:root{--bg:#050812;--line:rgba(65,138,255,.25);--text:#f6f8ff;--muted:#8794ad;--blue:#28a9ff;--green:#2bf096;--red:#ff4d6a}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,sans-serif;color:var(--text);background:var(--bg)}
body{overflow-x:hidden;background:radial-gradient(circle at 15% 12%,rgba(40,169,255,.12),transparent 28%),radial-gradient(circle at 85% 45%,rgba(139,77,255,.12),transparent 30%),#050812}
.ambient{position:fixed;width:430px;height:430px;border-radius:50%;filter:blur(120px);opacity:.15;pointer-events:none}.ambient.a{background:#087dff;left:-220px;top:100px}.ambient.b{background:#9148ff;right:-230px;bottom:-80px}.scanline{position:fixed;inset:0;pointer-events:none;background:linear-gradient(transparent 50%,rgba(255,255,255,.008) 50%);background-size:100% 5px;opacity:.18}
.page{width:min(950px,calc(100% - 32px));margin:auto;padding:30px 0 26px;position:relative}.top{display:flex;align-items:center;justify-content:space-between;margin-bottom:70px}
.brand{display:flex;align-items:center;gap:12px}.logo{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-size:29px;font-weight:800;border:1px solid #238fff;background:linear-gradient(135deg,rgba(40,169,255,.18),rgba(139,77,255,.16));box-shadow:0 0 28px rgba(40,169,255,.2)}.name{font-size:21px;font-weight:800;letter-spacing:-.7px}.name span{font-weight:500;color:#aeb8cf}.sub{font-size:8px;letter-spacing:3px;color:#687793;margin-top:3px}.live{font-size:10px;letter-spacing:1.8px;color:#aeb9cd;border:1px solid rgba(255,255,255,.1);padding:9px 12px;border-radius:99px;background:rgba(255,255,255,.025)}.live i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 13px var(--green);animation:blink 1.5s infinite;margin-right:7px}
.hero{display:flex;align-items:center;justify-content:center;gap:28px;margin-bottom:50px}.status-orb{width:112px;height:112px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,rgba(43,240,150,.26),rgba(43,240,150,.02) 58%,transparent 70%);box-shadow:0 0 0 1px rgba(43,240,150,.22),0 0 55px rgba(43,240,150,.15);animation:orbPulse 2s ease-in-out infinite}.status-orb.bad{background:radial-gradient(circle,rgba(255,77,106,.28),rgba(255,77,106,.02) 58%,transparent 70%);box-shadow:0 0 0 1px rgba(255,77,106,.25),0 0 55px rgba(255,77,106,.15)}.orb-core{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#03150d;font-size:28px;font-weight:800;box-shadow:0 0 25px rgba(43,240,150,.55)}.status-orb.bad .orb-core{background:var(--red);color:#fff;box-shadow:0 0 25px rgba(255,77,106,.55)}
.tiny,.card-label{font-size:9px;letter-spacing:2.6px;color:#71809b}.hero h1{font-size:34px;letter-spacing:-1.2px;margin:7px 0 8px}.hero p{margin:0;color:var(--muted);font-size:13px}.heartbeat-line{display:flex;align-items:center;gap:8px;color:#687691;font-size:10px;margin-top:14px}.mini-pulse{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);animation:blink 1s infinite}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.status-card{min-height:204px;padding:21px;border:1px solid var(--line);border-radius:21px;background:linear-gradient(145deg,rgba(16,25,46,.82),rgba(7,10,20,.78));box-shadow:inset 0 1px rgba(255,255,255,.04),0 18px 50px rgba(0,0,0,.18);transition:.25s}.status-card:hover{transform:translateY(-3px);border-color:rgba(65,138,255,.45)}.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.glyph{font-size:26px;color:#3baeff}.indicator{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 14px var(--green);animation:blink 1.5s infinite}.indicator.bad{background:var(--red);box-shadow:0 0 14px var(--red)}.card-value{font-size:25px;font-weight:750;margin-top:9px}.mono{font-variant-numeric:tabular-nums}.meter{height:3px;border-radius:5px;background:rgba(255,255,255,.06);margin-top:18px;overflow:hidden}.meter span{display:block;width:100%;height:100%;background:var(--green);box-shadow:0 0 12px var(--green);animation:flow 2s linear infinite}.meter span.off{background:var(--red);box-shadow:0 0 12px var(--red)}.card-foot{font-size:10px;color:#65728c;margin-top:12px}
.activity{display:flex;align-items:center;gap:13px;margin-top:18px;padding:16px 19px;border:1px solid rgba(43,240,150,.15);border-radius:16px;background:rgba(43,240,150,.03)}.activity-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);animation:blink 1.2s infinite}.activity-dot.bad{background:var(--red);box-shadow:0 0 12px var(--red)}.activity-text{display:flex;flex-direction:column;gap:4px;flex:1}.activity-text strong{font-size:11px}.activity-text span{font-size:10px;color:var(--muted)}.next{font-variant-numeric:tabular-nums;font-size:10px;color:#687690;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:6px 8px}
footer{display:flex;justify-content:space-between;color:#4f5b72;font-size:9px;margin-top:40px;padding:0 4px}@keyframes blink{0%,100%{opacity:1}50%{opacity:.28}}@keyframes orbPulse{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.045);opacity:1}}@keyframes flow{from{transform:translateX(-20%)}to{transform:translateX(20%)}}
@media(max-width:700px){.page{padding-top:21px}.top{margin-bottom:48px}.hero{justify-content:flex-start;gap:18px;margin-bottom:36px}.status-orb{width:78px;height:78px}.orb-core{width:45px;height:45px;font-size:21px}.hero h1{font-size:25px}.grid{grid-template-columns:1fr}.status-card{min-height:160px}.card-head{margin-bottom:17px}}