:root{color-scheme:dark;font-family:Inter,ui-rounded,"SF Pro Rounded",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#030207;overscroll-behavior:none;touch-action:manipulation}
button{font:inherit;-webkit-tap-highlight-color:transparent}
#app{position:fixed;inset:0;overflow:hidden;background:#030207}
#stage{position:absolute;left:50%;top:50%;width:min(100vw,calc(100dvh * 16 / 9));height:min(100dvh,calc(100vw * 9 / 16));aspect-ratio:16/9;overflow:hidden;background:#05040b;transform:translate(-50%,-50%);transform-origin:center center}
.screen{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s ease}
.screen.active{opacity:1;visibility:visible;pointer-events:auto}
.fill{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center center;user-select:none;-webkit-user-drag:none}
.roomPoster{z-index:5}
.openingScreen{background:#000;z-index:70}
.openingVideo{background:#000}
.startAdventure{position:absolute;inset:0;z-index:79;appearance:none;border:0;padding:0;background:linear-gradient(180deg,rgba(2,1,8,.02),rgba(2,1,8,.20));display:grid;place-items:center;color:white;cursor:pointer;transition:opacity .35s ease}
.startAdventure.hidden{opacity:0;pointer-events:none}
.startPill{margin-top:34%;padding:12px 22px;border-radius:999px;border:1px solid rgba(255,255,255,.26);background:rgba(7,5,18,.52);box-shadow:0 10px 34px rgba(0,0,0,.32),0 0 34px rgba(156,111,255,.18);backdrop-filter:blur(12px);font-size:clamp(14px,1.55vw,20px);font-weight:800;letter-spacing:.01em;text-shadow:0 1px 8px rgba(0,0,0,.55);animation:startBreathe 2.4s ease-in-out infinite}
.openingScreen:not(.started) .skipButton{opacity:0;pointer-events:none}
@keyframes startBreathe{0%,100%{transform:scale(.98);box-shadow:0 10px 34px rgba(0,0,0,.32),0 0 26px rgba(156,111,255,.14)}50%{transform:scale(1.025);box-shadow:0 10px 34px rgba(0,0,0,.32),0 0 42px rgba(156,111,255,.28)}}
.skipButton{position:absolute;z-index:80;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:9px 17px;color:white;background:rgba(5,4,14,.5);backdrop-filter:blur(10px);font-weight:700}
.hubImage{z-index:1;opacity:1;transition:opacity .18s ease}
.hubImage.switching{opacity:.16}
.hotspotLayer{position:absolute;inset:0;z-index:30;pointer-events:none}
.roomHotspot,.targetHotspot{position:absolute;appearance:none;border:0;padding:0;background:transparent;pointer-events:auto;cursor:pointer;overflow:visible}

/* Ship hints: a soft aura only — no ring, border or visible hitbox. */
.roomHotspot::after{content:"";position:absolute;inset:8%;border-radius:28%;opacity:0;pointer-events:none;background:radial-gradient(ellipse at center,rgba(160,220,255,.19) 0%,rgba(170,120,255,.10) 42%,rgba(120,190,255,0) 76%);filter:blur(7px);transform:scale(.94);transition:opacity .45s ease}
.roomHotspot.built::after{background:radial-gradient(ellipse at center,rgba(199,243,255,.28) 0%,rgba(173,126,255,.13) 44%,rgba(120,190,255,0) 78%)}
.roomHotspot.quiet::after{background:radial-gradient(ellipse at center,rgba(148,141,213,.13) 0%,rgba(90,72,150,.06) 48%,transparent 78%)}
.roomHotspot.hinting::after{opacity:.72;animation:roomAura 3s ease-in-out infinite}
@keyframes roomAura{0%,100%{opacity:.26;transform:scale(.96);filter:blur(8px)}50%{opacity:.68;transform:scale(1.015);filter:blur(10px)}}

.roomLabelLayer{position:absolute;inset:0;z-index:38;pointer-events:none;overflow:hidden}
.roomLabel{position:absolute;transform:translate(-50%,-100%);max-width:15%;padding:3px 8px;border-radius:999px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:rgba(255,255,255,.80);background:rgba(3,3,10,.52);border:1px solid rgba(255,255,255,.10);box-shadow:0 3px 12px rgba(0,0,0,.28);backdrop-filter:blur(7px);text-shadow:0 1px 5px rgba(0,0,0,.95);font-size:clamp(8px,.83vw,12px);font-weight:720;letter-spacing:.005em}
.roomLabel.built{color:#fff;background:rgba(16,10,30,.72);border-color:rgba(169,221,255,.34);box-shadow:0 3px 14px rgba(0,0,0,.30),0 0 14px rgba(121,214,255,.12);font-weight:820}
.roomLabel.built::before{content:"✦";margin-right:4px;color:#c7f2ff;font-size:.82em}
.roomLabel.future{opacity:.64}
.roomLabel.quiet{opacity:.62}

/* Premium in-room hints. The hit area itself stays completely invisible. */
.targetHotspot::before,.targetHotspot::after{content:"";position:absolute;pointer-events:none;opacity:0}
.targetHotspot.disabled{pointer-events:none}
.targetHotspot.disabled::before,.targetHotspot.disabled::after{display:none}

/* Props: one restrained moving glint rather than a hotspot outline. */
.targetHotspot.hint-glint::before{left:13%;top:18%;width:18%;height:58%;border-radius:999px;background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.05) 30%,rgba(255,248,221,.88) 49%,rgba(192,230,255,.24) 60%,transparent 100%);filter:blur(.6px);mix-blend-mode:screen;transform:translateX(-180%) rotate(13deg)}
.targetHotspot.hint-glint::after{right:17%;top:18%;width:6px;height:6px;border-radius:50%;background:white;box-shadow:0 0 6px 2px rgba(255,245,205,.78),0 0 12px 5px rgba(178,222,255,.28);transform:scale(.3)}
.targetHotspot.hint-glint.hinting::before{animation:propGlint 3.25s ease-in-out infinite}
.targetHotspot.hint-glint.hinting::after{animation:tinySpark 3.25s ease-in-out infinite .28s}
@keyframes propGlint{0%,18%{opacity:0;transform:translateX(-190%) rotate(13deg)}31%{opacity:.72}48%{opacity:.2;transform:translateX(360%) rotate(13deg)}50%,100%{opacity:0;transform:translateX(360%) rotate(13deg)}}
@keyframes tinySpark{0%,25%,58%,100%{opacity:0;transform:scale(.25) rotate(0deg)}34%{opacity:.9;transform:scale(1) rotate(45deg)}43%{opacity:.35;transform:scale(.55) rotate(90deg)}}

/* Crystal / magical targets: faint inner pulse plus sparse twinkles. */
.targetHotspot.hint-magic::before{inset:18%;border-radius:42%;background:radial-gradient(circle at 50% 48%,rgba(235,225,255,.20) 0%,rgba(163,116,255,.15) 28%,rgba(109,198,255,.07) 52%,transparent 74%);filter:blur(4px);mix-blend-mode:screen;transform:scale(.92)}
.targetHotspot.hint-magic::after{inset:10%;background:radial-gradient(circle at 24% 32%,rgba(255,255,255,.95) 0 1.2px,transparent 2px),radial-gradient(circle at 74% 22%,rgba(216,196,255,.85) 0 1px,transparent 2px),radial-gradient(circle at 65% 73%,rgba(177,231,255,.82) 0 1.2px,transparent 2.2px),radial-gradient(circle at 38% 67%,rgba(255,255,255,.65) 0 .9px,transparent 1.8px);filter:drop-shadow(0 0 5px rgba(181,144,255,.7))}
.targetHotspot.hint-magic.hinting::before{animation:magicBreathe 2.9s ease-in-out infinite}
.targetHotspot.hint-magic.hinting::after{animation:magicTwinkle 2.4s ease-in-out infinite .18s}
@keyframes magicBreathe{0%,100%{opacity:.18;transform:scale(.94)}50%{opacity:.58;transform:scale(1.025)}}
@keyframes magicTwinkle{0%,100%{opacity:.12;transform:translateY(1px) scale(.96)}45%{opacity:.8;transform:translateY(-2px) scale(1.03)}72%{opacity:.33;transform:translateY(-3px) scale(.99)}}

/* Bath: a few small bubbles rise from the actual bath area. */
.targetHotspot.hint-bubbles::before{left:20%;bottom:12%;width:8px;height:8px;border-radius:50%;border:1px solid rgba(220,250,255,.82);box-shadow:28px -3px 0 -2px rgba(220,250,255,.50),58px 5px 0 -1px rgba(198,238,255,.58),86px -2px 0 -2px rgba(230,250,255,.48),0 0 7px rgba(126,218,255,.42)}
.targetHotspot.hint-bubbles::after{left:48%;bottom:14%;width:5px;height:5px;border-radius:50%;border:1px solid rgba(230,250,255,.74);box-shadow:41px 2px 0 -1px rgba(224,248,255,.48),-38px 7px 0 -1px rgba(212,245,255,.40)}
.targetHotspot.hint-bubbles.hinting::before{animation:bubbleRise 2.8s ease-in-out infinite}
.targetHotspot.hint-bubbles.hinting::after{animation:bubbleRise 3.2s ease-in-out infinite .75s}
@keyframes bubbleRise{0%{opacity:0;transform:translateY(5px) scale(.9)}28%{opacity:.65}78%{opacity:.28}100%{opacity:0;transform:translateY(-12px) scale(1.05)}}

/* Lights: warm breathing illumination centred on the fixture. */
.targetHotspot.hint-light::before{inset:4%;border-radius:50%;background:radial-gradient(circle,rgba(255,246,205,.46) 0%,rgba(255,194,96,.20) 28%,rgba(255,172,75,.06) 52%,transparent 72%);filter:blur(3px);mix-blend-mode:screen}
.targetHotspot.hint-light.hinting::before{animation:lightBreathe 2.7s ease-in-out infinite}
@keyframes lightBreathe{0%,100%{opacity:.12;transform:scale(.9)}50%{opacity:.62;transform:scale(1.08)}}

/* Character hints use exact cut-outs from the room stills so the character itself moves. */
.hintSprite{position:absolute;z-index:8;pointer-events:none;user-select:none;-webkit-user-drag:none;opacity:0;will-change:transform,opacity;transform-origin:50% 82%;filter:drop-shadow(0 3px 7px rgba(0,0,0,.12));transition:opacity .2s ease}
.hintSprite.active{opacity:1}
.hintSprite.boobob.active{animation:boopBob 2.75s ease-in-out infinite}
.hintSprite.salmonfloat.active{animation:salmonFloat 3.05s ease-in-out infinite}
.hintSprite.glimsway.active{animation:glimSway 2.85s ease-in-out infinite}
.hintSprite.cosmofloat.active{animation:cosmoFloat 3.2s ease-in-out infinite}
@keyframes boopBob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-2px) rotate(.22deg)}}
@keyframes salmonFloat{0%,100%{transform:translateY(0) rotate(0)}48%{transform:translateY(-1.7px) rotate(-.18deg)}}
@keyframes glimSway{0%,100%{transform:translateY(0) rotate(-.18deg)}50%{transform:translateY(-1.4px) rotate(.32deg)}}
@keyframes cosmoFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-1.8px) rotate(.18deg)}}

/* Crystal Room discovery is deliberately stronger and sequential. The room is already
   full of light and colour, so each target gets one clear localised magical cue at a
   time rather than competing subtle hints. There are still no rings or hotspot shapes. */
#crystalTargets .targetHotspot.hint-character::before{inset:5%;border-radius:46%;background:radial-gradient(ellipse at center,rgba(239,229,255,.34) 0%,rgba(166,126,255,.20) 32%,rgba(103,207,255,.10) 54%,transparent 76%);filter:blur(9px);mix-blend-mode:screen;transform:scale(.88)}
#crystalTargets .targetHotspot.hint-character.hinting::before{animation:crystalCharacterBloom 1.95s ease-in-out infinite}
@keyframes crystalCharacterBloom{0%,100%{opacity:0;transform:scale(.88)}22%{opacity:.45}52%{opacity:.78;transform:scale(1.03)}82%{opacity:.25}}

#crystalTargets .targetHotspot.hint-magic::before{inset:5%;border-radius:44%;background:radial-gradient(ellipse at center,rgba(255,255,255,.42) 0%,rgba(213,190,255,.32) 18%,rgba(139,111,255,.22) 38%,rgba(92,200,255,.10) 58%,transparent 78%);filter:blur(5px);mix-blend-mode:screen;transform:scale(.88)}
#crystalTargets .targetHotspot.hint-magic::after{inset:2%;background:radial-gradient(circle at 18% 30%,rgba(255,255,255,1) 0 1.7px,transparent 3px),radial-gradient(circle at 77% 21%,rgba(238,218,255,.96) 0 1.5px,transparent 2.8px),radial-gradient(circle at 68% 74%,rgba(185,238,255,.96) 0 1.8px,transparent 3.1px),radial-gradient(circle at 34% 70%,rgba(255,255,255,.84) 0 1.3px,transparent 2.5px),radial-gradient(circle at 52% 44%,rgba(226,205,255,.76) 0 1.1px,transparent 2.3px);filter:drop-shadow(0 0 7px rgba(181,144,255,.85))}
#crystalTargets .targetHotspot.hint-magic.hinting::before{animation:crystalMagicFocus 1.95s ease-in-out infinite}
#crystalTargets .targetHotspot.hint-magic.hinting::after{animation:crystalMagicSparkle 1.95s ease-in-out infinite}
@keyframes crystalMagicFocus{0%,100%{opacity:0;transform:scale(.86)}18%{opacity:.36}50%{opacity:.86;transform:scale(1.035)}82%{opacity:.28;transform:scale(1)}}
@keyframes crystalMagicSparkle{0%,100%{opacity:0;transform:translateY(2px) scale(.90)}28%{opacity:.55}52%{opacity:1;transform:translateY(-2px) scale(1.06)}78%{opacity:.35;transform:translateY(-4px) scale(.98)}}

/* Give the four magical props distinct visual behaviour without adding labels. */
#crystalTargets .targetHotspot[data-id="crystalCore"].hinting::before{background:radial-gradient(ellipse at 50% 52%,rgba(255,255,255,.58) 0%,rgba(197,173,255,.40) 22%,rgba(119,133,255,.22) 46%,rgba(77,211,255,.10) 62%,transparent 80%)}
#crystalTargets .targetHotspot[data-id="floorStars"].hinting::before{background:radial-gradient(ellipse at 50% 64%,rgba(255,255,255,.36) 0%,rgba(154,194,255,.25) 30%,rgba(171,121,255,.16) 50%,transparent 76%)}
#crystalTargets .targetHotspot[data-id="magicShelf"].hinting::before{background:linear-gradient(110deg,transparent 4%,rgba(218,198,255,.08) 25%,rgba(255,255,255,.54) 48%,rgba(132,218,255,.18) 62%,transparent 84%);filter:blur(5px)}
#crystalTargets .targetHotspot[data-id="cosmoStar"].hinting::before{inset:-8%;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.78) 0%,rgba(217,198,255,.48) 18%,rgba(125,205,255,.24) 42%,transparent 72%);filter:blur(3px)}

/* The character itself moves, with a little more confidence than the other rooms because
   the Crystal Room background is visually dense. */
#crystalScreen .hintSprite.glimsway.active{animation:crystalGlimFocus 1.95s ease-in-out infinite;filter:drop-shadow(0 0 8px rgba(199,170,255,.28)) drop-shadow(0 3px 7px rgba(0,0,0,.12))}
#crystalScreen .hintSprite.cosmofloat.active{animation:crystalCosmoFocus 1.95s ease-in-out infinite;filter:drop-shadow(0 0 8px rgba(174,221,255,.28)) drop-shadow(0 3px 7px rgba(0,0,0,.12))}
@keyframes crystalGlimFocus{0%,100%{transform:translateY(0) rotate(-.15deg) scale(1)}45%{transform:translateY(-2.4px) rotate(.38deg) scale(1.012)}72%{transform:translateY(-1px) rotate(.08deg) scale(1.006)}}
@keyframes crystalCosmoFocus{0%,100%{transform:translateY(0) rotate(0) scale(1)}48%{transform:translateY(-2.7px) rotate(.22deg) scale(1.012)}74%{transform:translateY(-1px) rotate(.08deg) scale(1.006)}}

/* The old large instruction pill is intentionally hidden; discovery is visual now. */
#kitchenHint,#diningHint,#tvHint,#bubbleHint,#playHint,#greenhouseHint,#workshopHint,#musicHint,#crystalHint,#engineHint,.bedroomRoomScreen .hint{display:none!important}
.shipModeNav{position:absolute;z-index:60;left:max(12px,env(safe-area-inset-left));top:max(12px,env(safe-area-inset-top));display:flex;gap:5px;padding:5px;border-radius:999px;background:rgba(5,4,14,.50);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(12px);box-shadow:0 8px 24px rgba(0,0,0,.22)}
.shipModeButton{appearance:none;border:0;border-radius:999px;padding:8px 12px;color:rgba(255,255,255,.76);background:transparent;font-weight:760;font-size:clamp(10px,1.05vw,14px);white-space:nowrap;cursor:pointer}
.shipModeButton.active{color:#191020;background:rgba(255,255,255,.96);box-shadow:0 2px 12px rgba(255,255,255,.10)}
.mediaVideo{z-index:12;opacity:0;pointer-events:none;transition:opacity .10s linear;background:#000}
.kitchenIdleVideo{z-index:11;background:transparent}
.mediaVideo.visible{opacity:1}
.lightTransition{position:absolute;inset:0;z-index:22;pointer-events:none;opacity:0;background:#02020a;transition:opacity .34s ease}
.topBar{position:absolute;right:max(14px,env(safe-area-inset-right));top:max(14px,env(safe-area-inset-top));z-index:65}
.roundButton{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.25);color:white;background:rgba(11,9,22,.62);box-shadow:0 8px 24px rgba(0,0,0,.25);backdrop-filter:blur(10px)}
.backButton{position:absolute;left:max(14px,env(safe-area-inset-left));top:max(14px,env(safe-area-inset-top));z-index:55;font-size:40px;line-height:1}
.roomSound{position:absolute;right:max(14px,env(safe-area-inset-right));top:max(14px,env(safe-area-inset-top));z-index:55}
.hint{position:absolute;z-index:55;left:50%;bottom:max(16px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:78%;padding:8px 15px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(5,4,14,.54);color:rgba(255,255,255,.92);font-size:clamp(12px,1.35vw,17px);font-weight:650;text-align:center;backdrop-filter:blur(10px);transition:opacity .25s ease;pointer-events:none}
#hubHint{display:none}
#toast{position:absolute;z-index:90;left:50%;top:12%;transform:translate(-50%,-10px);opacity:0;padding:9px 14px;border-radius:999px;background:rgba(6,4,15,.78);color:white;font-size:14px;border:1px solid rgba(255,255,255,.16);pointer-events:none;transition:opacity .18s ease,transform .18s ease;backdrop-filter:blur(10px)}
#toast.show{opacity:1;transform:translate(-50%,0)}
.placeholder{display:grid;place-items:center;background:#05040b}
.blurredHub{filter:blur(9px) brightness(.36);transform:scale(1.04)}
.placeholderCard{position:relative;z-index:3;width:min(560px,72%);padding:28px;border-radius:28px;text-align:center;background:rgba(12,9,25,.78);border:1px solid rgba(255,255,255,.17);box-shadow:0 22px 80px rgba(0,0,0,.38);backdrop-filter:blur(16px)}
.placeholderCard h1{margin:0 0 8px;font-size:clamp(26px,4vw,52px)}
.placeholderCard p{opacity:.76}
.primaryButton{border:0;border-radius:999px;padding:12px 20px;font-weight:800;background:white;color:#17101f}
@media(max-width:760px){.shipModeNav{gap:2px;padding:3px;left:max(8px,env(safe-area-inset-left));top:max(8px,env(safe-area-inset-top))}.shipModeButton{padding:6px 8px;font-size:9px}.roomLabel{padding:2px 5px;font-size:7px}.roundButton{width:42px;height:42px}}
@media(orientation:portrait){#stage{width:min(100dvh,calc(100vw * 16 / 9));height:min(100vw,calc(100dvh * 9 / 16));transform:translate(-50%,-50%) rotate(90deg)}}

/* Orion first-play mission intro */
.orionIntroScreen{background:#000;overflow:hidden;z-index:65}
.orionIntroCutaway,.orionBridgeStill,.orionIntroVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.orionIntroCutaway{z-index:1;transform-origin:31% 22%;transform:scale(1);transition:transform 1.1s cubic-bezier(.32,.02,.18,1)}
.orionIntroCutaway.zooming{transform:scale(3.15)}
.orionBridgeStill{z-index:2;opacity:0;transition:opacity .42s ease;background:#000}
.orionBridgeStill.visible{opacity:1}
.orionIntroVideo{z-index:3;opacity:0;background:transparent;transition:opacity .16s linear}
.orionIntroVideo.visible{opacity:1}
.orionSkipButton{z-index:8;opacity:.92;pointer-events:auto}
.orionTapToPlay{position:absolute;z-index:9;left:50%;bottom:8%;transform:translateX(-50%);border:0;border-radius:999px;padding:12px 20px;background:rgba(5,6,20,.78);color:#fff;font:700 16px/1.1 system-ui,sans-serif;box-shadow:0 0 0 1px rgba(255,255,255,.35),0 6px 24px rgba(0,0,0,.35)}
.orionTapToPlay.hidden{display:none}

/* ===== Social-room lift navigation (2026-09-16) ===== */
.socialOverviewScreen,.socialLiftScreen,.liftDoorScreen,.floorHubScreen{background:#02030a;overflow:hidden}
.socialOverviewImage,.socialLiftImage,.liftDoorImage,.floorHubImage{object-fit:cover}
.socialOverviewImage{transform:scale(1);transition:transform 1.9s cubic-bezier(.2,.68,.26,1),filter .7s ease}
.socialOverviewScreen.entering .socialOverviewImage{transform:scale(1.075);filter:saturate(1.02) brightness(.98)}
.overviewEnter{position:absolute;z-index:40;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);appearance:none;border:1px solid rgba(255,255,255,.24);border-radius:999px;padding:10px 18px;background:rgba(8,8,22,.52);color:#fff;font-weight:820;font-size:clamp(12px,1.18vw,16px);box-shadow:0 10px 30px rgba(0,0,0,.3),0 0 28px rgba(92,184,255,.14);backdrop-filter:blur(10px);cursor:pointer;opacity:.86}
.socialNavSound{position:absolute;right:max(14px,env(safe-area-inset-right));top:max(14px,env(safe-area-inset-top));z-index:65}

.socialLiftImage{transform:perspective(900px) rotateY(0deg) scale(1);filter:blur(0);transition:transform .48s cubic-bezier(.25,.75,.2,1),filter .32s ease,opacity .34s ease}
.socialLiftScreen.turningAway .socialLiftImage{transform:perspective(900px) rotateY(-12deg) translateX(-7%) scale(1.035);filter:blur(1.4px);opacity:.18}
.socialLiftHotspots{position:absolute;inset:0;z-index:32;pointer-events:none}
.liftFloorHotspot{position:absolute;left:30.7%;width:38.6%;height:27.2%;appearance:none;border:0;border-radius:5%;padding:0;background:transparent;pointer-events:auto;cursor:pointer;overflow:hidden;transition:background .3s ease,box-shadow .3s ease,filter .3s ease}
#liftFloor2{top:4.3%}
#liftFloor3{top:35.2%}
#liftFloor4{top:65.0%}
.liftFloorHotspot::after{content:"";position:absolute;inset:3%;border-radius:7%;opacity:0;background:radial-gradient(ellipse at center,rgba(255,249,210,.34),rgba(95,193,255,.16) 48%,transparent 78%);box-shadow:inset 0 0 0 2px rgba(255,255,255,.10),0 0 28px rgba(102,205,255,.16);transition:opacity .2s ease,transform .2s ease,background .3s ease,box-shadow .3s ease;transform:scale(.97)}
.liftFloorHotspot:active::after,.liftFloorHotspot.selected::after{opacity:.95;transform:scale(1)}
.liftFloorHotspot.partial{background:linear-gradient(180deg,rgba(46,32,10,.18),rgba(19,14,9,.36));box-shadow:inset 0 0 22px rgba(76,53,14,.20),inset 0 0 0 1px rgba(255,224,142,.11)}
.liftFloorHotspot.partial::after{opacity:.28;transform:scale(1);background:radial-gradient(ellipse at center,rgba(255,240,186,.18),rgba(171,131,47,.11) 48%,transparent 78%);box-shadow:inset 0 0 0 1px rgba(255,228,154,.10),0 0 18px rgba(189,139,38,.09)}
.liftFloorHotspot.complete{background:linear-gradient(180deg,rgba(5,10,25,.36),rgba(3,6,18,.58));box-shadow:inset 0 0 26px rgba(4,9,26,.34),inset 0 0 0 1px rgba(156,190,255,.12);filter:saturate(.92)}
.liftFloorHotspot.complete::after{opacity:.22;transform:scale(1);background:radial-gradient(ellipse at center,rgba(182,209,255,.12),rgba(78,104,188,.10) 48%,transparent 78%);box-shadow:inset 0 0 0 1px rgba(155,190,255,.10),0 0 16px rgba(86,122,255,.10)}
.liftFloorHotspot.partial::before,.liftFloorHotspot.complete::before{position:absolute;z-index:2;right:5%;top:8%;display:grid;place-items:center;width:8%;aspect-ratio:1;border-radius:50%;font-size:clamp(10px,1.45vw,20px);font-weight:900;box-shadow:0 0 18px rgba(0,0,0,.35)}
.liftFloorHotspot.partial::before{content:"✦";color:#ffe6a0;background:rgba(41,26,8,.68);border:1px solid rgba(255,220,132,.52)}
.liftFloorHotspot.complete::before{content:"☾";color:#cbdcff;background:rgba(8,14,38,.78);border:1px solid rgba(144,186,255,.48)}

/* Premium quiet-state layers for the ship cutaways. Each overlay is tightly clipped
   to the actual room/door region, so lights-out feels integrated with the artwork. */
.socialOverviewStateLayer,.hubStateLayer,.crewCorridorStateLayer,.liftStateLayer{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.socialOverviewStateLayer,.hubStateLayer,.liftStateLayer{z-index:18}
.crewCorridorStateLayer{z-index:22}
.socialOverviewRoomShade,.crewCorridorDoorShade{position:absolute;opacity:0;transition:opacity .55s ease,transform .55s ease,filter .55s ease;background:linear-gradient(180deg,rgba(4,8,24,.18),rgba(2,5,18,.42));box-shadow:inset 0 0 26px rgba(2,5,18,.48),inset 0 0 0 1px rgba(148,185,255,.08);backdrop-filter:brightness(.58) saturate(.68);-webkit-backdrop-filter:brightness(.58) saturate(.68);transform:scale(.985);will-change:opacity,transform,filter}
.socialOverviewRoomShade{border-radius:16px 16px 12px 12px / 14px 14px 10px 10px}
.socialOverviewRoomShade::after,.crewCorridorDoorShade::after{content:"☾";position:absolute;right:7%;top:8%;display:grid;place-items:center;width:min(18px,16%);aspect-ratio:1;border-radius:50%;font-size:clamp(9px,.92vw,14px);font-weight:900;color:#d8e5ff;background:rgba(8,14,38,.78);border:1px solid rgba(144,186,255,.42);box-shadow:0 0 10px rgba(47,112,255,.18);opacity:0;transform:scale(.88);transition:opacity .4s ease,transform .4s ease}
.socialOverviewRoomShade.active,.crewCorridorDoorShade.active{opacity:1;transform:scale(1)}
.socialOverviewRoomShade.active::after,.crewCorridorDoorShade.active::after{opacity:.95;transform:scale(1)}
.socialOverviewRoomShade.active{filter:brightness(.98)}

.liftDoorScreen{background:#06050a}
.liftDoorImage{transform:scale(1);filter:brightness(1);transition:transform .38s ease,filter .38s ease,opacity .38s ease}
.liftDoorScreen.travelling .liftDoorImage{animation:liftTravel 1.05s ease-in-out both}
.liftDoorScreen.arrived .liftDoorImage{transform:scale(1.018);filter:brightness(1.08)}
@keyframes liftTravel{0%{transform:translateY(0) scale(1);filter:brightness(1)}22%{transform:translateY(1.2px) scale(1.003);filter:brightness(.96)}48%{transform:translateY(-1px) scale(1.005);filter:brightness(1.02)}74%{transform:translateY(1px) scale(1.004);filter:brightness(.98)}100%{transform:translateY(0) scale(1.008);filter:brightness(1.05)}}
.liftDestinationBadge{position:absolute;z-index:20;left:50%;top:7.1%;transform:translateX(-50%);display:grid;place-items:center;min-width:5.2%;aspect-ratio:1;border-radius:999px;color:#d9f4ff;background:rgba(8,17,40,.72);border:1px solid rgba(117,214,255,.44);font-size:clamp(17px,2.2vw,32px);font-weight:950;text-shadow:0 0 12px rgba(88,202,255,.9);box-shadow:0 0 22px rgba(58,176,255,.18);opacity:.96}
.liftTravelGlow{position:absolute;z-index:12;inset:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 52%,rgba(93,190,255,.10),transparent 46%)}
.liftDoorScreen.travelling .liftTravelGlow{animation:liftGlow 1.05s ease-in-out both}
@keyframes liftGlow{0%,100%{opacity:.06}45%{opacity:.7}70%{opacity:.24}}

.floorHubImage{transform:scale(1);filter:brightness(1);transition:transform .5s cubic-bezier(.22,.75,.24,1),filter .4s ease,opacity .3s ease}
.floorHubScreen.arriving .floorHubImage{animation:floorArrival .65s cubic-bezier(.18,.72,.2,1) both}
.floorHubScreen.approachingLift .floorHubImage{transform:scale(1.075);filter:brightness(.92) blur(.8px)}
@keyframes floorArrival{0%{opacity:.20;transform:scale(1.06);filter:brightness(1.2) blur(1px)}100%{opacity:1;transform:scale(1);filter:brightness(1) blur(0)}}
.floorHotspotLayer{position:absolute;inset:0;z-index:30;pointer-events:none}
.socialRoomDoor,.floorLiftHotspot{position:absolute;appearance:none;border:0;padding:0;background:transparent;pointer-events:auto;cursor:pointer}
.socialRoomDoor{border-radius:8%;overflow:hidden;transition:background .35s ease,box-shadow .35s ease,filter .35s ease}
.socialRoomDoor::after{content:"";position:absolute;inset:4%;border-radius:9%;opacity:0;background:radial-gradient(ellipse at center,rgba(255,245,183,.24),rgba(96,205,255,.12) 45%,transparent 76%);filter:blur(4px);transition:opacity .22s ease}
.socialRoomDoor:active::after{opacity:.88}
.socialRoomDoor.quiet{background:linear-gradient(180deg,rgba(2,7,19,.56),rgba(2,5,18,.72));box-shadow:inset 0 0 34px rgba(5,13,42,.58)}
.socialRoomDoor.quiet::before{content:"☾";position:absolute;z-index:2;right:8%;top:7%;display:grid;place-items:center;width:12%;aspect-ratio:1;border-radius:50%;color:#d7e6ff;background:rgba(7,12,34,.74);border:1px solid rgba(154,191,255,.42);font-size:clamp(9px,1.25vw,18px);text-shadow:0 0 9px rgba(100,168,255,.8);box-shadow:0 0 14px rgba(47,112,255,.16)}
.floorLiftHotspot{z-index:34;border-radius:12%;overflow:visible}
.floorLiftHotspot::after{content:"";position:absolute;inset:8%;border-radius:14%;opacity:0;background:radial-gradient(ellipse at center,rgba(255,240,176,.22),rgba(91,197,255,.10) 46%,transparent 74%);filter:blur(4px);transition:opacity .25s ease,transform .25s ease;transform:scale(.96)}
.floorLiftHotspot:active::after{opacity:.9;transform:scale(1.02)}
.floorHint{position:absolute;z-index:50;left:50%;bottom:max(13px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:72%;padding:7px 14px;border-radius:999px;background:rgba(5,6,18,.42);border:1px solid rgba(255,255,255,.13);color:rgba(255,255,255,.86);font-size:clamp(10px,1.05vw,14px);font-weight:720;text-align:center;white-space:nowrap;backdrop-filter:blur(8px);pointer-events:none;text-shadow:0 1px 5px rgba(0,0,0,.8);opacity:.78}

@media(max-width:760px){
  .overviewEnter{padding:7px 13px;font-size:10px}
  .floorHint{font-size:8px;padding:5px 9px;bottom:7px}
  .socialNavSound{width:40px;height:40px}
}

/* Lift doors physically open onto the selected floor.  The supplied closed-door
   artwork is preserved as the travelling view; on arrival it is reconstructed as
   a fixed outer frame plus two moving door leaves over the selected floor image. */
.liftArrivalPreview{z-index:1;opacity:0;transform:scale(1.055);filter:brightness(.9);transition:opacity .16s ease,transform .72s cubic-bezier(.18,.76,.18,1),filter .5s ease}
.liftDoorFrame,.liftDoorPanel{position:absolute;inset:0;background:url('assets/images/lift-doors.avif') center/100% 100% no-repeat;pointer-events:none;opacity:0}
.liftDoorFrame{z-index:2;
  -webkit-mask:
    linear-gradient(#000 0 0) 0 0/100% 13% no-repeat,
    linear-gradient(#000 0 0) 0 100%/100% 16% no-repeat,
    linear-gradient(#000 0 0) 0 13%/31.5% 71% no-repeat,
    linear-gradient(#000 0 0) 100% 13%/31.5% 71% no-repeat;
  mask:
    linear-gradient(#000 0 0) 0 0/100% 13% no-repeat,
    linear-gradient(#000 0 0) 0 100%/100% 16% no-repeat,
    linear-gradient(#000 0 0) 0 13%/31.5% 71% no-repeat,
    linear-gradient(#000 0 0) 100% 13%/31.5% 71% no-repeat}
.liftDoorPanel{z-index:3;transition:transform .64s cubic-bezier(.38,.02,.16,1),opacity .08s linear;will-change:transform}
.liftDoorPanelLeft{clip-path:polygon(31.5% 13%,50.15% 13%,50.15% 84%,31.5% 84%)}
.liftDoorPanelRight{clip-path:polygon(49.85% 13%,68.5% 13%,68.5% 84%,49.85% 84%)}
.liftDoorImage{z-index:4;opacity:1}
.liftDestinationBadge{z-index:20}
.liftDoorScreen.arrived .liftArrivalPreview{opacity:1;transform:scale(1.015);filter:brightness(1)}
.liftDoorScreen.arrived .liftDoorFrame,.liftDoorScreen.arrived .liftDoorPanel{opacity:1}
.liftDoorScreen.arrived .liftDoorImage{opacity:0;transform:scale(1.018);filter:brightness(1.08)}
.liftDoorScreen.arrived .liftDoorPanelLeft{transform:translateX(-19.3%)}
.liftDoorScreen.arrived .liftDoorPanelRight{transform:translateX(19.3%)}

/* ===== Lift floor completion polish (2026-09-16b) =====
   Room tap targets remain intentionally generous for young children, but the visual
   lights-out treatment is a separate, tightly fitted door panel so it cannot spill
   over the lift or adjacent architecture. */
.floorRoomShade{
  position:absolute;
  z-index:1;
  pointer-events:none;
  opacity:0;
  border-radius:19% 19% 12% 12% / 11% 11% 8% 8%;
  background:linear-gradient(180deg,rgba(2,8,24,.26),rgba(1,5,18,.52));
  box-shadow:inset 0 0 24px rgba(1,5,20,.54),inset 0 0 0 1px rgba(100,150,220,.08);
  backdrop-filter:brightness(.58) saturate(.68);
  -webkit-backdrop-filter:brightness(.58) saturate(.68);
  transition:opacity .46s ease,transform .46s ease;
  transform:scale(.985);
}
.floorRoomShade::after{content:"☾";position:absolute;right:8%;top:9%;display:grid;place-items:center;width:min(18px,15%);aspect-ratio:1;border-radius:50%;font-size:clamp(9px,1.05vw,15px);font-weight:900;color:#d8e5ff;background:rgba(8,14,38,.78);border:1px solid rgba(144,186,255,.42);box-shadow:0 0 10px rgba(47,112,255,.18);opacity:0;transform:scale(.88);transition:opacity .4s ease,transform .4s ease}
.floorRoomShade.active{opacity:1;transform:scale(1)}
.floorRoomShade.active::after{opacity:.95;transform:scale(1)}
.socialRoomDoor{z-index:2}
.socialRoomDoor.quiet{background:transparent;box-shadow:none}
.socialRoomDoor.quiet::before{display:none}


/* ===== Crew Deck chapter handoff (2026-09-18) ===== */
.crewDeckCutawayScreen,.crewCorridorScreen{background:#02030a;overflow:hidden}
.crewDeckCutawayImage,.crewCorridorImage{object-fit:cover}
.crewDeckCutawayImage{transform:scale(1);transform-origin:14.8% 50%;filter:brightness(1);transition:transform .68s cubic-bezier(.2,.72,.2,1),filter .5s ease}
.crewDeckCutawayScreen.approachingLift .crewDeckCutawayImage{transform:scale(1.34);filter:brightness(.88)}
.crewDeckLiftHotspot{position:absolute;z-index:45;left:10.2%;top:38.0%;width:10.8%;height:28.0%;appearance:none;border:0;padding:0;background:transparent;cursor:pointer;border-radius:22%;pointer-events:auto}
.crewDeckLiftHotspot::before{content:"";position:absolute;inset:-10%;border-radius:25%;opacity:0;background:radial-gradient(ellipse at center,rgba(255,226,145,.30),rgba(106,193,255,.15) 46%,transparent 74%);filter:blur(4px);box-shadow:0 0 28px rgba(255,204,111,.14);transition:opacity .35s ease,transform .35s ease;transform:scale(.94)}
.crewDeckCutawayScreen.ready .crewDeckLiftHotspot::before{opacity:.82;animation:crewLiftPulse 2.4s ease-in-out infinite}
.crewDeckLiftHotspot:active::before{opacity:1;transform:scale(1.04)}
.crewDeckLiftHotspot:disabled{pointer-events:none}
.crewDeckLiftHotspot span{position:absolute;left:50%;top:104%;transform:translateX(-50%);min-width:max-content;padding:7px 12px;border-radius:999px;background:rgba(5,7,19,.70);border:1px solid rgba(255,232,177,.30);color:#fff3cf;font-size:clamp(9px,.9vw,13px);font-weight:850;letter-spacing:.06em;text-shadow:0 1px 6px rgba(0,0,0,.8);box-shadow:0 7px 22px rgba(0,0,0,.28);backdrop-filter:blur(8px);opacity:0;transition:opacity .3s ease;white-space:nowrap}
.crewDeckLiftHotspot span small{display:block;margin-top:2px;color:rgba(255,255,255,.78);font-size:.78em;font-weight:650;letter-spacing:0}
.crewDeckCutawayScreen.ready .crewDeckLiftHotspot span{opacity:.94}
@keyframes crewLiftPulse{0%,100%{transform:scale(.96);opacity:.48}50%{transform:scale(1.04);opacity:.94}}

/* Dedicated Crew Quarters lift sequence.  This is intentionally isolated from the
   existing social-room lift so the proven floor navigation remains untouched. */
.crewLiftSequenceScreen{background:#02030a;overflow:hidden}
.crewLiftSequenceImage{object-fit:cover;opacity:1;transform:scale(1);filter:brightness(1);transition:opacity .16s ease,transform .32s ease,filter .22s ease;will-change:opacity,transform,filter}
.crewLiftSequenceScreen.frameChanging .crewLiftSequenceImage{opacity:.22;transform:scale(1.004);filter:brightness(.90)}
.crewLiftSequenceScreen.travelling .crewLiftSequenceImage{animation:crewLiftCabinTravel 1.12s ease-in-out both}
.crewLiftSequenceScreen.arrivedClosed .crewLiftSequenceImage{transform:scale(1.006);filter:brightness(1.02)}
.crewLiftSequenceScreen.doorsHalf .crewLiftSequenceImage{transform:scale(1.004)}
.crewLiftSequenceScreen.doorsOpen .crewLiftSequenceImage{transform:scale(1.002);filter:brightness(1.03)}
.crewLiftSequenceGlow{position:absolute;z-index:3;inset:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 54%,rgba(112,194,255,.12),transparent 50%)}
.crewLiftSequenceScreen.travelling .crewLiftSequenceGlow{animation:crewLiftSequenceGlow 1.12s ease-in-out both}
@keyframes crewLiftCabinTravel{0%{transform:translateY(0) scale(1);filter:brightness(1)}24%{transform:translateY(1.1px) scale(1.003);filter:brightness(.97)}52%{transform:translateY(-1px) scale(1.006);filter:brightness(1.025)}76%{transform:translateY(.8px) scale(1.004);filter:brightness(.99)}100%{transform:translateY(0) scale(1.004);filter:brightness(1.02)}}
@keyframes crewLiftSequenceGlow{0%,100%{opacity:.05}48%{opacity:.60}72%{opacity:.18}}

.crewCorridorImage{transform:scale(1)}
.crewCorridorScreen.arriving .crewCorridorImage{animation:crewCorridorArrival .75s cubic-bezier(.18,.74,.2,1) both}
@keyframes crewCorridorArrival{0%{opacity:.28;transform:scale(1.035);filter:brightness(1.12) blur(.8px)}100%{opacity:1;transform:scale(1);filter:brightness(1) blur(0)}}
.liftDoorScreen.crewDeckTravel .liftDestinationBadge{font-size:clamp(16px,2vw,30px);color:#fff0bf;border-color:rgba(255,220,137,.42);background:rgba(30,20,8,.68);text-shadow:0 0 12px rgba(255,214,128,.75)}
@media(max-width:760px){.crewDeckLiftHotspot span{padding:5px 8px;font-size:7px}.crewDeckLiftHotspot{left:9.3%;top:36.5%;width:12.5%;height:31%}}


/* Crew corridor navigation + bedroom patch */
.crewCorridorChrome{position:absolute;z-index:55;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));top:max(14px,env(safe-area-inset-top));display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:none}
.crewCorridorBadge{pointer-events:auto;flex:1;max-width:min(76vw,900px);margin:0 auto;padding:10px 18px;border-radius:999px;border:1px solid rgba(255,239,194,.28);background:rgba(7,9,22,.60);backdrop-filter:blur(12px);color:#fff4cf;font-weight:800;letter-spacing:.03em;font-size:clamp(11px,1.25vw,16px);text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.28)}
.crewCorridorNavButton{pointer-events:auto;appearance:none;border:1px solid rgba(255,239,194,.28);background:rgba(7,9,22,.70);backdrop-filter:blur(10px);color:#fff4cf;width:52px;height:52px;border-radius:999px;font-size:38px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(0,0,0,.28);transition:transform .2s ease,opacity .2s ease,border-color .2s ease}
.crewCorridorNavButton:hover{transform:scale(1.04);border-color:rgba(255,245,212,.44)}
.crewCorridorNavButton:disabled{opacity:.28;cursor:default;transform:none}
.crewCorridorHotspots{position:absolute;inset:0;z-index:40}
.crewCorridorDoorHotspot{position:absolute;appearance:none;border:0;padding:0;background:transparent;cursor:pointer;border-radius:20px}
.crewCorridorDoorHotspot::before{content:"";position:absolute;inset:-8%;border-radius:22px;background:radial-gradient(ellipse at center,rgba(255,229,166,.17),rgba(128,214,255,.10) 44%,transparent 72%);opacity:0;transform:scale(.94);transition:opacity .25s ease,transform .25s ease;filter:blur(2px)}
.crewCorridorDoorHotspot.is-active::before,.crewCorridorDoorHotspot:hover::before{opacity:.85;transform:scale(1)}
.crewCorridorDoorHotspot.is-active{animation:crewDoorPulse 2.8s ease-in-out infinite}
.crewCorridorDoorHotspot.is-asleep{animation:none}
.crewCorridorDoorHotspot.is-asleep::before{opacity:.18;transform:scale(1);background:radial-gradient(ellipse at center,rgba(164,194,255,.10),rgba(78,104,188,.06) 44%,transparent 72%)}
.crewCorridorDoorHotspot.is-asleep:hover::before{opacity:.28}
.crewCorridorDoorShade{border-radius:16px 16px 12px 12px / 12px 12px 8px 8px}
.crewCorridorDoorShade.planned{box-shadow:inset 0 0 18px rgba(255,226,145,.06),inset 0 0 0 1px rgba(148,185,255,.05)}
.crewCorridorDoorShade.dormant{opacity:.16;filter:brightness(.88) saturate(.82)}
.crewCorridorDoorShade.active{opacity:1;filter:brightness(.98)}
@keyframes crewDoorPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.012)}}
.crewCorridorHint{position:absolute;z-index:55;left:50%;bottom:max(16px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:min(88vw,1000px);padding:9px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(7,9,22,.60);backdrop-filter:blur(12px);color:rgba(255,255,255,.92);font-size:clamp(11px,1.15vw,16px);font-weight:700;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.24);pointer-events:none}
.bedroomRoomScreen{background:#02030a;overflow:hidden}
.bedroomRoomScreen .roomPoster{object-fit:cover}
.bedroomTargets{z-index:40;pointer-events:auto}
.bedroomTargets .targetHotspot{position:absolute;appearance:none;border:0;padding:0;background:transparent;cursor:pointer;border-radius:18px}
.bedroomTargets.sleeping .targetHotspot{pointer-events:none}
.bedroomTargets.sleeping .targetHotspot::before,.bedroomTargets.sleeping .targetHotspot::after{opacity:0!important}

/* Bedrooms now use the same discovery language as the Kitchen: real props glint,
   magical bedtime items softly pulse, and characters get a gentle localised bloom. */
.bedroomTargets .targetHotspot.hint-character::before{inset:6%;border-radius:44%;background:radial-gradient(ellipse at center,rgba(255,247,219,.34) 0%,rgba(185,225,255,.18) 34%,rgba(168,120,255,.10) 54%,transparent 76%);filter:blur(7px);mix-blend-mode:screen;transform:scale(.9)}
.bedroomTargets .targetHotspot.hint-character.hinting::before{animation:bedroomCharacterBloom 2.2s ease-in-out infinite}
@keyframes bedroomCharacterBloom{0%,100%{opacity:.12;transform:scale(.92)}50%{opacity:.72;transform:scale(1.025)}}

.bedroomTargets .targetHotspot.hint-magic::before{inset:10%;border-radius:38%;background:radial-gradient(circle at 50% 48%,rgba(240,230,255,.24) 0%,rgba(146,221,255,.15) 34%,rgba(167,120,255,.10) 56%,transparent 74%);filter:blur(4px);mix-blend-mode:screen;transform:scale(.94)}
.bedroomTargets .targetHotspot.hint-magic::after{inset:10%;background:radial-gradient(circle at 25% 30%,rgba(255,255,255,.95) 0 1.2px,transparent 2.2px),radial-gradient(circle at 76% 22%,rgba(215,197,255,.85) 0 1px,transparent 2.1px),radial-gradient(circle at 66% 74%,rgba(174,231,255,.82) 0 1.2px,transparent 2.2px),radial-gradient(circle at 36% 68%,rgba(255,255,255,.7) 0 1px,transparent 1.8px);filter:drop-shadow(0 0 5px rgba(181,144,255,.55))}
.bedroomTargets .targetHotspot.hint-magic.hinting::before{animation:magicBreathe 2.9s ease-in-out infinite}
.bedroomTargets .targetHotspot.hint-magic.hinting::after{animation:magicTwinkle 2.4s ease-in-out infinite .18s}

.bedroomTargets .targetHotspot:hover::before{opacity:.9}
@media(max-width:760px){.crewCorridorBadge{padding:8px 12px;font-size:10px}.crewCorridorNavButton{width:44px;height:44px;font-size:32px}.crewCorridorHint{max-width:92vw;font-size:10px;padding:8px 12px}}

/* Keep Social Rooms accessible after Crew Quarters unlock */
.crewReturnSocial{position:absolute;z-index:58;left:max(16px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom));appearance:none;border:1px solid rgba(255,239,194,.28);background:rgba(7,9,22,.72);backdrop-filter:blur(12px);color:#fff4cf;border-radius:999px;padding:10px 15px;font-size:clamp(11px,1.15vw,16px);font-weight:850;letter-spacing:.02em;box-shadow:0 10px 30px rgba(0,0,0,.28);cursor:pointer}
.crewReturnSocial:active{transform:scale(.98)}
.crewUnlockedButton{position:absolute;z-index:58;right:max(76px,calc(env(safe-area-inset-right) + 68px));top:max(16px,env(safe-area-inset-top));appearance:none;border:1px solid rgba(255,239,194,.30);background:rgba(7,9,22,.72);backdrop-filter:blur(12px);color:#fff4cf;border-radius:999px;padding:10px 15px;font-size:clamp(11px,1.15vw,16px);font-weight:850;letter-spacing:.02em;box-shadow:0 10px 30px rgba(0,0,0,.28);cursor:pointer}
.crewUnlockedButton.hidden{display:none}
@media(max-width:760px){.crewReturnSocial,.crewUnlockedButton{padding:8px 11px;font-size:10px}.crewUnlockedButton{right:62px}}

/* =========================================================
   Preschool discovery standard — Social Rooms + Bedrooms
   Five reusable visual cue types. Hitboxes remain invisible.
   ========================================================= */
.targetHotspot.hint-wiggle::before{
  inset:10%;border-radius:34%;
  background:linear-gradient(105deg,transparent 5%,rgba(255,255,255,.07) 27%,rgba(255,239,183,.72) 48%,rgba(156,222,255,.18) 63%,transparent 86%);
  filter:blur(1px);mix-blend-mode:screen;transform:translateX(-18%) rotate(-3deg)
}
.targetHotspot.hint-wiggle::after{
  left:48%;top:44%;width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.92);
  box-shadow:0 0 8px 2px rgba(255,231,162,.65),0 0 16px 5px rgba(124,202,255,.18)
}
.targetHotspot.hint-wiggle.hinting::before{animation:toddlerWiggle 1.55s ease-in-out infinite}
.targetHotspot.hint-wiggle.hinting::after{animation:toddlerWiggleSpark 1.55s ease-in-out infinite .16s}
@keyframes toddlerWiggle{0%,100%{opacity:.10;transform:translateX(-16%) rotate(-4deg) scale(.98)}38%{opacity:.78;transform:translateX(3%) rotate(4deg) scale(1.02)}68%{opacity:.34;transform:translateX(-1%) rotate(-2deg) scale(1)}}
@keyframes toddlerWiggleSpark{0%,100%{opacity:0;transform:scale(.35)}45%{opacity:.9;transform:scale(1.15)}70%{opacity:.25;transform:scale(.72)}}

.targetHotspot.hint-bob::before{
  inset:7%;border-radius:42%;
  background:radial-gradient(ellipse at center,rgba(255,250,222,.28) 0%,rgba(154,224,255,.18) 35%,rgba(170,118,255,.08) 58%,transparent 77%);
  filter:blur(6px);mix-blend-mode:screen
}
.targetHotspot.hint-bob.hinting::before{animation:toddlerBob 1.8s ease-in-out infinite}
@keyframes toddlerBob{0%,100%{opacity:.16;transform:translateY(3px) scale(.96)}50%{opacity:.72;transform:translateY(-5px) scale(1.035)}}

.targetHotspot.hint-pulse::before{
  inset:5%;border-radius:38%;
  background:radial-gradient(circle at center,rgba(255,248,205,.52) 0%,rgba(255,196,92,.23) 27%,rgba(113,194,255,.08) 55%,transparent 74%);
  filter:blur(3px);mix-blend-mode:screen
}
.targetHotspot.hint-pulse.hinting::before{animation:toddlerPulse 1.65s ease-in-out infinite}
@keyframes toddlerPulse{0%,100%{opacity:.16;transform:scale(.90)}50%{opacity:.82;transform:scale(1.08)}}

.targetHotspot.hint-sparkle::before{
  inset:7%;border-radius:40%;
  background:radial-gradient(ellipse at center,rgba(242,229,255,.30),rgba(128,210,255,.12) 42%,transparent 72%);
  filter:blur(4px);mix-blend-mode:screen
}
.targetHotspot.hint-sparkle::after{
  inset:4%;
  background:radial-gradient(circle at 20% 30%,#fff 0 1.7px,transparent 3px),radial-gradient(circle at 76% 22%,rgba(237,220,255,.95) 0 1.5px,transparent 3px),radial-gradient(circle at 68% 74%,rgba(190,239,255,.92) 0 1.6px,transparent 3px),radial-gradient(circle at 35% 70%,rgba(255,255,255,.8) 0 1.2px,transparent 2.5px)
}
.targetHotspot.hint-sparkle.hinting::before{animation:toddlerSparkleGlow 1.8s ease-in-out infinite}
.targetHotspot.hint-sparkle.hinting::after{animation:toddlerSparkle 1.45s ease-in-out infinite .08s}
@keyframes toddlerSparkleGlow{0%,100%{opacity:.14;transform:scale(.92)}50%{opacity:.70;transform:scale(1.04)}}
@keyframes toddlerSparkle{0%,100%{opacity:.08;transform:translateY(2px) scale(.92)}45%{opacity:1;transform:translateY(-3px) scale(1.08)}}

.targetHotspot.hint-squish::before{
  inset:10%;border-radius:45%;
  background:radial-gradient(ellipse at center,rgba(255,239,211,.30),rgba(244,144,216,.16) 44%,rgba(127,213,255,.08) 62%,transparent 78%);
  filter:blur(5px);mix-blend-mode:screen
}
.targetHotspot.hint-squish.hinting::before{animation:toddlerSquish 1.75s ease-in-out infinite}
@keyframes toddlerSquish{0%,100%{opacity:.16;transform:scaleX(.96) scaleY(1.02)}45%{opacity:.76;transform:scaleX(1.06) scaleY(.92)}70%{opacity:.35;transform:scaleX(.99) scaleY(1.03)}}

.characterCycleFallback{z-index:0}
.hotspotLayer .targetHotspot:not(.characterCycleFallback){z-index:2}

/* Universal Muddlepop bedtime switch. Same place and same behaviour in every room. */
.muddlepopBedtimeSwitch{
  position:absolute;z-index:69;right:max(13px,calc(env(safe-area-inset-right) + 10px));bottom:max(14px,calc(env(safe-area-inset-bottom) + 10px));
  width:clamp(68px,7.2vw,108px);height:clamp(82px,8.8vw,132px);appearance:none;padding:0;cursor:pointer;
  border:2px solid rgba(255,225,157,.70);border-radius:22px;
  background:linear-gradient(145deg,#7e4d20 0%,#d99b43 16%,#70421d 42%,#2d2542 100%);
  box-shadow:inset 0 0 0 3px rgba(52,31,17,.55),inset 0 0 18px rgba(255,215,131,.24),0 7px 23px rgba(0,0,0,.38),0 0 20px rgba(255,194,99,.16);
  transition:opacity .18s ease,transform .16s ease,filter .2s ease;overflow:hidden
}
.muddlepopBedtimeSwitch.hidden{opacity:0;visibility:hidden;pointer-events:none}
.muddlepopBedtimeSwitch:active{transform:scale(.96)}
.muddlepopBedtimeSwitch:disabled{pointer-events:none;filter:saturate(.7) brightness(.82)}
.muddlepopBedtimeSwitch::before{
  content:"";position:absolute;left:14%;right:14%;top:10%;height:42%;border-radius:50%;
  background:radial-gradient(circle,rgba(255,243,188,.95) 0%,rgba(255,202,96,.55) 32%,rgba(129,94,184,.12) 62%,transparent 75%);
  animation:bedtimeSwitchBreathe 2.2s ease-in-out infinite
}
@keyframes bedtimeSwitchBreathe{0%,100%{opacity:.48;transform:scale(.93)}50%{opacity:.98;transform:scale(1.08)}}
.bedtimeSwitchIcon{position:absolute;z-index:2;left:50%;top:9%;transform:translateX(-50%);width:38%;aspect-ratio:1;border-radius:50%;background:#ffe69b;box-shadow:0 0 15px rgba(255,220,128,.85)}
.bedtimeSwitchIcon::after{content:"";position:absolute;left:34%;top:-6%;width:78%;height:78%;border-radius:50%;background:#55416a}
.muddlepopBedtimeSwitch.dark .bedtimeSwitchIcon{background:#fff3b0;box-shadow:0 0 18px rgba(255,240,151,.95)}
.muddlepopBedtimeSwitch.dark .bedtimeSwitchIcon::after{display:none}
.muddlepopBedtimeSwitch.dark .bedtimeSwitchIcon::before{content:"";position:absolute;inset:31%;border-radius:50%;background:#ffc64c;box-shadow:0 -17px 0 -7px #ffc64c,0 17px 0 -7px #ffc64c,17px 0 0 -7px #ffc64c,-17px 0 0 -7px #ffc64c,12px 12px 0 -7px #ffc64c,-12px -12px 0 -7px #ffc64c,12px -12px 0 -7px #ffc64c,-12px 12px 0 -7px #ffc64c}
.bedtimeSwitchLever{position:absolute;z-index:3;left:50%;top:52%;width:18%;height:27%;transform:translateX(-50%) rotate(0deg);transform-origin:50% 88%;border-radius:9px;background:linear-gradient(90deg,#342316,#f2c477 43%,#8c5c2d 70%,#2e2017);box-shadow:0 3px 6px rgba(0,0,0,.45);transition:transform .25s ease}
.muddlepopBedtimeSwitch.dark .bedtimeSwitchLever{transform:translateX(-50%) rotate(180deg)}
.muddlepopBedtimeSwitch.pending .bedtimeSwitchLever{animation:switchNudge .34s ease-in-out 2}
@keyframes switchNudge{0%,100%{margin-left:0}50%{margin-left:4px}}
.bedtimeSwitchLabel{position:absolute;left:0;right:0;bottom:7%;color:#fff0c9;font-size:clamp(8px,.72vw,12px);font-weight:900;letter-spacing:.10em;text-shadow:0 1px 5px #000}
.muddlepopBedtimeSwitch.sleeping{opacity:.46}
@media(max-width:760px){.muddlepopBedtimeSwitch{width:58px;height:72px;border-radius:16px}.bedtimeSwitchLabel{font-size:7px}}

/* Room discovery is visual-only: no instruction pills in Social Rooms or Bedrooms. */

/* Floating bedtime switch retired: actual room lights are now the bedtime control. */
.muddlepopBedtimeSwitch{display:none!important}

#diningTargets .targetHotspot[data-id="diningBellTarget"].hinting::before{
  background:radial-gradient(circle,rgba(255,247,194,.72) 0%,rgba(255,198,79,.30) 30%,rgba(255,160,54,.08) 56%,transparent 74%);
  filter:blur(2px);mix-blend-mode:screen;
}

/* Sep 2026 — one-shot Lolly + Wibblo Universal Translator story beat. */
.communicationsScreen{background:#05040b;overflow:hidden;z-index:64}
.communicationsReadyImage,.communicationsEndHoldImage,.communicationsIntroVideo,.communicationsTestVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
.communicationsReadyImage{z-index:1}
.communicationsEndHoldImage{z-index:2;opacity:0;transition:opacity .10s linear}
.communicationsEndHoldImage.visible{opacity:1}
.communicationsIntroVideo,.communicationsTestVideo{z-index:3;opacity:0;background:#05040b;transition:opacity .10s linear}
.communicationsIntroVideo.visible,.communicationsTestVideo.visible{opacity:1}
.communicationsTapTarget{position:absolute;inset:0;z-index:7;border:0;padding:0;margin:0;background:transparent;appearance:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.communicationsTapTarget.hidden{display:none}
.communicationsTapPulse{position:absolute;left:47.25%;top:33.5%;width:13.2%;height:27.5%;border-radius:20px;border:3px solid rgba(105,255,152,.62);box-shadow:0 0 0 0 rgba(105,255,152,.35),0 0 28px rgba(89,255,153,.72),inset 0 0 24px rgba(89,255,153,.12);animation:communicationsInvite 1.45s ease-in-out infinite;pointer-events:none}
.communicationsTestFx{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;background:radial-gradient(circle at 54% 47%,rgba(80,255,216,.38) 0,rgba(168,86,255,.22) 15%,rgba(255,84,190,.10) 28%,transparent 47%);mix-blend-mode:screen}
.communicationsScreen.testing .communicationsTestFx{animation:communicationsTestFx 3.6s ease-in-out infinite}
.communicationsScreen.testing .communicationsReadyImage{animation:communicationsRoomWobble 1.9s ease-in-out 1}
.communicationsScreen.finalHold::after{content:"";position:absolute;z-index:4;pointer-events:none;left:42%;top:28%;width:20%;height:38%;border-radius:28px;background:radial-gradient(circle,rgba(116,255,224,.12),rgba(164,86,255,.06) 48%,transparent 72%);animation:communicationsFinalGlow 2.2s ease-in-out infinite}
@keyframes communicationsFinalGlow{0%,100%{opacity:.25;transform:scale(.985)}50%{opacity:.7;transform:scale(1.02)}}
@keyframes communicationsInvite{0%,100%{opacity:.42;transform:scale(.96);box-shadow:0 0 0 0 rgba(105,255,152,.28),0 0 20px rgba(89,255,153,.48),inset 0 0 18px rgba(89,255,153,.08)}50%{opacity:1;transform:scale(1.035);box-shadow:0 0 0 14px rgba(105,255,152,0),0 0 42px rgba(89,255,153,.95),inset 0 0 30px rgba(89,255,153,.18)}}
@keyframes communicationsTestFx{0%{opacity:0}8%{opacity:.85}18%{opacity:.18}30%{opacity:.95}44%{opacity:.28}60%{opacity:.78}76%{opacity:.15}100%{opacity:0}}
@keyframes communicationsRoomWobble{0%,100%{transform:translate3d(0,0,0) scale(1)}12%{transform:translate3d(-1px,1px,0) scale(1.001)}24%{transform:translate3d(2px,-1px,0) scale(1.002)}38%{transform:translate3d(-2px,0,0) scale(1.001)}54%{transform:translate3d(1px,1px,0) scale(1.001)}70%{transform:translate3d(-1px,-1px,0) scale(1)}}
@media (prefers-reduced-motion:reduce){.communicationsTapPulse{animation:none;opacity:.85}.communicationsScreen.testing .communicationsTestFx,.communicationsScreen.testing .communicationsReadyImage,.communicationsScreen.finalHold::after{animation:none}}

/* ===== Premium parent setup menu (2026-09-21) ===== */
.menuScreen{background:#02030a;overflow:hidden;z-index:90}
.menuHero{object-fit:cover;z-index:1;transform:scale(1.006);animation:menuHeroDrift 14s ease-in-out infinite alternate}
.menuAtmosphere{position:absolute;inset:0;z-index:2;pointer-events:none;background:
  radial-gradient(circle at 76% 16%,rgba(187,100,255,.10),transparent 28%),
  linear-gradient(90deg,rgba(2,5,18,.04) 0%,rgba(2,5,18,.02) 51%,rgba(2,5,18,.40) 69%,rgba(2,4,15,.68) 100%),
  linear-gradient(180deg,rgba(3,6,18,.02),rgba(3,6,18,.15));
}
.menuAtmosphere::before,.menuAtmosphere::after{content:"";position:absolute;border-radius:50%;background:#fff;box-shadow:0 0 8px rgba(196,225,255,.75);opacity:.36;animation:menuTwinkle 3.8s ease-in-out infinite}
.menuAtmosphere::before{width:3px;height:3px;left:47%;top:14%;box-shadow:90px 35px 7px rgba(255,255,255,.55),-102px 94px 6px rgba(180,210,255,.7),165px 160px 8px rgba(220,190,255,.55),-184px 236px 7px rgba(255,255,255,.48),60px 340px 7px rgba(170,215,255,.6)}
.menuAtmosphere::after{width:2px;height:2px;left:58%;top:59%;animation-delay:1.2s;box-shadow:115px -60px 6px rgba(255,255,255,.5),-96px 80px 7px rgba(180,210,255,.55),185px 92px 8px rgba(224,189,255,.48),-245px 45px 6px rgba(255,255,255,.4)}
@keyframes menuTwinkle{0%,100%{opacity:.18;transform:scale(.82)}50%{opacity:.72;transform:scale(1.12)}}
@keyframes menuHeroDrift{0%{transform:scale(1.006) translate3d(0,0,0)}100%{transform:scale(1.018) translate3d(-.18%,.12%,0)}}
.menuLogo{position:absolute;z-index:5;left:2.1%;top:2.4%;width:18.2%;height:auto;max-height:28%;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(0,0,0,.44));user-select:none;-webkit-user-drag:none}
.nightPlanPanel{position:absolute;z-index:8;right:2.25%;top:4.8%;width:36.2%;min-height:90.4%;padding:clamp(16px,1.75vw,28px) clamp(16px,1.85vw,30px) clamp(14px,1.5vw,24px);display:flex;flex-direction:column;justify-content:center;border-radius:clamp(20px,2vw,34px);color:#fff6dd;background:linear-gradient(180deg,rgba(10,15,38,.88),rgba(5,8,28,.93));border:1px solid rgba(255,218,148,.55);box-shadow:inset 0 0 0 2px rgba(87,58,25,.72),inset 0 0 44px rgba(124,76,255,.08),0 22px 65px rgba(0,0,0,.42);backdrop-filter:blur(14px) saturate(1.08)}
.nightPlanPanel::before{content:"";position:absolute;inset:7px;border-radius:calc(clamp(20px,2vw,34px) - 7px);border:1px solid rgba(255,224,161,.16);pointer-events:none}
.nightPlanKicker{align-self:flex-start;margin:0 0 .45rem;padding:.32rem .65rem;border-radius:999px;background:rgba(255,231,175,.10);border:1px solid rgba(255,230,180,.22);color:#f7d999;font-size:clamp(8px,.72vw,11px);font-weight:900;letter-spacing:.14em}
.nightPlanPanel h1{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(24px,2.25vw,40px);line-height:1.02;letter-spacing:-.018em;text-shadow:0 3px 15px rgba(0,0,0,.48)}
.nightPlanLead{margin:.45rem 0 1rem;color:rgba(245,245,255,.72);font-size:clamp(10px,.96vw,15px);font-weight:650}
.nightPlanFieldset{border:0;padding:0;margin:0 0 clamp(11px,1.15vw,18px);min-width:0}
.nightPlanFieldset legend{margin:0 0 .52rem;color:#f9deb0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(13px,1.18vw,19px);font-weight:700}
.nightModeGrid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,.75vw,12px)}
.nightModeCard{position:relative;min-width:0;min-height:clamp(82px,8vw,126px);padding:clamp(9px,.9vw,14px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-radius:clamp(14px,1.2vw,20px);border:1px solid rgba(255,222,166,.28);color:#f7f4ff;background:linear-gradient(180deg,rgba(38,47,93,.72),rgba(12,18,48,.72));box-shadow:inset 0 0 22px rgba(121,181,255,.05),0 8px 20px rgba(0,0,0,.18);cursor:pointer;transition:transform .16s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease}
.nightModeCard:nth-child(2){background:linear-gradient(180deg,rgba(53,37,83,.70),rgba(23,14,48,.78))}
.nightModeCard:active{transform:scale(.975)}
.nightModeCard.selected{border-color:rgba(152,225,255,.90);background:linear-gradient(180deg,rgba(27,106,154,.84),rgba(13,51,92,.82));box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 0 0 2px rgba(118,213,255,.18),0 0 26px rgba(77,182,255,.26),0 9px 24px rgba(0,0,0,.22)}
.nightModeIcon{display:grid;place-items:center;width:clamp(26px,2.4vw,40px);height:clamp(26px,2.4vw,40px);margin-bottom:clamp(4px,.38vw,7px);border-radius:50%;font-size:clamp(18px,1.7vw,28px);color:#ffe0a0;background:rgba(255,225,163,.08);text-shadow:0 0 14px rgba(255,224,128,.6)}
.nightModeCard:nth-child(2) .nightModeIcon{color:#ece4ff;text-shadow:0 0 14px rgba(183,165,255,.62)}
.nightModeTitle{font-family:Georgia,"Times New Roman",serif;font-size:clamp(14px,1.32vw,21px);font-weight:800;line-height:1.05}
.nightModeSub{margin-top:.25rem;color:rgba(255,255,255,.72);font-size:clamp(8px,.78vw,12px);font-weight:650;line-height:1.15}
.alienCountFieldset{margin-bottom:clamp(9px,.85vw,14px)}
.alienCountRow{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(7px,.65vw,11px)}
.alienCountButton{aspect-ratio:1;justify-self:center;width:min(100%,clamp(44px,4.7vw,74px));appearance:none;border-radius:50%;border:1px solid rgba(255,218,151,.40);background:linear-gradient(180deg,rgba(31,28,63,.92),rgba(12,12,36,.96));color:#ffeac1;font-family:Georgia,"Times New Roman",serif;font-size:clamp(17px,1.75vw,29px);font-weight:850;box-shadow:inset 0 0 0 2px rgba(76,43,17,.5),0 7px 18px rgba(0,0,0,.18);cursor:pointer;transition:transform .16s ease,box-shadow .2s ease,border-color .2s ease}
.alienCountButton:active{transform:scale(.95)}
.alienCountButton.selected{color:#fff;border-color:rgba(144,226,255,.96);background:linear-gradient(180deg,rgba(27,142,196,.96),rgba(13,80,128,.96));box-shadow:inset 0 0 0 2px rgba(231,248,255,.22),0 0 0 2px rgba(113,213,255,.16),0 0 24px rgba(59,182,255,.34),0 7px 18px rgba(0,0,0,.22)}
.nightEstimate{display:flex;align-items:center;justify-content:center;gap:.48rem;margin:0 0 clamp(9px,.85vw,13px);padding:.52rem .65rem;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);color:rgba(240,241,255,.78);font-size:clamp(9px,.82vw,13px)}
.nightEstimate span{font-size:1.35em;color:#cfe9ff}.nightEstimate strong{font-weight:760}
.rememberChoiceRow{display:flex;align-items:center;gap:.58rem;margin:0 0 clamp(10px,.95vw,15px);color:rgba(250,250,255,.83);font-size:clamp(9px,.86vw,14px);font-weight:700;cursor:pointer;user-select:none}
.rememberChoiceRow input{position:absolute;opacity:0;pointer-events:none}
.rememberChoiceSwitch{position:relative;width:clamp(34px,3.2vw,50px);height:clamp(19px,1.75vw,28px);border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 2px 7px rgba(0,0,0,.2);transition:background .2s ease}
.rememberChoiceSwitch::after{content:"";position:absolute;top:50%;left:3px;width:calc(clamp(19px,1.75vw,28px) - 6px);height:calc(clamp(19px,1.75vw,28px) - 6px);transform:translateY(-50%);border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.35);transition:left .2s ease,transform .2s ease}
.rememberChoiceRow input:checked + .rememberChoiceSwitch{background:linear-gradient(90deg,#2b91cf,#5cc9ef);border-color:rgba(171,234,255,.62)}
.rememberChoiceRow input:checked + .rememberChoiceSwitch::after{left:calc(100% - clamp(16px,1.45vw,25px))}
.beginTonightButton{position:relative;min-height:clamp(48px,4.3vw,68px);display:flex;align-items:center;justify-content:center;gap:.8rem;border:1px solid rgba(255,223,154,.74);border-radius:999px;color:#fff3cf;background:linear-gradient(180deg,#19814e,#0d5b38);font-family:Georgia,"Times New Roman",serif;font-size:clamp(14px,1.35vw,22px);font-weight:900;letter-spacing:.015em;text-shadow:0 2px 8px rgba(0,0,0,.44);box-shadow:inset 0 0 0 2px rgba(54,31,10,.62),inset 0 1px 10px rgba(255,255,255,.12),0 10px 28px rgba(0,0,0,.28),0 0 20px rgba(57,181,112,.12);cursor:pointer;transition:transform .16s ease,filter .18s ease,box-shadow .2s ease}
.beginTonightButton:active{transform:scale(.982);filter:brightness(.95)}
.beginTonightButton b{font-family:system-ui,sans-serif;font-size:1.45em;line-height:1;font-weight:500}
.nightPlanFootnote{margin:.55rem 0 0;text-align:center;color:rgba(255,255,255,.45);font-size:clamp(7px,.68vw,10px)}
.menuScreen.launching .nightPlanPanel,.menuScreen.launching .menuLogo{opacity:0;transform:translateY(8px);transition:opacity .32s ease,transform .32s ease}
.menuScreen.launching .menuHero{filter:brightness(1.05);transform:scale(1.022);transition:filter .45s ease,transform .55s ease}
.menuScreen:not(.launching) .nightPlanPanel,.menuScreen:not(.launching) .menuLogo{transition:opacity .3s ease,transform .3s ease}
@media(max-width:900px){
  .nightPlanPanel{right:1.6%;top:3.2%;width:38.5%;min-height:93.6%;padding:13px 14px 12px}
  .nightPlanLead{margin-bottom:.62rem}
  .nightPlanFieldset{margin-bottom:9px}
  .menuLogo{width:17%;top:1.6%;left:1.4%}
}
@media(prefers-reduced-motion:reduce){.menuHero,.menuAtmosphere::before,.menuAtmosphere::after{animation:none!important}}

/* ===== Universal Translator: 1980s Bedtime Dodge-O-Matic ===== */
.translatorArcade{position:absolute;inset:0;z-index:9;display:grid;place-items:center;background:radial-gradient(ellipse at center,rgba(18,5,41,.78),rgba(2,2,12,.94));font-family:"Courier New",ui-monospace,monospace;color:#9ffcff;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}
.translatorArcade.hidden{display:none}
.translatorArcadeScanlines{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.22;background:repeating-linear-gradient(180deg,rgba(255,255,255,.08) 0 1px,transparent 1px 4px);mix-blend-mode:screen}
.translatorArcadeCabinet{position:relative;z-index:2;width:min(88%,1120px);height:min(88%,660px);box-sizing:border-box;border:clamp(4px,.7vw,10px) solid #d7983f;border-radius:clamp(15px,2vw,28px);padding:clamp(10px,1.5vw,20px);background:linear-gradient(180deg,#14133a,#050618 74%);box-shadow:0 0 0 4px #552f80,0 0 34px rgba(61,221,255,.32),inset 0 0 40px rgba(44,10,87,.6);display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:clamp(5px,.7vw,10px);overflow:hidden}
.translatorArcadeTopline{display:flex;gap:12px;justify-content:space-between;align-items:center;font-size:clamp(8px,1.05vw,15px);font-weight:800;letter-spacing:.08em;color:#72f6ff;text-shadow:0 0 8px #0ff}
.translatorArcadeTopline b{color:#ffe86a;text-align:right}
.translatorArcadeTitle{text-align:center;font-size:clamp(17px,3.1vw,46px);line-height:1;font-weight:1000;letter-spacing:.06em;color:#ffef66;text-shadow:3px 3px 0 #c225bd,0 0 15px rgba(255,77,240,.65)}
#translatorArcadeCanvas{display:block;width:100%;height:100%;min-height:180px;background:linear-gradient(#090d2b,#141244 60%,#111831 60%);border:3px solid #2df5e8;box-shadow:inset 0 0 22px rgba(36,239,255,.23),0 0 16px rgba(36,239,255,.22);image-rendering:pixelated;cursor:pointer}
.translatorArcadeMessage{text-align:center;min-height:1.25em;font-size:clamp(12px,1.6vw,23px);font-weight:900;letter-spacing:.05em;color:#fff;text-shadow:2px 2px 0 #6d1f9f,0 0 8px rgba(255,255,255,.4)}
.translatorArcadeControls{display:flex;justify-content:space-between;gap:12px;font-size:clamp(8px,1.1vw,15px);font-weight:900;color:#70ff8e;letter-spacing:.06em}
.translatorArcade.overload .translatorArcadeCabinet{animation:translatorArcadeGlitch .13s steps(2,end) infinite}
.translatorArcade.overload #translatorArcadeCanvas{box-shadow:inset 0 0 30px rgba(255,39,194,.5),0 0 24px rgba(255,229,67,.45)}
@keyframes translatorArcadeGlitch{0%{transform:translate(0,0)}25%{transform:translate(2px,-1px)}50%{transform:translate(-2px,1px)}75%{transform:translate(1px,1px)}100%{transform:translate(0,0)}}
@media(max-width:760px){.translatorArcadeCabinet{width:94%;height:91%;padding:8px;border-width:4px}.translatorArcadeTopline{font-size:7px}.translatorArcadeControls{font-size:7px}.translatorArcadeMessage{font-size:10px}.translatorArcadeTitle{font-size:20px}}

/* ===== Final Captain Orion + bedtime pull-back ending ===== */
.finalOrionScreen,.finalGoodnightScreen{background:#02040b;overflow:hidden;z-index:82}
.finalOrionImage,.finalOrionVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
.finalOrionImage{z-index:1;opacity:0;transition:opacity .55s ease}
.finalOrionImage.active{opacity:1}
.finalOrionVideo{z-index:3;opacity:0;background:#02040b;transition:opacity .16s linear}
.finalOrionVideo.visible{opacity:1}
.finalOrionTap{position:absolute;inset:0;z-index:7;border:0;background:transparent;color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;display:flex;align-items:flex-end;justify-content:center;padding:0 0 clamp(28px,5.5vw,84px);font:800 clamp(12px,1.5vw,23px)/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-shadow:0 2px 12px #000}
.finalOrionTap.hidden{display:none}
.finalOrionTap>span:last-child{position:relative;padding:.62rem 1.05rem;border-radius:999px;background:rgba(6,12,35,.62);border:1px solid rgba(205,229,255,.35);box-shadow:0 6px 26px rgba(0,0,0,.34);backdrop-filter:blur(8px)}
.finalOrionTapGlow{position:absolute;right:7.5%;bottom:12%;width:clamp(42px,5vw,82px);height:clamp(42px,5vw,82px);border-radius:50%;border:2px solid rgba(255,222,150,.85);box-shadow:0 0 0 0 rgba(255,219,122,.42);animation:finalOrionPulse 1.7s ease-out infinite}
@keyframes finalOrionPulse{0%{transform:scale(.82);opacity:.95;box-shadow:0 0 0 0 rgba(255,219,122,.42)}75%{transform:scale(1.16);opacity:.3;box-shadow:0 0 0 24px rgba(255,219,122,0)}100%{transform:scale(1.16);opacity:0;box-shadow:0 0 0 24px rgba(255,219,122,0)}}

.finalGoodnightScreen{background:#01030a}
.endingMontage{position:absolute;inset:0;overflow:hidden;background:#01030a}
.endingFrame{position:absolute;inset:-2.5%;width:105%;height:105%;object-fit:cover;object-position:center center;opacity:0;transform:scale(1.045);transition:opacity 1.65s ease;will-change:transform,opacity}
.endingFrame.active{opacity:1}
.endingOrion.active{animation:endingPullOrion 8s linear both}
.endingCrew.active{animation:endingPullCrew 14s linear both}
.endingSocial.active{animation:endingPullSocial 14s linear both}
.endingShip.active{animation:endingDriftShip 19s linear both}
@keyframes endingPullOrion{from{transform:scale(1.055)}to{transform:scale(1.005)}}
@keyframes endingPullCrew{from{transform:scale(1.07)}to{transform:scale(1.005)}}
@keyframes endingPullSocial{from{transform:scale(1.065)}to{transform:scale(1.0)}}
@keyframes endingDriftShip{from{transform:scale(1.04) translate3d(0,0,0)}to{transform:scale(.92) translate3d(1.1%,.45%,0)}}
.endingVignette{position:absolute;inset:0;z-index:5;pointer-events:none;background:radial-gradient(ellipse at center,transparent 48%,rgba(0,4,14,.16) 72%,rgba(0,2,9,.48) 100%);opacity:.75;transition:opacity 2.4s ease,background 2.4s ease}
.finalGoodnightScreen.finalFade .endingVignette{opacity:1;background:rgba(0,2,8,.58)}
.endingGoodnightCard{position:absolute;z-index:8;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:6vw;color:#fff;opacity:1;transition:opacity 2s ease;background:linear-gradient(180deg,rgba(2,5,17,.20),rgba(1,3,10,.64));text-shadow:0 3px 18px rgba(0,0,0,.8)}
.endingGoodnightCard.hidden{display:flex;opacity:0;pointer-events:none}
.endingGoodnightKicker{font:800 clamp(9px,.9vw,14px)/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.19em;color:#ecd99d;margin-bottom:.8rem}
.endingGoodnightCard h1{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(31px,5vw,78px);font-weight:700;letter-spacing:-.025em;color:#ffe4a8}
.endingGoodnightCard p{margin:.65rem 0 1.55rem;font:650 clamp(14px,1.55vw,24px)/1.3 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:rgba(245,246,255,.88)}
.endingMenuButton{appearance:none;border:1px solid rgba(255,225,164,.55);border-radius:999px;padding:.72rem 1.25rem;background:rgba(14,22,49,.72);color:#fff4d4;font:800 clamp(12px,1.15vw,18px)/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;box-shadow:0 8px 28px rgba(0,0,0,.3);backdrop-filter:blur(8px);cursor:pointer;min-height:44px}
.endingMenuButton:active{transform:scale(.98)}
@media(prefers-reduced-motion:reduce){.finalOrionTapGlow,.endingFrame{animation:none!important}.endingFrame{transform:none!important}}


/* Parent escape hatch: always available once an adventure has started. */
.globalSettingsButton{position:absolute;z-index:150;left:50%;top:max(10px,env(safe-area-inset-top));transform:translateX(-50%);display:flex;align-items:center;gap:7px;appearance:none;border:1px solid rgba(255,255,255,.24);border-radius:999px;padding:8px 13px;color:#fff6df;background:rgba(7,7,20,.66);box-shadow:0 8px 26px rgba(0,0,0,.30);backdrop-filter:blur(12px);font-size:clamp(10px,1vw,14px);font-weight:780;letter-spacing:.01em;cursor:pointer;transition:opacity .18s ease,transform .18s ease,background .18s ease}
.globalSettingsButton:hover{background:rgba(16,13,35,.82);transform:translateX(-50%) scale(1.025)}
.globalSettingsButton.hidden{opacity:0;visibility:hidden;pointer-events:none}
.globalSettingsButton span{font-size:1.08em;line-height:1}
.globalSettingsButton b{font-weight:800}
.settingsConfirmOverlay{position:absolute;inset:0;z-index:220;display:grid;place-items:center;padding:5%;background:rgba(2,2,10,.68);backdrop-filter:blur(9px);transition:opacity .18s ease}
.settingsConfirmOverlay.hidden{opacity:0;visibility:hidden;pointer-events:none}
.settingsConfirmCard{width:min(520px,72%);padding:clamp(20px,2.3vw,34px);border-radius:clamp(22px,2.4vw,34px);color:#fff6df;text-align:center;background:linear-gradient(180deg,rgba(15,18,44,.97),rgba(7,9,29,.98));border:1px solid rgba(255,220,151,.48);box-shadow:inset 0 0 0 2px rgba(96,63,27,.52),0 24px 80px rgba(0,0,0,.52)}
.settingsConfirmKicker{margin-bottom:7px;color:#ffd890;font-size:clamp(9px,.85vw,12px);font-weight:900;letter-spacing:.14em}
.settingsConfirmCard h2{margin:0 0 10px;font-family:Georgia,"Times New Roman",serif;font-size:clamp(24px,2.6vw,38px);line-height:1.05}
.settingsConfirmCard p{margin:0 auto;color:rgba(255,246,223,.82);max-width:42ch;font-size:clamp(12px,1.15vw,16px);line-height:1.45}
.settingsConfirmActions{display:flex;justify-content:center;gap:10px;margin-top:22px}
.settingsConfirmActions button{appearance:none;border-radius:999px;padding:11px 18px;font-weight:850;cursor:pointer}
.settingsStayButton{border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.08);color:#fff}
.settingsChangeButton{border:1px solid rgba(255,226,169,.7);background:#fff1ca;color:#24150c;box-shadow:0 7px 24px rgba(255,202,105,.16)}
@media(max-width:760px){.globalSettingsButton{top:max(7px,env(safe-area-inset-top));padding:6px 10px}.settingsConfirmCard{width:min(560px,82%);padding:18px 20px}.settingsConfirmActions button{padding:9px 14px;font-size:11px}}

/* ===== Sep 2026 bedroom usability consistency pass ===== */
/* The dedicated bedtime switch is back for bedrooms only. JS keeps it hidden everywhere else. */
.muddlepopBedtimeSwitch{display:block!important}
.muddlepopBedtimeSwitch.armed{
  border-color:rgba(255,244,191,.98);
  box-shadow:inset 0 0 0 3px rgba(52,31,17,.55),inset 0 0 18px rgba(255,215,131,.28),0 7px 23px rgba(0,0,0,.38),0 0 30px rgba(255,224,128,.42);
  transform:scale(1.035)
}
.muddlepopBedtimeSwitch.armed .bedtimeSwitchLever{animation:switchNudge .62s ease-in-out infinite}
.muddlepopBedtimeSwitch.armed .bedtimeSwitchLabel{letter-spacing:.035em;font-size:clamp(7px,.66vw,11px)}

/* Bedroom hints must never wash over the artwork. A single small sparkle marker is
   shown beside one prop at a time; the actual hitbox remains completely invisible. */
.bedroomTargets .targetHotspot::before{display:none!important}
.bedroomTargets .targetHotspot::after{
  content:"✦"!important;
  position:absolute!important;
  left:auto!important;right:4%!important;top:3%!important;bottom:auto!important;
  width:clamp(14px,1.35vw,21px)!important;height:clamp(14px,1.35vw,21px)!important;
  display:grid!important;place-items:center!important;
  border-radius:50%!important;
  background:rgba(8,8,24,.62)!important;
  border:1px solid rgba(255,249,210,.72)!important;
  color:#fff6bc!important;
  font-size:clamp(10px,1vw,16px)!important;line-height:1!important;
  filter:none!important;mix-blend-mode:normal!important;box-shadow:0 0 10px rgba(255,232,138,.42)!important;
  transform:scale(.72)!important;opacity:0!important
}
.bedroomTargets .targetHotspot.hinting::after{
  opacity:.94!important;
  animation:bedroomHintMarker 1.15s ease-in-out infinite!important
}
.bedroomTargets .targetHotspot:hover::before{opacity:0!important}
@keyframes bedroomHintMarker{
  0%,100%{transform:scale(.72);opacity:.42}
  50%{transform:scale(1.02);opacity:1}
}

/* Hide tiny seed-image pose changes (notably Gigglesnoot and Salmon) with a gentle
   cross-fade after the video's first decoded frame is ready. */
.bedroomRoomScreen .mediaVideo{transition:opacity .22s ease;background:transparent}

/* Orion final-state swaps also fade rather than flashing between still/video states. */
.finalOrionImage,.finalOrionVideo{transition:opacity .22s ease}

/* ===== Sep 22 2026 premium lights-out correction =====
   Bedroom floating switch is retired again. Bedtime is an in-world, deliberate
   two-tap target on the authored room object instead. */
.muddlepopBedtimeSwitch{display:none!important}

/* The one remaining bedtime target is intentionally small. It stays invisible
   until the normal bedroom hint cycle reaches it, then receives a tiny moon cue. */
.bedroomTargets .targetHotspot.bedtimeInWorld::after{content:"☾"!important;color:#e4edff!important;border-color:rgba(179,207,255,.76)!important;background:rgba(7,12,34,.64)!important;box-shadow:0 0 11px rgba(92,144,255,.36)!important}
.bedroomTargets .targetHotspot.bedtimeInWorld.goodnight-armed::after{opacity:1!important;transform:scale(1)!important;animation:bedtimeInWorldConfirm .78s ease-in-out infinite!important;background:rgba(34,26,12,.74)!important;color:#fff1b8!important;border-color:rgba(255,230,155,.88)!important;box-shadow:0 0 16px rgba(255,210,104,.42)!important}
@keyframes bedtimeInWorldConfirm{0%,100%{transform:scale(.82)}50%{transform:scale(1.08)}}

/* Premium lights-out state assets. These are real feathered image overlays generated
   from the original room/corridor/lift artwork, so there is no hard rectangular mask. */
.socialOverviewRoomShade,.crewCorridorDoorShade,.floorRoomShade,.liftFloorStateShade{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:cover!important;object-position:center center!important;pointer-events:none!important;
  opacity:0!important;background:none!important;box-shadow:none!important;border:0!important;border-radius:0!important;
  filter:none!important;transform:none!important;transition:opacity .62s ease!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important
}
.socialOverviewRoomShade::after,.crewCorridorDoorShade::after,.floorRoomShade::after,.liftFloorStateShade::after{display:none!important;content:none!important}
.socialOverviewRoomShade.active,.crewCorridorDoorShade.active,.floorRoomShade.active,.liftFloorStateShade.active{opacity:1!important}
.crewCorridorDoorShade.dormant{opacity:0!important}

/* Lift floor completion is now carried by a feathered copy of the actual button artwork,
   not a dark CSS rectangle. Partial progress keeps only a restrained warm cue. */
.liftFloorHotspot.partial::before,.liftFloorHotspot.complete::before{display:none!important;content:none!important}
.liftFloorHotspot.partial{background:transparent!important;box-shadow:none!important;filter:none!important}
.liftFloorHotspot.partial::after{opacity:.20!important}
.liftFloorHotspot.complete{background:transparent!important;box-shadow:none!important;filter:none!important}
.liftFloorHotspot.complete::after{opacity:0!important}

/* ===== Sep 22 2026 Starhopper settings control =====
   Keep the parent escape hatch accessible but make it feel like part of the ship,
   and move it away from artwork / interaction space at the top of scenes. */
.globalSettingsButton{
  left:auto!important;top:auto!important;
  right:max(14px,env(safe-area-inset-right))!important;
  bottom:max(14px,env(safe-area-inset-bottom))!important;
  transform:none!important;
  min-height:42px;
  display:flex;align-items:center;gap:8px;
  padding:6px 10px 6px 7px!important;
  border-radius:14px!important;
  border:1px solid rgba(118,211,255,.48)!important;
  color:#eefaff!important;
  background:
    linear-gradient(180deg,rgba(34,50,70,.91),rgba(9,17,32,.94))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(0,0,0,.55),
    0 8px 22px rgba(0,0,0,.34),
    0 0 14px rgba(77,183,255,.10)!important;
  backdrop-filter:blur(10px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(10px) saturate(1.08)!important;
  letter-spacing:.08em!important;
  font-size:clamp(8px,.78vw,11px)!important;
  font-weight:900!important;
  overflow:hidden;
}
.globalSettingsButton::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(137,225,255,.72),transparent);
  opacity:.76;pointer-events:none
}
.globalSettingsButton::after{
  content:"";position:absolute;right:7px;top:6px;width:4px;height:4px;border-radius:50%;
  background:#8be9ff;box-shadow:0 0 7px rgba(92,218,255,.9);opacity:.72;pointer-events:none
}
.globalSettingsButton span{
  width:29px;height:29px;display:grid;place-items:center;flex:0 0 auto;
  border-radius:9px;
  border:1px solid rgba(255,213,125,.48);
  color:#ffe3a0;
  background:radial-gradient(circle at 38% 30%,rgba(255,224,151,.20),rgba(25,31,48,.92) 62%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 0 10px rgba(255,187,72,.08);
  font-size:15px!important;text-shadow:0 0 7px rgba(255,198,87,.35)
}
.globalSettingsButton b{font-weight:900!important;white-space:nowrap;padding-right:5px}
.globalSettingsButton:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(142,226,255,.68)!important;
  background:linear-gradient(180deg,rgba(43,64,88,.95),rgba(12,23,42,.97))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 26px rgba(0,0,0,.38),0 0 18px rgba(77,183,255,.16)!important
}
.globalSettingsButton:active{transform:translateY(0) scale(.97)!important}

.settingsConfirmOverlay{
  background:radial-gradient(ellipse at center,rgba(11,24,48,.48),rgba(1,4,13,.82))!important;
  backdrop-filter:blur(10px) saturate(.9)!important;
  -webkit-backdrop-filter:blur(10px) saturate(.9)!important
}
.settingsConfirmCard{
  position:relative;overflow:hidden;
  width:min(560px,76%)!important;
  padding:clamp(27px,2.8vw,40px)!important;
  border-radius:22px!important;
  color:#eefaff!important;
  background:
    radial-gradient(circle at 50% -20%,rgba(54,151,209,.24),transparent 48%),
    linear-gradient(180deg,rgba(24,42,62,.98),rgba(7,15,29,.99))!important;
  border:1px solid rgba(111,205,255,.42)!important;
  box-shadow:
    inset 0 0 0 2px rgba(5,12,25,.75),
    inset 0 1px 0 rgba(255,255,255,.14),
    0 28px 90px rgba(0,0,0,.58),
    0 0 36px rgba(65,174,255,.10)!important
}
.settingsConfirmCard::before{
  content:"";position:absolute;left:16px;right:16px;top:11px;height:3px;border-radius:99px;
  background:linear-gradient(90deg,rgba(255,188,73,.18),rgba(120,221,255,.88),rgba(255,188,73,.18));
  box-shadow:0 0 11px rgba(89,205,255,.28);opacity:.74
}
.settingsConfirmCard::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.15;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,.05) 0,rgba(255,255,255,.05) 1px,transparent 1px,transparent 5px)
}
.settingsConfirmKicker{position:relative;z-index:1;color:#8fddff!important;letter-spacing:.16em!important}
.settingsConfirmCard h2{
  position:relative;z-index:1;
  margin:2px 0 12px!important;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-size:clamp(23px,2.35vw,36px)!important;
  font-weight:900!important;letter-spacing:-.025em!important;color:#f5fbff!important;
  text-shadow:0 0 18px rgba(81,187,255,.10)
}
.settingsConfirmCard p{position:relative;z-index:1;color:rgba(225,240,250,.78)!important}
.settingsConfirmActions{position:relative;z-index:1;margin-top:24px!important;gap:12px!important}
.settingsConfirmActions button{
  min-height:43px;border-radius:13px!important;padding:10px 17px!important;
  letter-spacing:.025em;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease
}
.settingsStayButton{
  border:1px solid rgba(135,198,230,.26)!important;
  background:linear-gradient(180deg,rgba(41,58,76,.72),rgba(17,28,43,.82))!important;
  color:#e8f7ff!important
}
.settingsChangeButton{
  border:1px solid rgba(255,209,117,.62)!important;
  background:linear-gradient(180deg,#ffe5a5,#d99f48)!important;
  color:#27190b!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 7px 22px rgba(224,153,54,.16)!important
}
.settingsConfirmActions button:hover{transform:translateY(-1px)}
.settingsConfirmActions button:active{transform:scale(.98)}

@media(max-width:760px){
  .globalSettingsButton{right:max(9px,env(safe-area-inset-right))!important;bottom:max(9px,env(safe-area-inset-bottom))!important;min-height:38px;padding:5px 8px 5px 6px!important}
  .globalSettingsButton span{width:26px;height:26px;font-size:13px!important;border-radius:8px}
  .globalSettingsButton b{font-size:8px}
  .settingsConfirmCard{width:min(560px,86%)!important;padding:24px 20px!important}
}


/* Seed-to-video polish: Gigglesnoot and Salmon's generated clips return to a frame
   that is extremely close to, but not pixel-identical with, their master bedroom
   stills. A slightly longer optical dissolve makes the tiny pose shift read as a
   cinematic settle rather than a one-frame nudge. */
#gigglesnootRoomScreen .mediaVideo,#salmonRoomScreen .mediaVideo{transition:opacity .34s cubic-bezier(.22,.68,.28,1);will-change:opacity}

/* ===== Compact parent setup for phones / short landscape stages (2026-09-22) =====
   The game intentionally remains a 16:9 landscape canvas. On iPhone portrait the
   canvas is rotated, leaving only ~375–430 CSS px of internal stage height. The
   premium desktop setup panel can be taller than that, so Safari clips its lower
   controls. Keep the same design language but compact the setup form so every
   control remains visible and tappable without scrolling. */
@media (max-height:520px), (orientation:portrait) and (max-width:600px){
  .nightPlanPanel{
    right:1.4%;
    top:2%;
    width:39.2%;
    height:96%;
    min-height:0;
    padding:8px 10px 7px;
    justify-content:center;
    border-radius:16px;
    overflow:hidden;
  }
  .nightPlanPanel::before{inset:4px;border-radius:12px}
  .nightPlanKicker{
    margin:0 0 3px;
    padding:2px 6px;
    font-size:7px;
    line-height:1.1;
    letter-spacing:.12em;
  }
  .nightPlanPanel h1{
    font-size:19px;
    line-height:.98;
    letter-spacing:-.02em;
  }
  .nightPlanLead{
    margin:3px 0 5px;
    font-size:8px;
    line-height:1.15;
  }
  .nightPlanFieldset{margin-bottom:5px}
  .nightPlanFieldset legend{
    margin:0 0 3px;
    font-size:10px;
    line-height:1.05;
  }
  .nightModeGrid{gap:5px}
  .nightModeCard{
    min-height:62px;
    padding:5px 4px;
    border-radius:10px;
  }
  .nightModeIcon{
    width:20px;
    height:20px;
    margin-bottom:2px;
    font-size:14px;
  }
  .nightModeTitle{font-size:12px;line-height:1.02}
  .nightModeSub{margin-top:2px;font-size:6.5px;line-height:1.08}
  .alienCountFieldset{margin-bottom:4px}
  .alienCountRow{gap:5px}
  .alienCountButton{
    width:40px;
    max-width:100%;
    font-size:14px;
    box-shadow:inset 0 0 0 1px rgba(76,43,17,.5),0 4px 10px rgba(0,0,0,.18);
  }
  .nightEstimate{
    gap:4px;
    margin:0 0 4px;
    padding:3px 4px;
    font-size:7px;
    line-height:1.05;
  }
  .nightEstimate span{font-size:1.15em}
  .rememberChoiceRow{
    gap:5px;
    margin:0 0 5px;
    font-size:7px;
    line-height:1.05;
  }
  .rememberChoiceSwitch{width:27px;height:15px}
  .rememberChoiceSwitch::after{
    width:9px;
    height:9px;
  }
  .rememberChoiceRow input:checked + .rememberChoiceSwitch::after{left:14px}
  .beginTonightButton{
    min-height:38px;
    gap:5px;
    font-size:11px;
    border-radius:999px;
  }
  .beginTonightButton b{font-size:1.25em}
  .nightPlanFootnote{
    margin:3px 0 0;
    font-size:6px;
    line-height:1;
  }
  .menuLogo{width:15.5%;top:1.4%;left:1.2%;max-height:24%}
}

/* Very small phones get one final reduction while keeping the main actions at a
   practical tap size. */
@media (orientation:portrait) and (max-width:360px){
  .nightPlanPanel{width:40%;padding:6px 8px 5px}
  .nightPlanPanel h1{font-size:17px}
  .nightPlanLead{display:none}
  .nightModeCard{min-height:56px}
  .alienCountButton{width:36px;font-size:13px}
  .nightEstimate{margin-bottom:3px}
  .rememberChoiceRow{margin-bottom:3px}
  .beginTonightButton{min-height:35px;font-size:10px}
  .nightPlanFootnote{display:none}
}

/* ===== Portrait phone parent-menu hardening (2026-09-22b) =====
   iOS Safari can leave only ~390 CSS px of internal height once our 16:9 stage is
   rotated inside a portrait viewport. Keep the parent setup fully visible without
   scrolling or relying on browser chrome collapsing. */
@media (orientation:portrait) and (max-width:600px){
  #stage{
    width:min(100svh,calc(100vw * 16 / 9));
    height:min(100vw,calc(100svh * 9 / 16));
  }
  .nightPlanPanel{
    box-sizing:border-box;
    right:1.25%;
    top:3%;
    width:40.5%;
    height:94%;
    min-height:0;
    max-height:94%;
    padding:7px 9px 6px;
    justify-content:flex-start;
    overflow:hidden;
    border-radius:15px;
  }
  .nightPlanPanel::before{inset:4px;border-radius:11px}
  .nightPlanKicker{
    margin:0 0 2px;
    padding:2px 5px;
    font-size:6.5px;
    line-height:1;
  }
  .nightPlanPanel h1{
    margin:0 0 2px;
    font-size:18px;
    line-height:.95;
  }
  .nightPlanLead{
    margin:1px 0 4px;
    font-size:7px;
    line-height:1.05;
  }
  .nightPlanFieldset{margin:0 0 4px}
  .nightPlanFieldset legend{
    margin:0 0 2px;
    font-size:9px;
    line-height:1;
  }
  .nightModeGrid{gap:4px}
  .nightModeCard{
    min-height:52px;
    padding:4px 3px;
    border-radius:9px;
  }
  .nightModeIcon{
    width:17px;
    height:17px;
    margin-bottom:1px;
    font-size:11px;
  }
  .nightModeTitle{font-size:10px;line-height:1}
  .nightModeSub{margin-top:1px;font-size:5.5px;line-height:1.03}
  .alienCountFieldset{margin-bottom:3px}
  .alienCountRow{gap:4px}
  .alienCountButton{
    width:34px;
    min-width:0;
    height:34px;
    font-size:12px;
  }
  .nightEstimate{
    gap:3px;
    margin:0 0 3px;
    padding:2px 3px;
    font-size:6.4px;
    line-height:1;
  }
  .rememberChoiceRow{
    gap:4px;
    margin:0 0 3px;
    font-size:6.5px;
    line-height:1;
  }
  .rememberChoiceSwitch{width:24px;height:13px;flex:0 0 24px}
  .rememberChoiceSwitch::after{width:8px;height:8px;top:2px;left:3px}
  .rememberChoiceRow input:checked + .rememberChoiceSwitch::after{left:13px}
  .beginTonightButton{
    min-height:32px;
    height:32px;
    padding:0 9px;
    gap:4px;
    font-size:9px;
    line-height:1;
  }
  .beginTonightButton b{font-size:1.15em}
  .nightPlanFootnote{display:none}
  .menuLogo{width:14.5%;top:1.2%;left:1.1%;max-height:21%}
}

/* Narrow iPhones: keep the actions comfortably inside the rotated game canvas. */
@media (orientation:portrait) and (max-width:390px){
  .nightPlanPanel{width:41.5%;padding:6px 8px 5px}
  .nightPlanKicker{display:none}
  .nightPlanPanel h1{font-size:16px;margin-bottom:2px}
  .nightPlanLead{display:none}
  .nightModeCard{min-height:48px}
  .nightModeTitle{font-size:9.5px}
  .nightModeSub{font-size:5px}
  .alienCountButton{width:31px;height:31px;font-size:11px}
  .nightEstimate{font-size:6px}
  .rememberChoiceRow{font-size:6px}
  .beginTonightButton{height:30px;min-height:30px;font-size:8.5px}
}

/* ===== Entitlement foundation + child-first main menu (2026-09-22) ===== */
.menuScreen{overflow:hidden}
.menuScreen .menuHero{filter:saturate(1.02) brightness(.96)}
.menuScreen .menuAtmosphere{background:
  radial-gradient(circle at 77% 20%,rgba(187,100,255,.08),transparent 29%),
  linear-gradient(90deg,rgba(1,4,15,.02) 0%,rgba(1,4,15,.01) 52%,rgba(3,5,20,.18) 72%,rgba(3,5,20,.36) 100%),
  linear-gradient(180deg,rgba(2,5,16,.01),rgba(2,5,16,.12));
}
.menuLogo{left:2.1%;top:2.1%;width:13.5%;max-height:22%;z-index:8;filter:drop-shadow(0 7px 16px rgba(0,0,0,.52))}
.menuTitleBlock{position:absolute;z-index:8;right:4.2%;top:11.5%;width:38%;text-align:center;pointer-events:none;filter:drop-shadow(0 10px 24px rgba(0,0,0,.42))}
.menuTitleTop,.menuTitleBottom{font-family:Georgia,"Times New Roman",serif;font-weight:900;line-height:.86;letter-spacing:-.045em;-webkit-text-stroke:1px rgba(77,37,13,.58);text-shadow:0 2px 0 #6e3617,0 4px 0 #3e1d0d,0 0 16px rgba(255,184,68,.42),0 8px 24px rgba(0,0,0,.55)}
.menuTitleTop{font-size:clamp(42px,5.9vw,96px);color:#ffd991}
.menuTitleBottom{margin-top:.07em;font-size:clamp(56px,7.4vw,122px);color:#cddcff;text-shadow:0 2px 0 #7a5527,0 4px 0 #3e1d0d,0 0 18px rgba(124,186,255,.50),0 8px 26px rgba(0,0,0,.55)}
.menuTagline{margin-top:clamp(14px,1.5vw,25px);font-family:Georgia,"Times New Roman",serif;font-size:clamp(14px,1.55vw,25px);font-weight:800;color:#ffe4ad;letter-spacing:.015em;text-shadow:0 2px 8px rgba(0,0,0,.74)}
.menuStartButton{position:absolute;z-index:10;right:5.4%;top:61.5%;width:35%;height:clamp(62px,8vw,116px);display:flex;align-items:center;justify-content:center;gap:clamp(8px,1vw,16px);appearance:none;border:clamp(3px,.35vw,6px) solid #8b4b1e;border-radius:clamp(18px,2vw,31px);color:#49220d;background:linear-gradient(180deg,#fff1b6 0%,#ffd46f 52%,#f0a73c 100%);box-shadow:inset 0 0 0 3px rgba(255,242,187,.55),inset 0 -8px 20px rgba(145,72,16,.16),0 0 0 3px rgba(55,26,11,.66),0 12px 32px rgba(0,0,0,.36),0 0 22px rgba(255,188,65,.22);font-family:Georgia,"Times New Roman",serif;font-size:clamp(18px,2.15vw,35px);font-weight:950;text-shadow:0 1px 0 rgba(255,255,255,.5);cursor:pointer;transition:transform .15s ease,filter .18s ease}
.menuStartButton span{color:#b16b1f;font-size:.82em;text-shadow:0 1px 7px rgba(255,230,138,.85)}
.menuStartButton:active{transform:scale(.982);filter:brightness(.96)}
.menuGrownUpsButton{position:absolute;z-index:10;right:4.4%;bottom:5.6%;min-width:18%;height:clamp(43px,4.7vw,70px);display:flex;align-items:center;justify-content:center;gap:.55em;appearance:none;border:2px solid #7f4a22;border-radius:999px;color:#ffe7b0;background:linear-gradient(180deg,rgba(90,52,27,.97),rgba(44,25,18,.98));box-shadow:inset 0 0 0 2px rgba(255,207,119,.18),0 7px 20px rgba(0,0,0,.34);font-family:Georgia,"Times New Roman",serif;font-size:clamp(12px,1.35vw,21px);font-weight:900;cursor:pointer}
.menuGrownUpsButton span{font-family:system-ui,sans-serif;font-size:1.25em;color:#ffe1a1}
.menuGrownUpsButton:active{transform:scale(.98)}
.menuScreen.launching .menuTitleBlock,.menuScreen.launching .menuStartButton,.menuScreen.launching .menuGrownUpsButton,.menuScreen.launching .menuLogo{opacity:0;transform:translateY(8px);transition:opacity .32s ease,transform .32s ease}
.menuScreen:not(.launching) .menuTitleBlock,.menuScreen:not(.launching) .menuStartButton,.menuScreen:not(.launching) .menuGrownUpsButton,.menuScreen:not(.launching) .menuLogo{transition:opacity .3s ease,transform .3s ease}

.parentGateOverlay,.grownUpsOverlay{position:absolute;inset:0;z-index:220;display:grid;place-items:center;background:rgba(1,3,12,.74);backdrop-filter:blur(8px) brightness(.82);-webkit-backdrop-filter:blur(8px) brightness(.82)}
.parentGateCard,.grownUpsCard{position:relative;color:#fff1cc;background:linear-gradient(180deg,rgba(22,21,39,.98),rgba(8,10,27,.985));border:2px solid rgba(210,142,61,.78);box-shadow:inset 0 0 0 3px rgba(65,35,16,.78),inset 0 0 40px rgba(98,67,170,.08),0 22px 70px rgba(0,0,0,.58)}
.parentGateCard{width:min(52%,620px);padding:clamp(24px,3vw,46px);border-radius:clamp(20px,2vw,32px);text-align:center}
.parentGateCard h2,.grownUpsCard h2{margin:.2em 0 .35em;font-family:Georgia,"Times New Roman",serif;color:#ffe1a1}
.parentGateCard h2{font-size:clamp(24px,2.5vw,42px)}
.parentGateCard p{margin:.2em auto 1.25em;max-width:34em;color:rgba(255,255,255,.76);font-size:clamp(11px,1.05vw,16px)}
.parentGateKicker{color:#e8bd73;font-size:clamp(8px,.75vw,12px);font-weight:950;letter-spacing:.15em}
.parentCloseButton{position:absolute;z-index:4;right:12px;top:10px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,219,153,.32);color:#ffe3ad;background:rgba(58,35,23,.82);font-size:25px;line-height:1;cursor:pointer}
.parentHoldButton{position:relative;isolation:isolate;overflow:hidden;width:min(84%,420px);height:clamp(54px,5vw,78px);border-radius:999px;border:2px solid #b97830;color:#fff0c9;background:linear-gradient(180deg,#6d3c1d,#351f17);font-family:Georgia,"Times New Roman",serif;font-size:clamp(14px,1.3vw,21px);font-weight:900;box-shadow:inset 0 0 0 2px rgba(255,217,146,.12),0 7px 20px rgba(0,0,0,.35);touch-action:none;user-select:none;-webkit-user-select:none}
.parentHoldProgress{position:absolute;z-index:-1;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,rgba(222,150,55,.34),rgba(255,209,109,.62));transition:width .08s linear}
.parentHoldButton.holding .parentHoldProgress{width:100%;transition:width 2.2s linear}

.grownUpsCard{width:min(92%,1120px);max-height:92%;overflow:auto;padding:clamp(18px,2vw,30px);border-radius:clamp(18px,2vw,30px)}
.grownUpsHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding-right:46px}
.grownUpsHeader h2{font-size:clamp(24px,2.6vw,42px)}
.accessBadge{align-self:center;padding:.55em .9em;border-radius:999px;border:1px solid rgba(255,215,132,.5);background:rgba(85,50,23,.72);color:#ffe6ad;font-size:clamp(10px,.9vw,14px);font-weight:950;letter-spacing:.08em;white-space:nowrap}
.accessSection{margin-top:clamp(10px,1.2vw,18px)}
.accessSection h3{margin:0 0 .55em;font-family:Georgia,"Times New Roman",serif;font-size:clamp(15px,1.4vw,22px);color:#f8ddb0}
.accessTierGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,.8vw,13px)}
.accessTierCard{min-height:82px;padding:clamp(10px,1vw,15px);display:flex;flex-direction:column;justify-content:center;border-radius:16px;border:1px solid rgba(255,220,155,.20);background:linear-gradient(180deg,rgba(39,43,77,.66),rgba(17,20,46,.78));box-shadow:inset 0 0 18px rgba(120,176,255,.03)}
.accessTierCard strong{font-family:Georgia,"Times New Roman",serif;font-size:clamp(13px,1.25vw,20px);color:#fff0c8}
.accessTierCard span{margin-top:.3em;color:rgba(255,255,255,.66);font-size:clamp(8px,.76vw,12px);line-height:1.2}
.accessTierCard.current{border-color:rgba(255,208,111,.9);background:linear-gradient(180deg,rgba(111,70,27,.88),rgba(54,34,23,.90));box-shadow:inset 0 0 0 2px rgba(255,218,143,.12),0 0 24px rgba(255,180,63,.14)}
.accessTierCard.included{border-color:rgba(128,203,255,.34)}
.accessFoundationNote{margin:.55em 0 0;color:rgba(255,255,255,.50);font-size:clamp(8px,.72vw,11px)}

.grownUpsPlan.nightPlanPanel{position:relative;right:auto;top:auto;width:auto;min-height:0;margin-top:clamp(12px,1.2vw,18px);padding:clamp(12px,1.25vw,18px);display:grid;grid-template-columns:1.4fr 1fr;column-gap:clamp(12px,1.2vw,18px);row-gap:8px;border-radius:18px;background:linear-gradient(180deg,rgba(8,14,36,.70),rgba(5,9,26,.84));border:1px solid rgba(255,218,148,.26);box-shadow:inset 0 0 0 1px rgba(87,58,25,.34)}
.grownUpsPlan.nightPlanPanel::before{display:none}
.grownUpsPlan .nightPlanKicker{grid-column:1/-1;margin-bottom:0}
.grownUpsPlan .nightPlanFieldset{margin:0}
.grownUpsPlan .alienCountRow{grid-template-columns:repeat(5,1fr)}
.grownUpsPlan .nightEstimate,.grownUpsPlan .rememberChoiceRow{margin:0}
.grownUpsPlan .nightEstimate{align-self:center}
.grownUpsPlan .rememberChoiceRow{align-self:center}
.alienCountButton:disabled{opacity:.28;filter:saturate(.4);cursor:not-allowed;box-shadow:none}
.saveGrownUpsButton{grid-column:1/-1;min-height:44px;border-radius:999px;border:1px solid rgba(255,218,139,.55);background:linear-gradient(180deg,#a86b2c,#663817);color:#fff0c7;font-family:Georgia,"Times New Roman",serif;font-size:clamp(12px,1.1vw,17px);font-weight:900;cursor:pointer}

.qaAccessPanel{margin-top:12px;padding:11px 13px;border-radius:14px;border:1px dashed rgba(112,218,255,.42);background:rgba(9,46,68,.28)}
.qaAccessHead{display:flex;align-items:center;justify-content:space-between;color:#bceeff;font-size:11px;letter-spacing:.08em}.qaAccessHead span{font-size:9px;color:rgba(255,255,255,.50)}
.qaAccessButtons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}.qaAccessButtons button{min-height:38px;border-radius:10px;border:1px solid rgba(145,222,255,.3);background:rgba(10,44,71,.72);color:#dff7ff;font-weight:900;cursor:pointer}.qaAccessButtons button.current{background:linear-gradient(180deg,#2989ae,#125675);border-color:#9ce8ff;box-shadow:0 0 15px rgba(94,210,255,.18)}
.qaAccessPanel p{margin:7px 0 0;color:rgba(255,255,255,.52);font-size:9px}

.accessMessage{position:absolute;z-index:205;left:50%;bottom:8%;transform:translate(-50%,12px);max-width:76%;padding:clamp(9px,1vw,15px) clamp(15px,1.7vw,26px);border-radius:999px;border:1px solid rgba(255,222,157,.48);background:linear-gradient(180deg,rgba(70,43,24,.94),rgba(31,21,22,.96));color:#fff0ca;font-family:Georgia,"Times New Roman",serif;font-size:clamp(11px,1.05vw,16px);font-weight:850;text-align:center;text-shadow:0 2px 6px rgba(0,0,0,.5);box-shadow:0 10px 28px rgba(0,0,0,.35),inset 0 0 0 2px rgba(255,209,132,.08);opacity:0;transition:opacity .2s ease,transform .2s ease;pointer-events:none}
.accessMessage.visible{opacity:1;transform:translate(-50%,0)}

/* Unavailable tonight is deliberately distinct from the existing dark/asleep state. */
.liftFloorHotspot.access-locked{background:linear-gradient(180deg,rgba(87,52,15,.16),rgba(40,26,14,.34));box-shadow:inset 0 0 0 1px rgba(255,212,122,.18),inset 0 0 26px rgba(139,87,22,.14)}
.liftFloorHotspot.access-locked::before{content:"✦";position:absolute;z-index:3;right:6%;top:8%;display:grid;place-items:center;width:9%;aspect-ratio:1;border-radius:50%;color:#ffe29b;background:rgba(59,36,12,.78);border:1px solid rgba(255,210,118,.52);font-size:clamp(10px,1.45vw,20px);box-shadow:0 0 16px rgba(255,180,55,.16)}
.liftFloorHotspot.access-locked::after{opacity:.16;transform:scale(1);background:radial-gradient(ellipse at center,rgba(255,229,159,.12),rgba(160,104,35,.08) 50%,transparent 78%)}
.socialRoomDoor.access-locked,.roomHotspot.access-locked{background:linear-gradient(180deg,rgba(88,54,19,.12),rgba(28,20,20,.34));box-shadow:inset 0 0 0 1px rgba(255,220,145,.13),inset 0 0 30px rgba(106,68,25,.13);filter:saturate(.82) brightness(.94)}
.socialRoomDoor.access-locked::before,.roomHotspot.access-locked::before{content:"✦";position:absolute;z-index:3;right:8%;top:7%;display:grid;place-items:center;width:12%;aspect-ratio:1;border-radius:50%;color:#ffe4a1;background:rgba(60,38,16,.76);border:1px solid rgba(255,216,130,.46);font-size:clamp(9px,1.2vw,17px);box-shadow:0 0 14px rgba(255,184,61,.13)}
.socialRoomDoor.access-locked.quiet::before,.roomHotspot.access-locked.quiet::before{content:"✦";color:#ffe4a1;background:rgba(60,38,16,.76);border-color:rgba(255,216,130,.46)}
.crewCorridorDoorHotspot.access-locked{background:linear-gradient(180deg,rgba(102,62,21,.13),rgba(38,25,22,.32));box-shadow:inset 0 0 0 1px rgba(255,220,142,.12),inset 0 0 24px rgba(116,74,25,.12)}
.crewCorridorDoorHotspot.access-locked::before{opacity:.32;transform:scale(1);background:radial-gradient(ellipse at center,rgba(255,224,148,.16),rgba(173,108,37,.08) 48%,transparent 74%)}
.crewCorridorDoorHotspot.access-locked::after{content:"✦";position:absolute;z-index:3;right:5%;top:5%;display:grid;place-items:center;width:24%;aspect-ratio:1;border-radius:50%;color:#ffe4a1;background:rgba(60,38,16,.82);border:1px solid rgba(255,216,130,.48);font-size:clamp(8px,.9vw,14px);box-shadow:0 0 12px rgba(255,184,61,.13)}
.crewCorridorDoorShade.entitlementLocked{opacity:.05!important;filter:sepia(.18) brightness(.98) saturate(.88)!important}
.access-nudge{animation:accessNudge .42s ease-out}
@keyframes accessNudge{0%{transform:scale(1)}35%{transform:scale(1.025)}70%{transform:scale(.992)}100%{transform:scale(1)}}

@media(max-height:560px){
  .menuTitleBlock{top:8.5%;right:3.5%;width:39%}.menuTitleTop{font-size:clamp(30px,5.2vw,70px)}.menuTitleBottom{font-size:clamp(40px,6.4vw,88px)}.menuTagline{margin-top:8px;font-size:clamp(10px,1.25vw,17px)}
  .menuStartButton{top:59%;right:4.4%;width:37%;height:54px;font-size:16px}.menuGrownUpsButton{bottom:4%;height:38px;font-size:10px}
  .grownUpsCard{max-height:96%;padding:12px 14px}.accessTierCard{min-height:56px}.grownUpsPlan.nightPlanPanel{padding:8px;row-gap:4px}.grownUpsPlan .nightModeCard{min-height:50px}.grownUpsPlan .alienCountButton{width:34px;height:34px}.saveGrownUpsButton{min-height:34px}
}
@media (orientation:portrait) and (max-width:600px){
  .menuLogo{width:12%;top:1%;left:1%}.menuTitleBlock{right:3%;top:8%;width:40%}.menuStartButton{right:4%;top:59%;width:38%;height:44px;font-size:12px}.menuGrownUpsButton{right:3%;bottom:4%;height:32px;font-size:8px}
  .grownUpsCard{width:95%;max-height:96%;padding:9px 11px}.grownUpsHeader h2{font-size:16px}.accessTierCard{min-height:45px;padding:6px}.accessTierCard strong{font-size:9px}.accessTierCard span{font-size:5.5px}.accessFoundationNote{font-size:5.5px}.grownUpsPlan.nightPlanPanel{grid-template-columns:1.4fr 1fr;padding:6px;gap:4px}.grownUpsPlan .nightPlanKicker{font-size:6px}.grownUpsPlan .nightPlanFieldset legend{font-size:8px}.grownUpsPlan .nightModeCard{min-height:42px}.grownUpsPlan .nightModeTitle{font-size:8px}.grownUpsPlan .nightModeSub{font-size:5px}.grownUpsPlan .alienCountButton{width:28px;height:28px;font-size:10px}.grownUpsPlan .nightEstimate,.grownUpsPlan .rememberChoiceRow{font-size:5.5px}.saveGrownUpsButton{min-height:28px;font-size:8px}.qaAccessPanel{padding:5px}.qaAccessButtons button{min-height:27px;font-size:8px}.parentGateCard{width:58%;padding:14px}.parentHoldButton{height:42px;font-size:9px}.parentCloseButton{width:28px;height:28px;font-size:18px}
}
/* Explicit visibility rules for entitlement overlays. The legacy stylesheet only
   defined .hidden on individual controls, so these new panels need their own. */
.parentGateOverlay.hidden,.grownUpsOverlay.hidden,.qaAccessPanel.hidden{display:none}
.accessMessage.hidden{display:none}


.supabaseAccessPanel{margin-top:14px;padding:14px 14px 12px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(7,10,26,.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.supabaseHelp{margin:8px 0 12px;font-size:.92rem;line-height:1.45;color:rgba(236,240,255,.84)}
.supabaseAccessRow{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.supabaseEmailInput{width:100%;min-width:0;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(9,12,29,.82);color:#fff;font:inherit;outline:none;box-sizing:border-box}
.supabaseEmailInput::placeholder{color:rgba(229,235,255,.48)}
.supabaseEmailInput:focus{border-color:rgba(158,211,255,.7);box-shadow:0 0 0 3px rgba(127,190,255,.18)}
.supabaseSendLinkButton{width:100%}
.supabaseActionRow{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.supabaseSecondaryButton{appearance:none;border:none;border-radius:999px;padding:10px 16px;background:rgba(255,255,255,.12);color:#fff;font:inherit;font-weight:700;letter-spacing:.02em;cursor:pointer}
.supabaseSecondaryButton:disabled,.supabaseSendLinkButton:disabled{opacity:.55;cursor:not-allowed}
.supabaseStatus{margin:10px 0 0;font-size:.9rem;line-height:1.45;color:rgba(232,238,255,.88)}
.supabaseStatus[data-tone="error"]{color:#ffd4d4}
.supabaseStatus[data-tone="success"]{color:#dfffd6}
@media (min-width:760px){.supabaseAccessRow{grid-template-columns:minmax(0,1fr) auto}.supabaseSendLinkButton{width:auto}}

/* ===== Sep 22 2026 entitlement mapping correction =====
   Locked content now reuses the same exact feathered state artwork as the proven
   lights-off/completed mapping. Tap targets stay invisible and generous; there are
   no rectangular gold/brown blocks drawn over premium room artwork. */
.socialOverviewRoomShade.entitlementLocked,
.floorRoomShade.entitlementLocked,
.liftFloorStateShade.entitlementLocked,
.crewCorridorDoorShade.entitlementLocked{opacity:1!important;filter:none!important;transform:none!important}

.liftFloorHotspot.access-locked,
.socialRoomDoor.access-locked,
.roomHotspot.access-locked,
.crewCorridorDoorHotspot.access-locked{
  background:transparent!important;
  box-shadow:none!important;
  filter:none!important;
  border-color:transparent!important
}
.liftFloorHotspot.access-locked::before,
.liftFloorHotspot.access-locked::after,
.socialRoomDoor.access-locked::before,
.socialRoomDoor.access-locked::after,
.roomHotspot.access-locked::before,
.roomHotspot.access-locked::after,
.crewCorridorDoorHotspot.access-locked::before,
.crewCorridorDoorHotspot.access-locked::after{
  display:none!important;
  content:none!important;
  opacity:0!important;
  background:none!important;
  box-shadow:none!important
}
\n\n/* ===== Sep 23 2026 final consolidation patch ===== */\n.supabaseCodeRow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;margin-top:9px}\n.supabaseOtpInput{min-width:0;border:1px solid rgba(169,218,255,.34);border-radius:12px;padding:11px 12px;background:rgba(4,11,28,.78);color:#fff;font:800 16px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.14em;text-align:center;outline:none}\n.supabaseOtpInput::placeholder{color:rgba(224,240,255,.44);letter-spacing:.02em;font-weight:650}\n.supabaseOtpInput:focus{border-color:rgba(123,219,255,.82);box-shadow:0 0 0 3px rgba(73,190,255,.12)}\n.supabaseVerifyCodeButton{min-width:150px;padding-inline:16px!important}\n\n/* Parent settings no longer lives over active room play. It appears only on navigation screens. */\n.globalSettingsButton{\n  left:auto!important;top:auto!important;right:max(8px,env(safe-area-inset-right))!important;bottom:max(8px,env(safe-area-inset-bottom))!important;\n  width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;padding:0!important;\n  display:grid!important;place-items:center!important;border-radius:50%!important;gap:0!important;overflow:visible!important;\n  color:#eaf8ff!important;background:rgba(7,16,31,.56)!important;border:1px solid rgba(133,213,255,.35)!important;\n  box-shadow:0 5px 16px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,255,255,.05)!important;\n  opacity:.48;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;\n  transition:opacity .18s ease,transform .18s ease,background .18s ease!important\n}\n.globalSettingsButton::before,.globalSettingsButton::after{display:none!important;content:none!important}\n.globalSettingsButton svg{width:17px;height:17px;display:block;fill:currentColor;filter:drop-shadow(0 0 5px rgba(103,205,255,.22))}\n.globalSettingsButton:hover,.globalSettingsButton:focus-visible{opacity:.96;transform:scale(1.06)!important;background:rgba(12,28,50,.84)!important}\n.globalSettingsButton:active{opacity:1;transform:scale(.94)!important}\n.globalSettingsButton b,.globalSettingsButton>span:not(.settingsSrText){display:none!important}\n.settingsSrText{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}\n\n/* Make Muddlepop's actual colourful brand visible rather than reading as a tiny dark badge. */\n.menuLogo{left:1.4%!important;top:1.2%!important;width:18.5%!important;max-height:30%!important;filter:saturate(1.16) brightness(1.07) drop-shadow(0 8px 20px rgba(0,0,0,.46))!important}\n\n@media(max-width:760px){\n  .supabaseCodeRow{grid-template-columns:minmax(0,1fr) auto;gap:6px;margin-top:6px}\n  .supabaseOtpInput{padding:8px 9px;font-size:12px;border-radius:9px}\n  .supabaseVerifyCodeButton{min-width:118px!important;padding-inline:9px!important;font-size:8px!important}\n  .globalSettingsButton{right:max(6px,env(safe-area-inset-right))!important;bottom:max(6px,env(safe-area-inset-bottom))!important;width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important}\n  .globalSettingsButton svg{width:15px;height:15px}\n  .menuLogo{width:16.5%!important;top:.8%!important;left:.8%!important;max-height:27%!important}\n}\n\n\n/* ===== Sep 23 2026 Social Room polish ===== */\n/* All social-room discoverable props use the same tiny white locator dot.\n   Character zones remain invisible; Ana tells the child that aliens can be tapped. */\n#kitchenTargets .targetHotspot:not(.characterCycleFallback)::before,\n#diningTargets .targetHotspot:not(.characterCycleFallback)::before,\n#tvTargets .targetHotspot:not(.characterCycleFallback)::before,\n#bubbleTargets .targetHotspot:not(.characterCycleFallback)::before,\n#playTargets .targetHotspot:not(.characterCycleFallback)::before,\n#greenhouseTargets .targetHotspot:not(.characterCycleFallback)::before,\n#musicTargets .targetHotspot:not(.characterCycleFallback)::before,\n#workshopTargets .targetHotspot:not(.characterCycleFallback)::before,\n#crystalTargets .targetHotspot:not(.characterCycleFallback)::before,\n#engineTargets .targetHotspot:not(.characterCycleFallback)::before{display:none!important}\n\n#kitchenTargets .targetHotspot:not(.characterCycleFallback)::after,\n#diningTargets .targetHotspot:not(.characterCycleFallback)::after,\n#tvTargets .targetHotspot:not(.characterCycleFallback)::after,\n#bubbleTargets .targetHotspot:not(.characterCycleFallback)::after,\n#playTargets .targetHotspot:not(.characterCycleFallback)::after,\n#greenhouseTargets .targetHotspot:not(.characterCycleFallback)::after,\n#musicTargets .targetHotspot:not(.characterCycleFallback)::after,\n#workshopTargets .targetHotspot:not(.characterCycleFallback)::after,\n#crystalTargets .targetHotspot:not(.characterCycleFallback)::after,\n#engineTargets .targetHotspot:not(.characterCycleFallback)::after{\n  content:""!important;position:absolute!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;\n  width:clamp(7px,.72vw,11px)!important;height:clamp(7px,.72vw,11px)!important;border-radius:50%!important;\n  background:#fff!important;border:1px solid rgba(255,255,255,.94)!important;box-shadow:0 0 8px 2px rgba(255,255,255,.62),0 0 14px 4px rgba(138,215,255,.20)!important;\n  transform:translate(-50%,-50%) scale(.55)!important;opacity:0!important;filter:none!important;mix-blend-mode:normal!important;\n}\n\n#kitchenTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,\n#diningTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,\n#tvTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,\n#bubbleTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,\n#playTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,\n#greenhouseTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,\n#musicTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,\n#workshopTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,\n#crystalTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,\n#engineTargets .targetHotspot.hinting:not([data-no-hint="1"])::after{\n  opacity:.96!important;animation:socialHintDot 1.05s ease-in-out infinite!important\n}\n@keyframes socialHintDot{0%,100%{transform:translate(-50%,-50%) scale(.62);opacity:.38}50%{transform:translate(-50%,-50%) scale(1.05);opacity:1}}\n\n/* Idle clips are only revealed after a decoded frame exists; remove the extra opacity\n   crossfade so AVIF -> idle is visually seamless rather than a tiny dissolve. */\n.socialIdleVideo{transition:none!important;background:transparent!important}\n\n/* Spaceship-style room exit control: compact illuminated hatch-arrow rather than a\n   generic circular phone back button. Existing aria-labels remain unchanged. */\n.backButton{\n  width:clamp(54px,5.5vw,76px)!important;height:clamp(38px,4vw,52px)!important;border-radius:12px!important;\n  clip-path:polygon(10% 0,90% 0,100% 22%,100% 78%,90% 100%,10% 100%,0 78%,0 22%);\n  background:linear-gradient(180deg,rgba(14,31,48,.92),rgba(5,11,22,.92))!important;\n  border:1px solid rgba(143,229,255,.58)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 0 14px rgba(78,198,255,.16),0 8px 22px rgba(0,0,0,.32)!important;\n  color:transparent!important;font-size:0!important;overflow:visible!important\n}\n.backButton::before{\n  content:"";position:absolute;left:50%;top:50%;width:18px;height:12px;transform:translate(-38%,-50%);\n  border-left:3px solid #dff8ff;border-bottom:3px solid #dff8ff;rotate:45deg;filter:drop-shadow(0 0 4px rgba(116,221,255,.72))\n}\n.backButton::after{\n  content:"";position:absolute;left:48%;top:50%;width:19px;height:3px;border-radius:3px;background:#dff8ff;transform:translate(-8%,-50%);\n  box-shadow:0 0 5px rgba(116,221,255,.62)\n}\n.backButton:active{transform:scale(.95)}\n@media(max-width:760px){.backButton{width:52px!important;height:38px!important;border-radius:10px!important}}\n\n\n/* ===== Sep 23 2026 unified Social + Bedroom interaction language ===== */\n/* Bedroom prop hints now use the exact same compact white locator dot as Social Rooms.\n   Character hit zones stay visually invisible; Ana's rotating follow-up prompt teaches\n   the child that aliens themselves can be tapped. The moon remains the one deliberate\n   exception because it means BEDTIME rather than a normal interaction. */\n.bedroomTargets .targetHotspot::before{display:none!important}\n.bedroomTargets .targetHotspot::after{\n  content:""!important;position:absolute!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;\n  width:clamp(7px,.72vw,11px)!important;height:clamp(7px,.72vw,11px)!important;display:block!important;border-radius:50%!important;\n  background:#fff!important;border:1px solid rgba(255,255,255,.94)!important;box-shadow:0 0 8px 2px rgba(255,255,255,.62),0 0 14px 4px rgba(138,215,255,.20)!important;\n  color:transparent!important;font-size:0!important;filter:none!important;mix-blend-mode:normal!important;\n  transform:translate(-50%,-50%) scale(.55)!important;opacity:0!important\n}\n.bedroomTargets .targetHotspot[data-no-hint="1"]::after{display:none!important}\n.bedroomTargets .targetHotspot.hinting:not([data-no-hint="1"])::after{\n  opacity:.96!important;animation:socialHintDot 1.05s ease-in-out infinite!important\n}\n.bedroomTargets .targetHotspot.bedtimeInWorld::after{\n  display:grid!important;place-items:center!important;content:"☾"!important;color:#e4edff!important;font-size:clamp(10px,1vw,16px)!important;\n  background:rgba(7,12,34,.64)!important;border-color:rgba(179,207,255,.76)!important;box-shadow:0 0 11px rgba(92,144,255,.36)!important\n}\n.bedroomTargets .targetHotspot.bedtimeInWorld.goodnight-armed::after{\n  opacity:1!important;transform:translate(-50%,-50%) scale(1)!important;animation:bedtimeInWorldConfirmUnified .78s ease-in-out infinite!important;\n  background:rgba(34,26,12,.74)!important;color:#fff1b8!important;border-color:rgba(255,230,155,.88)!important;box-shadow:0 0 16px rgba(255,210,104,.42)!important\n}\n@keyframes bedtimeInWorldConfirmUnified{\n  0%,100%{transform:translate(-50%,-50%) scale(.82)}\n  50%{transform:translate(-50%,-50%) scale(1.08)}\n}\n/* Bedroom idle videos switch in like Social Room idles: no tiny AVIF -> idle dissolve.\n   Interaction clips still keep their short fade-out back to the exact seed still. */\n.bedroomIdleVideo{transition:none!important;background:transparent!important}\n

/* ===== Sep 23 2026 menu + first-frame interaction pass ===== */

/* Colour-first main menu: preserve the full supplied hero artwork while filling
   16:9 phones/tablets with a softly blurred copy behind it. */
.menuHeroBackdrop{
  z-index:1!important;object-fit:cover!important;filter:blur(24px) brightness(.62) saturate(1.22)!important;
  transform:scale(1.08)!important;opacity:.96!important;animation:none!important
}
.menuHeroColour{
  z-index:2!important;object-fit:contain!important;object-position:center center!important;
  transform:none!important;animation:none!important;filter:saturate(1.04) brightness(1.01)!important
}
.menuAtmosphere{z-index:3!important;background:linear-gradient(90deg,rgba(3,5,18,.10),transparent 28%,transparent 74%,rgba(4,3,16,.16))!important}
.menuLogo,.menuTitleBlock{display:none!important}
.menuStartButton{
  right:6%!important;top:auto!important;bottom:8.2%!important;width:34%!important;height:clamp(58px,6.8vw,96px)!important;
  border-color:#6d3514!important;background:linear-gradient(180deg,#fff8ca,#ffd85f 52%,#ef9f31)!important;
  box-shadow:inset 0 0 0 3px rgba(255,250,206,.62),inset 0 -8px 20px rgba(145,72,16,.18),0 0 0 3px rgba(55,26,11,.66),0 12px 34px rgba(0,0,0,.40),0 0 28px rgba(255,181,48,.30)!important
}
.menuGrownUpsButton{
  left:2.4%!important;right:auto!important;bottom:3.0%!important;min-width:0!important;width:auto!important;height:clamp(38px,4.1vw,58px)!important;
  padding:0 clamp(14px,1.4vw,22px)!important;background:rgba(18,14,35,.66)!important;border:1px solid rgba(206,230,255,.32)!important;
  color:#eef7ff!important;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  box-shadow:0 8px 24px rgba(0,0,0,.28),inset 0 0 0 1px rgba(255,255,255,.05)!important;backdrop-filter:blur(9px)
}
.menuAccessStatus{
  position:absolute;z-index:11;left:2.4%;bottom:9.1%;padding:7px 12px;border-radius:999px;
  background:rgba(5,13,33,.68);border:1px solid rgba(156,222,255,.32);color:#dff7ff;
  font:900 clamp(8px,.85vw,12px)/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.11em;box-shadow:0 7px 22px rgba(0,0,0,.25);backdrop-filter:blur(8px)
}

/* Parent-friendly routine chooser: no hold gate when the device already has access.
   The Grown-Ups gate remains only for account/restore/admin tasks. */
.quickPlanOverlay{
  position:absolute;inset:0;z-index:205;display:grid;place-items:center;padding:4%;
  background:rgba(2,4,16,.58);backdrop-filter:blur(10px) saturate(1.08);transition:opacity .18s ease
}
.quickPlanOverlay.hidden{opacity:0;visibility:hidden;pointer-events:none}
.quickPlanCard{
  position:relative;width:min(720px,70%);max-height:91%;overflow:auto;padding:clamp(18px,2.1vw,30px);
  border-radius:clamp(20px,2vw,30px);color:#fff9df;
  background:linear-gradient(180deg,rgba(17,22,55,.96),rgba(7,9,31,.97));
  border:1px solid rgba(255,219,137,.56);box-shadow:inset 0 0 0 2px rgba(103,64,24,.50),0 24px 80px rgba(0,0,0,.52),0 0 40px rgba(101,89,255,.10)
}
.quickPlanHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.quickPlanHeader h2{margin:3px 0 0;font:900 clamp(25px,2.8vw,40px)/1.05 Georgia,"Times New Roman",serif}
.quickPlanCard .nightPlanFieldset{margin:12px 0 0}
.quickPlanCard .nightModeGrid{grid-template-columns:1fr 1fr}
.quickPlanCard .alienCountRow{grid-template-columns:repeat(5,1fr)}
.quickNightEstimate{margin-top:12px}
.quickFreeNote{
  margin-top:12px;padding:11px 12px;border-radius:13px;display:flex;align-items:center;justify-content:space-between;gap:12px;
  color:#dfefff;background:rgba(13,36,67,.62);border:1px solid rgba(123,205,255,.26);font-size:clamp(9px,.95vw,13px)
}
.quickFreeNote.hidden{display:none}
.quickFreeNote button{
  appearance:none;border:1px solid rgba(255,220,143,.62);border-radius:999px;padding:8px 12px;
  background:linear-gradient(180deg,#ffeaa6,#edac45);color:#39200d;font-weight:900;font-size:.88em;cursor:pointer
}
.quickStartTonight{
  width:100%;margin-top:14px;min-height:52px;display:flex;align-items:center;justify-content:center;gap:10px;
  appearance:none;border:2px solid #714019;border-radius:15px;background:linear-gradient(180deg,#fff4bc,#ffd662 54%,#eca039);
  color:#3f220d;font:950 clamp(15px,1.7vw,24px)/1 Georgia,"Times New Roman",serif;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.32),0 10px 25px rgba(0,0,0,.30);cursor:pointer
}
.quickStartTonight:active{transform:scale(.985)}
.quickPlanClose{z-index:4}

/* EJECT replaces the ambiguous tiny settings gear. It sits beside the room back
   control so it doesn't cover the interaction field. */
.globalSettingsButton{
  left:max(80px,calc(env(safe-area-inset-left) + 80px))!important;right:auto!important;
  top:max(14px,env(safe-area-inset-top))!important;bottom:auto!important;transform:none!important;
  width:auto!important;height:clamp(34px,3.4vw,46px)!important;min-width:clamp(58px,6vw,82px)!important;min-height:0!important;
  padding:0 clamp(10px,1vw,14px)!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;
  border-radius:9px!important;clip-path:polygon(7% 0,93% 0,100% 18%,100% 82%,93% 100%,7% 100%,0 82%,0 18%)!important;
  color:#fff6f3!important;background:linear-gradient(180deg,#c74232,#8c1f18 58%,#5f120f)!important;
  border:1px solid rgba(255,187,168,.70)!important;box-shadow:inset 0 0 0 2px rgba(83,9,7,.45),inset 0 5px 9px rgba(255,255,255,.09),0 7px 19px rgba(0,0,0,.30),0 0 14px rgba(255,63,43,.13)!important;
  opacity:.78!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  font:950 clamp(8px,.86vw,12px)/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;letter-spacing:.10em
}
.globalSettingsButton::before,.globalSettingsButton::after{display:none!important}
.globalSettingsButton b{display:block!important;padding:0!important;color:inherit!important}
.globalSettingsButton .ejectLight{display:block!important;width:7px!important;height:7px!important;border-radius:50%!important;background:#ffcf83!important;box-shadow:0 0 7px rgba(255,185,88,.85)!important}
.globalSettingsButton:hover,.globalSettingsButton:focus-visible{opacity:1!important;transform:translateY(-1px)!important;filter:brightness(1.07)}
.globalSettingsButton:active{transform:translateY(1px) scale(.98)!important}
.settingsConfirmKicker{color:#ffb0a4!important}
.settingsChangeButton{background:linear-gradient(180deg,#e75847,#a6261d)!important;color:#fff!important;border-color:rgba(255,177,163,.75)!important}

/* Interaction dots arrive quickly once Ana has finished; one dot at a time stays
   small and consistent throughout Social Rooms and bedrooms. */
#bubbleTargets .targetHotspot.hinting:not([data-no-hint="1"])::after,
#greenhouseTargets .targetHotspot.hinting:not([data-no-hint="1"])::after{
  opacity:1!important;visibility:visible!important
}

@media(max-width:760px){
  .menuStartButton{right:4%!important;bottom:6.6%!important;width:39%!important;height:48px!important;font-size:12px!important}
  .menuGrownUpsButton{left:1.5%!important;bottom:2.2%!important;height:30px!important;padding:0 9px!important;font-size:8px!important}
  .menuAccessStatus{left:1.5%;bottom:7.3%;padding:5px 8px;font-size:6.5px}
  .quickPlanCard{width:min(760px,88%);padding:14px 15px}
  .quickPlanHeader h2{font-size:20px}.quickPlanCard .nightModeCard{min-height:52px}
  .quickPlanCard .alienCountButton{width:32px;height:32px}.quickStartTonight{min-height:42px;font-size:12px}
  .globalSettingsButton{left:max(68px,calc(env(safe-area-inset-left) + 68px))!important;top:max(8px,env(safe-area-inset-top))!important;height:30px!important;min-width:52px!important;padding:0 8px!important;font-size:7px!important}
  .globalSettingsButton .ejectLight{width:5px!important;height:5px!important}
}

/* ===== Sep 23 2026 authoritative interaction-marker + parent-menu pass =====
   This block intentionally wins over every earlier experimental hint treatment. */

/* Old animated cut-out / shimmer hint layers are retired. */
.hintSprite{display:none!important}

/* One exact marker across ALL Social Rooms and ALL bedrooms. */
#app #stage #kitchenTargets .targetHotspot::before,
#app #stage #diningTargets .targetHotspot::before,
#app #stage #tvTargets .targetHotspot::before,
#app #stage #bubbleTargets .targetHotspot::before,
#app #stage #playTargets .targetHotspot::before,
#app #stage #greenhouseTargets .targetHotspot::before,
#app #stage #musicTargets .targetHotspot::before,
#app #stage #workshopTargets .targetHotspot::before,
#app #stage #crystalTargets .targetHotspot::before,
#app #stage #engineTargets .targetHotspot::before,
#app #stage .bedroomTargets .targetHotspot::before{display:none!important;content:none!important}

#app #stage #kitchenTargets .targetHotspot::after,
#app #stage #diningTargets .targetHotspot::after,
#app #stage #tvTargets .targetHotspot::after,
#app #stage #bubbleTargets .targetHotspot::after,
#app #stage #playTargets .targetHotspot::after,
#app #stage #greenhouseTargets .targetHotspot::after,
#app #stage #musicTargets .targetHotspot::after,
#app #stage #workshopTargets .targetHotspot::after,
#app #stage #crystalTargets .targetHotspot::after,
#app #stage #engineTargets .targetHotspot::after,
#app #stage .bedroomTargets .targetHotspot::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;
  width:clamp(8px,.78vw,12px)!important;height:clamp(8px,.78vw,12px)!important;
  display:block!important;border-radius:50%!important;
  background:#fff!important;border:1px solid rgba(255,255,255,.98)!important;
  box-shadow:0 0 7px 2px rgba(255,255,255,.72),0 0 15px 4px rgba(157,224,255,.24)!important;
  opacity:0!important;filter:none!important;mix-blend-mode:normal!important;
  transform:translate(-50%,-50%) scale(.55)!important;
  pointer-events:none!important
}

#app #stage #kitchenTargets .targetHotspot.hinting::after,
#app #stage #diningTargets .targetHotspot.hinting::after,
#app #stage #tvTargets .targetHotspot.hinting::after,
#app #stage #bubbleTargets .targetHotspot.hinting::after,
#app #stage #playTargets .targetHotspot.hinting::after,
#app #stage #greenhouseTargets .targetHotspot.hinting::after,
#app #stage #musicTargets .targetHotspot.hinting::after,
#app #stage #workshopTargets .targetHotspot.hinting::after,
#app #stage #crystalTargets .targetHotspot.hinting::after,
#app #stage #engineTargets .targetHotspot.hinting::after,
#app #stage .bedroomTargets .targetHotspot.hinting::after{
  opacity:1!important;
  animation:nnaKitchenDotPulse 1.18s ease-in-out infinite!important
}

@keyframes nnaKitchenDotPulse{
  0%,100%{transform:translate(-50%,-50%) scale(.38);opacity:0;box-shadow:0 0 5px 1px rgba(255,255,255,.45),0 0 10px 3px rgba(157,224,255,.10)}
  42%{transform:translate(-50%,-50%) scale(1.08);opacity:1;box-shadow:0 0 8px 3px rgba(255,255,255,.82),0 0 15px 5px rgba(157,224,255,.26)}
  70%{transform:translate(-50%,-50%) scale(.72);opacity:.32;box-shadow:0 0 6px 2px rgba(255,255,255,.58),0 0 12px 4px rgba(157,224,255,.16)}
}

/* The bedtime target is the sole exception: it remains a moon, not a normal interaction dot. */
#app #stage .bedroomTargets .targetHotspot.bedtimeInWorld::after{
  display:grid!important;place-items:center!important;content:"☾"!important;
  width:clamp(18px,1.7vw,26px)!important;height:clamp(18px,1.7vw,26px)!important;
  color:#e4edff!important;font-size:clamp(10px,1vw,16px)!important;
  background:rgba(7,12,34,.64)!important;border:1px solid rgba(179,207,255,.76)!important;
  box-shadow:0 0 11px rgba(92,144,255,.36)!important
}
#app #stage .bedroomTargets .targetHotspot.bedtimeInWorld.hinting::after{
  animation:nnaBedtimeMoonPulse 1.35s ease-in-out infinite!important;opacity:.94!important
}
#app #stage .bedroomTargets .targetHotspot.bedtimeInWorld.goodnight-armed::after{
  opacity:1!important;animation:bedtimeInWorldConfirmUnified .78s ease-in-out infinite!important
}
@keyframes nnaBedtimeMoonPulse{
  0%,100%{transform:translate(-50%,-50%) scale(.82);opacity:.54}
  50%{transform:translate(-50%,-50%) scale(1.02);opacity:1}
}

/* Disabled targets never advertise themselves. */
#app #stage .targetHotspot.disabled::after,#app #stage .targetHotspot:disabled::after{display:none!important}

/* Parent/main-menu escape: deliberately quiet and ONLY shown by JS on navigation screens. */
#app #stage .globalSettingsButton{
  left:max(8px,env(safe-area-inset-left))!important;right:auto!important;
  top:auto!important;bottom:max(8px,env(safe-area-inset-bottom))!important;
  width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;
  padding:0!important;display:grid!important;place-items:center!important;
  border-radius:9px!important;clip-path:none!important;
  color:rgba(210,230,244,.80)!important;background:rgba(6,13,24,.48)!important;
  border:1px solid rgba(154,202,229,.25)!important;
  box-shadow:0 5px 15px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.035)!important;
  opacity:.42!important;transform:none!important;backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important;
  transition:opacity .18s ease,transform .18s ease,box-shadow .18s ease!important
}
#app #stage .globalSettingsButton::before,#app #stage .globalSettingsButton::after{display:none!important;content:none!important}
#app #stage .globalSettingsButton svg{display:block!important;width:15px!important;height:15px!important;fill:currentColor!important;filter:none!important}
#app #stage .globalSettingsButton b,#app #stage .globalSettingsButton .ejectLight{display:none!important}
#app #stage .globalSettingsButton:hover,#app #stage .globalSettingsButton:focus-visible{opacity:.78!important;transform:scale(1.03)!important;background:rgba(9,21,36,.68)!important}
#app #stage .globalSettingsButton.holding{opacity:.95!important;transform:scale(.94)!important;box-shadow:0 0 0 3px rgba(116,205,255,.16),0 4px 14px rgba(0,0,0,.28)!important}
#app #stage .globalSettingsButton.hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important}

@media(max-width:760px){
  #app #stage .globalSettingsButton{left:max(6px,env(safe-area-inset-left))!important;bottom:max(6px,env(safe-area-inset-bottom))!important;width:29px!important;height:29px!important;min-width:29px!important;min-height:29px!important}
  #app #stage .globalSettingsButton svg{width:14px!important;height:14px!important}
}


/* ===== Sep 23 2026 definitive real-marker + adaptive-iPhone patch ===== */
/* The hotspot remains transparent. Every visible locator is now a real child element,
   never a ::before/::after painted on the hit area itself. */
#app #stage .hotspotLayer .targetHotspot::before,
#app #stage .hotspotLayer .targetHotspot::after{
  display:none!important;content:none!important;animation:none!important
}
#app #stage .targetHotspot>.interactionMarker{
  position:absolute;left:50%;top:50%;z-index:9;pointer-events:none;
  width:clamp(8px,.78vw,12px);height:clamp(8px,.78vw,12px);border-radius:50%;
  display:block;background:#fff;border:1px solid rgba(255,255,255,.98);
  box-shadow:0 0 7px 2px rgba(255,255,255,.72),0 0 15px 4px rgba(157,224,255,.24);
  opacity:0;transform:translate(-50%,-50%) scale(.38);transform-origin:center;
  will-change:transform,opacity;filter:none;mix-blend-mode:normal
}
#app #stage .targetHotspot.hinting>.interactionMarker:not(.bedtimeMoonMarker){
  animation:nnaRealMarkerPulse 1.18s ease-in-out infinite
}
@keyframes nnaRealMarkerPulse{
  0%,100%{transform:translate(-50%,-50%) scale(.38);opacity:0;box-shadow:0 0 5px 1px rgba(255,255,255,.45),0 0 10px 3px rgba(157,224,255,.10)}
  42%{transform:translate(-50%,-50%) scale(1.08);opacity:1;box-shadow:0 0 8px 3px rgba(255,255,255,.82),0 0 15px 5px rgba(157,224,255,.26)}
  70%{transform:translate(-50%,-50%) scale(.72);opacity:.32;box-shadow:0 0 6px 2px rgba(255,255,255,.58),0 0 12px 4px rgba(157,224,255,.16)}
}
#app #stage .targetHotspot>.interactionMarker.bedtimeMoonMarker{
  display:grid;place-items:center;width:clamp(18px,1.7vw,26px);height:clamp(18px,1.7vw,26px);
  color:#e4edff;font-size:clamp(10px,1vw,16px);line-height:1;
  background:rgba(7,12,34,.64);border:1px solid rgba(179,207,255,.76);
  box-shadow:0 0 11px rgba(92,144,255,.36)
}
#app #stage .targetHotspot.bedtimeInWorld.hinting>.bedtimeMoonMarker{
  animation:nnaRealBedtimeMoonPulse 1.35s ease-in-out infinite
}
#app #stage .targetHotspot.bedtimeInWorld.goodnight-armed>.bedtimeMoonMarker{
  opacity:1;animation:bedtimeInWorldConfirmUnified .78s ease-in-out infinite
}
@keyframes nnaRealBedtimeMoonPulse{
  0%,100%{transform:translate(-50%,-50%) scale(.82);opacity:.54}
  50%{transform:translate(-50%,-50%) scale(1.02);opacity:1}
}
#app #stage .targetHotspot.disabled>.interactionMarker,
#app #stage .targetHotspot:disabled>.interactionMarker{display:none!important}

/* The main menu is the one screen allowed to expand beyond the game's 16:9 playfield.
   The adaptive 2532x1170 art holds every logo/title/ship/character inside a central safe
   area and uses artwork-derived galaxy extension at the sides. Gameplay returns to the
   strict 16:9 stage immediately after leaving the menu, so hotspot geometry is untouched. */
@media (orientation:landscape) and (min-aspect-ratio:16/9){
  #stage.menuViewportMode{width:100vw;height:100dvh;aspect-ratio:auto}
  #stage.menuViewportMode .menuHeroBackdrop{object-fit:cover!important;filter:blur(18px) saturate(1.08) brightness(.8)!important;transform:scale(1.035)!important}
  #stage.menuViewportMode .menuHeroColour{object-fit:cover!important;object-position:center center!important;transform:none!important}
}