:root{--ink:#e8ebf5;--muted:#9aa3bd;--accent:#6f8fdc;}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(160deg,#0f1220,#141a30);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.wrap{max-width:1040px;margin:0 auto;padding:22px 18px 40px}
h1{font-size:20px;margin:0 0 2px}
p.sub{margin:0 0 16px;color:var(--muted);font-size:13px}
.card{background:#171b2e;border:1px solid #222842;border-radius:14px;padding:16px 18px;box-shadow:0 8px 30px rgba(0,0,0,.25)}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-bottom:12px}
.ctl{display:flex;flex-direction:column;gap:6px;min-width:300px;flex:1}
.lab{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}
.lab b{color:var(--ink);font-variant-numeric:tabular-nums}
input[type=range]{-webkit-appearance:none;appearance:none;height:6px;border-radius:6px;background:linear-gradient(90deg,var(--accent),#3a4a86);outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:#dfe6ff;border:2px solid var(--accent);cursor:pointer}
input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#dfe6ff;border:2px solid var(--accent);cursor:pointer}
button{background:var(--accent);color:#0b0e19;border:0;border-radius:9px;padding:9px 16px;font-weight:650;font-size:14px;cursor:pointer}
button:hover{filter:brightness(1.07)}
button.ghost{background:transparent;color:var(--ink);border:1px solid #2a3054;font-weight:600}
button.ghost:hover{background:#1c2238;filter:none}
.hint{color:var(--muted);font-size:12px}
.metric{display:flex;flex-direction:column}
.metric .k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
.metric .v{font-size:26px;font-weight:650;font-variant-numeric:tabular-nums}
#game{width:100%;height:600px;border-radius:10px;background:#0b0e19;margin-top:6px;overflow:hidden;
  touch-action:none;cursor:grab}
#game.grabbing{cursor:grabbing}
#game canvas{display:block;border-radius:10px}
.foot{color:var(--muted);font-size:12px;margin-top:12px;line-height:1.5}
.badge{display:inline-block;padding:2px 8px;border-radius:999px;border:1px solid #2a3054;color:var(--muted);font-size:11px;margin-left:6px}
#status{color:var(--muted);font-size:12.5px;padding:8px 0 2px}
