:root{font-family:Inter,system-ui,sans-serif;color:#e2e8f0;background:#050b16;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top,#12213d,#050b16 55%)}button,input,select{font:inherit}.shell{width:min(1120px,100%);margin:auto;padding:28px}header h1{font-size:clamp(2.4rem,7vw,5rem);margin:.1em 0}.eyebrow{color:#5eead4;font-family:ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase}.controls,.hud,.stride-controls,.score-panel{display:flex;gap:12px;flex-wrap:wrap}.controls{align-items:end;margin:20px 0}.controls label,.score-panel label{display:grid;gap:6px}.controls select,input{background:#0f172a;border:1px solid #334155;border-radius:8px;padding:10px;color:#fff}button{border:1px solid #475569;border-radius:10px;background:#172033;color:#fff;padding:11px 16px;font-weight:700;cursor:pointer}button:hover:not(:disabled),button:focus-visible{border-color:#5eead4;outline:2px solid #5eead4;outline-offset:2px}button:disabled{opacity:.45;cursor:not-allowed}.hud{display:grid;grid-template-columns:repeat(4,1fr);margin:16px 0}.hud article{background:#0d1525;border:1px solid #24324a;border-radius:12px;padding:14px}.hud span{display:block;color:#94a3b8;font-size:.8rem;text-transform:uppercase}.hud strong{font-family:ui-monospace,monospace;font-size:1.35rem}.status{min-height:1.5em;color:#cbd5e1}canvas{width:100%;height:auto;border:1px solid #334155;border-radius:14px;background:#07101f}.stride-controls{display:grid;grid-template-columns:1fr 1fr;margin-top:14px}.stride-controls button{min-height:72px;font-size:1.15rem;background:#0f2230}.score-panel{margin-top:20px;padding:18px;border:1px solid #334155;border-radius:12px;align-items:end}.score-panel h2{width:100%;margin:0}footer{color:#94a3b8;font-size:.9rem}@media(max-width:700px){.shell{padding:16px}.hud{grid-template-columns:1fr 1fr}.stride-controls{grid-template-columns:1fr}.controls>*{flex:1 1 100%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

.toolbar,.touch{display:flex;gap:12px;margin:14px 0}.touch{display:grid;grid-template-columns:1fr 1fr}.touch button{min-height:60px}#score-panel{margin-top:20px;padding:18px;border:1px solid #334155;border-radius:12px}@media(max-width:700px){.touch{grid-template-columns:1fr}}
