:root{--bg:#03040b;--surface:rgba(8,10,28,0.78);--ink:#f2f4ff;--muted:#8a93b8;--line:#2ee6ff;--accent:#2ee6ff;--trap:#ff2e7e;--safe:#7a5aff;--boost:#ffc14d}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Inter","Segoe UI","Helvetica Neue",Arial,sans-serif;font-weight:700;min-width:360px}
html,body{height:100%;margin:0}
#app{position:relative;width:100%;height:100vh;overflow:hidden;z-index:1}
canvas{display:block;position:fixed;inset:0;width:100vw;height:100vh;z-index:0}
.hud{position:absolute;top:8px;left:8px;right:8px;z-index:2;pointer-events:none;color:var(--accent);font-weight:700;font-size:18px;text-shadow:0 0 8px var(--accent);background:transparent}
.panel{position:absolute;left:12px;right:12px;bottom:72px;background:var(--surface);border:1.5px solid var(--line);box-shadow:0 0 12px var(--line);padding:12px;border-radius:10px;z-index:3;max-height:40vh;overflow:auto;color:var(--ink)}
.crash-card{left:50%;right:auto;transform:translateX(-50%);bottom:80px;width:min(560px,92vw);height:auto;max-height:60vh;overflow:auto;background:rgba(8,10,28,0.78);border:1.5px solid #ff2e7e;box-shadow:0 0 12px #ff2e7e;border-radius:10px;padding:10px;z-index:3;}
@media (max-width:375px){.panel{max-height:55vh}}
button{min-height:44px;min-width:44px;background:var(--accent);color:#080a1c;border:none;border-radius:6px;padding:8px 12px;font-weight:700;cursor:pointer}
.lanebtn{min-height:44px}
.lanebtn.selected{background:var(--accent);color:#080a1c;border:2px solid var(--accent)}
.lanebtn:not(.selected){background:var(--surface);color:var(--ink);border:1px solid var(--accent)}
#footer{position:fixed;bottom:0;left:0;right:0;font-size:11px;color:var(--muted);padding:6px 12px;background:var(--bg);z-index:1}
body.riding #footer { bottom: 0; padding: 2px 8px; }
body.riding #footer p { display: none; }
body.riding #footer p:last-child { display: inline; font-size: 11px; margin: 0; }
body.riding #boostBtn, body.riding .boost-btn, body.riding .boost { bottom: 28px !important; }
.modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:4;background:rgba(0,0,0,.6)}
.hidden{display:none}
a{color:var(--accent);text-decoration:underline}
#boostBtn, .boostBtn, .boost-btn, .boost, button.boost { min-width:96px; min-height:64px; z-index:100; background:var(--boost); color:#080a1c; }
#boostBtn, .boost-btn, .boost, button.boost { box-shadow:0 0 12px var(--boost); }

.lanebtn.selected, .lanebtn.selected small { color: var(--bg) !important; }
h1,h2,h3,.hud{font-weight:700}
