@font-face{font-family:Runner;src:url('assets/fonts/barlow-condensed-bold.ttf') format('truetype');font-weight:700;font-display:swap}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#091119;color:#f5f5eb;font-family:Arial,sans-serif;overscroll-behavior:none}body{display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 25%,#243646,#091119 75%)}
/* Desktop and tablets: the sides around the portrait column carry the blurred key art, never a flat void. */
@media(min-aspect-ratio:2/3){body:before{content:'';position:fixed;inset:-48px;background:url(assets/keyart-home.webp) center 30%/cover no-repeat;filter:blur(24px) saturate(.8) brightness(.42);z-index:0;pointer-events:none}body:after{content:'';position:fixed;inset:0;background:radial-gradient(ellipse at 50% 40%,#0000 40%,#05101a 100%);z-index:0;pointer-events:none}}
#stage{--hud-top:max(14px,env(safe-area-inset-top));--hud-bottom:max(16px,env(safe-area-inset-bottom));--cyan:#82e6e4;--lime:#c4f58a;--laser:#ff7a4a;--gold:#ffd27a;--pink:#ff4fb4;position:relative;z-index:1;width:min(100vw,calc(var(--visible-height,100dvh)*.64));height:var(--visible-height,100dvh);max-height:100dvh;overflow:hidden;background:#152438;isolation:isolate;container-type:inline-size;box-shadow:0 0 100px #0008;touch-action:auto;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
canvas{display:block;width:100%;height:100%;outline:none;touch-action:none;-webkit-user-drag:none}svg{display:block;flex-shrink:0}button{border:0;border-radius:6px;background:transparent;color:inherit;font:inherit;cursor:pointer;min-width:44px;min-height:44px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible,summary:focus-visible{outline:2px solid var(--cyan,#82e6e4);outline-offset:3px}button:disabled{cursor:default}button[hidden],[hidden]{display:none!important}
/* Always-on HUD: one band at the top (identity, city progress, score and its chips), weapon and BOMBE at the bottom. Everything else is transient. */
header{position:absolute;top:var(--hud-top);left:16px;right:10px;display:flex;align-items:flex-start;gap:10px;pointer-events:none;isolation:isolate;z-index:8}header:before{content:'';position:absolute;inset:-35px -25px -52px;background:linear-gradient(#08111ae0,#08111a8c 55%,transparent);z-index:-1;pointer-events:none}.identity{display:flex;flex-direction:column;flex-shrink:0;line-height:1;gap:6px}.identity strong{font:700 23px/1 Runner,'Arial Narrow',Arial,sans-serif;letter-spacing:.1px}
.score{margin-left:auto;text-align:right;flex-shrink:0;display:flex;flex-direction:column;align-items:flex-end;gap:5px;min-width:0}.score b{display:block;font:700 27px/1 Runner,Arial,sans-serif;white-space:nowrap;letter-spacing:1px;font-variant-numeric:tabular-nums}.run{display:flex;align-items:center;justify-content:flex-end;gap:5px;font-variant-numeric:tabular-nums;flex-wrap:wrap}
#clock{font:700 10px Runner,sans-serif;letter-spacing:1px;color:#93a7b2;padding:2px 0 2px 3px}#crowns{display:inline-flex;align-items:center;gap:4px;font:700 12px Runner,sans-serif;letter-spacing:.5px;color:var(--lime);padding:3px 6px;border:1px solid #c4f58a66;border-radius:4px;background:#0d1a2680}#crowns svg{width:12px;height:12px}#crowns.pop{animation:chip-pop .3s ease-out}
#combo{display:inline-flex;flex-direction:column;gap:3px;padding:3px 7px 4px;min-width:82px;border:1px solid #ffd27a77;border-radius:4px;background:#0d1a2680;color:var(--gold);font:700 12px/1 Runner,sans-serif;letter-spacing:.6px;text-align:left}#combo b{font:inherit;white-space:nowrap}.combo-track{display:block;height:2px;background:#ffd27a2e;border-radius:2px;overflow:hidden}#combo-fill{display:block;height:100%;width:100%;background:var(--gold)}#combo.up{animation:chip-pop .35s ease-out}#combo.max{border-color:var(--gold);background:#ffd27a26}
#loop-chip{font:700 11px Runner,sans-serif;letter-spacing:.8px;color:#13201c;background:var(--pink);padding:3px 6px;border-radius:4px;white-space:nowrap}
@keyframes chip-pop{0%{transform:scale(1)}40%{transform:scale(1.18)}100%{transform:scale(1)}}
#pause{pointer-events:auto;font-size:24px;display:grid;place-items:center;padding:0;margin-top:-10px;flex-shrink:0}
#health{display:flex;gap:4px}#health i{color:#c4f58a;font-style:normal}#health i svg{width:15px;height:15px;fill:currentColor;stroke-width:1.3}#health i.empty{color:#74818b;opacity:.6}#health i.empty svg{fill:none}
.journey{position:absolute;top:calc(var(--hud-top) + 60px);left:16px;right:16px;display:flex;align-items:center;gap:10px;pointer-events:none;font:700 11px Runner,sans-serif;letter-spacing:1.4px;color:#dbe6ec;z-index:8}#world-label{white-space:nowrap}#world-progress{height:4px;flex:1;background:#aab8c72e;border-radius:4px;overflow:hidden}#world-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#8fd2cf,var(--lime));border-radius:4px;transition:width .2s linear}.fighting-boss #world-progress i,.clear #world-progress i{background:var(--laser)}
#sector{position:absolute;top:calc(var(--hud-top) + 78px);left:16px;right:20px;pointer-events:none;text-shadow:0 2px 5px #07101b;transition:opacity .35s;z-index:7;opacity:0}#sector-label{font:700 16px Runner,Arial,sans-serif;letter-spacing:.6px}#sector-objective{display:block;color:#cfdde3;font:700 11px Runner,Arial,sans-serif;letter-spacing:.9px;text-transform:uppercase;margin-top:2px}.fighting-boss #sector{display:none}
#boss-hud{position:absolute;top:calc(var(--hud-top) + 74px);left:16px;right:16px;pointer-events:none;color:#ffcb9c;z-index:8;text-shadow:0 2px 6px #07101b}.boss-row{display:flex;align-items:center;gap:8px;margin-bottom:5px}#boss-name{font:700 15px Runner,sans-serif;letter-spacing:.5px;white-space:nowrap}#boss-phases{display:inline-flex;gap:4px;align-items:center}#boss-phases i{width:8px;height:8px;border-radius:50%;background:#ffcb9c33;border:1px solid #ffcb9c99}#boss-phases i.done{background:#ffcb9c}#boss-phases i.now{background:#fff;border-color:#fff;box-shadow:0 0 7px #fff;animation:phase-dot .9s ease-in-out infinite alternate}@keyframes phase-dot{from{transform:scale(1)}to{transform:scale(1.35)}}#boss-state{margin-left:auto;font:700 11px Runner,Arial,sans-serif;letter-spacing:.8px;text-align:right;color:#ffe2c4;white-space:nowrap}.boss-track{height:4px;background:#73849533;border-radius:3px;overflow:hidden}#boss-life{display:block;height:100%;background:#ffb375;transition:width .12s}#boss-hud.open{color:#fff2d4}#boss-hud.open #boss-life{background:#fff2d4}
#boss-hud.stagger #boss-state{color:#fff;background:var(--laser);padding:3px 7px;border-radius:4px;text-shadow:none;animation:stagger-pulse .45s ease-in-out infinite alternate}#boss-hud.stagger #boss-life{background:#fff}@keyframes stagger-pulse{from{transform:scale(1);filter:brightness(1)}to{transform:scale(1.08);filter:brightness(1.25)}}
/* Transient: chapter banner mid-screen (boss beats lower, under the boss and above the hero), tutorial under the hero, toast above the weapon. */
#chapter{position:absolute;left:24px;right:24px;top:30%;display:flex;flex-direction:column;align-items:center;text-align:center;pointer-events:none;opacity:0;transition:opacity .3s;z-index:5;text-shadow:0 3px 14px #07101b}#chapter span{font-size:10px;letter-spacing:2.5px;color:#bfd8e0}#chapter strong{font:700 42px/1 Runner,Arial,sans-serif;letter-spacing:1px;margin-top:8px;text-wrap:balance}#chapter small{margin-top:9px;font-size:12px;letter-spacing:.6px;color:#e8f5ef;padding:5px 12px;background:#0d202ccc;border-radius:4px}#chapter.clear strong{color:var(--lime)}.transit #chapter{top:15%}
#chapter.boss,#chapter.phase{top:47%}#chapter.perfect{top:40%}#chapter.boss strong{color:#ffd3a8;font-size:36px}#chapter.boss span{color:#ffb98a}#chapter.phase strong{font-size:25px;letter-spacing:.6px;color:#ffd3a8;padding:7px 14px;background:#2a1208d9;border:1px solid #ff9c8666;border-radius:6px}#chapter.phase span{color:#ffb98a}#chapter.perfect strong{font-size:34px;color:var(--gold);text-shadow:0 0 18px #ffd27a99,0 3px 14px #07101b}#chapter.perfect span{color:var(--gold)}
#tutorial{position:absolute;left:36px;right:36px;top:76%;display:flex;gap:10px;align-items:center;justify-content:center;padding:9px 14px;background:#0d1a26e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#f0f9ed;border:1px solid #ffffff1f;border-radius:8px;pointer-events:none;z-index:7;font:700 15px/1.15 Runner,Arial,sans-serif;letter-spacing:.5px;text-transform:uppercase;opacity:0;transition:opacity .2s}#tutorial svg{color:var(--lime);width:22px;height:22px}#tutorial small{display:block;font:400 11px/1.3 Arial,sans-serif;letter-spacing:0;text-transform:none;color:#bad0da;margin-top:2px}
#notice{position:absolute;left:16px;bottom:calc(var(--hud-bottom) + 98px);display:inline-flex;align-items:center;gap:9px;padding:5px 12px 5px 5px;font:700 14px/1.1 Runner,Arial,sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#f3fbf6;pointer-events:none;opacity:0;transition:opacity .18s;background:#0d1a26e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #ffffff1f;border-radius:8px;z-index:7;max-width:84%}#notice svg{width:18px;height:18px;color:#13201c}#notice>svg{flex-shrink:0;box-sizing:content-box;padding:6px;background:var(--lime);border-radius:6px}#notice.danger>svg{background:var(--laser);color:#fff}#notice small{display:block;font:400 11px/1.25 Arial,sans-serif;letter-spacing:0;text-transform:none;color:#c1d3dc;margin-top:2px}
footer{position:absolute;left:16px;right:16px;bottom:var(--hud-bottom);display:flex;align-items:flex-end;gap:16px;pointer-events:none;isolation:isolate;z-index:8}footer:before{content:'';position:absolute;inset:-44px -25px -35px;background:linear-gradient(transparent,#08111af2 80%);z-index:-1}.weapon{display:flex;gap:10px;align-items:flex-end;min-width:0;flex:1;padding-bottom:4px}.weapon>div{min-width:0;flex:1}.weapon>span:first-child{color:var(--weapon,var(--lime));width:30px;flex-shrink:0;margin-bottom:6px}.weapon b{font:700 21px Runner,Arial,sans-serif;letter-spacing:.3px;white-space:nowrap}.weapon small{display:block;font:700 11px Runner,Arial,sans-serif;letter-spacing:1px;color:#d4e1e7;margin:3px 0 6px;white-space:nowrap}.track{height:3px;width:76px;background:#a5b4bd44}.track i{display:block;height:100%;background:var(--weapon,var(--lime));width:100%}
#active-bonuses{display:flex;flex-wrap:wrap;overflow:hidden;max-width:100%;max-height:24px;gap:6px;margin-top:7px;font:700 11px Runner,Arial,sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#e7f8ef}#active-bonuses>span{display:inline-flex;align-items:center;gap:5px;padding:3px 7px 3px 5px;background:#0d1a26e0;border:1px solid #ffffff22;border-radius:5px;white-space:nowrap}#active-bonuses svg{width:15px;height:15px;color:var(--cyan)}#active-bonuses>span.mult{background:var(--gold);color:#2a1a05;border-color:#ffe6b0;animation:chip-pop .4s ease-out}#active-bonuses>span.mult svg{color:#2a1a05}
/* BOMBE: the one button. Stock dots top-right, flow bar filling the next one, a ripple when it fires, a halo while the slow-motion lesson waits for the tap. */
#blast{pointer-events:auto;position:relative;display:flex;align-items:center;justify-content:center;gap:8px;margin-left:auto;flex-shrink:0;width:142px;min-height:72px;padding:12px 10px 16px;background:var(--lime);border:1px solid #e4ffb8;border-radius:10px;color:#13201c;box-shadow:0 3px 16px #06151a77,0 0 0 0 #c4f58a00;transition:box-shadow .2s}#blast-icon svg{width:26px;height:26px}.blast-copy{display:flex;flex-direction:column;gap:5px;align-items:flex-start}#blast b{font:700 22px/1 Runner,Arial,sans-serif;letter-spacing:.8px}#blast-state{font:700 10px Runner,Arial,sans-serif;letter-spacing:1px;white-space:nowrap}
#blast-stock{position:absolute;top:7px;right:9px;display:flex;align-items:center;gap:4px}#blast-stock b{font:700 11px/9px Runner,Arial,sans-serif;letter-spacing:.4px;margin-right:2px}#blast-stock i{width:9px;height:9px;border-radius:50%;background:#13201c;opacity:.2;transition:opacity .2s}#blast-stock i.on{opacity:1;box-shadow:0 0 0 1.5px #13201c55}
#blast:disabled{color:#dcecec;background:linear-gradient(90deg,#2f5560 var(--flow,0%),#213a43e8 var(--flow,0%));border-color:#829f9f77;box-shadow:none}#blast:disabled #blast-stock i{background:#b0c6c6}#blast:disabled #blast-state{font-size:11px;color:#8dede2}#blast.ready{box-shadow:0 3px 16px #06151a77,0 0 0 3px #c4f58a55}
#blast:after{content:'';position:absolute;inset:-3px;border-radius:13px;border:3px solid var(--lime);opacity:0;pointer-events:none}#blast.pulse{animation:blast-pulse .5s ease-out}#blast.pulse:after{animation:blast-ripple .65s ease-out}@keyframes blast-pulse{0%{transform:scale(1)}30%{transform:scale(.93)}100%{transform:scale(1)}}@keyframes blast-ripple{0%{opacity:.95;transform:scale(1)}100%{opacity:0;transform:scale(1.7)}}
#blast.teach{animation:blast-teach .7s ease-in-out infinite alternate}@keyframes blast-teach{from{box-shadow:0 3px 16px #06151a77,0 0 0 3px #c4f58a99,0 0 0 8px #c4f58a22}to{box-shadow:0 3px 16px #06151a77,0 0 0 6px #c4f58aee,0 0 30px 16px #c4f58a77}}
#blast-hint{position:absolute;left:50%;bottom:calc(100% + 12px);transform:translateX(-50%);font:700 13px Runner,Arial,sans-serif;letter-spacing:1.2px;color:#13201c;background:var(--lime);padding:6px 10px;border-radius:5px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s}#blast-hint:after{content:'';position:absolute;left:50%;top:100%;margin-left:-6px;border:6px solid transparent;border-top-color:var(--lime)}#blast.teach #blast-hint{opacity:1;animation:hint-bob .7s ease-in-out infinite alternate}@keyframes hint-bob{from{transform:translate(-50%,0)}to{transform:translate(-50%,-6px)}}
#flow-hud{position:absolute;left:10px;right:10px;bottom:6px;pointer-events:none}.flow-track{display:block;height:3px;background:#13201c33;border-radius:3px;overflow:hidden}#flow-fill{display:block;height:100%;background:#13201c;width:0}#blast:disabled #flow-fill{background:#8dede2}#blast:disabled .flow-track{height:4px;background:#0a161a}
/* Full-frame flashes: damage rim, lime bomb vignette, city-cleared flash, slow-motion vignette, fade between cities. */
#damage-flash,#nova-flash,#beat-flash,#slowmo,#transition{position:absolute;inset:0;pointer-events:none;opacity:0}#damage-flash{box-shadow:inset 0 0 70px #d46445;z-index:2}#nova-flash{background:radial-gradient(ellipse at 50% 62%,#c4f58a00 42%,#c4f58a5c 78%,#d9ffb0 100%);z-index:2;mix-blend-mode:screen}#nova-flash.perfect{background:radial-gradient(ellipse at 50% 62%,#ffd27a00 36%,#ffd27a70 72%,#fff1c8 100%)}#beat-flash{background:#f4ffe9;z-index:3}#slowmo{background:radial-gradient(ellipse at 50% 55%,#0000 45%,#07152299 100%);z-index:2;transition:opacity .35s}.slowmo #slowmo{opacity:1}#transition{background:#0b1622;z-index:3}
#stage.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate3d(-2px,1px,0)}20%,80%{transform:translate3d(4px,-2px,0)}30%,50%,70%{transform:translate3d(-7px,3px,0)}40%,60%{transform:translate3d(7px,-3px,0)}}
/* Landscape on a touch screen: the field would be 250 px wide, so the game pauses behind a veil until the phone is upright. */
#rotate{position:fixed;inset:0;z-index:40;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;background:#071522f7;padding:24px;color:#f5f5eb}#rotate svg{width:52px;height:52px;color:var(--lime);animation:rotate-phone 1.8s ease-in-out infinite}@keyframes rotate-phone{0%,20%{transform:rotate(0)}55%,75%{transform:rotate(90deg)}100%{transform:rotate(0)}}#rotate b{font:700 30px Runner,sans-serif;letter-spacing:1px}#rotate small{font-size:12px;color:#b9c8d1;max-width:340px;line-height:1.5}
@media(pointer:coarse) and (orientation:landscape){#rotate{display:flex}.desktop-note{display:none}}
#toast{position:absolute;left:50%;bottom:calc(var(--hud-bottom) + 4px);transform:translateX(-50%);z-index:30;padding:9px 14px;background:#0d1a26f2;border:1px solid #ffffff22;border-radius:8px;font:700 13px Runner,sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#f3fbf6;white-space:nowrap;pointer-events:none;animation:toast .25s ease-out}@keyframes toast{from{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%,0)}}
#overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-start;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;background:linear-gradient(#07152222 0%,#071522c4 30%,#071522fa 65%);padding:105px 24px 24px;z-index:6}.brand{position:absolute;top:calc(var(--hud-top) + 44px);left:16px;display:flex;align-items:center;gap:8px;color:#f5f5eb;pointer-events:none;z-index:2}.brand-crown svg{width:26px;height:26px;color:var(--lime)}.brand-copy{display:flex;flex-direction:column;line-height:1}.brand-copy strong{font:700 15px Runner,sans-serif;letter-spacing:.5px}.brand-copy small{font-size:7px;letter-spacing:2px;color:#b9c8d1;margin-top:3px}.tag{position:absolute;font:700 13px/1.1 Runner,sans-serif;letter-spacing:.5px;color:#f5f5eb;opacity:.28;transform:rotate(-8deg);pointer-events:none;z-index:2}.tag-left{left:18px;top:24%}.tag-right{right:14px;bottom:14px;font-size:11px;transform:rotate(6deg)}.menu-open:not(.paused) .identity,.menu-open:not(.paused) .score{visibility:hidden}.paused .tag,.is-ending .tag,.lost .tag,.paused .brand{display:none}.sheet{display:flex;flex-direction:column;align-items:center;text-align:center;padding-bottom:8px;margin-top:auto;width:100%;flex-shrink:0}#eyebrow{color:var(--cyan);font-size:10px;letter-spacing:1.5px}h1{font:700 53px/1 Runner,Arial,sans-serif;letter-spacing:1px;margin:12px 0}#message{color:#d0dde3;font-size:13px;line-height:1.5;max-width:330px;margin:5px 0 20px}
#start{width:100%;max-width:360px;background:var(--lime);color:#13201c;min-height:54px;font-weight:800;font-size:13px;letter-spacing:1px;box-shadow:0 3px 20px #0003}#retry{font-size:11px;letter-spacing:.2px;color:#d8e4e7;margin-top:6px;min-height:44px}
/* Defeat: resuming the city is the choice wanted nine times out of ten, so it takes the primary button. */
.lost #retry{width:100%;max-width:360px;background:var(--lime);color:#13201c;min-height:54px;font-weight:800;font-size:13px;letter-spacing:1px;box-shadow:0 3px 20px #0003;margin:0}.lost #retry:not([hidden])+#start{background:transparent;color:#d8e4e7;font-size:11px;letter-spacing:.3px;min-height:44px;box-shadow:none;margin-top:4px;font-weight:700;width:auto}
#share{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 20px;margin-top:8px;border:1px solid #82e6e4aa;border-radius:6px;color:var(--cyan);font-size:12px;letter-spacing:1px;font-weight:700}#share svg{width:16px;height:16px}
.menu-options{display:flex;justify-content:space-between;align-items:center;width:100%;gap:6px;margin-top:4px;flex-shrink:0}#options-open{font:700 11px Runner,sans-serif;letter-spacing:1.4px;color:#e8f3dc;padding:0 14px;min-height:40px;border:1px solid #ffffff2e;border-radius:999px;background:#0d1a26a6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.shop-link{display:inline-flex;align-items:center;min-height:44px;padding:0 8px;font:700 11px Runner,sans-serif;letter-spacing:1.4px;color:#cfdae0;text-decoration:none;-webkit-tap-highlight-color:transparent}.shop-link:hover,.shop-link:focus-visible{color:var(--lime);outline:none}.edition{font-size:8px;letter-spacing:1px;color:#90a6b2;margin-top:14px;text-align:center;flex-shrink:0}
#result{width:100%;display:flex;justify-content:center;gap:14px 12px;margin-bottom:18px;flex-wrap:wrap}#result:empty{display:none}#result>div{min-width:54px}#result b{font:700 26px Runner,Arial,sans-serif;display:block;white-space:nowrap}#result small{font-size:9px;letter-spacing:.4px;color:#afbec7;white-space:nowrap}
#leaderboard{width:100%;max-width:360px;margin:0 0 16px;text-align:left}#leaderboard>strong{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#a5c6d4;margin-bottom:6px}#leaderboard>strong em{font-style:normal;color:var(--lime)}#leaderboard ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:3px}#leaderboard li{display:flex;align-items:center;gap:10px;padding:6px 10px;background:#0f1f2c;border:1px solid transparent;border-radius:5px;font-size:11px;color:#c7d5dd}#leaderboard li.now{background:#c4f58a22;border-color:#c4f58a88;color:#f5f5eb}#leaderboard li>span:first-child{font:700 13px Runner,sans-serif;color:var(--cyan);width:24px}#leaderboard li b{font:700 16px Runner,sans-serif;letter-spacing:.5px;margin-left:auto;font-variant-numeric:tabular-nums}#leaderboard li small{font-size:9px;color:#8fa3ae;letter-spacing:.4px}
#quick-guide{display:grid;grid-template-columns:repeat(3,1fr);width:100%;gap:10px;margin:0}#quick-guide>div{display:flex;flex-direction:column;align-items:center;gap:8px}#quick-guide svg{width:28px;height:28px;color:var(--cyan)}#quick-guide b{font:700 18px Runner,sans-serif}#quick-guide small{font-size:10px;color:#b5cad5}#mission-map{display:flex;gap:10px;width:100%;list-style:none;margin:0 0 18px;padding:0;justify-content:center}#mission-map li{flex:1;text-align:left;border-top:2px solid #4e6370;padding-top:6px}#mission-map li.current{border-color:var(--lime)}#mission-map li.done{border-color:var(--cyan)}#mission-map span{font-size:9px;color:#acbdc7;letter-spacing:1px}#mission-map b{font:700 18px Runner,sans-serif;display:inline;margin-left:7px}
#mode-select{display:flex;gap:8px;width:100%;margin:4px 0 0}#mode-select button{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:9px 12px;min-height:54px;background:#0f1f2ccc;border:1px solid #3d5361;border-radius:8px;text-align:left;transition:border-color .15s,background .15s}#mode-select button b{font:700 18px Runner,sans-serif;letter-spacing:.6px}#mode-select button small{font-size:10px;color:#a9bcc7;letter-spacing:.3px}#mode-select button.on{border-color:var(--lime);background:#c4f58a1c;box-shadow:inset 0 0 0 1px var(--lime)}#mode-select button.on b{color:var(--lime)}#mode-select button.locked{opacity:.6}#mode-select button.locked small{color:#ffb98a}.paused #mode-select,.lost #mode-select{display:none}
/* Options: one sheet for sound, volumes, quality, guide, mode and the shop link; a bottom sheet on phones, a card beside the column on desktop. */#options{position:fixed;inset:auto 0 0 0;margin:0 auto;width:min(100%,430px);max-width:none;max-height:86dvh;padding:14px 20px calc(var(--hud-bottom,16px) + 8px);border:1px solid #526673;border-bottom:0;border-radius:16px 16px 0 0;background:#12232e;color:#e8eef0;box-shadow:0 -12px 60px #0009;overflow:auto;font-size:12px}#options::backdrop{background:#040d17aa}#options[open]{display:flex;flex-direction:column;gap:7px}.options-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:2px}.options-head b{font:700 22px Runner,sans-serif;letter-spacing:.8px}#options-close{font-size:28px;min-width:44px;margin-right:-12px;color:#cfdae0}#options>button{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:0 12px;border:1px solid #3d5361;border-radius:8px;background:#0f1f2ccc;font:700 13px Runner,sans-serif;letter-spacing:.8px;color:#e8eef0;text-align:left}#options>button svg{width:18px;height:18px;color:var(--cyan)}#audio-settings{display:flex;width:100%;gap:16px;padding:4px 2px 0}#audio-settings label{flex:1;text-align:left;font:700 10px Runner,sans-serif;letter-spacing:.8px;color:#b7c9d3}#audio-settings input{display:block;width:100%;height:36px;margin:2px 0 0;accent-color:var(--cyan);cursor:pointer}#options .shop-link{justify-content:center;margin-top:4px;color:var(--cyan)}@media(min-aspect-ratio:2/3){#options{inset:50% auto auto 50%;transform:translate(-50%,-50%);width:min(92vw,400px);border-bottom:1px solid #526673;border-radius:14px;padding-bottom:18px}}#loadout{width:100%;text-align:left;margin:16px 0 6px;padding:12px;background:#183040;border-radius:5px}#loadout>strong{display:block;font-size:10px;letter-spacing:1px;color:#a5c6d4;margin-bottom:10px}#loadout>div{display:flex;gap:10px;align-items:center;margin:8px 0}#loadout svg{color:var(--cyan)}#loadout b{display:block;font-size:12px}#loadout small{display:block;font-size:11px;color:#bed3df;margin-top:4px}.paused #mission-map,.paused .edition,.is-ending #mission-map{display:none}
/* Ending: one 390 × 260 card per city (never the full backgrounds again), then the crew line and the build. */
#ending{width:100%;max-width:350px;margin:0 0 18px}#ending-cities{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}#ending-cities>div{height:124px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:9px 7px;background-size:cover;background-position:center;border-bottom:2px solid #526e7b;border-radius:4px 4px 0 0;background-color:#0f1f2c}#ending-cities>div.freed{border-color:var(--cyan)}#ending-cities>div.medal{border-color:var(--lime)}.ending-paris{background-image:linear-gradient(transparent 30%,#071520ee),url('assets/card-paris.webp')}.ending-london{background-image:linear-gradient(transparent 30%,#071520ee),url('assets/card-london.webp')}.ending-new-york{background-image:linear-gradient(transparent 30%,#071520ee),url('assets/card-new-york.webp')}#ending-cities b{font:700 20px Runner,sans-serif}#ending-cities small{font-size:8px;letter-spacing:.2px;color:var(--cyan);margin-top:4px;line-height:1.5;text-align:left}#ending-cities>div.medal small{color:var(--lime)}#ending-crew{font-size:11px;color:var(--cyan);margin:13px 0 6px}#ending-build{font-size:11px;color:#b4c6d2;line-height:1.5}.is-ending h1{font-size:42px}
/* Guide: three illustrated cards, one sentence each, then compact legends. */
#guide-dialog{color:#e8eef0;background:#12232e;border:1px solid #526673;border-radius:8px;width:min(94vw,420px);max-height:88dvh;padding:24px 18px;overflow:auto;line-height:1.5;font-size:13px;box-shadow:0 12px 80px #0009}#guide-dialog::backdrop{background:#040d17bb}#guide-dialog h2{font:700 29px Runner,sans-serif;margin:0 30px 16px 0;line-height:1.1}#guide-dialog h3{font-size:11px;letter-spacing:.7px;margin:22px 0 10px;color:var(--cyan)}#close-guide{position:absolute;right:5px;top:5px;font-size:29px}.guide-note{color:#adbfcb;font-size:11px;line-height:1.55;margin:18px 0 0}
.guide-cards{display:flex;flex-direction:column;gap:12px}.guide-card{margin:0;display:flex;flex-direction:column;gap:8px;background:#0b1622;border:1px solid #2d4250;border-radius:8px;overflow:hidden}.guide-card svg{width:100%;height:auto;display:block;aspect-ratio:160/100}.guide-card figcaption{padding:0 12px 12px;font-size:12px;line-height:1.45;color:#d0dde3;text-align:left}.guide-card figcaption b{display:block;font:700 16px Runner,sans-serif;letter-spacing:.6px;color:var(--lime);margin-bottom:3px}
.icon-legend{display:grid;gap:8px}.icon-legend>div{display:flex;align-items:center;gap:11px}.icon-legend>div>span{width:28px;flex-shrink:0}.icon-legend b{display:block;font-size:12px}.icon-legend small{display:block;font-size:11px;color:#b9ccd8;margin-top:2px;line-height:1.4}
/* Desktop keyboard help beside the column, readable at arm's length. */
.desktop-note{position:fixed;left:28px;bottom:28px;display:flex;flex-direction:column;gap:7px;font-size:12px;letter-spacing:.4px;color:#b7c6d0;z-index:2;line-height:1.4}.desktop-note strong{font:700 15px Runner,sans-serif;letter-spacing:1.5px;color:#f5f5eb;margin-bottom:4px}.desktop-note span{display:flex;align-items:center;gap:3px}.desktop-note kbd{display:inline-block;min-width:24px;padding:3px 6px;margin-right:3px;border:1px solid #6b8391;border-bottom-width:2px;border-radius:4px;background:#0f1f2c;font:700 10px Runner,sans-serif;letter-spacing:.8px;color:#e2ecf0;text-align:center}.desktop-note kbd+span,.desktop-note kbd:last-of-type{margin-right:6px}
.menu-open header .run,.menu-open #health,.menu-open .journey,.menu-open footer,.menu-open #boss-hud,.menu-open #sector,.menu-open #notice,.menu-open #chapter,.menu-open #tutorial,.menu-open #popups{visibility:hidden}.menu-open #crowns{visibility:hidden}.extraction footer,.transit #blast{opacity:0}
@media(max-width:800px),(pointer:coarse){.desktop-note{display:none}}
@container(max-width:340px){.tag{display:none}header{left:12px;right:7px;gap:8px}.identity strong{font-size:21px}.score b{font-size:23px}#combo{min-width:72px;font-size:11px}#crowns{font-size:11px}#health{gap:3px}#health i svg{width:13px;height:13px}.journey,#sector,#boss-hud{left:12px;right:12px}.journey{font-size:10px}footer{left:12px;right:12px;gap:9px}.weapon{gap:7px}.weapon>span:first-child{width:24px}.weapon b{font-size:18px}.weapon small{font-size:9px}.track{width:61px}#blast{width:124px;gap:6px;min-height:68px}#blast b{font-size:20px}#blast-icon svg{width:22px}#blast-state{font-size:8px}#notice{left:12px;font-size:10px}#tutorial{left:16px;right:16px;font-size:11px}#chapter strong{font-size:34px}#chapter.phase strong{font-size:24px}#overlay{padding-left:18px;padding-right:18px}#launch{padding-left:18px;padding-right:18px}#launch .launch-title{font-size:40px}#quick-guide b{font-size:16px}#ending-cities b{font-size:18px}#ending-cities small{font-size:7px}#mode-select button b{font-size:16px}#result b{font-size:22px}#active-bonuses{font-size:10px;gap:4px}#active-bonuses>span{padding:2px 5px 2px 4px}#active-bonuses svg{width:13px;height:13px}}
@media(max-height:660px){#stage{--hud-top:max(9px,env(safe-area-inset-top));--hud-bottom:max(12px,env(safe-area-inset-bottom))}#overlay{padding-top:70px;padding-bottom:15px}.sheet{padding:0}.sheet h1{font-size:43px;margin:9px 0}#message{margin-bottom:16px;font-size:12px}#launch .launch-title{font-size:44px;margin:9px 0 16px}#launch .launch-copy{margin-bottom:20px}#quick-guide{gap:6px}#quick-guide>div{gap:6px}#quick-guide svg{width:23px;height:23px}#quick-guide small{font-size:9px}#mission-map{margin-bottom:14px}#mode-select button{min-height:46px;padding:7px 10px}.edition{display:none}.lost .brand,.is-ending .brand{display:none}#ending-cities>div{height:94px}#chapter{top:26%}#leaderboard li{padding:4px 10px}}
@media(max-height:450px){#stage{--hud-top:5px;--hud-bottom:8px}.menu-open header{visibility:hidden}#overlay{padding:16px}#quick-guide,#mission-map{display:none}#launch .launch-title{font-size:32px;margin:6px 0 12px}#launch .launch-copy{margin-bottom:12px}#launch{padding-bottom:10px}.sheet h1{font-size:33px}#message{font-size:11px;line-height:1.4;margin:4px 0 12px}#start{min-height:45px}.tag,.brand{display:none}#ending{margin-bottom:10px}#ending-cities>div{height:75px}#sector{display:none}#chapter strong{font-size:28px}.desktop-note{display:none}#mode-select{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
#boss-mark{font:700 9px Runner,Arial,sans-serif;letter-spacing:1.4px;color:#ff9c86;opacity:.5;padding:2px 5px;border:1px solid #ff9c8655;border-radius:4px;transition:opacity .3s}.boss-near #boss-mark{opacity:1;background:#ff6a4f2e;animation:boss-mark .6s ease-in-out infinite alternate}.fighting-boss #boss-mark{opacity:1;background:var(--laser);color:#fff;border-color:transparent}@keyframes boss-mark{from{transform:scale(1)}to{transform:scale(1.12)}}
/* Aggregated score popups: one per kind and screen cell, merged while they repeat, six at most. */
#popups{position:absolute;inset:0;pointer-events:none;z-index:6;overflow:hidden}#popups span{position:absolute;transform:translate(-50%,-50%);font:700 14px Runner,Arial,sans-serif;letter-spacing:.5px;color:#f3fbf6;text-shadow:0 1px 3px #07101b,0 0 12px #07101b;white-space:nowrap;animation:popup 1s ease-out forwards}#popups span.crown{color:var(--lime)}#popups span.combo{color:var(--gold);font-size:17px}#popups span.big{font-size:18px;color:#fff3d0}#popups span.blast{font-size:19px;color:var(--lime);text-shadow:0 0 14px #c4f58a88,0 1px 3px #07101b}#popups span.graze{font-size:13px;color:var(--cyan);letter-spacing:1px}
@keyframes popup{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}14%{opacity:1;transform:translate(-50%,-72%) scale(1.1)}100%{opacity:0;transform:translate(-50%,-200%) scale(1)}}@keyframes popup-b{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}14%{opacity:1;transform:translate(-50%,-72%) scale(1.1)}100%{opacity:0;transform:translate(-50%,-200%) scale(1)}}
/* Launch screen: still key art, title and the three gestures over it, a thin lime gauge; #start is the whole frame; the overlay lifts when the game starts. */
#stage.home:not(.lifting) #game{visibility:hidden}.home #overlay{padding:0;overflow:hidden;touch-action:none;background:#071522}#launch{position:absolute;inset:0;display:none;flex-direction:column;justify-content:flex-end;align-items:center;text-align:center;padding:0 24px calc(var(--hud-bottom) + 30px);background:linear-gradient(#07152200 0%,#0715222e 34%,#071522c4 58%,#071522f7 80%),url(assets/keyart-home.webp) center top/cover no-repeat #071522;z-index:1;pointer-events:none}.home #launch{display:flex}.launch-copy{display:flex;flex-direction:column;align-items:center;width:100%;margin-bottom:26px}.launch-eyebrow{color:var(--cyan);font-size:10px;letter-spacing:1.5px}.launch-title{font:700 56px/1 Runner,Arial,sans-serif;letter-spacing:1px;margin:12px 0 22px;color:#f5f5eb;text-shadow:0 3px 18px #07101b}.launch-load{display:flex;flex-direction:column;align-items:center;gap:13px;width:100%}#load-track{width:100%;height:2px;background:#c4f58a2b;border-radius:2px;overflow:hidden}#load-bar{display:block;height:100%;width:var(--load,0%);background:var(--lime);box-shadow:0 0 10px #c4f58a99;transition:width .3s ease-out}#launch-status{font:700 14px Runner,sans-serif;letter-spacing:2px;color:#dbe6ec;min-height:17px}#launch.eager #load-bar{background:linear-gradient(90deg,var(--lime) 0 55%,#f4ffe6 70%,var(--lime) 85%);background-size:200% 100%;animation:load-run .55s linear infinite}#launch.eager #launch-status{color:#f4ffe6}#launch .launch-load.tap{animation:chip-pop .3s ease-out}#launch.ready #launch-status{color:var(--lime);animation:prompt-pulse 1.5s ease-in-out infinite}#launch.ready #load-track{opacity:.4}#launch.error #launch-status{color:#ffb98a;animation:none}@keyframes load-run{from{background-position:200% 0}to{background-position:0 0}}@keyframes prompt-pulse{0%,100%{opacity:.5}50%{opacity:1}}.home .sheet{display:contents}.home .sheet>:not(#start),.home .edition,.home #overlay .shop-link{display:none}.home #start{position:absolute;inset:0;z-index:2;width:auto;max-width:none;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:transparent;font-size:0;touch-action:none;cursor:pointer}.home #start:focus-visible{outline-offset:-4px}.home .menu-options{position:absolute;top:calc(var(--hud-top) + 6px);right:12px;width:auto;margin:0;z-index:3}.lifting #overlay{opacity:0;pointer-events:none;transition:opacity .34s ease-out}header,.journey,footer{transition:opacity .3s}.lifting header,.lifting .journey,.lifting footer{opacity:0;transition:none}

/* First launches on touch screens: a thumb sliding left and right under the hero, briefly. */
#swipe-hint{position:absolute;left:0;right:0;top:57%;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;z-index:7;color:#f5f5eb;filter:drop-shadow(0 3px 10px #07101b)}#swipe-hint svg{animation:swipe-hand 1.1s ease-in-out infinite alternate}#swipe-hint .arrow{position:absolute;top:14px;font:700 34px Runner,Arial,sans-serif;color:var(--lime);opacity:.9}#swipe-hint .arrow:first-child{left:calc(50% - 72px)}#swipe-hint .arrow:nth-child(3){left:calc(50% + 52px)}#swipe-hint b{font:700 14px Runner,Arial,sans-serif;letter-spacing:1.2px;color:var(--lime);background:#0d1a26cc;padding:3px 9px;border-radius:5px}@keyframes swipe-hand{from{transform:translateX(-34px) rotate(-6deg)}to{transform:translateX(34px) rotate(6deg)}}#swipe-hint[hidden]{display:none}
.audio-state{display:block;font:400 10px/1.4 Arial,sans-serif;letter-spacing:.3px;color:#8fa3ae;margin:-6px 0 10px;min-height:14px}.audio-state:empty{display:none}
/* Launch screen, calmer: the brand logo leads, the title steps back, no rotated tags, a discreet credit. */
.home .brand,.home .tag{display:none}#launch-logo{position:absolute;top:calc(var(--hud-top) + 26px);left:50%;width:min(46vw,190px);height:auto;transform:translateX(-50%);filter:drop-shadow(0 6px 22px #00000099);pointer-events:none}
.home .launch-eyebrow{color:#c9d7de;font-size:9px;letter-spacing:3px;opacity:.8}.home .launch-title{font-size:38px;letter-spacing:2.5px;margin:8px 0 18px;text-shadow:0 2px 12px #07101b}
.home #quick-guide{gap:8px;opacity:.85}.home #quick-guide svg{width:20px;height:20px;color:#dbe6ec}.home #quick-guide b{font-size:13px;letter-spacing:1.2px}.home #quick-guide small{font-size:9px;color:#9fb1bb}
.home #launch-status{font-size:12px;letter-spacing:2.5px}#launch.ready #launch-status{color:#e6f5d0;animation:none}#load-bar{box-shadow:none}
#credit{position:absolute;left:50%;bottom:calc(var(--hud-bottom) + 4px);transform:translateX(-50%);font:400 8px/1 Arial,sans-serif;letter-spacing:1px;text-transform:lowercase;color:#8a9aa4;opacity:.38;text-decoration:none;padding:8px 12px;pointer-events:auto;z-index:20}#credit:hover,#credit:focus-visible{opacity:.9;color:#dbe6ec}
@media(max-height:660px){#launch-logo{width:120px;top:calc(var(--hud-top) + 12px)}.home .launch-title{font-size:32px}}
/* Launch screen, minimal and dark: everything centred, the key art barely there, a hairline progress, TAP TO PLAY. */
.home #overlay{background:#06090d}.home #launch{justify-content:center;padding:0 28px;background:radial-gradient(ellipse at 50% 42%,#0d141c 0%,#06090d 68%)}
.home #launch:before{content:'';position:absolute;inset:0;background:url(assets/keyart-home.webp) center 30%/cover no-repeat;opacity:.14;filter:saturate(.6) blur(2px);pointer-events:none}
.launch-stack{position:relative;display:flex;flex-direction:column;align-items:center;gap:0;width:100%;max-width:340px}
.home #launch-logo{position:static;transform:none;width:118px;margin-bottom:26px;filter:drop-shadow(0 4px 18px #00000099)}
.home .launch-eyebrow{font:500 9px Runner,Arial,sans-serif;letter-spacing:4px;color:#7f8d96;opacity:1}
.home .launch-title{font:600 34px/1 Runner,Arial,sans-serif;letter-spacing:5px;color:#eef2f4;margin:10px 0 0;text-shadow:none}
.launch-rule{display:block;width:26px;height:1px;background:#c4f58a;opacity:.8;margin:20px 0 24px}
.home .launch-load{gap:12px;width:160px}.home #load-track{height:1px;background:#ffffff1f}.home #load-bar{background:#dfe6ea;box-shadow:none}
.home #launch-status{font:500 11px Runner,Arial,sans-serif;letter-spacing:3.5px;color:#9aa8b1;min-height:14px}#launch.ready #launch-status{color:#eef2f4;animation:tap-pulse 1.8s ease-in-out infinite}#launch.ready #load-track{opacity:0}
@keyframes tap-pulse{0%,100%{opacity:.55}50%{opacity:1}}
.launch-hint{position:absolute;left:0;right:0;bottom:calc(var(--hud-bottom) + 30px);text-align:center;font:400 9px Arial,sans-serif;letter-spacing:1.6px;text-transform:uppercase;color:#5f6c74}
.home #quick-guide,.home .launch-copy{display:none}#launch.eager #launch-status{color:#dfe6ea}#launch.eager #load-bar{background:linear-gradient(90deg,#dfe6ea 0 55%,#ffffff 70%,#dfe6ea 85%);background-size:200% 100%}
@media(max-height:660px){.home #launch-logo{width:96px;margin-bottom:18px}.home .launch-title{font-size:28px}}
#credit em{font-style:normal;color:#eef2f4;background:#c4f58a33;padding:1px 4px;border-radius:2px;margin-left:1px}
/* Bottom HUD, quieter: a thin weapon line and a round BOMBE button with a recharge ring, less colour, less space. */
footer{gap:12px;align-items:center}footer:before{inset:-30px -25px -35px;background:linear-gradient(transparent,#08111ab8 85%)}
.weapon{gap:8px;align-items:center;padding-bottom:0}.weapon>span:first-child{width:22px;margin-bottom:0;opacity:.9}.weapon>span:first-child svg{width:22px;height:22px}
.weapon b{font:600 14px Runner,Arial,sans-serif;letter-spacing:1.4px;color:#eef2f4}.weapon small{font:500 9px Runner,Arial,sans-serif;letter-spacing:1.4px;color:#93a4ae;margin:2px 0 5px}.track{height:2px;width:56px;background:#ffffff1f}.track i{opacity:.9}
#active-bonuses{gap:5px;margin-top:5px;font:500 9px Runner,Arial,sans-serif;letter-spacing:1px;color:#c9d7de;max-height:20px}#active-bonuses>span{padding:2px 6px 2px 4px;background:#0d1a26a8;border:0;border-radius:4px}#active-bonuses svg{width:12px;height:12px}
#blast{width:64px;min-height:64px;height:64px;padding:0;border-radius:50%;background:#0d1a26d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1.5px solid #c4f58ab3;color:var(--lime);box-shadow:0 2px 12px #06151a66;gap:0;flex-direction:column;justify-content:center}
#blast-icon svg{width:22px;height:22px;color:var(--lime)}.blast-copy{align-items:center;gap:0}#blast b{font:600 8px/1 Runner,Arial,sans-serif;letter-spacing:1.8px;margin-top:3px;color:#dbe6ec}#blast-state{display:none}
#blast-stock{top:auto;right:auto;bottom:-11px;left:50%;transform:translateX(-50%);gap:4px}#blast-stock b{display:none}#blast-stock i{width:5px;height:5px;background:var(--lime);opacity:.25;box-shadow:none}#blast-stock i.on{opacity:1;box-shadow:0 0 6px #c4f58a99}
#blast.ready{box-shadow:0 2px 12px #06151a66,0 0 14px #c4f58a55}#blast:disabled{background:#0d1a26d9;border-color:#ffffff26;color:#93a4ae;box-shadow:none}#blast:disabled #blast-icon svg{color:#93a4ae}#blast:disabled #blast-stock i{background:var(--lime)}
#flow-hud{inset:-4px;bottom:-4px;left:-4px;right:-4px;top:-4px;border-radius:50%;background:conic-gradient(#8dede2 var(--flow,0%),transparent 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));opacity:0;transition:opacity .2s}#blast:disabled #flow-hud{opacity:.9}.flow-track{display:none}
#blast:after{inset:-3px;border-radius:50%;border-width:2px}#blast-hint{bottom:calc(100% + 16px)}@keyframes blast-teach{from{box-shadow:0 2px 12px #06151a66,0 0 0 3px #c4f58a99}to{box-shadow:0 2px 12px #06151a66,0 0 0 6px #c4f58aee,0 0 26px 12px #c4f58a66}}
#notice{bottom:calc(var(--hud-bottom) + 86px);gap:8px;padding:4px 10px 4px 4px;font:600 12px/1.1 Runner,Arial,sans-serif;letter-spacing:.8px;background:#0d1a26cc;border:0;border-radius:7px;max-width:78%}#notice>svg{padding:4px;width:15px;height:15px;border-radius:5px}#notice small{font-size:10px}
/* Teaching line, quieter: no box, one centred line with a small icon, the detail in grey underneath. */
#tutorial{left:24px;right:24px;top:72%;flex-direction:column;gap:2px;padding:0;background:none;border:0;-webkit-backdrop-filter:none;backdrop-filter:none;font:600 12px/1.2 Runner,Arial,sans-serif;letter-spacing:2px;color:#eef2f4;text-shadow:0 1px 3px #07101b,0 0 14px #07101b}
#tutorial svg{width:14px;height:14px;color:var(--lime);vertical-align:-2px;margin-right:6px}#tutorial>span{display:flex;flex-direction:column;align-items:center}#tutorial small{font:400 10px/1.3 Arial,sans-serif;letter-spacing:.2px;color:#aebcc5;margin-top:3px;text-transform:none}
#swipe-hint{top:63%;gap:4px}#swipe-hint b{background:none;padding:0;font:600 12px Runner,Arial,sans-serif;letter-spacing:2px;color:#eef2f4;text-shadow:0 1px 3px #07101b,0 0 14px #07101b;margin-top:4px}#swipe-hint small{font:400 10px Arial,sans-serif;color:#aebcc5;text-shadow:0 1px 3px #07101b}#swipe-hint svg{width:38px;height:50px}#swipe-hint .arrow{top:8px;font-size:28px}#swipe-hint .arrow:first-child{left:calc(50% - 62px)}#swipe-hint .arrow:nth-child(3){left:calc(50% + 44px)}
#swipe-hint{top:73%}
/* Glass: toasts and the BOMBE button let the scene through; the button sits a little higher and breathes when the lane fills up. */
#notice{background:#0d1a2666;-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);box-shadow:inset 0 0 0 1px #ffffff14;color:#f3fbf6f2}#notice>svg{background:#c4f58acc}
#blast{background:#0d1a2652;-webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);border-color:#c4f58a80;margin-bottom:22px}#blast:disabled{background:#0d1a2652;border-color:#ffffff1f}
#blast.danger{animation:blast-danger .55s ease-in-out infinite alternate;border-color:var(--lime)}#blast.danger #blast-icon svg{animation:icon-breathe .55s ease-in-out infinite alternate}
@keyframes blast-danger{from{box-shadow:0 2px 12px #06151a66,0 0 0 2px #c4f58a66,0 0 10px #c4f58a33}to{box-shadow:0 2px 12px #06151a66,0 0 0 5px #c4f58acc,0 0 26px 8px #c4f58a66}}@keyframes icon-breathe{from{transform:scale(1)}to{transform:scale(1.16)}}
#active-bonuses>span{background:#0d1a2666;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
/* Ready: the screen dims a step further and TAP TO PLAY comes forward. */
#launch:after{content:'';position:absolute;inset:0;background:#03050899;opacity:0;transition:opacity .6s ease;pointer-events:none}#launch.ready:after{opacity:1}
.launch-stack>*{transition:opacity .6s ease,transform .6s ease}#launch.ready .launch-stack>*:not(.launch-load){opacity:.38;transform:scale(.97)}
.launch-stack,.launch-hint,#credit{position:relative;z-index:2}.launch-hint,#credit{position:absolute}#launch.ready .launch-hint{opacity:.7}
#launch.ready #launch-status{font-size:15px;letter-spacing:5px;color:#ffffff;text-shadow:0 0 18px #c4f58a66;transform:translateY(6px);transition:font-size .5s ease,letter-spacing .5s ease,transform .5s ease}
#credit em{background:none;padding:0;margin:0;color:#c9d7de;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;text-decoration-color:#c4f58aaa}
/* Credit: above the full-screen launch zone so it can be tapped, still barely there. */
#credit{display:none;z-index:4}.home #credit{display:block;position:absolute;left:50%;bottom:calc(var(--hud-bottom) + 2px);transform:translateX(-50%);padding:10px 14px;opacity:.42}#launch.ready~#credit,.home #credit:hover{opacity:.55}
/* BOMBE, final form: dark glass disc, a filled lime bomb with a flickering spark, the label under it. */
#blast{width:70px;height:70px;min-height:70px;background:radial-gradient(circle at 50% 38%,#1b2c38e6,#0b141cd9 70%);border:1.5px solid #c4f58acc;box-shadow:0 4px 16px #02070b99,inset 0 1px 0 #ffffff1f}
#blast-icon{display:block;width:34px;height:34px;margin-top:2px}#blast-icon svg{width:34px;height:34px}#blast b{font:600 8px/1 Runner,Arial,sans-serif;letter-spacing:2px;margin-top:1px;color:#e8f3dc}
#blast .bomb-spark{transform-origin:35.6px 4.9px;animation:spark-flicker .32s steps(2,end) infinite}@keyframes spark-flicker{0%{transform:scale(1) rotate(0);opacity:1}50%{transform:scale(.7) rotate(22deg);opacity:.75}}
#blast:disabled .bomb-body{fill:#56646c}#blast:disabled .bomb-cap{fill:#48545b}#blast:disabled .bomb-shine{stroke:#ffffff55}#blast:disabled .bomb-spark,#blast:disabled .bomb-fuse{opacity:.25;animation:none}#blast:disabled b{color:#93a4ae}
#blast.nudge{animation:bomb-nudge .9s cubic-bezier(.3,1.6,.5,1)}@keyframes bomb-nudge{0%{transform:scale(1)}18%{transform:scale(1.28) translateY(-6px)}36%{transform:scale(.94)}54%{transform:scale(1.12) translateY(-2px)}72%{transform:scale(.98)}100%{transform:scale(1)}}
#blast.nudge:after{animation:blast-ripple .8s ease-out}
#blast.gain{animation:bomb-gain .45s ease-out}@keyframes bomb-gain{0%{transform:scale(1)}35%{transform:scale(1.2)}100%{transform:scale(1)}}#blast.gain:after{animation:blast-ripple .6s ease-out}
.charge-fly{position:absolute;z-index:9;width:30px;height:30px;pointer-events:none;filter:drop-shadow(0 0 8px #c4f58acc) drop-shadow(0 0 2px #fff);transform:translate(-50%,-50%)}.charge-fly svg{width:30px;height:30px}
@media(prefers-reduced-motion:reduce){#blast.nudge,#blast.gain,#blast .bomb-spark{animation:none}}
.charge-fly{width:40px;height:40px;filter:drop-shadow(0 0 10px #c4f58a) drop-shadow(0 0 3px #ffffff)}.charge-fly svg{width:40px;height:40px}
/* Launch footer: the brand's account and the credit side by side, above the full-screen start zone, barely there. */
#credits{display:none;position:absolute;left:50%;bottom:calc(var(--hud-bottom) + 2px);transform:translateX(-50%);z-index:4;align-items:center;white-space:nowrap}.home #credits{display:flex}
.home #credits #credit{display:inline-block;position:static;transform:none;padding:10px 6px;opacity:1;z-index:auto}
#brand-link{font:400 8px/1 Arial,sans-serif;letter-spacing:1px;color:#8a9aa4;text-decoration:none;padding:10px 6px}#brand-link:hover,#brand-link:focus-visible{color:#dbe6ec}
.credits-dot{font:400 8px/1 Arial,sans-serif;color:#5f6c74}.home #credits{opacity:.5}
.options-links{display:flex;justify-content:center;align-items:center;gap:22px;flex-wrap:wrap}.options-links .brand-link{font:600 12px Runner,Arial,sans-serif;letter-spacing:2px;color:#9fb1bb;text-decoration:none;padding:10px 0}
#blast:disabled .bomb-light{fill:#6b7880}
/* BOMBE v3: a larger, detailed bomb; disabled = grey metal. */
#blast{width:74px;height:74px;min-height:74px}#blast-icon{width:40px;height:40px;margin-top:0}#blast-icon svg{width:40px;height:40px;overflow:visible}
#blast .bomb-spark{transform-origin:41.4px 8.4px;animation:spark-flicker .28s steps(2,end) infinite}
#blast:disabled .bomb-body{fill:#20282d}#blast:disabled .bomb-mid{fill:#46535a}#blast:disabled .bomb-light{fill:#65737b}#blast:disabled .bomb-core{opacity:.12}#blast:disabled .bomb-cap-hi{fill:#7d8a91}#blast:disabled .bomb-spark{display:none}#blast:disabled .bomb-fuse,#blast:disabled .bomb-fuse-twist{opacity:.45}
.charge-fly{width:44px;height:44px}.charge-fly svg{width:44px;height:44px;overflow:visible}
/* Slow-motion lesson: the scene dims around the button, which swells and shrinks, rings pulse out, a bubble points at it. */
.slowmo #slowmo{background:radial-gradient(circle at calc(100% - 53px) calc(100% - var(--hud-bottom) - 59px),#0000 0 66px,#030609d9 170px);transition:opacity .25s}
#blast.teach{animation:bomb-teach .55s ease-in-out infinite alternate;border-color:var(--lime);z-index:3}
@keyframes bomb-teach{from{transform:scale(1);box-shadow:0 2px 12px #06151a66,0 0 0 3px #c4f58aaa,0 0 18px 4px #c4f58a55}to{transform:scale(1.38);box-shadow:0 2px 12px #06151a66,0 0 0 5px #c4f58a,0 0 42px 16px #c4f58a99}}
#blast.teach:after{border-color:var(--lime);animation:teach-ring 1.1s ease-out infinite}@keyframes teach-ring{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(2.1)}}
#blast.teach #blast-icon svg{animation:icon-breathe .55s ease-in-out infinite alternate}
#blast-hint{font:700 15px Runner,Arial,sans-serif;letter-spacing:1.6px;padding:8px 12px;left:auto;right:-6px;transform:none;bottom:calc(100% + 26px)}#blast-hint:after{left:auto;right:30px;margin-left:0}
#blast.teach #blast-hint{animation:hint-bob2 .55s ease-in-out infinite alternate}@keyframes hint-bob2{from{transform:translateY(0)}to{transform:translateY(-8px)}}
.slowmo #tutorial{z-index:9;top:40%}.slowmo #tutorial svg{color:var(--lime)}
#blast-icon{width:50px;height:50px;margin:-8px 0 -4px}#blast-icon svg{width:50px;height:50px}#blast b{font-size:7.5px;letter-spacing:1.8px}
@keyframes bomb-teach{from{transform:scale(1);box-shadow:0 2px 12px #06151a66,0 0 0 3px #c4f58aaa,0 0 18px 4px #c4f58a55}to{transform:scale(1.45);box-shadow:0 2px 12px #06151a66,0 0 0 5px #c4f58a,0 0 46px 18px #c4f58aa6}}
#blast.teach{transform-origin:70% 72%}
