:root{color-scheme:dark;font-family:Trebuchet MS,Avenir Next Condensed,sans-serif;--sand-1: #f2d59c;--sand-2: #b67c35;--sand-3: #6b4319;--night: rgba(14, 23, 31, .84);--panel: rgba(27, 22, 15, .64);--panel-border: rgba(255, 231, 191, .18);--highlight: #ffd36e;--warning: #ff9c63;--text: #fff6dc}*{box-sizing:border-box}html,body{margin:0;min-height:100%;overflow:hidden;background:radial-gradient(circle at top,rgba(255,211,110,.2),transparent 38%),linear-gradient(180deg,#301b10,#120f0f);color:var(--text)}body{position:relative}canvas{display:block;width:100vw;height:100vh}.overlay{position:fixed;inset:0;display:grid;grid-template-columns:minmax(280px,400px) minmax(260px,320px);justify-content:space-between;padding:1.25rem;gap:1rem;pointer-events:none}.hud-card,.side-panel,.touch-controls{pointer-events:auto}.hud-card,.side-panel{align-self:start;border:1px solid var(--panel-border);background:linear-gradient(180deg,rgba(255,218,134,.09),transparent 25%),var(--panel);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 18px 50px #00000047}.hud-card{padding:1rem 1.15rem;border-radius:22px}.eyebrow{margin:0;text-transform:uppercase;letter-spacing:.22em;font-size:.72rem;color:#ffecccb3}.hud-card h1,.side-panel h2{margin:.2rem 0 .75rem;font-weight:900;letter-spacing:.04em}.hud-card h1{font-size:clamp(1.8rem,3vw,2.7rem)}.stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.stat-grid div{padding:.8rem .85rem;border-radius:16px;background:#fff8df14;border:1px solid rgba(255,248,223,.12)}.stat-label{display:block;margin-bottom:.35rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.16em;color:#ffebc1b8}.stat-grid strong{font-size:clamp(1.05rem,2vw,1.35rem)}.status-line{min-height:1.4rem;margin:.9rem 0 0;color:var(--highlight)}.side-panel{justify-self:end;width:min(100%,320px);padding:1rem;border-radius:24px}.field{display:grid;gap:.45rem;margin-bottom:1rem}.field span,.panel-heading span{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:#ffebc1ad}input,button{font:inherit}input{width:100%;padding:.72rem .85rem;border-radius:14px;border:1px solid rgba(255,238,206,.18);background:#fff9e914;color:var(--text)}button{border:0;border-radius:14px;padding:.78rem .95rem;color:#251509;background:linear-gradient(180deg,#ffe8b0,#ffbe54);font-weight:800;cursor:pointer;transition:transform .14s ease,filter .14s ease}button:hover,button:focus-visible{transform:translateY(-1px);filter:brightness(1.05)}.panel-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin-bottom:1rem}.leaderboard,.help-panel{margin-top:1rem;padding-top:.9rem;border-top:1px solid rgba(255,234,197,.12)}.panel-heading{display:flex;align-items:baseline;justify-content:space-between;gap:.8rem}.panel-heading h2{font-size:1.1rem}.leaderboard ol{margin:.8rem 0 0;padding-left:1.2rem}.leaderboard li{display:grid;grid-template-columns:1fr auto;gap:.8rem;padding:.45rem 0;border-bottom:1px solid rgba(255,238,206,.08)}.leaderboard li:last-child{border-bottom:0}.leaderboard .empty{padding:.5rem 0;color:#ffebc1b8;list-style:none;margin-left:-1.2rem}.help-panel p{margin:.55rem 0 0;color:#fff5dae0}kbd{display:inline-flex;align-items:center;justify-content:center;min-width:1.8rem;margin-right:.18rem;padding:.2rem .35rem;border-radius:8px;background:#fff7e329;border:1px solid rgba(255,247,227,.12)}.touch-controls{position:fixed;inset:auto 1rem max(1rem,env(safe-area-inset-bottom)) 1rem;display:none;justify-content:space-between;gap:1rem}.touch-cluster{display:flex;gap:.75rem}.touch-controls button{min-width:5.2rem;min-height:5.2rem;border-radius:999px;font-size:1rem;background:linear-gradient(180deg,#ffedc2f2,#ffb64af2)}.touch-controls button:active,.touch-controls button.is-active{transform:scale(.97);filter:brightness(.92)}@media(max-width:960px){.overlay{grid-template-columns:1fr;align-content:start}.side-panel{justify-self:stretch;width:auto}}@media(pointer:coarse),(max-width:900px){.touch-controls{display:flex}.overlay{padding-bottom:8.2rem}}