.joystick-base{position:fixed;z-index:200;border-radius:50%;border:2px solid var(--joy-base-color, #fff8ff);background:#ffffff14;display:grid;place-items:center;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.joystick-knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;background:var(--joy-knob-color, #fff8ff);pointer-events:none;box-shadow:0 2px 8px #00000059}:root{font-family:Arial,Helvetica,sans-serif;color:#eef9f2;background:#081612;font-synthesis:none;--ink:#eef9f2;--panel:#102721;--accent:#b5f5d8}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden}canvas{display:block;touch-action:none}button{font:inherit;min-height:46px;padding:12px 22px;border:1px solid #8fb4a5;background:var(--panel);color:var(--ink);border-radius:5px;cursor:pointer}button:focus-visible{outline:3px solid white;outline-offset:4px}button:disabled{opacity:.55;cursor:default}button:not(:disabled):hover{background:#21483b}button:active{transform:translateY(1px)}.cover{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#07140fd9;padding:24px;overflow:auto}.intro{max-width:560px;text-align:center}.intro h1{font-family:Georgia,serif;font-size:clamp(42px,8vw,76px);letter-spacing:.08em;font-weight:500;margin:20px 0 28px}.intro p{font-size:17px;line-height:1.9}.intro .eyebrow{font-size:13px;letter-spacing:.16em;color:var(--accent);text-transform:uppercase}.intro>button{display:block;margin:16px auto;min-width:180px}.intro .hint,.intro small{font-size:12px;line-height:1.8;color:#b9cbbf}.hud{position:fixed;top:max(24px,env(safe-area-inset-top));left:24px;right:24px;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.hud>div:first-child{background:#102721ed;border-left:2px solid var(--accent);padding:16px 20px}.hud h1{font-family:Georgia,serif;font-size:24px;letter-spacing:.08em;margin:0}.hud p{font-size:14px;margin:10px 0}.hud strong{font-size:14px;color:var(--accent)}.hud button{pointer-events:auto}.hud-controls{display:flex;gap:8px}.theme-toggle{width:46px;padding:10px;display:grid;place-items:center}.theme-toggle svg{width:20px;height:20px}.objective{position:fixed;right:24px;top:112px;background:#102721e8;padding:14px 18px;border-radius:5px;display:grid;gap:8px;font-size:14px}.objective b{color:var(--accent);font-weight:400}.actions{position:fixed;bottom:max(24px,env(safe-area-inset-bottom));left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;gap:16px}.actions span{font-size:12px;background:#102721dd;padding:10px}.success{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);max-width:440px;width:calc(100% - 40px);padding:28px;background:#102721f5;text-align:center;border:1px solid var(--accent);border-radius:8px}.success h2{font-family:Georgia,serif;font-size:30px}.success p{font-size:15px;line-height:1.8}@media(max-width:700px){.hud{left:12px;right:12px;top:12px;gap:8px}.hud>div:first-child{padding:12px}.hud h1{font-size:20px}.hud p{font-size:12px;max-width:190px}.hud button{padding:10px 14px}.theme-toggle{width:46px;padding:10px!important}.objective{top:154px;right:12px;padding:10px 12px}.actions{right:12px;left:auto;bottom:35px;max-width:52%}.actions span{display:none}.actions button{font-size:14px;padding:12px;min-height:52px}.intro h1{margin:10px 0 20px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}.joystick-base{left:20px!important;right:auto!important;margin-left:0!important;bottom:max(28px,env(safe-area-inset-bottom))!important}.success button{margin:4px}.npc-tag{min-width:110px;padding:7px 10px;border:1px solid #ffffff80;border-radius:5px;background:#102721e8;color:#fff;text-align:center;pointer-events:none;white-space:nowrap}.npc-tag strong,.npc-tag span{display:block}.npc-tag strong{font-family:Georgia,serif;font-size:16px;letter-spacing:.05em}.npc-tag span{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:#d6ece2;margin-top:3px}.challenge{position:fixed;z-index:12;left:50%;bottom:max(34px,env(safe-area-inset-bottom));transform:translate(-50%);width:min(620px,calc(100% - 32px));padding:26px 28px;background:#102721f5;border:1px solid #92cbb4;border-radius:8px;box-shadow:0 18px 60px #0009;text-align:center;animation:immersive-arrive .72s ease-out both}.challenge.is-leaving{animation:immersive-leave .72s ease-in both}.challenge h2{font-family:Georgia,serif;font-size:clamp(24px,5vw,34px);margin:10px 0}.challenge>p:not(.chapter):not(.error){max-width:520px;margin:10px auto 20px;line-height:1.65;color:#d8e6df}.chapter{font-size:11px;letter-spacing:.16em;color:var(--accent);text-transform:uppercase}.speaker{display:inline-grid;border-left:4px solid var(--speaker);padding-left:10px;text-align:left}.speaker span{font-family:Georgia,serif;font-size:20px}.speaker small{font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:#bcd1c7}.choices,.meow-pad{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.choices button{min-width:150px}.listen{margin-bottom:14px}.meow-pad button{min-width:110px;background:#1c4136;border-color:#c4ebda}.progress{display:block;margin-top:14px;color:#b9cbbf}.error{color:#ffbaa8;font-weight:700}.success{z-index:14}.success .chapter{font-size:11px}.success h2{margin:8px 0 14px}@keyframes immersive-arrive{0%{opacity:0}to{opacity:1}}@keyframes immersive-leave{0%{opacity:1}to{opacity:0}}@media(max-width:700px){.challenge{bottom:18px;padding:20px 16px}.challenge>p:not(.chapter):not(.error){font-size:14px;margin-bottom:14px}.choices{display:grid}.choices button{width:100%}.meow-pad button{min-width:84px;padding:10px}.npc-tag{display:none}}.challenge-invite{width:min(760px,calc(100% - 32px));padding:20px 28px;border-radius:18px;background:#102721dd;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.challenge-invite h2{font-size:clamp(20px,4vw,28px)}.challenge-invite>p:not(.chapter){margin-bottom:14px}.accept-challenge{min-width:220px;border-radius:999px;background:#285b49}.challenge-countdown,.challenge-listen{left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%);width:auto;min-width:154px;padding:20px;border-radius:22px;background:#102721d9}.challenge-countdown>:not(.countdown),.challenge-listen>:not(.listen-status){display:none}.countdown{display:grid;place-items:center;width:94px;height:94px;margin:auto;border:3px solid #fff;border-radius:24px;font-family:Georgia,serif;font-size:56px;box-shadow:0 0 36px #b5f5d866}.listen-status{display:flex;align-items:center;gap:12px;font-size:18px;white-space:nowrap}.pulse-dot{width:14px;height:14px;border-radius:50%;background:var(--accent);box-shadow:0 0 #b5f5d899;animation:pulse 1s infinite}.sequence-indicator{display:flex;justify-content:center;gap:10px;margin:14px 0}.sequence-indicator span{display:grid;place-items:center;width:34px;height:34px;border:1px solid #8fb4a5;border-radius:999px;color:#9bb3a9}.sequence-indicator .current{border-color:#fff;color:#fff;box-shadow:0 0 0 4px #b5f5d822}.sequence-indicator .done{border-color:var(--accent);background:var(--accent);color:#102721}.credits-roll{position:fixed;z-index:13;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;text-align:center;background:linear-gradient(90deg,#07140f66,transparent 30%,transparent 70%,#07140f66)}.credits-roll>div{position:absolute;left:50%;width:min(520px,80vw);transform:translate(-50%);animation:credits-rise 24s linear infinite;text-shadow:0 2px 8px #000}.credits-roll h2{font-family:Georgia,serif;font-size:clamp(38px,7vw,68px);letter-spacing:.12em;margin:18px 0 8px}.credits-roll h3{font-size:13px;letter-spacing:.2em;color:var(--accent);margin:54px 0 12px}.credits-roll p{font-size:17px;line-height:1.8}.credits-roll strong{display:block;margin-top:70px;font-family:Georgia,serif;font-size:26px}.credits-restart{position:fixed;z-index:15;right:24px;bottom:24px;background:#102721dd}@keyframes pulse{70%{box-shadow:0 0 0 14px #b5f5d800}}@keyframes credits-rise{0%{top:82%}to{top:-115%}}@media(max-width:700px){.challenge-invite{bottom:18px;padding:16px}.challenge-invite>p:not(.chapter){display:none}.credits-roll h3{margin-top:42px}.credits-restart{right:12px;bottom:12px}}@media(prefers-reduced-motion:reduce){.pulse-dot{animation:none}.credits-roll{overflow:auto}.credits-roll>div{position:relative;top:auto;padding:100px 0;animation:none}}.story-notice{position:fixed;z-index:11;left:50%;top:24px;transform:translate(-50%);width:min(520px,calc(100% - 32px));padding:18px 20px;background:#102721ed;border:1px solid #92cbb4;border-radius:14px;box-shadow:0 16px 44px #0008;text-align:center}.story-notice-kicker{margin:0 0 7px;color:var(--accent);font-size:10px;letter-spacing:.16em}.story-notice h2{margin:0 0 8px;font-family:Georgia,serif;font-size:22px}.story-notice>p:not(.story-notice-kicker){margin:0 auto 14px;max-width:460px;color:#d8e6df;line-height:1.55}.story-notice button{min-width:96px;border-radius:999px}.gift-tag{padding:5px 8px;border-radius:999px;border:1px solid #fff;background:#102721e8;color:#fff;font-size:9px;letter-spacing:.1em;white-space:nowrap;box-shadow:0 4px 12px #0008}.gift-tag-valid{border-color:#ffd1a1;color:#ffe2bf}.gift-tag-empty{border-color:#a6b0aa;color:#c8d0cc}@media(max-width:700px){.story-notice{top:14px;padding:14px 16px}.story-notice h2{font-size:19px}.story-notice>p:not(.story-notice-kicker){font-size:14px}.gift-tag{font-size:8px}}:root{--glass: rgba(9, 20, 39, .68);--glass-strong: rgba(8, 18, 35, .86);--line: rgba(255, 255, 255, .78);--muted-line: rgba(210, 231, 255, .4);--ui-ink: #f7f6ff;--ui-soft: #c8d7ee;--ui-accent: #ffd39b;--ui-radius: 18px}.cover.title-screen{background:linear-gradient(180deg,#040a1b2e,#040a1b94);pointer-events:none}.title-screen .intro{width:min(760px,calc(100% - 40px));max-width:760px;color:var(--ui-ink);pointer-events:auto}.title-screen .eyebrow,.prologue-kicker,.pickup-kicker{font-family:Arial Narrow,Arial,sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--ui-soft)}.title-screen h1{margin:12px 0 10px;font-family:Impact,Arial Narrow,sans-serif;font-size:clamp(48px,8vw,94px);font-weight:400;letter-spacing:.16em;line-height:.96;text-transform:uppercase;text-shadow:0 4px 22px rgba(0,0,0,.42)}.title-copy{margin:0 auto 20px;color:var(--ui-soft);font-size:16px;letter-spacing:.04em}.title-dialog,.prologue-capsule{border:1px solid var(--line);border-radius:var(--ui-radius);background:linear-gradient(110deg,#091127d1,#161c4380);box-shadow:0 18px 60px #0000004d,inset 0 1px #ffffff14;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.title-dialog{margin:0 auto 18px;padding:18px 26px;font-family:Arial Narrow,Arial,sans-serif;font-size:clamp(16px,2vw,22px);letter-spacing:.08em;text-transform:uppercase}.title-screen .intro>button,.prologue-capsule>button,.pickup-confirm{min-width:148px;border-color:var(--line);border-radius:999px;background:#0e1733b8;color:var(--ui-ink);font-family:Arial Narrow,Arial,sans-serif;font-size:14px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}.title-screen .intro>button:hover,.prologue-capsule>button:hover,.pickup-confirm:hover{transform:translateY(-2px) scale(1.03);background:#535c938c;box-shadow:0 0 24px #ffd39b3d}.title-screen small{display:block;margin-top:28px;color:#dce5f7ad;letter-spacing:.08em}.hud{top:22px;left:24px;right:24px}.hud>div:first-child,.objective,.actions>button,.auto-interact-hint{border:1px solid var(--muted-line);border-radius:14px;background:var(--glass);box-shadow:0 12px 34px #0003;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px)}.hud>div:first-child{border-left:1px solid var(--line);padding:13px 17px}.hud h1,.hud p,.hud strong{font-family:Arial Narrow,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}.hud h1{font-size:18px;font-weight:700}.hud p{margin:8px 0;color:var(--ui-soft);font-size:11px}.hud strong{color:var(--ui-accent);font-size:11px}.objective{top:104px;padding:12px 16px;color:var(--ui-ink)}.objective span,.objective b{font-family:Arial Narrow,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}.objective b{color:var(--ui-accent);font-size:11px}.actions{bottom:22px;left:24px;right:24px}.control-legend{display:flex;align-items:center;gap:10px;padding:7px 10px;border:1px solid var(--muted-line);border-radius:14px;background:#0812239e;color:var(--ui-soft);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.control-group{display:inline-flex;align-items:center;gap:6px;font-family:Arial Narrow,Arial,sans-serif;font-size:10px;letter-spacing:.1em;white-space:nowrap}.control-group b{font-weight:700}kbd{display:inline-grid;min-width:24px;height:24px;place-items:center;border:1px solid rgba(255,255,255,.7);border-radius:7px;background:#ffffff14;box-shadow:inset 0 -2px #ffffff24,0 0 10px #ffd39b14;color:var(--ui-ink);font-family:Arial,sans-serif;font-size:11px;line-height:1}kbd:hover{border-color:var(--ui-accent);box-shadow:0 0 14px #ffd39b57}.key-cluster{display:grid;grid-template-columns:repeat(4,24px);gap:2px}.wide-key{min-width:48px;padding:0 5px;font-size:9px}.actions>button{padding:11px 16px;color:var(--ui-ink)}.auto-interact-hint{padding:11px 16px;color:var(--ui-soft);font-size:12px;text-align:center}.prologue-backdrop,.pickup-backdrop{position:fixed;z-index:16;top:0;right:0;bottom:0;left:0;display:grid;place-items:end center;padding:0 20px 9vh;background:linear-gradient(180deg,transparent 25%,rgba(2,7,20,.32));pointer-events:auto}.prologue-capsule{width:min(760px,100%);padding:22px 30px 24px;text-align:center;animation:capsule-rise .42s cubic-bezier(.2,.8,.2,1) both}.prologue-capsule h2,.pickup-focus-content h2{margin:7px 0 10px;font-family:Arial Narrow,Arial,sans-serif;font-size:clamp(22px,4vw,34px);font-weight:700;letter-spacing:.08em;text-transform:uppercase}.prologue-capsule p:not(.prologue-kicker),.pickup-body{max-width:620px;margin:0 auto 18px;color:var(--ui-soft);font-size:15px;line-height:1.65}.pickup-backdrop{z-index:18;place-items:center;padding:20px;background:radial-gradient(circle at center,#0309190f,#0207147a)}.pickup-focus-content{width:min(620px,100%);padding:22px 24px;text-align:center;border:0;border-radius:0;background:transparent;box-shadow:none;animation:pickup-focus .76s cubic-bezier(.2,.8,.2,1) both}.pickup-focus-content.pickup-invalid{color:#fff0e7}.pickup-focus-content.pickup-valid{color:#fff8ed}.pickup-focus-content.is-leaving{animation:pickup-leave .72s ease-in both}.pickup-item{margin:0 0 10px;color:var(--ui-accent);font-family:Arial Narrow,Arial,sans-serif;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.pickup-confirm{margin-top:8px}@keyframes pickup-focus{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes pickup-leave{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.04)}}.npc-signal{display:flex;gap:7px;align-items:flex-end;color:#fff5dc;font-family:Georgia,serif;font-size:23px;font-weight:700;filter:drop-shadow(0 3px 8px rgba(0,0,0,.65));animation:note-float 1.8s ease-in-out infinite;pointer-events:none}.npc-signal span:nth-child(2){margin-bottom:13px;color:#ffc4c7;font-size:17px;animation:note-float 1.8s .26s ease-in-out infinite}@keyframes capsule-rise{0%{opacity:0;transform:translateY(22px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes capsule-pop{0%{opacity:0;transform:scale(.78)}72%{transform:scale(1.035)}to{opacity:1;transform:scale(1)}}@keyframes note-float{0%,to{transform:translateY(4px) rotate(-5deg)}50%{transform:translateY(-7px) rotate(5deg)}}@media(max-width:700px){.title-screen .intro{width:min(520px,calc(100% - 24px))}.title-screen h1{font-size:clamp(42px,13vw,68px)}.title-dialog{padding:14px 16px;font-size:13px}.hud{top:12px;left:12px;right:12px}.objective{top:140px;right:12px}.actions{right:12px;left:12px;bottom:25px}.actions .control-legend{display:flex;width:auto;min-width:0}.actions .control-legend .control-group{display:inline-flex;padding:0;background:transparent}.control-legend{gap:7px;padding:6px 7px}.control-group{gap:4px;font-size:8px}.key-cluster{grid-template-columns:repeat(4,21px)}kbd{min-width:21px;height:21px;font-size:10px}.wide-key{min-width:42px}.actions>button,.auto-interact-hint{padding:10px 11px;font-size:12px}.prologue-backdrop{padding:0 12px 28px}.prologue-capsule{padding:18px 18px 20px}.prologue-capsule p:not(.prologue-kicker),.pickup-body{font-size:14px}}@media(prefers-reduced-motion:reduce){.prologue-capsule,.pickup-focus-content,.npc-signal{animation:none}}