:root {
  --bg: #04090f; --panel: #07121d; --panel2: #0a1a2a; --line: rgba(56, 189, 248, .14); --line2: rgba(25, 230, 140, .28);
  --tx: #e6eef7; --mut: #8396ab; --dim: #55687c;
  --em: #19e68c; --cy: #22d3ee; --bl: #3b82f6; --red: #ff4d5e; --amb: #fbbf24;
  --r: 6px;
  --mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  --sans: Inter, "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
}
* { box-sizing: border-box; margin: 0; }
html, body { height: 100%; overflow: hidden; background: var(--bg); }
body {
  font: 12.5px/1.35 var(--sans); color: var(--tx); display: flex; flex-direction: column;
  background: radial-gradient(1100px 480px at 72% -8%, rgba(34, 211, 238, .08), transparent), radial-gradient(900px 520px at 0% 100%, rgba(25, 230, 140, .06), transparent), var(--bg);
}
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; text-align: inherit; }
input, select { font: inherit; color: inherit; }
button:focus-visible, input:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--cy); outline-offset: 1px; }
[hidden] { display: none !important; }
.mono { font-variant-numeric: tabular-nums; font-family: var(--mono); }
.up { color: var(--em); } .dn { color: var(--red); } .mut { color: var(--mut); } .small { font-size: 11px; }
code { font-family: var(--mono); color: var(--cy); font-size: .92em; }
::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-thumb { background: #1b2e42; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) { * { animation-duration: .01ms !important; transition-duration: .01ms !important; } }
