:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#091017;color:#eef5f9}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:1rem;background:radial-gradient(circle at top right,#1d496545,transparent 45%),#091017}main{width:min(52rem,100%);padding:clamp(1.25rem,4vw,2.5rem);border:1px solid #35546b;border-radius:1.25rem;background:linear-gradient(145deg,#182b3b,#101b27);box-shadow:0 1rem 4rem #0008}header{display:flex;gap:1rem;justify-content:space-between;align-items:flex-start}.eyebrow{margin:0;color:#67c1f5;font-size:.75rem;font-weight:800;letter-spacing:.14em}h1{margin:.35rem 0;font-size:clamp(1.75rem,6vw,3rem);line-height:1.05}.connection{flex:none;border:1px solid #49738e;border-radius:99rem;color:#b8d9ee;font-size:.8rem;font-weight:700;padding:.4rem .65rem}.connection[data-state="live"]{border-color:#4eaf7d;color:#9be0b7}.connection[data-state="stale"],.connection[data-state="offline"]{border-color:#b78a52;color:#f1c17c}#message{color:#c2d1db;margin:.75rem 0}button,#links a{border:0;border-radius:.5rem;background:#245778;color:#fff;font:inherit;font-weight:700;padding:.65rem .85rem;text-decoration:none}button:hover,#links a:hover{background:#2f729a}.actions,.links{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:.75rem;margin:1.5rem 0}.card{min-height:6.75rem;padding:1rem;border-radius:.75rem;background:#0b151e;border:1px solid #223f54}.card span,.card small{display:block;color:#a7bdcb}.card strong{display:block;margin:.25rem 0;font-size:clamp(1.2rem,4vw,1.65rem);overflow-wrap:anywhere}.detail{margin:.9rem 0 0;color:#a7bdcb;font-variant-numeric:tabular-nums}@media (max-width:28rem){header{display:block}.connection{display:inline-block;margin-top:.5rem}.metrics{grid-template-columns:1fr 1fr}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}