:root{color-scheme:dark;--cyan:#99fff1;--lemon:#ffe19e;--navy:#0a0e2f;--pink:#ff6d9f}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#080b21;color:#fff;font-family:Consolas,'Courier New',monospace}body{display:grid;place-items:center;touch-action:none;overscroll-behavior:none}button{cursor:pointer;font:inherit;user-select:none;-webkit-user-select:none}#game-shell{position:relative;width:100vw;height:100vh;height:100dvh;overflow:hidden;isolation:isolate;background:#282153}canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;image-rendering:auto}#game-shell.pixel canvas{image-rendering:pixelated}#scanlines{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(13,4,34,.09) 0px,rgba(13,4,34,.09) 1px,transparent 2px,transparent 4px);opacity:.35;z-index:3}.hidden{display:none!important}#hud{position:absolute;inset:0;z-index:5;pointer-events:none;text-shadow:2px 2px 0 #14224f,0 0 14px #19002a}.hud-top{display:flex;justify-content:space-between;align-items:flex-start;padding:15px 21px;gap:10px}.hud-block{min-width:160px;display:flex;flex-direction:column;gap:0}.hud-block small,.hud-center small{font-size:11px;color:#b9f8f4;letter-spacing:1.8px;font-weight:800}.hud-block strong{font-size:25px;letter-spacing:2px;color:#fff8db;line-height:1.2}.hud-right{text-align:right}.hud-center{text-align:center;display:flex;flex-direction:column;gap:4px}.hud-center strong{font-size:13px;color:#fdb6d6;letter-spacing:2px}.hud-bottom{position:absolute;bottom:12px;left:20px;right:20px;display:flex;align-items:flex-end;justify-content:space-between;gap:15px}.life-row{width:150px;display:flex;flex-direction:column;gap:4px}.life-row small{font-size:9px;letter-spacing:2px;color:#bbf8ed}.life-row span{color:#ffdf91;letter-spacing:6px;font-size:21px}.wave-status{width:230px;text-align:center}.wave-status>span{font-size:10px;letter-spacing:1.8px;color:#fff4b6;font-weight:800}.progress,.boss-track{height:6px;background:#081c3d;border:1px solid #b6ffe6;margin-top:7px;box-shadow:0 0 12px #9effec60}.progress span,.boss-track div{display:block;height:100%;width:5%;background:#ffde85;box-shadow:0 0 10px #ffdb8d}.sound-hud{display:flex;gap:7px;width:150px;justify-content:flex-end;pointer-events:auto}.sound-hud button{color:#dbfff6;background:#071936a3;border:1px solid #90f4e0a9;padding:8px 10px;letter-spacing:1px}.boss-bar{position:absolute;top:72px;left:50%;transform:translateX(-50%);width:min(320px,50vw);text-align:center;color:#fff1bb;font-size:11px;letter-spacing:2px;font-weight:bold}.boss-bar span{color:#ff7ba5}.boss-track{height:11px;border-color:#ffb5c7}.boss-track div{width:100%;background:#ff6482}.message{position:absolute;top:24%;left:50%;transform:translateX(-50%);font-size:clamp(14px,2.5vw,25px);letter-spacing:3px;color:#fff1bc;text-align:center;white-space:pre-line;line-height:1.5;font-weight:900;filter:drop-shadow(0 3px 1px #5b1749);pointer-events:none}.overlay{position:absolute;inset:0;z-index:10;display:flex;justify-content:center;align-items:center;background:radial-gradient(ellipse at 50% 48%,rgba(20,12,49,.74),rgba(4,8,29,.80) 65%,rgba(1,3,17,.93));overflow:auto}.menu{align-items:center}.menu-card{width:min(550px,91vw);position:relative;border:2px solid #85f9e5b9;padding:clamp(14px,2.5vw,26px) clamp(20px,3vw,31px);background:linear-gradient(135deg,#071c37e9,#0d1538ee 60%,#2e1549e5);box-shadow:0 20px 80px #000a,0 0 45px #74f7e529,inset 0 0 38px #ff73a70d;outline:1px solid #ffdda777;outline-offset:6px;max-height:94%;overflow:auto}.kicker{display:flex;align-items:center;gap:8px;font-weight:bold;font-size:10px;letter-spacing:1.6px;color:#abfdec;border-bottom:1px solid #8dffd342;padding-bottom:12px}.kright{margin-left:auto;color:#ffdb93}.led{width:7px;height:7px;border-radius:100%;background:#83ffe1;box-shadow:0 0 12px #69ffc5}.title-lock{text-align:center;padding:17px 0 9px}.mini{font-size:11px;letter-spacing:3px;color:#ffcfae}h1{margin:0;line-height:1.08;font-weight:1000;font-size:clamp(53px,9vw,78px);letter-spacing:-4px;font-style:italic;color:#ffefad;text-shadow:4px 4px 0 #eb597d,8px 8px 0 #32368d,0 0 40px #ff876e57}h1 span{font-size:.58em;letter-spacing:-2px;color:#9cfff3;text-shadow:4px 4px 0 #26368d,0 0 23px #59ffdf}.sub-title{font-size:12px;font-weight:900;color:#aefbf2;letter-spacing:4px;margin-top:6px}.tagline{color:#d8e6f4;font-size:11px;line-height:1.75;text-align:center;margin:10px 0 20px}.primary{width:100%;padding:15px;border:2px solid #fff1b4;background:linear-gradient(#ffdf88,#ff9c73);color:#202245;font-weight:1000;letter-spacing:2px;box-shadow:0 6px 0 #7a365d,0 0 22px #ffd88944;transition:filter .12s,transform .12s}.primary:hover{filter:brightness(1.15)}.primary:active{transform:translateY(3px);box-shadow:0 3px 0 #7a365d}.primary span{float:right;font-size:10px;letter-spacing:0;border:1px solid #8c465d;padding:3px 5px}.menu-options{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin:18px 0 14px;color:#a8f7e8;letter-spacing:1px;font-weight:900;font-size:11px}.menu-options label{display:flex;align-items:center;gap:7px;cursor:pointer}.menu-options input{accent-color:#74f8de}.control-help{border-top:1px solid #c6fdef38;border-bottom:1px solid #c6fdef38;padding:11px 0;display:grid;gap:7px}.control-help div{display:flex;justify-content:space-between;gap:8px;font-size:10px}.control-help b{color:#ffd88f;letter-spacing:1.5px}.control-help span{color:#c7e5ea;text-align:right}.fine{font-size:9px;text-align:center;line-height:1.7;color:#7ca5c6;letter-spacing:.4px;margin-top:15px}.menu-footer{position:absolute;bottom:12px;left:20px;right:20px;display:flex;justify-content:space-between;gap:10px;color:#b8defd;font-size:9px;letter-spacing:1.5px}.end-card,.pause-card{text-align:center;width:min(420px,86vw);border:2px solid #ffdf95;background:#0c1539ec;padding:27px;box-shadow:0 0 65px #0009}.end-card h2,.pause-card h2{font-size:36px;letter-spacing:2px;color:#fff1b0;text-shadow:3px 3px #bf477e;margin:10px 0}.end-card p{color:#c5ecee;font-size:12px}.end-score{border-block:1px solid #77efd157;padding:15px;margin:20px 0;display:flex;flex-direction:column;gap:5px}.end-score small{font-size:10px;letter-spacing:2px;color:#9effdf}.end-score strong{font-size:34px;letter-spacing:3px;color:#ffe5a0}.secondary{margin-top:13px;background:transparent;color:#b1f9e7;border:1px solid #79e9da;padding:10px 25px;width:100%;letter-spacing:2px}.pause-card>div{font-size:11px;letter-spacing:2px;color:#a7fbe5}#touch-controls{position:absolute;inset:0;z-index:6;pointer-events:none}#stick-area{position:absolute;bottom:7%;left:5%;height:116px;width:116px;border-radius:50%;border:2px solid #baffeb55;background:#08283c71;pointer-events:auto;touch-action:none;box-shadow:inset 0 0 20px #60f9cc32}#stick-area:before,#stick-area:after{content:"";position:absolute;left:50%;top:50%;background:#a1efdd50;transform:translate(-50%,-50%)}#stick-area:before{width:1px;height:70%}#stick-area:after{height:1px;width:70%}#stick-knob{position:absolute;width:50px;height:50px;left:33px;top:33px;border-radius:50%;background:radial-gradient(#ffffcb,#73e9c4);box-shadow:0 0 23px #85ffd88b;border:2px solid #effff9;pointer-events:none}.touch-right{position:absolute;bottom:7%;right:5%;display:flex;align-items:flex-end;gap:12px;pointer-events:auto}.touch-right button{background:#081a3dbd;border:2px solid #b9ffecaa;color:#d9ffed;box-shadow:0 0 20px #79ffe544;touch-action:none}.touch-right #touch-fire{width:97px;height:97px;border-radius:50%;background:radial-gradient(#ffbe8b,#ed5274);color:#fff;letter-spacing:2px;font-size:15px;font-weight:bold;text-shadow:1px 2px #942e65}.touch-right #touch-fire span{display:block;font-size:19px;color:#ffe8b3}.touch-right #touch-pause{height:36px;padding:0 12px;margin-bottom:4px}#rotate-hint{display:none;position:absolute;bottom:4px;left:50%;transform:translateX(-50%);pointer-events:none;font-size:9px;letter-spacing:1px;color:#d9ffff;z-index:7;white-space:nowrap}@media(hover:none) and (pointer:coarse){.menu-footer{display:none}#rotate-hint{display:block}}@media(max-width:760px){.hud-top{padding:9px 9px}.hud-block{min-width:92px}.hud-block small,.hud-center small{font-size:8px;letter-spacing:.5px}.hud-block strong{font-size:16px}.hud-center strong{font-size:10px}.hud-bottom{left:9px;right:9px;bottom:5px}.life-row{width:85px}.life-row span{font-size:13px;letter-spacing:2px}.wave-status{width:115px}.wave-status>span{font-size:8px;letter-spacing:.3px}.sound-hud{width:90px}.sound-hud button{padding:5px 6px;font-size:10px}.boss-bar{top:40px}.menu-card{max-height:94vh;max-height:94dvh;padding:14px 20px}.title-lock{padding:9px 0}.tagline{margin:7px 0 12px}.menu-options{margin:10px 0}.control-help{padding:7px 0}.fine{margin-top:8px}}@media (orientation:portrait) and (hover:none){#game-shell{width:100vw;height:100dvh}#rotate-hint{bottom:3%;}.menu-card{max-height:82dvh}.hud-bottom{bottom:14%}#stick-area,.touch-right{bottom:5%}}

.menu-card{touch-action:pan-y}
@media (hover:none) and (pointer:coarse){
 .hud-bottom{top:48px;bottom:auto;align-items:flex-start}
 .hud-bottom .life-row{order:0}
 .hud-bottom .wave-status{order:1;align-self:flex-start}
 .hud-bottom .sound-hud{order:2}
 .hud-bottom .life-row span{font-size:12px}
 .boss-bar{top:80px;width:min(260px,56vw)}
 #touch-controls{z-index:7}
}
/* STEEL HALO / YETI RETRIEVAL expansion */
.hud-special{position:absolute;right:20px;top:85px;display:flex;flex-direction:column;align-items:flex-end;gap:7px;font-size:10px;color:#a7e9e4;letter-spacing:1px;font-weight:bold;white-space:nowrap}.gear-label b{color:#ffdf8a;margin-left:6px}.gear-label span{color:#ff99ad;margin-left:5px}.boost-wrapper{width:172px;margin-top:6px}.boost-head{display:flex;justify-content:space-between;margin-bottom:5px;color:#9df9e9}.boost-head b{color:#fff3b4}.boost-track{height:9px;border:1px solid #89ffee7a;background:#03172c;padding:1px;box-shadow:0 0 12px #2cf8ff35}.boost-track span{display:block;background:linear-gradient(90deg,#4fd3f5,#87ffce,#ffffb1);height:100%;width:100%;box-shadow:0 0 8px #66f7ff75;transition:width .1s linear}.boost-wrapper.active .boost-track span{background:#ffe49b;box-shadow:0 0 15px #ffed90}
.touch-right #touch-boost{height:71px;width:71px;border-radius:50%;font-weight:900;color:#fff4b2;font-size:11px;background:radial-gradient(#47858f,#132c60)}.touch-right #touch-boost span{display:block;font-size:24px;color:#a1ffeb}.touch-right #touch-boost.pressed{background:radial-gradient(#fcdb81,#e5807f);color:#142342}.fragment-popup{position:absolute;top:32%;left:50%;transform:translateX(-50%);z-index:9;padding:16px 26px;background:#071734ef;box-shadow:0 0 40px #ffe68355;outline:2px solid #ffdf87;text-align:center;pointer-events:none;color:#ffe9ac;display:flex;flex-direction:column;align-items:center;gap:7px;letter-spacing:2px;text-shadow:2px 2px #3b1843}.fragment-popup span{font-size:11px;color:#84ffeb}.fragment-popup strong{font-size:clamp(15px,2.7vw,24px)}.fragment-popup small{font-size:11px;color:#fff}.puzzle-card{width:min(870px,95vw);max-height:94dvh;overflow:auto;touch-action:pan-y;background:linear-gradient(125deg,#081c35f5,#121435f5);border:2px solid #a3fff0;padding:clamp(14px,2.7vw,30px);box-shadow:0 0 65px #000b,0 0 42px #89ffe52a}.puzzle-card h2{font-style:italic;letter-spacing:2px;color:#fff0bc;text-shadow:3px 3px #ac5376;font-size:clamp(24px,3.5vw,39px);margin:12px 0}.puzzle-card h2 em{font-style:normal;color:#fce45d}.puzzle-card p{font-size:12px;color:#d2eaf0;line-height:1.7}.puzzle-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.puzzle-caption{font-size:11px;letter-spacing:1.5px;color:#8dfff0;margin-bottom:10px}.puzzle-board,.puzzle-pieces{display:flex;gap:4px;align-items:center;justify-content:center;background:#020e24b8;border:1px solid #8ce4d55e;padding:12px;min-height:192px}.puzzle-slot,.puzzle-piece{position:relative;width:calc((100% - 8px) / 3);max-width:120px;aspect-ratio:1 / 1.68;cursor:pointer;border:2px dashed #a8d9e35e;background:#172c4d;color:#8cf6e8;font-size:24px;font-weight:bold;background-repeat:no-repeat;transition:filter .1s,transform .1s}.puzzle-slot.correct{border-style:solid;border-color:#a5ffe1;color:transparent}.puzzle-piece{background-color:#173550;border-style:solid;border-color:#ffdb8a}.puzzle-piece.selected{outline:3px solid #fffbcc;transform:translateY(-9px);filter:brightness(1.24)}.puzzle-piece.used{opacity:.17;pointer-events:none;filter:grayscale(1)}.puzzle-note{font-size:10px;letter-spacing:.5px;color:#ffeaa1;min-height:30px;margin-top:10px}.puzzle-card .secondary{max-width:230px;margin:18px auto 0;display:block}.hud-special .gear-label:first-child{background:#06193487;padding:3px 5px}
@media(max-width:760px){.hud-special{right:8px;top:75px;font-size:8px;gap:4px;max-width:43%;letter-spacing:0}.gear-label b{margin-left:2px}.boost-wrapper{width:min(150px,35vw)}.touch-right{gap:7px}.touch-right #touch-fire{width:77px;height:77px;font-size:13px}.touch-right #touch-boost{width:63px;height:63px}.touch-right #touch-pause{position:absolute;bottom:85px;right:15px}.puzzle-layout{gap:8px}.puzzle-board,.puzzle-pieces{padding:4px;min-height:120px}.puzzle-card{padding:14px}.puzzle-card p{font-size:11px}}
@media (orientation:portrait) and (pointer:coarse){.hud-special{top:95px}.touch-right #touch-pause{bottom:88px}}

.title-preview{margin-top:14px;border-color:#ffe19988;color:#ffeab6;font-size:11px;background:#16213b99;padding:9px;width:100%}.title-preview:hover{background:#314269}

/* V2.1 • arcade attract panels + yellow vessel recovery monitor */
canvas{image-rendering:auto}
.menu{justify-content:space-between;gap:1.5vw;padding:20px max(14px,2.2vw)}
.menu-card{flex:0 1 550px;width:min(550px,49vw);min-width:0;z-index:1;padding:clamp(14px,1.8vw,23px)}
.attract-side{flex:1 1 0;min-width:0;max-width:330px;height:min(75vh,570px);border:1px solid #7df9d188;background:linear-gradient(180deg,#091b3bd9,#080c29d7);padding:13px;box-shadow:inset 0 0 24px #4ae9d20d,0 0 28px #1cf5dd14;display:flex;flex-direction:column;align-self:center;letter-spacing:1px;text-align:center}
.panel-top{color:#ffe6a3;font-size:clamp(10px,1vw,15px);font-weight:1000;letter-spacing:2px;white-space:nowrap;text-shadow:0 0 15px #ffc77b66}
.panel-sub{margin-top:7px;padding-bottom:12px;border-bottom:1px solid #7cfde34c;color:#7ae7d7;font-size:9px}
.marquee-mask{flex:1;position:relative;overflow:hidden;mask-image:linear-gradient(transparent,#000 7%,#000 91%,transparent);margin:8px 0}
.scroll-up{width:100%;position:absolute;left:0;top:100%;animation:attractRise 28s linear infinite}
.scores-scroll{animation-duration:28s}
.credits-scroll{animation-duration:35s;text-align:center;color:#c1e9eb;font-size:11px;line-height:1.75}
.credits-scroll p{padding:6px 4px;margin:10px 0}
.credits-scroll .credit-head{color:#ffda89;font-weight:900;font-size:12px;letter-spacing:2px;padding-top:8px}
@keyframes attractRise{0%{transform:translateY(0)}100%{transform:translateY(calc(-100% - 530px))}}
.arcade-score{display:flex;justify-content:space-between;gap:3px;margin:12px 0;color:#e5fcff;font-size:clamp(9px,.9vw,13px);font-weight:bold;white-space:nowrap}
.arcade-score .r{color:#ffd88c}.arcade-score .nm{color:#9bfff3}.arcade-score.personal .r,.arcade-score.personal .nm{color:#ffb8c6}
.arcade-score-note{font-size:9px;color:#a4c5cf;margin:18px 0 28px;line-height:1.8}
.arcade-side-footer{border-top:1px solid #82ffe744;padding-top:12px;color:#ffe9a6;font-size:9px;line-height:1.5;letter-spacing:.5px}
.title-yeti{display:flex;align-items:center;justify-content:center;gap:12px;border:1px solid #ffe28d61;background:#ffe18c0d;margin:12px auto 0;padding:7px;width:max-content;max-width:100%;text-align:left}
.title-yeti img{width:54px;height:64px;object-fit:contain;filter:drop-shadow(0 0 7px #ffe78190)}
.title-yeti div{display:flex;flex-direction:column;gap:5px}.title-yeti b{font-size:11px;color:#ffe08a;letter-spacing:1.5px}.title-yeti span{font-size:10px;color:#ffb2ae}.title-yeti em{font-size:9px;color:#a7ffe7;font-style:normal}
.yeti-monitor{position:absolute;left:16px;top:90px;width:133px;z-index:5;pointer-events:none;border:1px solid #f7df8488;background:linear-gradient(150deg,#07102ace,#141a3adc);padding:9px 8px 7px;text-align:center;box-shadow:0 0 22px #0008, inset 0 0 22px #ffcd4312}
.ym-title{font-size:9px;color:#ffe0a2;letter-spacing:1px;font-weight:900}
.ym-art{width:90px;height:107px;position:relative;overflow:hidden;margin:7px auto 4px;background:repeating-linear-gradient(0deg,#192640,#192640 8px,#102038 9px,#102038 10px)}
.ym-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:brightness(.13) grayscale(.7)}
.ym-slice{position:absolute;inset:0;background:url('../assets/sprites/yeti-mug.png') center/contain no-repeat;opacity:0;transition:opacity .3s}
.ym-slice.recovered{opacity:1;filter:drop-shadow(0 0 5px #ffdd7a)}
#ym-piece-0{clip-path:inset(0 0 66.66% 0)}#ym-piece-1{clip-path:inset(33.33% 0 33.33% 0)}#ym-piece-2{clip-path:inset(66.66% 0 0 0)}
.ym-count{color:#98ffe7;font-size:10px;font-weight:900;padding:4px}.ym-message{font-size:8px;color:#e2ac76;letter-spacing:.5px}
.record-entry{margin:8px 0 15px;text-align:left}.record-entry label{display:block;color:#a4ffef;letter-spacing:1px;font-size:10px;margin-bottom:7px}.record-row{display:flex;gap:7px}.record-row input{width:33%;min-width:85px;background:#061830;border:1px solid #a6ffe0;color:#ffe19a;font:900 16px monospace;text-transform:uppercase;padding:10px;letter-spacing:2px}.record-row button{flex:1;background:#e6bf7b;color:#111d39;border:0;font-weight:900;font-size:12px}.record-entry span{display:block;color:#afffe2;font-size:10px;margin-top:5px;min-height:12px}
@media(max-width:1150px){.attract-side{padding:7px;min-height:360px}.menu{gap:.8vw;padding:10px}.menu-card{width:52vw;padding:15px}.panel-top{letter-spacing:.3px}.attract-side{height:70vh}.title-yeti img{width:38px;height:46px}.title-yeti{margin-top:6px}.tagline{margin:5px 0 11px}}
@media(max-width:800px){.menu{padding:7px;justify-content:center}.menu-card{width:min(550px,94vw);flex-basis:auto}.attract-side{display:none}.title-yeti img{width:37px;height:43px}.yeti-monitor{top:130px;left:8px;width:84px;padding:5px 2px}.ym-art{width:62px;height:71px;margin:4px auto}.ym-title{font-size:7px}.ym-count{font-size:8px}.ym-message{font-size:6px}}
@media(max-width:520px){.yeti-monitor{top:118px}.hud-special{top:100px}.menu-card{width:94vw}.menu-options{gap:10px}.title-yeti em{display:none}}
@media (prefers-reduced-motion:reduce){.scroll-up{animation-duration:60s}}

/* Immediately populated, perpetually rolling title-side panels. */
.scroll-up{top:0;animation-name:attractSeamlessRise}
@keyframes attractSeamlessRise{from{transform:translateY(0)}to{transform:translateY(-50%)}}
.scroll-up>.scroll-copy{padding-bottom:20px}

/* V2.2 — genuine resolution control and less intense overlays */
#scanlines{opacity:.12;background:repeating-linear-gradient(to bottom,rgba(8,4,25,.07) 0px,rgba(8,4,25,.07) 1px,transparent 2px,transparent 5px)}
#game-shell.pixel canvas{image-rendering:pixelated}
.sound-hud{width:auto}
#quality-button{color:#ffe4a2;background:#081935bf;border-color:#ffd78ab0;white-space:nowrap;min-width:56px}
/* Optional web font with sturdy offline monospace fallback; no font files shipped. */

.attract-side{font-family:'Press Start 2P',Consolas,'Courier New',monospace;line-height:1.9;letter-spacing:.1px}
.panel-top{font-size:clamp(9px,.80vw,13px);letter-spacing:0;line-height:1.9}
.panel-sub{font-size:clamp(7px,.55vw,10px);line-height:1.7}
.arcade-score{font-size:clamp(8px,.67vw,11px);line-height:2.1;letter-spacing:0;gap:6px}
.arcade-score .nm{overflow:hidden;text-overflow:ellipsis;max-width:34%}
.arcade-score-note{font-size:9px;line-height:2.1;letter-spacing:0}
.credits-scroll{font-size:clamp(8px,.63vw,10px);line-height:2.4}
.credits-scroll .credit-head{font-size:clamp(9px,.7vw,11px);letter-spacing:0;line-height:2.1}
/* Move the reels outwards and narrow the title slightly when all three are visible. */
@media(min-width:1151px){.menu{gap:clamp(28px,3vw,78px);padding-inline:clamp(25px,3vw,78px)}.menu-card{flex:0 0 min(510px,41vw);width:min(510px,41vw)}.attract-side{max-width:300px}}
/* Visible reel motion: they begin below the panel and scroll upwards on a clear loop. */
.scroll-up{top:100%;animation:steelhaloCrawl 24s linear infinite;will-change:transform}
.scores-scroll{animation-duration:18s}
.credits-scroll{animation-duration:28s}
@keyframes steelhaloCrawl{from{transform:translateY(0)}to{transform:translateY(calc(-100% - 650px))}}
@media(max-width:1150px){.menu{gap:15px}.menu-card{width:51vw}}
@media(max-width:800px){.sound-hud{gap:4px}#quality-button{min-width:45px}}
/* Compact landscape phones, including 844x390 CSS viewports. */
@media (pointer:coarse) and (max-height:500px) {
 .hud-top{padding:4px 8px}
 .hud-block{min-width:84px}
 .hud-block strong{font-size:15px}
 .hud-block small,.hud-center small{font-size:8px}
 .hud-center strong{font-size:9px}
 .hud-bottom{top:42px;left:8px;right:8px}
 .hud-bottom .wave-status{width:160px}
 .hud-bottom .wave-status>span{font-size:8px}
 .sound-hud{gap:3px}
 .sound-hud button{padding:4px 5px;font-size:9px}
 .yeti-monitor{width:83px;top:95px;left:6px;padding:5px 3px}
 .ym-art{width:56px;height:65px;margin:4px auto 2px}
 .ym-title{font-size:7px}
 .ym-count{font-size:8px}
 .ym-message{font-size:6px}
 .hud-special{right:6px;top:81px;gap:3px;font-size:8px;max-width:36%}
 .boost-wrapper{width:110px;margin-top:2px}
 .boss-bar{top:70px;width:min(240px,30vw)}
 #stick-area{height:90px;width:90px;bottom:5%;left:3%}
 #stick-knob{height:42px;width:42px;left:22px;top:22px}
 .touch-right{bottom:5%;right:3%;gap:7px}
 .touch-right #touch-fire{width:72px;height:72px}
 .touch-right #touch-boost{width:61px;height:61px}
 #rotate-hint{display:none}
}

/* v2.3: target icons and small-breakpoint layout */
.arcade-target-counts{display:flex;gap:5px;grid-column:1/-1;align-items:center;justify-content:center;margin:3px 0 9px;flex-wrap:wrap}
.arcade-target-counts span{display:inline-flex;align-items:center;gap:2px;background:#14233dc9;padding:1px 4px;border:1px solid #3b5368;border-radius:3px;font-size:9px;color:#ffe389}
.arcade-target-counts img{width:17px;height:17px;object-fit:contain}
.special-tally{position:absolute;right:1.3%;top:25%;z-index:4;display:flex;flex-direction:column;gap:5px;max-width:80px;pointer-events:none}
.target-chip{display:flex;align-items:center;gap:4px;background:#080e24af;border:1px solid #5c738b6b;border-radius:6px;padding:2px 5px;font:700 11px monospace;color:#ffdd81}
.target-chip img{width:25px;height:25px;object-fit:contain}
.menu .fine a{color:#9cf9dd;text-decoration:underline}
@media(max-width:740px){.special-tally{top:27%;right:2%;flex-direction:row;flex-wrap:wrap;justify-content:flex-end;max-width:140px;gap:2px}.target-chip{padding:1px 3px;font-size:9px}.target-chip img{width:17px;height:17px}}

/* Wrap each arcade score's optional target icons beneath its score safely. */
.arcade-score{display:grid;grid-template-columns:1.3rem minmax(0,1fr) max-content;align-items:center}
.arcade-target-counts{grid-column:1/-1;justify-content:flex-start;margin:0 0 6px 19px}

/* v2.4: user-toggleable target nameplates, interchangeable weapon art */
#labels-button{min-width:72px;font-size:10px;color:#b6fee8;background:#081935bf;border-color:#77d9c7a8;white-space:nowrap}
#labels-button.on{color:#ffe5a2;border-color:#ffd784b0}
.weapon-display{display:flex;align-items:center;gap:7px}
.weapon-display>img{width:31px;height:31px;flex:none;object-fit:contain;border:1px solid #9cf3e65b;background:#062a39aa;border-radius:4px;padding:2px}
.weapon-display>div{min-width:0}
.weapon-display b{display:inline-block;margin-left:4px}
@media(max-width:800px){#labels-button{min-width:54px;font-size:8px;padding:4px 3px}.weapon-display>img{width:23px;height:23px}}
@media (pointer:coarse) and (max-height:500px){#labels-button{min-width:48px;padding:3px 2px;font-size:7px}.weapon-display{gap:4px}.weapon-display>img{width:20px;height:20px}}

/* V2.5 shield charge indicator — shares the existing compact HUD rhythm. */
.shield-wrapper{min-width:105px;max-width:144px;flex:1}.shield-head{font:700 9px ui-monospace,monospace;display:flex;justify-content:space-between;gap:7px;color:#b4f6ff;letter-spacing:.07em}.shield-head b{color:#ecfcff}.shield-track{height:6px;margin-top:3px;border:1px solid #367186;border-radius:8px;overflow:hidden;background:#10273e}.shield-track span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#34addf,#7bfff2);transition:width .12s linear}.shield-wrapper.critical .shield-head,.shield-wrapper.critical .shield-head b{color:#ff9c52}.shield-wrapper.critical .shield-track span{background:linear-gradient(90deg,#ff5836,#ffd178)}

/* V2.6: light-weight preflight callsign selection */
.pilot-preflight{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin:9px auto 10px}
.pilot-preflight label{font:700 11px/1.4 monospace;letter-spacing:.08em;color:#e7dbaa;display:flex;flex-direction:column;text-align:left}
.pilot-preflight label small{font:9px/1.4 monospace;color:#9dabcf;letter-spacing:0}
.pilot-preflight input{width:98px;padding:9px 8px;text-transform:uppercase;background:#0c1932;border:1px solid #7aa5c9;border-radius:5px;color:#ffeb9f;letter-spacing:.14em;font:700 15px monospace;text-align:center}

/* STEEL HALO PROTOCOL // original cold-tech visual identity */
:root{--cyan:#5ce9f5;--lemon:#e8f7ff;--navy:#06101b;--pink:#ff4e67}
html,body{background:#020711;color:#e8f8ff;font-family:Consolas,'Lucida Console',monospace}
#game-shell{background:#040a19}#scanlines{opacity:.14;background:repeating-linear-gradient(to bottom,rgba(20,45,65,.08) 0 1px,transparent 2px 5px)}
.menu-card{border:1px solid #6de7ee91;background:linear-gradient(130deg,#061625f2,#091421f0 63%,#181423ef);outline:1px solid #e54b5355;box-shadow:0 26px 100px #000d,0 0 45px #2dd5f020,inset 0 0 60px #0bc9e70a}
h1{font-size:clamp(47px,7vw,74px);letter-spacing:-4px;color:#f0fcff;text-shadow:3px 3px 0 #3284a0,6px 7px 0 #122f4b,0 0 33px #2af2ff8a;transform:skewX(-5deg)}h1 span{font-size:.92em;letter-spacing:-4px;color:#ff576a;text-shadow:3px 3px 0 #631f39,0 0 19px #f22a527a}
.title-lock .mini,.sub-title,.kicker{color:#79dfec}.kright,.control-help b{color:#ff818d}.tagline{color:#bed9e7}.primary{background:linear-gradient(#e0fbff,#40cadf);border:1px solid #a6f7ff;color:#031925;box-shadow:0 5px 0 #246172,0 0 30px #19f5ff22}
.hud-block small,.hud-center small,.hud-special,.boost-head{color:#92d9e7}.hud-block strong{color:#f0faff}.hud-center strong{color:#fc6582}.boss-track div{background:#ed5263}.progress span{background:#6af7ee}.menu-options,.control-help span{color:#a7c7d8}
.attract-side{background:linear-gradient(135deg,#061522e8,#051019e8)!important;border-color:#408ba088!important}.panel-top,.panel-sub{color:#75e3eb!important}.arcade-side-footer{color:#5ebdc8!important}
.rival-board{position:absolute;left:20px;top:86px;min-width:145px;max-width:205px;padding:9px 10px;background:#061521c8;border:1px solid #4f95a077;box-shadow:inset 0 0 18px #164b6633;font-size:10px;letter-spacing:.7px;color:#badde9}
.rival-heading{display:block;font-size:9px;letter-spacing:1px;color:#fd8096;border-bottom:1px solid #fd809644;margin-bottom:7px;padding-bottom:5px}
.rival-row{display:flex;justify-content:space-between;gap:8px;margin:5px 0;font-size:10px}.rival-row b{color:#f6fdff}.rival-row.carry{color:#ffde85}.rival-board small{font-size:7px;color:#77aab5;letter-spacing:.6px}
#yeti-monitor{border-color:#e4b93d88!important}
@media(max-width:760px){.rival-board{top:74px;left:6px;min-width:96px;max-width:118px;padding:5px;font-size:8px}.rival-heading{font-size:7px}.rival-row{font-size:8px}.rival-board small{display:none}.hud-special{top:112px!important}.menu-card{max-width:min(550px,92vw)}}
@media(max-width:600px) and (orientation:portrait){.rival-board{top:83px;left:5px;max-width:98px}.hud-special{top:142px!important}}
/* V1 polish: no empty animated reels at the start of an attract loop. */
@keyframes steelHaloReel {from{transform:translateY(0)}to{transform:translateY(-50%)}}
.scroll-up{top:0;animation:steelHaloReel 33s linear infinite}
.scores-scroll{animation-duration:24s}
.credits-scroll{animation-duration:33s}
/* Keep rival readout apart from the yellow reconstruction monitor. */
.rival-board{top:278px;left:20px}
@media(max-width:760px){.rival-board{top:200px;left:6px}}
@media(max-width:560px) and (orientation:portrait){.rival-board{top:230px;left:5px}}
@media(max-height:480px) and (pointer:coarse){.rival-board{top:230px;left:6px;max-width:126px;padding:5px}.rival-board small{display:none}}

/* STEEL HALO V1.01: browser autoplay permission fallback. */
.title-preview.needs-tap{background:#164050;border-color:#87f7f0;color:#f5fcf8;font-weight:900;box-shadow:0 0 0 1px #8af7ec66,inset 0 0 18px #55fae71c;}

/* V1.02: initial landscape flight briefing, shown on every fresh page load. */
.flight-gate{position:absolute;inset:0;z-index:80;display:grid;place-items:center;padding:clamp(10px,3vw,30px);overflow:auto;background:radial-gradient(ellipse at 50% 45%,#051a2bdb 0%,#020718f2 80%);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);touch-action:pan-y}
.flight-gate-card{width:min(580px,94vw);max-height:min(94dvh,730px);overflow:auto;text-align:center;border:1px solid #77e4f2;background:linear-gradient(142deg,#08172bed,#0a2134f5 64%,#220f24ef);outline:1px solid #ff64795b;outline-offset:5px;box-shadow:0 20px 90px #000d,0 0 40px #3fe5ff27;padding:clamp(19px,4vw,40px);touch-action:pan-y}
.flight-gate-kicker{display:flex;justify-content:space-between;align-items:center;gap:9px;border-bottom:1px solid #7ceaff5c;padding-bottom:12px;color:#9ff5fd;font-size:clamp(8px,1.3vw,11px);font-weight:900;letter-spacing:1.8px}
.flight-gate-dot{height:8px;width:8px;flex:0 0 8px;border-radius:50%;background:#fd676d;box-shadow:0 0 14px #ff444e;}
.flight-gate-symbol{font-family:Consolas,monospace;color:#e6f8ff;font-size:clamp(38px,6vw,68px);margin:12px 0 -6px;text-shadow:0 0 25px #63eafa;font-weight:900}
.flight-gate h2{font-family:Consolas,'Courier New',monospace;font-size:clamp(21px,3.9vw,37px);letter-spacing:1.8px;font-style:italic;margin:7px 0 14px;color:#ecf9ff;text-shadow:3px 3px #173f60}
.flight-gate h2 em{font-style:normal;color:#74edff}
.flight-gate p{font-family:Consolas,'Courier New',monospace;font-size:clamp(12px,1.8vw,17px);line-height:1.55;color:#d1eaf4;letter-spacing:1px;margin:8px 0}
.flight-gate p strong{color:#ffe19f}
.flight-gate .flight-gate-sub{font-size:clamp(10px,1.2vw,12px);color:#a4c1d7;max-width:460px;margin:8px auto 22px;line-height:1.6}
.flight-gate-continue{display:block;width:100%;background:linear-gradient(110deg,#d8faff,#48dbea);color:#041925;border:2px solid #b8fcff;padding:clamp(12px,1.6vw,17px);font-size:clamp(11px,1.6vw,16px);font-weight:1000;letter-spacing:1.3px;box-shadow:0 5px #246272,0 0 22px #3bf8e349}
.flight-gate-continue:focus-visible{outline:3px solid #ffde8f;outline-offset:5px}
.flight-gate-continue:hover{filter:brightness(1.12)}
.flight-gate-foot{font-size:10px;letter-spacing:.5px;line-height:1.5;color:#a0c7ce;margin-top:17px}
@media (pointer:coarse) and (orientation:portrait){.flight-gate-card{max-height:92dvh}.flight-gate-symbol{margin:2px 0}.flight-gate h2{font-size:clamp(19px,6vw,28px)}.flight-gate p{font-size:13px}}
@media (pointer:coarse) and (max-height:500px){.flight-gate-card{padding:12px 22px}.flight-gate-symbol{display:none}.flight-gate h2{margin:5px 0;font-size:23px}.flight-gate .flight-gate-sub{margin:6px auto 11px}.flight-gate-foot{margin-top:8px}}

/* v consent update: responsive optional-analytics choice over existing arcade title. */
.flight-gate .consent-card{width:min(625px,95vw);padding:clamp(15px,3vw,29px)}
.flight-gate .consent-card .flight-gate-symbol{font-size:clamp(27px,4vw,43px);margin:4px 0 -7px}
.flight-gate .consent-card h2{margin:7px 0 8px;font-size:clamp(19px,3.3vw,31px)}
.flight-gate .consent-panel{text-align:left;border:1px solid #8edbed75;background:#071c2bb3;padding:clamp(10px,2vw,16px);margin:14px 0 16px}
.flight-gate .consent-head{font:900 clamp(11px,1.4vw,13px) Consolas,'Courier New',monospace;color:#a9f3ff;letter-spacing:1px;margin-bottom:6px}
.flight-gate .consent-panel p{font-size:clamp(11px,1.5vw,13px);letter-spacing:0;line-height:1.5;margin:6px 0;color:#e2f5fa}
.flight-gate .consent-panel .consent-tip{color:#c0d1df;font-size:clamp(10px,1.3vw,12px);margin-top:9px}
.flight-gate .consent-actions{display:grid;gap:10px}
.flight-gate .consent-actions button{min-height:47px;font:900 clamp(11px,1.4vw,15px) Consolas,'Courier New',monospace;letter-spacing:.5px;cursor:pointer;border-radius:0}
.flight-gate .consent-actions .flight-gate-continue{box-shadow:none;padding:13px 12px}
.flight-gate .flight-gate-decline{width:100%;padding:12px;border:2px solid #a5c5dd;color:#f2f8ff;background:#10233d;box-shadow:none}
.flight-gate .flight-gate-decline:hover,.flight-gate .flight-gate-decline:focus-visible{background:#1e3855;border-color:#e8faff}
.flight-gate .flight-gate-foot{font-size:10px;line-height:1.55;letter-spacing:0;margin-top:13px;color:#c1d2de}
.flight-gate .flight-gate-foot a{color:#a1f7f3;text-decoration:underline;text-underline-offset:2px}
@media (pointer:coarse) and (max-height:510px){.flight-gate .consent-card{padding:12px 18px}.flight-gate .consent-card .flight-gate-symbol{display:none}.flight-gate .consent-card h2{font-size:20px}.flight-gate .consent-panel{margin:7px 0;padding:9px}.flight-gate .consent-actions button{min-height:38px;padding:8px}.flight-gate .flight-gate-foot{margin-top:8px}}

.flight-gate .consent-actions[hidden],.flight-gate .consent-saved[hidden]{display:none!important}
.flight-gate .consent-saved{display:grid;gap:10px}
.flight-gate .consent-saved #consent-saved-status{font:900 12px/1.5 Consolas,'Courier New',monospace;color:#b6f4e5;margin:3px 0 2px;letter-spacing:.4px}
.flight-gate .consent-saved .flight-gate-continue,.flight-gate .consent-saved .flight-gate-decline{min-height:45px;display:block;width:100%;cursor:pointer;font-weight:900;padding:12px}