:root{color:#ecf4ee;font-synthesis:none;--bg:#090d0c;--surface:#101613;--surface-2:#151c18;--text:#ecf4ee;--muted:#84968b;--border:#213029;--green:#6ee7a2;--violet:#a5a0ff;--blue:#82c9f5;--amber:#ecc888;background:#090d0c;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(ellipse at 50% -15%,#182c204d,transparent 55%),var(--bg);min-height:100vh;margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}.topbar{border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#090d0ccc;justify-content:space-between;align-items:center;height:76px;padding:0 max(24px,50vw - 590px);display:flex}.brand{color:var(--text);letter-spacing:-.8px;align-items:center;gap:11px;font-family:Manrope,sans-serif;font-size:20px;font-weight:800;text-decoration:none;display:flex}.brand-symbol{width:34px;height:34px;color:var(--green);background:#172b20;border:1px solid #2c4534;border-radius:10px;place-items:center;display:grid}.brand-muted{color:#6e8175;font-weight:500}.live-label{letter-spacing:1.6px;color:var(--muted);align-items:center;gap:8px;font-size:10px;font-weight:600;display:flex}.live-label i,.pulse{background:var(--green);border-radius:50%;width:6px;height:6px;display:inline-block;box-shadow:0 0 10px #6ee7a266}.container{max-width:1180px;margin:auto;padding:50px 24px 28px}.hero{justify-content:space-between;align-items:center;gap:30px;padding-bottom:35px;display:flex}.status-label{align-items:center;gap:10px;margin-bottom:18px;display:flex}.status-icon{width:29px;height:29px;color:var(--green);background:#193124;border-radius:50%;place-items:center;display:grid}.badge{letter-spacing:1px;color:var(--green);background:#6ee7a212;border:1px solid #6ee7a229;border-radius:6px;align-items:center;padding:5px 9px;font-size:10px;font-weight:700;display:inline-flex}.badge.warning{color:var(--amber);background:#ecc88812;border-color:#ecc88833}.badge.critical,.badge.offline{color:#ff9e95;background:#ff9e9512;border-color:#ff9e9533}.hero h1{letter-spacing:-1.5px;margin:0 0 11px;font-family:Manrope,sans-serif;font-size:34px;font-weight:700;line-height:1.2}.hero p{color:var(--muted);margin:0;font-size:13px}.hero-meta{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:10px;display:flex}.hero-meta>span{color:#b1c3b6;align-items:center;gap:8px;font-size:11px;display:flex}.hero-meta small{color:var(--muted);font-size:11px}button{border:1px solid var(--border);color:#b8c9be;background:var(--surface);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:7px;margin-top:3px;padding:8px 12px;font-size:11px;transition:background .2s,border-color .2s;display:inline-flex}button:hover{background:var(--surface-2);border-color:#435a49}button:disabled{opacity:.6;cursor:wait}.metrics{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}.metric-card,.chart-card,.uptime-card,.server-card{border:1px solid var(--border);background:linear-gradient(140deg,#131b16,#0f1511);border-radius:14px}.metric-card{min-width:0;padding:18px;transition:transform .2s,border-color .2s}.metric-card:hover{border-color:#38503f;transform:translateY(-2px)}.metric-top{align-items:center;gap:9px;display:flex}.metric-icon{color:var(--accent);display:flex}.metric-label{color:#b0c1b5;font-size:12px;font-weight:500}.metric-dot{background:var(--accent);opacity:.7;border-radius:50%;width:5px;height:5px;margin-left:auto}.metric-body{align-items:center;gap:15px;margin-top:15px;display:flex}.gauge{flex-shrink:0;width:102px;height:102px;position:relative}.gauge svg{width:100%;height:100%;transform:rotate(-90deg)}.gauge circle{fill:none;stroke-width:5px}.gauge-track{stroke:#25332a}.gauge-value{stroke-linecap:round;transition:stroke-dashoffset .7s}.gauge>div{flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.gauge strong{letter-spacing:-1px;font-family:Manrope,sans-serif;font-size:25px}.gauge small{color:var(--muted);margin-left:2px;font-size:12px}.gauge span{color:var(--muted);margin-top:1px;font-size:9px}.metric-info{flex-direction:column;gap:5px;min-width:0;display:flex}.metric-info strong{white-space:nowrap;font-size:16px;font-weight:600}.metric-info span{color:var(--muted);font-size:10px;line-height:1.55}.history-grid{grid-template-columns:1fr 1fr;gap:14px;margin-top:14px;display:grid}.chart-card{min-width:0;padding:22px 18px 16px}.section-heading{justify-content:space-between;align-items:center;gap:10px;display:flex}.eyebrow{color:var(--muted);letter-spacing:1.4px;font-size:9px;font-weight:600}.section-heading h2,.server-card h2{letter-spacing:-.3px;margin:5px 0 0;font-family:Manrope,sans-serif;font-size:16px;font-weight:600}.period{color:var(--muted);font-size:10px}.chart{min-width:0;height:218px;margin-top:20px}.tooltip{background:#19251d;border:1px solid #354b3b;border-radius:8px;align-items:center;gap:18px;padding:8px 10px;display:flex;box-shadow:0 5px 20px #0005}.tooltip span{color:var(--muted);font-size:10px}.tooltip strong{color:var(--green);font-size:12px}.details{grid-template-columns:1fr 310px;gap:14px;margin-top:14px;display:grid}.uptime-card,.server-card{padding:22px}.uptime-bars{align-items:stretch;gap:4px;height:34px;margin:25px 0 15px;display:flex}.uptime-bars i{background:#23322a;border-radius:2px;flex:1;min-width:2px}.uptime-bars i.online{background:#5bd391}.uptime-bars i.warning{background:var(--amber)}.uptime-bars i.critical,.uptime-bars i.offline{background:#ff9e95}.uptime-footer{color:var(--muted);justify-content:space-between;gap:10px;font-size:10px;display:flex}.server-card h2{margin-bottom:20px}.server-row{border-top:1px solid var(--border);color:var(--muted);align-items:center;gap:9px;padding:11px 0;font-size:11px;display:flex}.server-row svg{color:#668e75}.server-row strong{color:#c6d6ca;margin-left:auto;font-size:11px;font-weight:500}.footnote{color:var(--muted);justify-content:center;align-items:center;gap:8px;margin:28px 0 4px;font-size:10px;display:flex}footer{border-top:1px solid var(--border);letter-spacing:1.5px;max-width:1180px;color:var(--muted);justify-content:space-between;align-items:center;margin:20px auto 0;padding:24px;font-size:9px;display:flex}footer a{color:var(--muted);letter-spacing:0;align-items:center;gap:4px;font-size:11px;text-decoration:none;display:flex}.error{color:var(--amber);background:#ecc8880d;border:1px solid #ecc88833;border-radius:10px;align-items:center;gap:8px;margin-bottom:16px;padding:12px;font-size:12px;display:flex}.reveal{animation:.55s cubic-bezier(.16,1,.3,1) both enter}@keyframes enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}.spin-once{animation:.65s spin}@media (width<=1050px){.metrics{grid-template-columns:repeat(2,1fr)}.metric-info{flex-direction:column}.metric-body{justify-content:space-around}.metric-card{padding:20px}.gauge{width:115px;height:115px}}@media (width<=680px){.topbar{height:64px;padding:0 18px}.container{padding:30px 16px 20px}.brand{font-size:18px}.live-label{letter-spacing:1px;font-size:8px}.hero{padding-bottom:24px;display:block}.hero h1{letter-spacing:-1px;font-size:28px}.hero p{font-size:12px}.hero-meta{align-items:flex-start;gap:8px;margin-top:22px}.hero-meta button{min-height:36px;margin-top:5px}.metrics{gap:10px}.metric-card{padding:14px}.metric-label{font-size:11px}.metric-body{flex-direction:column;gap:8px;margin-top:15px}.gauge{width:98px;height:98px}.metric-info{text-align:center;align-items:center}.metric-info strong{font-size:15px}.metric-info span{font-size:9px}.history-grid,.details{grid-template-columns:1fr;gap:10px;margin-top:10px}.chart-card{padding:18px 12px 12px}.chart{height:200px;margin-top:18px}.uptime-card,.server-card{padding:18px}.uptime-bars{gap:2px;height:28px;margin-top:23px}.uptime-footer{font-size:9px}.footnote{text-align:center;padding:0 20px;font-size:9px;line-height:1.6}.period{font-size:9px}footer{margin-top:14px;padding:20px 18px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.chart-empty{height:100%;color:var(--muted);border:1px dashed var(--border);border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex}.chart-empty svg{color:#54705b}.chart-empty span{color:#9caf9f;font-size:12px}.chart-empty small{text-align:center;padding:0 20px;font-size:10px}