:root{color-scheme:dark;--cream:#fff5e5;--pink:#ffaaa0;--deep:#121328;--muted:#c8c5d6;--line:#ffffff24;font-family:'DM Sans',system-ui,sans-serif;color:var(--cream);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:#101128}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #ffe99c;outline-offset:5px}button:disabled{opacity:.65;cursor:wait}.hidden{display:none!important}#game,#world,.vignette{position:absolute;inset:0}#game{height:100svh;min-height:min(420px,100svh);overflow:hidden}#world{touch-action:none}#world canvas{display:block;width:100%;height:100%;outline:none}.vignette{pointer-events:none;background:linear-gradient(90deg,rgba(12,12,30,.88),rgba(12,12,30,.15) 60%,transparent),linear-gradient(0deg,rgba(12,12,30,.45),transparent 35%);transition:opacity 1s}.playing .vignette{opacity:.25}.hud{position:absolute;left:0;right:0;top:0;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:calc(20px + env(safe-area-inset-top)) calc(24px + env(safe-area-inset-right)) 0 calc(24px + env(safe-area-inset-left));pointer-events:none}.eyebrow{font-size:12px;letter-spacing:.18em;font-weight:700}.tools{display:flex;flex-shrink:0;gap:8px;margin-left:auto;pointer-events:auto}.icon-button{width:44px;height:44px;display:grid;place-items:center;background:#16182d99;border:1px solid var(--line);border-radius:50%;font-size:22px;backdrop-filter:blur(14px)}.icon-button[aria-pressed=true]{background:#64506d;color:#ffdcbc}.intro{position:absolute;left:7%;bottom:12%;max-width:600px}.location{color:var(--pink);margin-bottom:24px;line-height:1.7}h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.055em;margin:0}h1{font-size:clamp(44px,5.9vw,88px);line-height:1.06}em{font-weight:400;color:var(--pink)}.intro-copy{font-size:17px;line-height:1.65;margin:25px 0 28px;color:#ddd5e2}.primary{display:flex;align-items:center;justify-content:space-between;gap:40px;background:var(--cream);color:#352339;border:0;border-radius:100px;padding:18px 27px;min-height:56px;font-weight:700;font-size:16px;box-shadow:0 8px 32px #0002;transition:transform .2s,background .2s}.primary:hover{background:#ffd9cd;transform:translateY(-2px)}.primary span{font-size:23px;line-height:.8}.small-note{font-size:12px;line-height:1.6;color:#c8bfd0;margin:17px 0 0;display:block}.objective{display:flex;gap:8px;align-items:center;min-width:0;max-width:320px;padding:9px 12px;background:#15172bd9;border:1px solid var(--line);border-radius:14px;backdrop-filter:blur(14px)}.objective>div{min-width:0;overflow-wrap:break-word}.objective-icon{flex-shrink:0;color:var(--pink);font-size:22px}.objective .eyebrow{display:block;font-size:11px;line-height:1.3;letter-spacing:.12em;color:#c8bfd0}.objective p{margin:3px 0 0;font-size:14px;line-height:1.35}.controls{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:34px;right:34px;height:125px;pointer-events:none;display:flex;align-items:end;justify-content:space-between}.joystick{width:112px;height:112px;background:#fef5eb12;border:1px solid #fff5eb44;border-radius:50%;position:relative;pointer-events:auto;touch-action:none;backdrop-filter:blur(5px)}.stick{width:47px;height:47px;border-radius:50%;position:absolute;left:32px;top:32px;background:#fff5e5cc;box-shadow:0 2px 15px #17152c55}.move-hint{position:absolute;left:140px;bottom:19px;font-size:13px;line-height:1.7;color:#fff6e7;pointer-events:none}.move-hint span{font-size:12px;color:#ccc6d5}.interact{pointer-events:auto;position:absolute;right:0;bottom:22px;border:1px solid #ffb5ac88;border-radius:100px;background:#fff5e5;color:#38233b;padding:18px 25px;min-height:58px;font-weight:700;font-size:16px;box-shadow:0 6px 30px #110e3d66}.interact span{font-size:21px;padding-left:14px}.world-label{position:absolute;transform:translate(-50%,-100%);padding:8px 13px;border-radius:30px;background:#ffedda;color:#432d4a;font-size:13px;font-weight:700;pointer-events:none;box-shadow:0 3px 18px #19112866}.world-label span{color:#ba4b67;padding-left:5px}.world-label:after{content:'';width:7px;height:7px;background:#ffedda;position:absolute;bottom:-3px;left:calc(50% - 3px);transform:rotate(45deg)}.toast{position:absolute;left:50%;top:25%;transform:translateX(-50%);padding:12px 20px;max-width:90%;width:max-content;border-radius:30px;background:#17182ce8;border:1px solid var(--line);font-size:14px;text-align:center;z-index:8}.dialogue{position:absolute;bottom:calc(16px + env(safe-area-inset-bottom));left:calc(50% + (env(safe-area-inset-left) - env(safe-area-inset-right))/2);transform:translateX(-50%);width:min(520px,calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));max-height:calc(100% - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;background:#fdf4e6;color:#30233c;border-radius:17px;padding:12px 16px 8px;box-shadow:0 8px 40px #09071955;z-index:6}.dialogue-top{display:flex;align-items:center;min-height:18px;padding-right:32px}.dialogue-top .eyebrow{color:#9a5964;font-size:11px;line-height:1.35;letter-spacing:.12em}.text-button{position:absolute;top:0;right:2px;border:0;background:transparent;color:#735866;font-size:24px;width:44px;height:44px}.dialogue p{font-family:Georgia,serif;font-size:20px;line-height:1.35;letter-spacing:-.015em;margin:4px 20px 0 0;overflow-wrap:break-word}.dialogue-next{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-height:44px;margin-left:auto;background:none;border:0;font-size:13px;font-weight:700;line-height:1.3;padding:8px 2px}.ending{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#11102dc9;backdrop-filter:blur(8px);z-index:10;padding:30px;animation:reveal 1s ease}.ending-heart{font-size:55px;line-height:1;color:var(--pink);margin-bottom:15px}.ending .eyebrow{color:var(--pink);margin-bottom:20px}.ending h2{font-size:clamp(40px,5vw,66px);line-height:1.1}.ending>p:not(.eyebrow){font-size:16px;line-height:1.7;color:#e0d6e0;margin:22px 0 28px}.ending .small-note{margin-top:22px}dialog{color:var(--cream);background:#1c1c33;border:1px solid #fff2;border-radius:25px;padding:28px;max-width:min(440px,calc(100% - 30px));box-shadow:0 25px 100px #0008}dialog::backdrop{background:#08081988;backdrop-filter:blur(8px)}.options-head{display:flex;align-items:center;justify-content:space-between;gap:30px}.options-head h2{font-size:34px}dialog>p{font-size:16px;line-height:1.6;color:#d1c7d8}.option-button{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;padding:17px 0;margin-top:8px;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;font-size:15px}dialog .small-note{font-size:13px}.error{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:35px;background:#11122c;z-index:30;text-align:center}.error h2{font-size:42px}.error p{max-width:360px;line-height:1.6}.error .primary{margin-top:15px}@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){.hud{gap:10px;padding:calc(12px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) 0 calc(12px + env(safe-area-inset-left))}.tools{gap:6px}.icon-button{width:44px;height:44px;font-size:21px}.intro{left:27px;right:25px;bottom:calc(58px + env(safe-area-inset-bottom))}.intro .location{font-size:12px;letter-spacing:.14em;margin-bottom:18px}h1{font-size:clamp(41px,10.8vw,61px)}.intro-copy{font-size:16px;margin:20px 0 23px}.small-note{font-size:12px}.vignette{background:linear-gradient(0deg,#111128f5,rgba(13,13,33,.72) 42%,transparent 80%)}.objective{gap:6px;padding:8px 10px;border-radius:13px}.objective p{font-size:13px}.objective-icon{font-size:20px}.controls{left:22px;right:22px;bottom:calc(26px + env(safe-area-inset-bottom))}.joystick{width:110px;height:110px}.move-hint{left:133px;bottom:26px;font-size:12px;max-width:150px}.move-hint span{display:none}.interact{padding:16px 21px;bottom:24px;font-size:15px}.dialogue{bottom:calc(12px + env(safe-area-inset-bottom));padding:10px 14px 6px}.dialogue p{font-size:18px}.ending .small-note{max-width:270px;font-size:12px}.ending-heart{font-size:43px}.ending h2{font-size:43px}.ending>p:not(.eyebrow){font-size:15px}.playing .vignette{opacity:.28}.world-label{font-size:12px}.toast{top:29%;font-size:13px}}
@media(max-height:550px) and (min-width:600px){.hud{padding:calc(10px + env(safe-area-inset-top)) calc(16px + env(safe-area-inset-right)) 0 calc(16px + env(safe-area-inset-left))}.intro{bottom:30px;left:5%}h1{font-size:45px}.intro .location{margin-bottom:10px}.intro-copy{margin:12px 0 16px;font-size:15px}.intro .small-note{display:none}.primary{padding:13px 23px;min-height:46px}.objective{padding:8px 11px}.controls{bottom:15px}.joystick{transform:scale(.8);transform-origin:bottom left}.dialogue{bottom:calc(10px + env(safe-area-inset-bottom));width:min(580px,calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:18px;padding:10px 16px}.dialogue-top{grid-column:1/-1}.dialogue p{font-size:18px;margin:4px 0 0}.dialogue-next{align-self:end}.ending{padding:20px}.ending-heart{font-size:30px;margin:0}.ending .eyebrow{margin:12px 0}.ending h2{font-size:34px}.ending>p:not(.eyebrow){margin:12px 0;font-size:14px}.ending .small-note{margin-top:12px}}
@media(max-width:700px){.interact{max-width:calc(100% - 126px);line-height:1.35}}
.ending{inset:50% 4% auto auto;width:min(390px,42%);transform:translateY(-50%);padding:26px 22px;border:1px solid var(--line);border-radius:26px;background:#141329e8;backdrop-filter:none;animation:none}.ending-heart{font-size:32px;margin-bottom:10px}.ending .eyebrow{margin-bottom:14px}.ending h2{font-size:38px}.ending>p:not(.eyebrow){margin:16px 0 20px;font-size:15px}.ending .small-note{margin-top:16px;font-size:12px}.ending .primary{gap:18px;font-size:14px;padding:15px 22px}
@media(max-aspect-ratio:4/5){.ending{inset:auto 16px max(20px,env(safe-area-inset-bottom));width:auto;transform:none;padding:18px}.ending-heart{display:none}.ending .eyebrow{font-size:12px;margin-bottom:8px}.ending h2{font-size:30px}.ending>p:not(.eyebrow){font-size:14px;margin:10px 0 14px}.ending .primary{min-height:48px;padding:12px 22px}.ending .small-note{margin-top:12px}}
@media(max-height:550px) and (min-aspect-ratio:4/5){.ending{padding:16px;right:3%;width:41%}.ending-heart{display:none}.ending h2{font-size:28px}.ending .eyebrow{font-size:12px;margin-bottom:8px}.ending>p:not(.eyebrow){font-size:13px;margin:10px 0 14px}.ending .small-note{margin-top:10px;font-size:12px}.ending .primary{min-height:44px;padding:12px 18px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.sound-hint{position:absolute;top:calc(74px + env(safe-area-inset-top));right:calc(24px + env(safe-area-inset-right));z-index:12;border:1px solid #ffb5ac88;border-radius:24px;background:#fff5e5;color:#38233b;padding:11px 16px;font-size:13px;font-weight:700;box-shadow:0 4px 20px #0003}
@media(max-width:700px){.sound-hint{top:calc(66px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));max-width:94px}}
@media(max-height:550px) and (min-width:600px){.sound-hint{top:calc(64px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right))}}
.capture{position:absolute;inset:0;z-index:7;pointer-events:none;background:linear-gradient(0deg,#121328c9,transparent 26%)}
.capture-heading{position:absolute;top:calc(68px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:min(340px,calc(100% - 32px));padding:8px 10px;text-align:center;color:#fff5e6;background:#191b32;border:1px solid #f9e3d533;border-radius:12px;box-shadow:0 4px 16px #080a1b44}
.capture h2{font-size:clamp(1.0625rem,5.1vw,1.25rem);line-height:1.15;letter-spacing:-.025em}.capture-feedback{margin:5px 0 0;font-size:.875rem;font-weight:650;color:#ffe4b0;line-height:1.35}
.capture-feedback:empty{display:none}
.capture-ball{position:absolute;left:calc(50% - 44px);bottom:max(68px,calc(env(safe-area-inset-bottom) + 52px));width:88px;height:88px;padding:0;border:3px solid #312739;border-radius:50%;background:linear-gradient(#ef5266 0 45%,#322638 45% 55%,#fff3e1 55%);box-shadow:inset -9px -7px 0 #39284425,inset 6px 4px 0 #ffffff20,0 12px 24px #0005;touch-action:none;pointer-events:auto;user-select:none;cursor:grab;will-change:transform;display:grid;place-items:center}
.capture-ball:active{cursor:grabbing}.capture-ball span{display:grid;place-items:center;width:30px;height:30px;background:#fff3e1;color:#e77e96;border:5px solid #322638;border-radius:50%;font-size:12px;line-height:1}.capture-ball:after{content:'';position:absolute;top:13px;left:19px;width:20px;height:10px;background:#fff6;border-radius:50%;transform:rotate(-28deg)}
.capture-footer{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:20px;right:20px;text-align:center}.capture-footer p{font-size:14px;line-height:1.45;margin:0 auto;max-width:340px;color:#f6e9da}.capture-footer .primary{pointer-events:auto;margin:0 auto;gap:22px;display:none}
.capture:not([data-phase=ready]) .capture-ball{visibility:hidden;pointer-events:none}.capture[data-phase=caught] .capture-footer .primary{display:flex}.capture[data-phase=caught] .capture-footer p{display:none}.capture[data-phase=caught] h2{color:#ffe1af}.capturing .sound-hint{top:68px}
@media(min-aspect-ratio:6/5){.capture-heading{left:calc(24px + env(safe-area-inset-left));top:calc(20px + env(safe-area-inset-top));transform:none;width:240px;text-align:left}.capture-ball{bottom:68px}.capture-footer{bottom:17px}}
@media(max-height:550px) and (min-aspect-ratio:6/5){.capture-heading{left:calc(16px + env(safe-area-inset-left));width:210px}.capture-ball{width:72px;height:72px;left:calc(50% - 36px);bottom:54px}.capture-footer p{font-size:13px}.capture-footer .primary{min-height:44px;padding:12px 20px}}

.chapter-link{display:inline-block;color:var(--cream);font-size:14px;text-underline-offset:5px;margin-top:18px;line-height:1.5}.chapter-next{text-decoration:none;margin:0 0 12px;gap:15px!important}.ending .chapter-next{font-size:14px;line-height:1.4}.ending #replay{background:transparent;color:var(--cream);box-shadow:none;border:1px solid var(--line);min-height:44px;padding:10px 18px}.option-button.chapter-link{display:flex;text-decoration:none;font-size:15px}

/* Share the top edge; keep touch controls usable on narrow screens. */
@media(max-width:380px){.objective-icon{display:none}}
.playing:has(.dialogue:not(.hidden)) .sound-hint{display:none}

.dialogue button:focus-visible,.ceremony button:focus-visible{outline:2px solid currentColor;outline-offset:-3px}

/* Read the motivation while the party keeps dancing behind it. */
.party-briefing{position:absolute;z-index:7;left:50%;bottom:max(28px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(620px,calc(100% - 40px));max-height:calc(100% - 96px - env(safe-area-inset-top));overflow-y:auto;background:#fff5e8f5;border:1px solid #ffdab1;border-radius:18px;padding:20px 24px 12px;color:#30233c;box-shadow:0 10px 40px #09071955}
.party-briefing .eyebrow{color:#925268;font-size:12px;margin:0 0 9px}.party-briefing>p:not(.eyebrow){font-size:17px;line-height:1.65;margin:0 0 6px}.party-briefing .dialogue-next{font-size:14px;gap:15px}.party-briefing button:focus-visible{outline:2px solid #925268;outline-offset:-2px}.briefing-visible .sound-hint{display:none!important}
@media(max-width:700px){.party-briefing{bottom:max(16px,env(safe-area-inset-bottom));width:calc(100% - 32px);padding:16px 18px 8px}.party-briefing>p:not(.eyebrow){font-size:16px;line-height:1.55}}
@media(max-height:550px) and (min-width:600px){.party-briefing{bottom:16px;width:min(640px,calc(100% - 36px));padding:12px 18px 5px}.party-briefing .eyebrow{margin-bottom:5px}.party-briefing>p:not(.eyebrow){font-size:16px;line-height:1.45}.party-briefing .dialogue-next{min-height:40px}}

/* One menu button leaves the play area clear in every chapter. */
#options{width:min(420px,calc(100% - 28px));max-height:calc(100svh - 32px);overflow-y:auto;overscroll-behavior:contain}
#options .options-head{position:sticky;top:-1px;z-index:1;background:inherit;padding-bottom:10px}
#options .options-head h2{font-size:30px}
#options .menu-control{min-height:48px;gap:18px}
#options .menu-control:disabled{cursor:default}
#options .sound-hint{position:static;display:block;transform:none;max-width:none;margin:8px 0 12px;width:100%;font-size:14px}

#motion-status:empty{display:none}