@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Unbounded:wght@500;600&display=swap');

:root { color-scheme: dark; --bg:#07110f; --ink:#eefaf5; --muted:#91a7a0; --line:rgba(219,255,240,.14); --accent:#58f5b5; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; background:var(--bg); color:var(--ink); font-family:Manrope,system-ui,sans-serif; overflow-x:hidden; }
body::before { content:""; position:fixed; inset:-35%; background:radial-gradient(circle at 71% 38%,rgba(49,230,157,.16),transparent 25%),radial-gradient(circle at 5% 95%,rgba(36,121,91,.15),transparent 22%); pointer-events:none; }
.grain { position:fixed; inset:0; opacity:.22; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.1'/%3E%3C/svg%3E"); }
.topbar, main, footer { width:min(1180px,calc(100% - 48px)); margin-inline:auto; position:relative; }
.topbar { height:96px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; font-size:17px; letter-spacing:.02em; }
.brand strong { color:var(--accent); font-weight:600; }
.brand-mark { width:34px; height:34px; border:1px solid var(--accent); display:grid; place-items:center; border-radius:7px; color:var(--accent); font-family:Unbounded,sans-serif; font-size:14px; }
.environment { color:var(--muted); font-size:12px; letter-spacing:.14em; display:flex; align-items:center; gap:9px; }
.environment i,.online i { width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 16px var(--accent); }
.hero { min-height:660px; padding:108px 46% 86px 0; display:flex; flex-direction:column; justify-content:center; position:relative; }
.eyebrow { color:var(--accent); font-size:12px; letter-spacing:.19em; font-weight:700; margin:0 0 24px; }
h1,h2 { font-family:Unbounded,Manrope,sans-serif; margin:0; }
h1 { font-size:clamp(48px,6.4vw,86px); line-height:1.04; letter-spacing:-.045em; white-space:nowrap; }
h1 em { color:var(--accent); font-style:normal; }
.lead { color:#b8cbc4; max-width:610px; font-size:18px; line-height:1.7; margin:30px 0 0; }
.actions { display:flex; align-items:center; gap:32px; margin-top:43px; }
.check-button { border:0; background:var(--accent); color:#06100d; padding:17px 20px 17px 22px; border-radius:4px; font:700 15px Manrope,sans-serif; display:flex; gap:30px; align-items:center; cursor:pointer; transition:transform .2s,box-shadow .2s; }
.check-button:hover { transform:translateY(-2px); box-shadow:0 12px 34px rgba(88,245,181,.18); }
.check-button:focus-visible,.text-link:focus-visible { outline:2px solid white; outline-offset:4px; }
.check-button svg { width:19px; fill:none; stroke:currentColor; stroke-width:1.8; }
.text-link { color:var(--ink); text-underline-offset:6px; text-decoration-color:rgba(255,255,255,.3); font-size:14px; }
.text-link span { color:var(--accent); margin-left:7px; }
.edge-card { position:absolute; right:1%; top:96px; width:370px; height:480px; border:1px solid var(--line); background:linear-gradient(145deg,rgba(16,39,32,.84),rgba(7,17,15,.6)); padding:24px; backdrop-filter:blur(15px); transform:rotate(2deg); box-shadow:0 35px 80px rgba(0,0,0,.22); }
.card-head { color:var(--muted); font-size:11px; letter-spacing:.16em; display:flex; justify-content:space-between; }
.signal { display:flex; align-items:flex-end; gap:3px; height:10px; }
.signal i { display:block; width:2px; background:var(--accent); }.signal i:nth-child(1){height:4px}.signal i:nth-child(2){height:7px}.signal i:nth-child(3){height:10px}
.orbit { width:220px; aspect-ratio:1; margin:43px auto 39px; border:1px solid rgba(88,245,181,.38); border-radius:50%; display:grid; place-items:center; position:relative; box-shadow:inset 0 0 60px rgba(88,245,181,.06); }
.orbit::before,.orbit::after { content:""; position:absolute; border:1px solid rgba(88,245,181,.14); border-radius:50%; inset:20px; }.orbit::after{inset:48px;background:rgba(88,245,181,.05)}
.orbit span { position:relative; z-index:1; font-family:Unbounded,sans-serif; font-size:29px; letter-spacing:-.05em; }
.orbit span::after { content:""; position:absolute; width:8px; height:8px; border-radius:50%; background:var(--accent); right:-38px; top:12px; box-shadow:0 0 18px var(--accent); }
.edge-card dl { margin:0; border-top:1px solid var(--line); display:grid; grid-template-columns:1.35fr 1fr; padding-top:22px; }
.edge-card dt { color:var(--muted); font-size:10px; letter-spacing:.16em; margin-bottom:7px; }.edge-card dd{margin:0;font-size:13px;font-weight:600}
.status { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:66px 0; display:grid; grid-template-columns:.8fr 1.2fr; gap:60px; align-items:end; }
.status h2 { font-size:clamp(27px,3.5vw,44px); letter-spacing:-.035em; }
.metrics { display:grid; grid-template-columns:repeat(3,1fr); }
.metrics article { min-height:100px; padding:8px 28px; border-left:1px solid var(--line); display:flex; flex-direction:column; justify-content:space-between; }
.metric-label { color:var(--muted); font-size:12px; }.metrics strong{font:500 25px Unbounded,sans-serif}.metrics small{font:500 12px Manrope,sans-serif;color:var(--muted)}
.metrics .online { color:var(--accent); font:700 14px Manrope,sans-serif; display:flex; align-items:center; gap:10px; }.metrics .time{font:600 14px Manrope,sans-serif}
footer { height:100px; display:flex; align-items:center; justify-content:space-between; color:#6e837c; font-size:12px; }
@media (max-width:900px){.hero{padding-right:0;padding-top:76px}.edge-card{position:relative;right:auto;top:auto;margin:70px auto 0;width:min(100%,430px);height:445px}.hero{min-height:auto}.status{grid-template-columns:1fr}.metrics{margin-left:-28px}h1{white-space:normal}}
@media (max-width:620px){.topbar,main,footer{width:min(100% - 32px,1180px)}.topbar{height:76px}.environment{font-size:0}.environment i{display:block}.hero{padding:72px 0}.eyebrow{font-size:10px}.lead{font-size:16px}.actions{align-items:flex-start;flex-direction:column;gap:24px}.edge-card{height:420px;padding:20px}.orbit{width:190px;margin:40px auto 33px}.status{padding:52px 0}.metrics{grid-template-columns:1fr;margin:0}.metrics article{border-left:0;border-top:1px solid var(--line);padding:22px 0;min-height:88px}.status{gap:40px}footer{height:90px}footer span:last-child{display:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.check-button{transition:none}}
