:root{--ink:#101521;--paper:#ffffffe6;--paper-strong:#fffffffa;--line:#ffffffa3;--muted:#607086;--red:#ee394d;--sun:#ffd45f;--aqua:#3de0df;--leaf:#58c16d;--violet:#7357ff;--road:#2c3340}*{box-sizing:border-box}html,body,.game-shell{width:100%;height:100%}body{color:var(--ink);background:#88d8ef;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden}button{color:inherit;font:inherit;border:0}.game-shell{isolation:isolate;position:relative}#game-canvas{touch-action:none;background:linear-gradient(#8bdcf2,#d8eff0 46%,#78c36c);outline:none;width:100vw;height:100vh;display:block;position:fixed;inset:0}.hud,.effect-strip,.touch-controls,#toast{z-index:4;position:fixed}.hud{pointer-events:none;grid-template-columns:minmax(116px,158px) minmax(280px,1fr) auto;align-items:stretch;gap:6px;display:grid;top:8px;left:8px;right:8px}.brand-block,.hud-grid,.hud-actions,.effect-strip,.overlay .title-stack,.overlay .pause-stack,#toast{border:1px solid var(--line);background:var(--paper);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 24px #12293d29,inset 0 -2px #0b111b1a}.brand-block{border-radius:8px;min-height:42px;padding:6px 8px}.brand-block span,.hud-tile span,.eyebrow{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:.5rem;font-weight:900;display:block}.brand-block span{color:var(--red)}h1,h2,p{margin:0}h1{letter-spacing:0;margin-top:3px;font-size:clamp(.9rem,1.35vw,1.14rem);line-height:1}.hud-grid{border-radius:8px;grid-template-columns:repeat(4,minmax(80px,1fr));gap:4px;padding:4px;display:grid}.hud-tile{background:linear-gradient(#fff 0%,#eef5f4 100%);border-radius:6px;min-height:32px;padding:4px 6px;overflow:hidden;box-shadow:inset 0 -2px #2433431a}.hud-tile strong{white-space:nowrap;margin-top:2px;font-size:clamp(.74rem,1.18vw,.94rem);line-height:1;display:block}.lives-tile{background:linear-gradient(#fff 0%,#ffd7df 100%)}.lives-tile strong{color:#b71834}.hud-actions{pointer-events:auto;border-radius:8px;grid-template-columns:52px 56px 46px;align-content:stretch;gap:5px;padding:4px;display:grid}.tool-button,.primary-button,.secondary-button,.go-button,.lane-button{cursor:pointer;letter-spacing:0;border-radius:8px;font-weight:900;transition:transform .12s,filter .12s,background .12s}.tool-button{color:#fff;background:linear-gradient(#253247,#111827);min-height:28px;padding:0 7px;font-size:.72rem}.tool-button.quiet{color:var(--ink);background:linear-gradient(#fff,#e7ecee)}.tool-button.music-on{color:#071b23;background:linear-gradient(#62efe8,#29c5d0);box-shadow:0 0 15px #3de0df57,inset 0 -2px #05353f33}.tool-button.music-off{color:#f7fafc;background:linear-gradient(#6b7280,#2b3443)}.tool-button:hover,.primary-button:hover,.secondary-button:hover,.go-button:hover,.lane-button:hover{filter:brightness(1.05)}.tool-button:active,.primary-button:active,.secondary-button:active,.go-button:active,.lane-button:active{transform:translateY(1px)}.effect-strip{min-width:110px;min-height:30px;color:var(--ink);border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:6px 8px;font-size:.72rem;font-weight:900;display:flex;bottom:10px;right:10px}#shield-light{background:#b8c2cc;border-radius:50%;width:11px;height:11px;display:block;box-shadow:inset 0 2px 3px #0003}.game-shell.shielded #shield-light{background:var(--aqua);box-shadow:0 0 16px #3de0dfcc,inset 0 0 0 3px #ffffff94}.touch-controls{pointer-events:auto;gap:8px;display:flex;bottom:10px;left:10px}.lane-button{color:#fff;background:linear-gradient(#31445f,#182132);width:32px;height:32px;font-size:.96rem;box-shadow:0 8px 18px #10152133,inset 0 -2px #0003}.overlay{z-index:5;background:linear-gradient(#0b111b38,#0b111b6b);place-items:center;padding:24px;display:grid;position:fixed;inset:0}.overlay[hidden]{display:none}.overlay.compact{background:#0b111b38}.instructions-overlay{background:#0b111b52;place-items:center}.title-stack,.pause-stack,.instructions-panel{text-align:center;border-radius:8px;width:min(320px,100vw - 32px);padding:clamp(16px,3.4vw,22px)}.instructions-panel{border:1px solid var(--line);background:var(--paper-strong);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);text-align:left;width:min(860px,100vw - 28px);max-height:min(630px,100vh - 28px);overflow:auto;box-shadow:0 16px 36px #12293d38,inset 0 -2px #0b111b1a}.instructions-header{border-bottom:1px solid #60708633;justify-content:space-between;align-items:end;gap:12px;padding-bottom:10px;display:flex}.instructions-header h2{font-size:clamp(1.35rem,4vw,2rem);line-height:1}.intro-copy,.instruction-block p,.signoff{color:#263244;font-size:.84rem;font-weight:700;line-height:1.35}.intro-copy{margin-top:12px}.instruction-grid{grid-template-columns:1.12fr 1.12fr 1fr 1fr;gap:10px;margin-top:14px;display:grid}.instruction-block{background:linear-gradient(#fff 0%,#eef5f4 100%);border-radius:8px;padding:10px;box-shadow:inset 0 -2px #24334314}.instruction-block h3{color:var(--ink);margin:0 0 8px;font-size:.82rem;line-height:1}.instruction-block p+p{margin-top:8px}.powerup-list{gap:7px;display:grid}.powerup-card{grid-template-columns:30px 1fr;align-items:center;gap:8px;min-height:36px;display:grid}.powerup-card strong{color:var(--ink);font-size:.82rem;line-height:1.05;display:block}.powerup-card p{margin-top:2px;font-size:.76rem;line-height:1.2}.power-icon{border-radius:50%;width:28px;height:28px;display:block;position:relative;box-shadow:0 4px 10px #1015212e,inset 0 -2px #00000029}.shield-icon{clip-path:polygon(50% 3%,84% 17%,76% 72%,50% 96%,24% 72%,16% 17%);background:linear-gradient(#183345,#0c1d2a);border:3px solid #66fff6;border-radius:9px 9px 12px 12px}.life-icon{background:#fff}.life-icon:before,.life-icon:after{content:"";background:#ee394d;border-radius:3px;position:absolute;inset:8px 14px}.life-icon:after{transform:rotate(90deg)}.turbo-icon{clip-path:polygon(52% 3%,17% 50%,43% 50%,29% 97%,84% 37%,56% 37%);background:#ffe36a;border-radius:7px}.clear-icon{background:#7be675}.clear-icon:before{content:"";border:3px solid #123b20;border-right-color:#0000;border-radius:50%;position:absolute;inset:8px}.clear-icon:after{content:"";border-top:5px solid #0000;border-bottom:5px solid #0000;border-left:8px solid #123b20;width:0;height:0;position:absolute;top:9px;right:5px;transform:rotate(-16deg)}.puddle-icon{background:radial-gradient(circle at 42% 35%,#b8f1ff 0 15%,#4aaadd 42%,#155f89 78%);border-radius:44% 56% 48% 52%;overflow:hidden}.puddle-icon:before{content:"";border-top:3px solid #eefcffd1;border-radius:50%;width:17px;height:6px;position:absolute;top:9px;left:7px;transform:rotate(-10deg)}.breaker-icon{background:#d9c8ff}.breaker-icon:before,.breaker-icon:after{content:"";background:#5f35df;border-radius:999px;width:4px;height:22px;position:absolute;top:5px;left:14px}.breaker-icon:before{transform:rotate(45deg)}.breaker-icon:after{transform:rotate(-45deg)}.oil-icon{background:radial-gradient(circle at 38% 32%,#636b76 0 14%,#171b20 48%,#050607 78%);border-radius:48% 52% 42% 58%}.oil-icon:before{content:"";border:2px solid #9271ff94;border-radius:50%;position:absolute;inset:9px 6px;transform:rotate(18deg)}.signoff{color:#b71834;text-align:center;margin-top:14px;font-weight:900}.instructions-panel .go-button{margin:12px auto 0;display:grid}.title-stack h2{letter-spacing:0;margin-top:6px;font-size:clamp(2.35rem,9vw,4.8rem);line-height:.9}.title-score{color:var(--muted);margin:14px auto 0;font-size:.9rem;font-weight:900}.title-score strong{color:var(--ink)}.pause-stack h2{letter-spacing:0;font-size:clamp(2rem,6vw,3.3rem);line-height:.95}.primary-button,.secondary-button,.go-button{place-items:center;min-height:44px;margin-top:18px;padding:0 20px;display:inline-grid}.primary-button,.go-button{color:#111827;background:linear-gradient(#ffe877,#ffb12f);box-shadow:0 16px 32px #76440840,inset 0 -4px #723e062e}.secondary-button{color:#fff;background:linear-gradient(#2e3f59,#141c2b);margin-left:8px}.go-button{border-radius:8px;min-width:112px;min-height:62px;font-size:clamp(1.75rem,5vw,2.9rem);line-height:1}#toast{max-width:min(320px,100vw - 24px);min-height:34px;color:var(--ink);opacity:0;pointer-events:none;text-align:center;border-radius:8px;padding:8px 12px;font-size:.88rem;font-weight:900;transition:opacity .18s,transform .18s;top:76px;left:50%;transform:translate(-50%,-8px)}#toast.visible{opacity:1;transform:translate(-50%)}#screen-flash{z-index:3;pointer-events:none;opacity:0;background:#ee394d5c;transition:opacity .22s;position:fixed;inset:0}#screen-flash.hit{opacity:1;transition-duration:60ms}.game-shell[data-mode=title] .hud,.game-shell[data-mode=title] .effect-strip,.game-shell[data-mode=title] .touch-controls,.game-shell[data-mode=gameover] .touch-controls{opacity:0;pointer-events:none}.game-shell[data-mode=ready] .hud,.game-shell[data-mode=running] .hud,.game-shell[data-mode=paused] .hud{opacity:1}@media (width<=840px){.hud{grid-template-columns:1fr;gap:6px;width:min(304px,100vw - 20px);top:10px;left:10px;right:auto}.brand-block{min-height:38px}.hud-grid{grid-template-columns:repeat(4,1fr)}.hud-actions{width:166px}#toast{top:144px}.instructions-panel{width:min(520px,100vw - 24px);padding:16px}.instruction-grid{grid-template-columns:1fr;gap:8px}.powerup-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=560px){.hud{gap:5px;width:min(272px,100vw - 20px)}.brand-block{min-height:36px;padding:6px 8px}h1{font-size:.92rem}.hud-grid{gap:4px;padding:4px}.hud-tile{min-height:34px;padding:4px 5px}.hud-tile span{font-size:.46rem}.hud-tile strong{font-size:.72rem}.touch-controls{bottom:12px;left:12px}.lane-button{width:32px;height:32px}.effect-strip{min-width:106px;min-height:32px;font-size:.7rem;bottom:12px;right:12px}.instructions-overlay{padding:12px}.instructions-panel{max-height:calc(100vh - 24px);padding:13px}.instructions-header{padding-bottom:8px;display:block}.instructions-header h2{margin-top:4px}.intro-copy,.instruction-block p,.signoff{font-size:.8rem}.instruction-grid{margin-top:10px}.instruction-block{padding:8px}.powerup-list{grid-template-columns:1fr;gap:5px}.powerup-card{grid-template-columns:28px 1fr;min-height:34px}.power-icon{width:27px;height:27px}.instructions-panel .go-button{min-height:48px;margin-top:10px}.secondary-button{margin-left:auto;margin-right:auto;display:grid}}