@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Chivo:wght@400;600&display=swap");[data-lane-shift-root]{color-scheme:dark;--bg:radial-gradient(circle at 20% 20%,#101827 0,#0b1220 45%,#060b16 100%);--panel:rgba(255,255,255,0.06);--panel-strong:rgba(255,255,255,0.12);--stroke:rgba(255,255,255,0.12);--fg:#e8edf7;--muted:#9fb0cb;--accent:#5ee2ff;--accent-2:#96f7c8;--danger:#ff7b7b;--shadow:0 18px 48px rgba(0,0,0,0.35);min-height:100vh;background:var(--bg);color:var(--fg);font-family:Space Grotesk,Chivo,system-ui,-apple-system,sans-serif;letter-spacing:-.01em}[data-lane-shift-root][data-theme=light]{color-scheme:light;--bg:radial-gradient(circle at 30% 30%,#fdf8ff 0,#e9f0ff 45%,#dfe7ff 100%);--panel:rgba(15,23,42,0.04);--panel-strong:rgba(15,23,42,0.08);--stroke:rgba(15,23,42,0.08);--fg:#0f172a;--muted:#4b5563;--accent:#0ea5e9;--accent-2:#16a34a;--danger:#dc2626;--shadow:0 18px 48px rgba(15,23,42,0.15)}*{box-sizing:border-box}body{margin:0}.app{max-width:1080px;margin:0 auto 64px;padding:24px;display:grid;grid-gap:16px;gap:16px}.app__header{background:var(--panel);border:1px solid var(--stroke);border-radius:20px;padding:20px;box-shadow:var(--shadow);display:grid;grid-gap:12px;gap:12px}.app__header h1{margin:4px 0 8px;font-size:28px}.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.08em;font-size:11px;margin:0}.muted{color:var(--muted);margin:0}.small{font-size:13px}.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center}button{border:1px solid var(--stroke);background:var(--panel-strong);color:var(--fg);padding:10px 14px;border-radius:12px;font-size:14px;cursor:pointer;transition:transform .08s ease,border-color .08s ease}button:hover{transform:translateY(-1px);border-color:var(--accent)}button.primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0b1220;border-color:transparent;font-weight:700}button.ghost{background:transparent}.toggle{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--fg)}.toggle input{width:18px;height:18px}.pills{display:flex;gap:8px;flex-wrap:wrap}.pill{padding:6px 10px;border-radius:999px;background:var(--panel-strong);border:1px solid var(--stroke);font-size:12px;color:var(--muted)}.hud{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));grid-gap:6px;gap:6px}.hud__metric{background:var(--panel);border:1px solid var(--stroke);border-radius:8px;padding:6px 8px;box-shadow:var(--shadow)}.hud .label{color:var(--muted);font-size:10px}.hud .value{display:block;font-weight:700;font-size:13px;margin-top:2px}.meter{width:100%;height:4px;background:var(--panel-strong);border-radius:999px;overflow:hidden;margin-top:3px}.meter__bar{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:width .12s ease}.badge{border:1px dashed var(--stroke)}.badge--shield{border-color:var(--accent);background:rgba(94,226,255,.12)}.badge--revive{border-color:var(--accent-2);background:rgba(150,247,200,.12)}.badge--down{border-color:var(--danger);background:rgba(255,123,123,.1)}.playfield{background:var(--panel);border:1px solid var(--stroke);border-radius:18px;padding:16px;box-shadow:var(--shadow);display:grid;grid-gap:10px;gap:10px;isolation:isolate}.playfield,.track{position:relative;overflow:hidden}.track{border-radius:16px;border:1px solid var(--stroke);padding:12px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0));touch-action:pan-y;z-index:0;min-height:520px}.track__grid{display:grid;grid-template-rows:repeat(9,1fr);grid-gap:6px;gap:6px;height:100%;width:100%;overflow:hidden}.track__row{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:8px;gap:8px;transition:transform .16s ease;width:100%;min-width:0}.track__row--double .cell{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.track__row--player{position:relative}.cell{height:60px;border-radius:12px;border:1px solid var(--stroke);background:rgba(255,255,255,.03);display:grid;place-items:center;color:var(--fg);font-weight:700;font-size:18px;min-width:0;overflow:hidden}.cell--block{background:linear-gradient(135deg,#ff6f61,#ff3d75);border-color:rgba(255,109,97,.6);color:#0b1220}.cell--hole{background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.75),rgba(0,0,0,.92));border-color:rgba(0,0,0,.5)}.cell--coin{background:radial-gradient(circle at 30% 30%,#fff7cc,#ffd84d);border-color:#f5b400;color:#7a4b00}.cell--runner{outline:3px solid var(--accent);outline-offset:-3px;box-shadow:0 0 0 8px rgba(94,226,255,.25);background:linear-gradient(135deg,var(--accent),var(--accent-2));position:relative}.cell--runner:after{content:"▲";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:28px;color:#0b1220;text-shadow:0 1px 2px rgba(0,0,0,.3)}.lane-guides{position:absolute;inset:12px 12px auto 12px;display:grid;grid-template-columns:repeat(3,1fr);grid-gap:8px;gap:8px;pointer-events:none;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.lane-controls{display:flex;gap:10px;z-index:2;margin-top:8px}.lane-controls button{flex:1 1;font-size:22px;height:48px}.lane-controls .start-btn{flex:2 1;font-size:16px}.shield-toggle{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:var(--muted);cursor:pointer;margin-top:6px}.shield-toggle input{accent-color:var(--accent)}.card,.section{background:var(--panel);border:1px solid var(--stroke);border-radius:16px;padding:16px;box-shadow:var(--shadow)}.outcome{display:flex;justify-content:space-between;align-items:center;gap:12px}.outcome .statline{display:flex;gap:12px;font-weight:600}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));grid-gap:10px;gap:10px;margin-top:12px}.stat-grid .label{color:var(--muted);margin:0;font-size:12px}.stat-grid .value{margin:4px 0 0;font-weight:700}.actions{display:flex;gap:8px}.notes ul{margin:8px 0 12px;padding-left:18px;color:var(--fg);display:grid;grid-gap:6px;gap:6px}@media (max-width:720px){body{padding:12px}.cell{height:48px}.app__header h1{font-size:22px}.outcome{flex-direction:column;align-items:flex-start}}@media (max-width:400px){.track{min-height:380px}.track__grid{gap:4px}.cell{height:38px;border-radius:8px;font-size:14px}.cell--runner:after{font-size:20px}.lane-controls{gap:6px}.lane-controls button{font-size:18px;height:42px}.lane-controls .start-btn{font-size:13px;padding:0 8px}.lane-guides{font-size:9px}}