@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--cyan:#8ff6ff;--gold:#ebc985;--purple:#be8eff;--pink:#fa8cbd;--ink:#070b10;--muted:#8e99ac;--font:'Space Grotesk',sans-serif}*{box-sizing:border-box}body{margin:0;background:#070a0f;color:#eee;font-family:var(--font);overflow:hidden;user-select:none;-webkit-user-select:none;overscroll-behavior:none}body:before{content:'';position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 48% 44%,#16263890,transparent 53%),linear-gradient(90deg,#080a0e,#0b0f17 50%,#080a0e)}button,input{font:inherit}button{cursor:pointer;color:inherit;touch-action:none;-webkit-tap-highlight-color:transparent}button:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}button{border:1px solid #556578;background:linear-gradient(#1a2531,#080d13);border-radius:8px}button:active{filter:brightness(1.3)}[hidden]{display:none!important}.arcade{display:flex;align-items:center;justify-content:center;gap:clamp(24px,4vw,68px);height:100dvh;padding:12px 20px}.identity,.missions{width:215px;flex:none}.identity{align-self:center}.eyebrow,.edition{font-size:12px;letter-spacing:2px;color:var(--gold);font-weight:500}.identity h1{font-family:Georgia,serif;font-size:45px;font-weight:400;line-height:.95;letter-spacing:1px;margin:28px 0 20px}.identity h1 span{font-size:84px;letter-spacing:-3px}.fine-line{width:48px;height:1px;background:var(--gold);margin:27px 0}.edition{color:#8d9aac;letter-spacing:3px}.intro{font-family:Georgia,serif;font-style:italic;font-size:24px;line-height:1.5;color:#acb7ca;margin:30px 0 55px}.best{display:flex;flex-direction:column;gap:10px}.best span{font-size:12px;letter-spacing:2px;color:var(--muted)}.best strong{font-size:27px;font-variant-numeric:tabular-nums;color:var(--gold);font-weight:400;letter-spacing:2px}.best small{color:#738095;font-size:12px}.keys{font-size:12px;line-height:2.6;color:#8793a6;margin-top:50px}.keys span{margin:0 6px}kbd{font:11px var(--font);padding:3px 6px;border:1px solid #354151;border-radius:3px;color:#bbc7d7;margin-right:4px}.cabinet{height:min(calc(100dvh - 24px),1100px);width:min(580px,calc((100dvh - 220px)*.666667));min-width:260px;display:flex;flex-direction:column;background:#080d15;border:1px solid #64543c;border-radius:17px;box-shadow:0 0 0 3px #101a23,0 0 0 4px #414958,0 28px 85px #000,0 0 36px #64d7ff0a;overflow:hidden;position:relative;flex:none}.marquee{height:85px;flex:none;padding:9px 15px 7px;border-bottom:1px solid #8b7654;background:radial-gradient(ellipse at top,#162938,transparent),linear-gradient(110deg,#131b25,#03090f 60%,#142334)}.brand{font:23px/1 Georgia,serif;letter-spacing:1.8px;color:#ecf7ff;text-shadow:0 0 13px #78d0ff90;display:flex;align-items:center;justify-content:space-between;white-space:nowrap}.brand span{font:10px var(--font);letter-spacing:2.5px;color:var(--gold)}.scoreboard{display:flex;justify-content:space-between;margin-top:6px;align-items:center}.score-cell{display:flex;flex-direction:column}.score-cell label{font-size:9px;letter-spacing:2px;color:#aab7ca}.score-cell output{font:32px/.95 'Barlow Condensed',monospace;letter-spacing:4px;color:#ffdc8f;text-shadow:0 0 12px #efa32966;font-variant-numeric:tabular-nums}.ball-cell{display:flex;flex-direction:column;gap:4px;border-left:1px solid #394454;padding-left:15px;min-width:120px}.ball-cell>span{font-size:13px;letter-spacing:1.5px}.ball-cell b{color:var(--gold)}.ball-cell i{font-style:normal;color:#7e8ca1}.ball-cell strong{font:16px 'Barlow Condensed',sans-serif;letter-spacing:2px;color:var(--cyan)}.music-strip{height:30px;flex:none;display:flex;align-items:center;gap:7px;padding:0 11px;background:#080d14;border-bottom:1px solid #544731;font-size:10px;white-space:nowrap;overflow:hidden}.now{font-size:8px;color:#869db0;letter-spacing:1px}.music-strip #track{overflow:hidden;text-overflow:ellipsis;flex:1;letter-spacing:.6px;font-size:11px;color:#d4eaff}.preview-tag{font-size:8px;color:#8b9aad;letter-spacing:1px}.equalizer{height:13px;display:flex;align-items:center;gap:2px}.equalizer i{width:2px;height:7px;background:var(--cyan);animation:eq .65s infinite alternate}.equalizer i:nth-child(2){height:12px;animation-delay:-.3s}.equalizer i:nth-child(3){height:5px;animation-delay:-.1s}.equalizer i:nth-child(4){height:10px;animation-delay:-.5s}.muted .equalizer i{animation-play-state:paused;opacity:.3}@keyframes eq{to{height:3px}}.table-wrap{flex:1;min-height:0;width:100%;position:relative;background:#050912;overflow:hidden}.table-wrap canvas{display:block;width:100%;height:100%;touch-action:none}.mission-strip{position:absolute;top:0;left:0;right:0;background:linear-gradient(#050911e8,#050911b0);padding:7px 8px;display:flex;gap:6px;align-items:center;border-bottom:1px solid #8ff6ff26;min-height:27px}.mission-strip span:last-child{font-size:10px;line-height:1.2;letter-spacing:.15px;color:#e6eef7}.live-dot{height:4px;width:4px;background:var(--gold);box-shadow:0 0 5px var(--gold);border-radius:50%;flex:none}.notice{position:absolute;top:29%;left:5%;right:5%;pointer-events:none;opacity:0;transform:translateY(5px);transition:opacity .15s,transform .15s;display:flex;flex-direction:column;align-items:center;text-align:center;padding:14px 8px;background:linear-gradient(90deg,transparent,#050c14e8 20%,#050c14e8 80%,transparent);color:var(--cyan);border-block:1px solid #82f5ff40}.notice.visible{opacity:1;transform:none}.notice strong{font:32px 'Barlow Condensed',sans-serif;letter-spacing:3px;text-shadow:0 0 15px currentColor}.notice span{font-size:11px;letter-spacing:.5px;margin-top:5px;color:#eff8ff}.launch-hint{position:absolute;bottom:10%;left:8%;right:8%;text-align:center;pointer-events:none;padding:13px 0;background:linear-gradient(90deg,transparent,#040a12c0,transparent);text-shadow:0 2px 8px #000}.launch-hint span{display:block;color:var(--gold);font-size:10px;letter-spacing:2px;margin-bottom:6px}.launch-hint b{font-weight:500;font-size:13px;color:#effbff}.controls{flex:none;height:98px;padding:6px 9px 4px;border-top:1px solid #91794d;background:linear-gradient(130deg,#16212b,#060a0f 40%,#101d2a);box-shadow:0 -3px 16px #000}.main-controls{height:53px;display:grid;grid-template-columns:1fr 1.05fr 1fr;gap:9px}.main-controls button{position:relative;font-size:13px;letter-spacing:2px;font-weight:700;border-radius:13px;display:flex;align-items:center;justify-content:center;gap:8px;overflow:hidden;box-shadow:inset 0 1px 1px #a6c9de66,0 3px 5px #000;background:linear-gradient(140deg,#26364488,#0b111bc9 50%,#24354470)}.flipper{border-color:#737d83!important;text-shadow:0 0 6px #fff8}.flipper.active{background:linear-gradient(#537180,#193342);border-color:var(--cyan)!important;box-shadow:0 0 14px #60f0ff60}.flipper-icon{font-size:24px;font-weight:400;color:#cad9e5}.launch{border-color:#77dce7!important;flex-direction:column;gap:0!important;color:var(--cyan);box-shadow:0 0 10px #69eaff20,inset 0 0 12px #89efff15!important}.launch-mark{font-size:19px;line-height:15px;z-index:1}.launch b{z-index:1;font-size:14px;letter-spacing:3px}.charge-fill{position:absolute;inset:100% 0 0;background:linear-gradient(#bdffff70,#34bacf60);transition:none}.utility-controls{display:flex;align-items:center;justify-content:space-between;height:34px;padding:3px 9px 0}.icon-button{border:0;background:transparent;width:34px;height:31px;padding:4px;color:#a8bccf}.icon-button svg{width:22px;height:22px}.nudge{background:#070c12;border:1px solid #42494f;border-radius:20px;padding:4px 21px;font-size:10px;letter-spacing:2px;color:#adb8c7}.nudge span{color:var(--gold);margin-left:9px;font-size:8px;letter-spacing:3px}.mission-card{padding:21px 0;border-top:1px solid #303440}.mission-card:first-child{padding-top:0;border:0}.zone-index{font-size:10px;letter-spacing:1.8px;color:var(--gold)}.mission-card h2{font-family:Georgia,serif;font-size:24px;font-weight:400;line-height:1.05;margin:11px 0 16px}.mission-card h2 em{display:block;font-size:18px;color:#a7afbb;font-weight:400;line-height:1.7}.mission-card p{font-size:12px;line-height:1.7;color:#919daf;margin:13px 0}.mission-card strong{font-size:20px;letter-spacing:1px;font-weight:400;color:var(--gold)}.mission-card small{font-size:8px;color:#8997ac;margin-left:4px;letter-spacing:1px}.aircraft-lights,.destinations,.flower-lights{display:flex;gap:7px}.aircraft-lights i{font-style:normal;width:31px;height:29px;display:grid;place-items:center;border:1px solid #384049;border-radius:4px;color:#536276}.aircraft-lights i.lit{color:var(--gold);border-color:#b9914e;box-shadow:0 0 10px #ebc98533}.destinations{margin-top:9px;font-size:10px;letter-spacing:1px;justify-content:space-between;color:#5c697c}.destinations .lit{color:var(--gold);text-shadow:0 0 7px #edc67388}.moon .zone-index,.moon strong{color:var(--cyan)}.moon-meter{height:4px;background:#273240;margin-top:19px;border-radius:2px;overflow:hidden}.moon-meter i{display:block;height:100%;background:var(--cyan);width:0;box-shadow:0 0 9px var(--cyan)}.meter-meta{display:flex;justify-content:space-between;margin-top:8px;font-size:9px;color:#8594a9;letter-spacing:.5px}.persephone .zone-index,.persephone strong{color:var(--pink)}.flower-lights{color:#536075;font-size:23px;gap:13px}.flower-lights i{font-style:normal}.flower-lights .lit{color:var(--pink);text-shadow:0 0 15px #fa8cbd}.pause-cover,.gameover{position:absolute;inset:0;background:#050a12d9;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:4;text-align:center}.pause-cover>span,.gameover>span{font-size:10px;letter-spacing:2px;color:var(--gold)}.pause-cover h2,.gameover h2{font:48px/1.05 Georgia,serif;margin:20px 0 30px;font-weight:400}.gameover>strong{font:50px 'Barlow Condensed',sans-serif;letter-spacing:4px;color:var(--gold);margin:8px 0}.gameover p{color:#9eafc4;font-size:12px}.pause-cover button,.gameover button,dialog button{padding:12px 20px;color:var(--cyan);border:1px solid #789fac;font-size:14px}.gameover button{margin-top:20px}dialog{width:min(92vw,470px);max-height:88dvh;border:1px solid #74705e;border-radius:16px;background:linear-gradient(140deg,#18232d,#090e17 70%);color:#e5edf6;padding:25px;box-shadow:0 20px 100px #000;user-select:text}dialog::backdrop{background:#02040abf;backdrop-filter:blur(8px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.dialog-heading h2{font:29px Georgia,serif;margin:9px 0}.dialog-heading>button{border:0;background:transparent;font-size:28px;padding:5px 10px}.setting{display:flex;align-items:center;justify-content:space-between;margin:22px 0;gap:15px}.setting label{font-size:14px}.setting small{display:block;color:#91a0b2;font-size:11px}.setting input[type=range]{width:45%;accent-color:var(--cyan)}.setting input[type=checkbox]{width:19px;height:19px;accent-color:var(--cyan)}details{border-top:1px solid #374252;padding:18px 0;font-size:14px}summary{cursor:pointer;color:var(--gold)}details p{font-size:13px;line-height:1.65;color:#a3b0c2}.url-label{font-size:13px;display:block;margin:15px 0}.url-label input{display:block;width:100%;border:1px solid #414f64;color:#eee;background:#050b13;border-radius:6px;padding:9px;margin-top:6px;font-size:13px;user-select:text}.settings-footer{display:flex;gap:10px;justify-content:space-between;margin-top:20px}.settings-footer button{font-size:12px;padding:11px}.settings-footer .secondary{color:#a9b5c7;border-color:#394b60}.cabinet.shake{animation:shake .25s ease-out}@keyframes shake{25%{transform:translate(-3px,2px)}75%{transform:translate(3px,-2px)}}@media(max-width:1100px){.arcade{gap:26px}.identity{width:165px}.identity h1{font-size:33px}.identity h1 span{font-size:65px}.missions{width:185px}}@media(max-width:860px){.identity{display:none}.missions{width:185px}.arcade{gap:30px}}@media(max-width:620px){.arcade{padding:0;gap:0;align-items:center}.identity,.missions{display:none}.cabinet{width:min(100vw,calc((100dvh - 199px)*.666667));min-width:0;height:100dvh;border-radius:0;border-width:0;box-shadow:none}.marquee{padding-top:max(8px,env(safe-area-inset-top));height:calc(83px + env(safe-area-inset-top));}.controls{height:calc(91px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}.main-controls{height:49px;gap:7px}.brand{font-size:21px}.music-strip{height:27px}.score-cell output{font-size:31px}.ball-cell{min-width:107px}.mission-strip span:last-child{font-size:9px}.mission-strip{padding:6px}.table-wrap{flex:1}.cabinet{width:100vw}.launch-hint{bottom:8%}.controls{padding-inline:8px}}@media(max-height:650px) and (min-width:620px){.identity,.missions{display:none}.cabinet{width:calc((100dvh - 170px)*.666667);height:100dvh}.marquee{height:70px}.brand{font-size:17px}.score-cell output{font-size:23px}.music-strip{height:22px}.controls{height:78px}.main-controls{height:42px}.utility-controls{height:28px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
.marquee{position:relative;z-index:1}.brand{position:relative}.brand>span:first-child{font:inherit;letter-spacing:inherit;color:#ecf7ff}.brand>span:last-child{font:10px var(--font);letter-spacing:2.5px;color:var(--gold)}.brand .host-mark{position:absolute;left:45%;top:-11px;width:48px;height:67px;display:grid;place-items:end center;z-index:4;overflow:hidden;pointer-events:none}.host-mark img{width:54px;height:76px;object-fit:contain;object-position:center bottom;transform-origin:center bottom;animation:hostIdle 3.2s ease-in-out infinite;filter:drop-shadow(0 0 5px #71dfff85)}.host-mark .host-ring{position:absolute;inset:2px 4px 5px;border:1px solid #79eaf099;border-radius:50% 50% 22% 22%;background:radial-gradient(ellipse at 50% 75%,#50e7ff21,transparent 68%);box-shadow:inset 0 0 14px #65e8ff18,0 0 10px #67dcff1c;transition:border-color .15s,box-shadow .15s}.host-mark.is-celebrating img{animation:hostCelebrate .64s cubic-bezier(.24,.85,.32,1.3) 2;filter:drop-shadow(0 0 11px var(--host-glow,#ffe19a)) saturate(1.2)}.host-mark.is-celebrating .host-ring{border-color:var(--host-glow,#ffe19a);box-shadow:inset 0 0 20px var(--host-glow,#ffe19a),0 0 19px var(--host-glow,#ffe19a)}@keyframes hostIdle{0%,100%{transform:translateY(1px) rotateY(-4deg)}50%{transform:translateY(-2px) rotateY(4deg)}}@keyframes hostCelebrate{0%{transform:translateY(0) rotateZ(0) scale(1)}35%{transform:translateY(-6px) rotateZ(-6deg) scale(1.09)}68%{transform:translateY(0) rotateZ(5deg) scale(1.04)}100%{transform:translateY(-2px) rotateZ(0) scale(1)}}.nudge{display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;padding:4px 10px}.guard-status{font-size:8px!important;letter-spacing:.6px!important;color:#91f0ce!important;padding-left:5px;border-left:1px solid #344650}.guard-status .spent{color:#697483!important;opacity:.55}.cabinet.action-punch{animation:actionPunch .24s cubic-bezier(.3,.9,.4,1)}@keyframes actionPunch{24%{transform:translateY(1px) scale(.994)}65%{transform:translateY(-1px) scale(1.003)}}@media(max-width:620px){.brand{font-size:20px;letter-spacing:1.3px}.brand>span:last-child{font-size:8px;letter-spacing:1.8px}.brand .host-mark{left:46%;top:-12px;width:43px;height:60px}.host-mark img{width:49px;height:69px}.utility-controls{padding-inline:3px}.nudge{gap:4px;font-size:9px;letter-spacing:1.2px}.guard-status{font-size:7px!important;letter-spacing:.25px!important;padding-left:4px}}@media(max-width:370px){.brand{font-size:17px}.brand>span:last-child{font-size:7px;letter-spacing:1.1px}.brand .host-mark{left:51%;top:-10px;width:35px;height:52px}.host-mark img{width:42px;height:59px}.ball-cell{min-width:97px}.guard-status{font-size:7px!important}.nudge{gap:3px;padding-inline:6px}}
/* Dedicated central host bay: no overlap with score, ball count or controls. */
.arcade-nav{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;flex:none;padding:4px 9px;background:#08131d;border-bottom:1px solid #e1bd6540;min-height:48px}.arcade-nav button{min-height:40px;padding:6px 10px;font-size:12px;letter-spacing:.05em;border-radius:11px;color:#dbf8ff;background:linear-gradient(130deg,#54738144,#0a101a);border-color:#9dbbc64d}.arcade-nav>span{text-align:center;font-size:10px;letter-spacing:.1em;color:#d8c393}.marquee{height:118px;padding:10px 12px;overflow:hidden}.brand{height:25px;position:static;font-size:clamp(13px,3.8vw,20px)}.brand>span:first-child{max-width:44%;font-size:inherit;letter-spacing:.3px}.brand>span:last-child{font-size:9px}.brand .host-mark{left:43%;top:0;width:30%;height:118px;overflow:hidden}.host-mark img{width:100%;height:124px;object-fit:contain;max-width:none}.host-mark .host-ring{inset:5px 6px 1px;border-radius:48% 48% 18% 18%;border-color:#9cdde750}.scoreboard{margin-top:17px;position:relative;pointer-events:none}.score-cell{max-width:42%}.score-cell output{font-size:clamp(28px,8.3vw,39px);letter-spacing:2px}.ball-cell{min-width:0;width:25%;padding-left:8px}.ball-cell>span{font-size:12px;letter-spacing:.3px}.ball-cell strong{font-size:15px;letter-spacing:1px}.pin-pass{height:21px;flex:none;display:grid;place-items:center;background:#111b23;border-bottom:1px solid #eac57835;color:#e8cc91;font-size:10px;letter-spacing:.15px}.pin-pass span{white-space:nowrap}.cabinet{width:min(580px,calc((100dvh - 280px)*.666667))}@media(max-width:620px){.cabinet{width:100vw}.arcade-nav{padding-top:max(4px,env(safe-area-inset-top))}.marquee{height:114px;padding:8px 12px}.brand .host-mark{height:114px;left:43%;top:0;width:30%}.host-mark img{height:120px;width:100%}.brand{font-size:clamp(13px,3.8vw,20px)}.brand>span:last-child{font-size:9px}.ball-cell{width:25%;min-width:0}.scoreboard{margin-top:17px}}@media(max-height:680px){.marquee{height:94px}.brand .host-mark{height:94px}.host-mark img{height:101px}.scoreboard{margin-top:9px}.arcade-nav{min-height:44px}.arcade-nav button{min-height:36px}.pin-pass{height:18px;font-size:9px}}
.shared-arcade .music-sources{display:none}
/* Cosmic Opera — shared visual identity with Karakou. */
body:before{background:linear-gradient(90deg,#050714d9,#08091966,#050714d9),url('/assets/game-media/cosmic-opera-v1.webp') center 28%/cover no-repeat}
.cabinet{border-color:#e9c889;box-shadow:0 0 0 1px #f9dc963d,0 0 34px #a361db28,0 24px 70px #000b}
.marquee{background:linear-gradient(90deg,#080b1ee8,#090c2055 53%,#080b1ee8),url('/assets/game-media/cosmic-opera-v1.webp') center 15%/cover;border-bottom-color:#e5c17b}
.brand .host-mark{width:32%;left:42%;background:radial-gradient(ellipse at center,#a983eb28,transparent 70%)}
.host-mark img{object-fit:cover;object-position:50% 14%;filter:drop-shadow(0 0 9px #b891e76b)}
.host-mark .host-ring{border-color:#eed5a27a;box-shadow:0 0 16px #b578ff25,inset 0 0 14px #c790ff1c}
.arcade-nav,.pin-pass,.music-strip{background:linear-gradient(110deg,#171126,#080d1c 58%,#251531);border-color:#dbb97855}
.arcade-nav button{border-color:#d9bd8559;background:linear-gradient(140deg,#263448aa,#100d24);color:#ecfaff}
.controls{background:linear-gradient(120deg,#111327,#080b18 65%,#24112d);border-top:1px solid #e4c58580}
.main-controls .launch{border-color:#d296ff;box-shadow:inset 0 0 14px #9d47e43d,0 0 13px #9d47e445;background:linear-gradient(140deg,#28223b,#100c20)}
.main-controls .launch b,.launch-mark{color:#f4deff}.main-controls .flipper{border-color:#d6c5ed80}
.main-controls button:active,.main-controls button.held{box-shadow:inset 0 0 20px #b879ff55,0 0 18px #d7adff55}
@media(prefers-reduced-motion:reduce){.host-mark,.host-mark img,.host-ring{animation:none!important;transition:none!important}}
