:root{--bg:#0d0d0d;--card:#1a1a1a;--accent:#0078ff;--good:#00ff88;--warn:#ffcc00;--bad:#ff3344;color-scheme:dark;}
  body{font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:#eee;margin:0;padding:28px;display:flex;flex-direction:column;align-items:center;gap:18px;}
  h1{margin:0;font-size:20px}
  .panel{width:980px;max-width:96%;background:var(--card);padding:18px;border-radius:10px;box-shadow:0 6px 30px rgba(0,0,0,.6);}
  .controls{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
  label{font-size:13px;color:#ccc}
  select,input{background:#0b0b0b;color:#fff;border:1px solid #222;padding:6px 8px;border-radius:6px}
  button{background:var(--accent);color:#fff;border:none;padding:8px 12px;border-radius:8px;cursor:pointer}
  button.secondary{background:#444}
  .preview{margin-top:14px;border-radius:8px;overflow:hidden;background:#000;display:flex;justify-content:center;align-items:center}
  canvas#renderCanvas{width:640px;height:360px;display:block;background:#000}
  .results{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
  .stat{background:#111;padding:12px;border-radius:8px}
  .orb{width:18px;height:18px;border-radius:50%;display:inline-block;margin-right:8px;vertical-align:middle}
  .orb.good{background:var(--good);box-shadow:0 0 10px var(--good)}
  .orb.warn{background:var(--warn);box-shadow:0 0 10px var(--warn)}
  .orb.bad{background:var(--bad);box-shadow:0 0 10px var(--bad)}
  pre{white-space:pre-wrap;color:#ddd;background:#070707;padding:10px;border-radius:6px;max-height:260px;overflow:auto}
  .muted{color:#999;font-size:13px}
  @media (max-width:700px){.results{grid-template-columns:1fr}}