:root{--touch-scale:1;--touch-opacity:.72;color:#f6f2e8;font-synthesis:none;text-rendering:optimizelegibility;background:#061420;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}button,kbd{font:inherit}#game-canvas{touch-action:none;outline:none;width:100%;height:100%;display:block}.panel{z-index:10;width:min(560px, calc(100vw - max(20px, env(safe-area-inset-left)) - max(20px, env(safe-area-inset-right))));text-align:center;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(135deg,#071825f0,#19112eeb);border:1px solid #eecf7d6b;border-radius:6px;padding:44px;transition:opacity .5s,visibility .5s;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 30px 90px #0009}.panel:before,.panel:after{content:"";background:linear-gradient(90deg,#0000,#eecf7d,#0000);height:1px;position:absolute;left:24px;right:24px}.panel:before{top:18px}.panel:after{bottom:18px}.panel.hidden{opacity:0;visibility:hidden;pointer-events:none}.eyebrow{color:#eecf7d;letter-spacing:.24em;margin:0 0 12px;font-size:11px;font-weight:600}h1,h2{letter-spacing:.11em;margin:0;font-family:Cinzel,Georgia,serif;font-weight:500}h1{text-shadow:0 0 38px #926cff57;font-size:clamp(48px,10vw,78px);line-height:1}h2{letter-spacing:.04em;font-size:clamp(27px,6vw,40px)}.chapter{color:#b7daea;letter-spacing:.08em;margin:12px 0 28px;font-family:Cinzel,Georgia,serif}.intro-copy,.complete-panel>p:not(.eyebrow){color:#f6f2e8c7;max-width:440px;margin:0 auto 28px;line-height:1.7}.panel button{color:#101727;cursor:pointer;background:linear-gradient(135deg,#f4dc99,#dca95b);border:0;border-radius:2px;padding:13px 25px;font-weight:600;box-shadow:0 8px 30px #dca95b33}.panel button:hover{filter:brightness(1.08)}.button-row{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.panel .secondary-button{color:#e9eef5;box-shadow:none;background:#ffffff12;border:1px solid #b7daea59}.secondary-button.hidden{display:none}.cost-note{color:#ffffff61;letter-spacing:.08em;margin:18px 0 0;font-size:11px}.hud{z-index:4;opacity:0;pointer-events:none;transition:opacity .4s;position:fixed;inset:0}body:has(.intro-panel.hidden) .hud{opacity:1}.quest-card,.controls-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#05131ec7,#121326ad);border:1px solid #eecf7d38;border-radius:3px;padding:16px 18px;position:absolute}body[data-controller=touch] .controls-card,body[data-controller=mouse-only] .controls-card{display:none}.quest-card{top:calc(env(safe-area-inset-top) + 24px);left:calc(env(safe-area-inset-left) + 24px);min-width:270px}.quest-card .eyebrow{margin-bottom:7px;font-size:9px}#objective{margin:0;font-family:Cinzel,Georgia,serif;font-size:16px}#progress{color:#8fe7f1;margin:8px 0 0;font-size:13px}.controls-card{right:calc(env(safe-area-inset-right) + 24px);bottom:calc(env(safe-area-inset-bottom) + 24px);color:#ffffff9e;gap:7px;font-size:11px;display:grid}kbd{color:#f4dc99;text-align:center;background:#ffffff12;border:1px solid #ffffff1f;border-radius:2px;min-width:42px;margin-right:8px;padding:2px 5px;display:inline-block}.prompt{color:#f8e8b6;text-align:center;opacity:0;background:#040d18bd;border:1px solid #eecf7d4d;border-radius:3px;min-width:240px;padding:10px 18px;transition:opacity .18s;position:absolute;bottom:13%;left:50%;transform:translate(-50%)}.prompt.visible{opacity:1}.sight-indicator{top:calc(env(safe-area-inset-top) + 26px);color:#bda7ff;letter-spacing:.22em;text-shadow:0 0 12px #8d62ff;opacity:0;font-size:10px;font-weight:600;transition:opacity .15s;position:absolute;left:50%;transform:translate(-50%)}.sight-indicator.visible{opacity:1}.resolve-indicator{left:calc(env(safe-area-inset-left) + 24px);bottom:calc(env(safe-area-inset-bottom) + 24px);color:#f2cc78;letter-spacing:.16em;opacity:0;font-size:11px;font-weight:600;transition:opacity .25s,color .15s;position:absolute}.resolve-indicator.visible{opacity:1}.resolve-indicator.hurt{color:#ff6b75}.ability-indicator{left:calc(env(safe-area-inset-left) + 24px);bottom:calc(env(safe-area-inset-bottom) + 50px);color:#9feeff;letter-spacing:.16em;text-shadow:0 0 12px #60e2ffb3;opacity:0;font-size:10px;font-weight:600;transition:opacity .22s,color .15s;position:absolute}.ability-indicator.visible{opacity:1}.ability-indicator.cooling{color:#9feeff7a}.story-beat{z-index:6;pointer-events:none;place-items:center;display:grid;position:fixed;inset:0}.story-beat p{color:#fff;letter-spacing:.04em;text-align:center;text-shadow:0 4px 24px #000;opacity:0;max-width:720px;margin:0;padding:18px 28px;font-family:Cinzel,Georgia,serif;font-size:clamp(20px,3vw,34px);transition:opacity .7s}.story-beat p.visible{opacity:1}.complete-panel{z-index:12;opacity:0;visibility:hidden;pointer-events:none;background:linear-gradient(135deg,#071825fa,#19112ef7);box-shadow:0 30px 100px #000000d1,0 0 70px #5cdcff24}.complete-panel.visible{opacity:1;visibility:visible;pointer-events:auto}.complete-panel h2{margin-bottom:22px}.complete-panel>.run-stats{color:#8fe7f1;letter-spacing:.08em;margin:20px auto 0;font-size:11px;line-height:1.5}.modal-layer{z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#020810b3;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal-layer.hidden{display:none}.pause-panel{position:relative;top:auto;left:auto;transform:none}.pause-panel>p:not(.eyebrow){color:#f6f2e8b8;margin:18px auto 28px}body.paused #game-canvas{filter:saturate(.55)brightness(.7)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}@media (width<=720px){.panel{padding:36px 24px}.quest-card{top:12px;left:12px}.controls-card{display:none}.ability-indicator,.resolve-indicator{left:12px}}@media (width<=900px) and (pointer:coarse){.controls-card{display:none}}.trilogy-panel{width:min(860px,100vw - 36px);padding:34px 40px 30px}.trilogy-panel h1{font-size:clamp(42px,8vw,68px)}.trilogy-panel .chapter{margin-bottom:16px}.trilogy-panel .intro-copy{margin-bottom:20px}.part-selector{grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0 22px;display:grid}.panel .part-card{color:#f4f7fab8;text-align:left;min-height:98px;box-shadow:none;background:#ffffff09;border:1px solid #b7daea2b;padding:13px 14px;display:grid}.panel .part-card.selected{color:#fff7df;background:linear-gradient(145deg,#4c317094,#143c4e7a);border-color:#eecf7d85}.panel .part-card:disabled{cursor:not-allowed;filter:grayscale(.8);opacity:.4}.part-card span,.part-card small{letter-spacing:.18em;font-size:9px}.part-card strong{align-self:center;font-family:Cinzel,Georgia,serif;font-size:13px;font-weight:500}.part-card small{color:#8fe7f1}.title-actions{margin-bottom:11px}.utility-actions .secondary-button{padding:8px 13px;font-size:11px}.panel .danger-button{color:#ffc1c7;border-color:#ff6b7552}.moral-trajectory{color:#d7b4ff;letter-spacing:.14em;margin:9px 0 0;font-size:10px;font-weight:600}.moral-trajectory.hidden{display:none}.ability-indicator{max-width:min(680px,100vw - 48px)}.choice-panel,.settings-panel{width:min(690px, calc(100vw - max(20px, env(safe-area-inset-left)) - max(20px, env(safe-area-inset-right))))}.choice-copy{color:#f6f2e8c2;max-width:560px;margin:18px auto 24px;line-height:1.65}.choice-options{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}.panel .choice-options button{color:#f5f1e8;text-align:left;min-height:118px;box-shadow:none;background:linear-gradient(145deg,#392152c7,#092a3bd1);border:1px solid #8fe7f147;gap:8px;padding:18px;display:grid}.choice-options strong{color:#f4dc99;font-family:Cinzel,Georgia,serif}.choice-options span{color:#ffffffa6;font-size:13px;line-height:1.5}.settings-panel{text-align:left;max-height:calc(100dvh - max(16px, env(safe-area-inset-top)) - max(16px, env(safe-area-inset-bottom)));gap:18px;display:grid;overflow-y:auto}.settings-panel h2,.settings-panel>.eyebrow{text-align:center}.settings-panel label{color:#d6e8ef;gap:8px;font-size:13px;display:grid}.settings-panel .toggle-label{align-items:center;gap:10px;display:flex}.settings-panel input[type=range]{accent-color:#8fe7f1;width:100%}.settings-panel select{color:#f6f2e8;background:#102535;border:1px solid #8fe7f159;border-radius:3px;width:100%;padding:10px 12px}.device-status{color:#8fe7f1;overflow-wrap:anywhere;margin:-10px 0 0;font-size:12px}.control-reference{color:#ffffff94;margin:0;font-size:12px;line-height:1.7}.control-reference span{margin:2px 10px 2px 0;display:inline-block}.settings-panel button{justify-self:center}.pwa-install-guide{color:#f6f2e8c2;background:#8fe7f10e;border:1px solid #8fe7f133;border-radius:3px;padding:12px 14px;font-size:12px;line-height:1.55}.pwa-install-guide summary{color:#8fe7f1;cursor:pointer;font-weight:600}.pwa-install-guide ol{margin:12px 0 8px;padding-left:22px}.pwa-install-guide li+li{margin-top:5px}.pwa-install-guide p{color:#f6f2e88c;margin:10px 0 0}.connection-status,.pwa-update{z-index:32;top:calc(env(safe-area-inset-top) + 14px);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:fixed;left:50%;transform:translate(-50%)}.connection-status[hidden],.pwa-update[hidden]{display:none}.connection-status{color:#f4dc99;letter-spacing:.12em;background:#05131ee6;border:1px solid #eecf7d4d;border-radius:999px;padding:7px 12px;font-size:10px;font-weight:600}.pwa-update{width:min(390px, calc(100vw - max(16px, env(safe-area-inset-left)) - max(16px, env(safe-area-inset-right))));color:#f6f2e8;background:#05131ef5;border:1px solid #8fe7f16b;border-radius:4px;padding:12px 14px;box-shadow:0 12px 42px #0006}.pwa-update p{margin:0 0 9px;font-size:12px;line-height:1.45}.pwa-update .button-row{justify-content:flex-end}.pwa-update button{color:#061420;background:#8fe7f1;border:0;border-radius:2px;min-height:34px;padding:7px 11px;font-size:11px;font-weight:600}.pwa-update .secondary-button{color:#d6e8ef;background:0 0;border:1px solid #8fe7f147}.pwa-update.deferred{border-color:#eecf7d8c}body.offline .pwa-update{top:calc(env(safe-area-inset-top) + 52px)}button:focus-visible,select:focus-visible,input:focus-visible,.controller-selected{outline-offset:3px;outline:3px solid #8fe7f1!important}.visual-controller{z-index:8;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;display:none;position:fixed;inset:0}.visual-controller.visible{display:block}.visual-controller button{pointer-events:auto;color:#f8e8b6;letter-spacing:.08em;background:rgba(5, 19, 30, calc(var(--touch-opacity) * .9));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);touch-action:none;border:1px solid #8fe7f18c;border-radius:50%;min-width:52px;min-height:48px;padding:8px;font:700 10px/1 Inter,sans-serif}.visual-controller button.active{color:#071722;background:#8fe7f1;box-shadow:0 0 24px #8fe7f1b3}.visual-controller button.unavailable,.touch-layout{display:none}.visual-controller[data-mode=touch] .touch-layout{display:block}.touch-stick{left:calc(env(safe-area-inset-left) + 20px);bottom:calc(env(safe-area-inset-bottom) + 18px);width:calc(132px * var(--touch-scale));height:calc(132px * var(--touch-scale));pointer-events:auto;border:1px solid rgba(143, 231, 241, calc(var(--touch-opacity) * .75));background:rgba(5, 19, 30, calc(var(--touch-opacity) * .42));touch-action:none;border-radius:50%;position:absolute}.touch-stick-knob{background:rgba(143, 231, 241, var(--touch-opacity));border-radius:50%;width:44%;height:44%;margin:-22%;position:absolute;top:50%;left:50%;box-shadow:0 0 20px #8fe7f147}.touch-look-zone{pointer-events:auto;touch-action:none;width:44%;position:absolute;top:18%;bottom:24%;right:0}.touch-look-zone span{right:calc(env(safe-area-inset-right) + 18px);color:#ffffff42;letter-spacing:.16em;font-size:9px;position:absolute;top:0}.visual-actions{right:calc(env(safe-area-inset-right) + 16px);bottom:calc(env(safe-area-inset-bottom) + 16px);align-items:end;gap:calc(8px * var(--touch-scale));pointer-events:none;grid-template-columns:repeat(3,auto);display:grid;position:absolute}.visual-actions .context-action{min-width:calc(68px * var(--touch-scale));min-height:calc(68px * var(--touch-scale));border-color:#f4dc99}.visual-actions .pause-control{right:calc(env(safe-area-inset-right) + 14px);top:calc(env(safe-area-inset-top) + 14px);min-width:44px;min-height:44px;position:fixed}.mouse-pad,.mouse-camera{pointer-events:none;display:none;position:absolute}.visual-controller[data-mode=mouse-only] .mouse-pad{grid-template-columns:repeat(3,54px);grid-template-areas:".up.""left stop right"".down.";gap:6px;display:grid;bottom:24px;left:24px}.mouse-pad [data-move=up]{grid-area:up}.mouse-pad [data-move=left]{grid-area:left}.mouse-pad [data-move=stop]{grid-area:stop}.mouse-pad [data-move=right]{grid-area:right}.mouse-pad [data-move=down]{grid-area:down}.visual-controller[data-mode=mouse-only] .mouse-camera{grid-template-columns:repeat(2,auto);gap:6px;display:grid;top:88px;right:24px}.visual-controller[data-mode=mouse-only] .visual-actions{grid-template-columns:repeat(4,auto);bottom:24px;right:24px}.portrait-note{top:calc(env(safe-area-inset-top) + 64px);color:#ffffffad;white-space:nowrap;background:#05131eb3;border-radius:2px;padding:7px 10px;font-size:10px;display:none;position:absolute;left:50%;transform:translate(-50%)}.toast{z-index:30;left:50%;bottom:calc(env(safe-area-inset-bottom) + 28px);color:#f8e8b6;text-align:center;opacity:0;pointer-events:none;background:#030e19f0;border:1px solid #eecf7d59;max-width:min(620px,100vw - 32px);padding:11px 18px;transition:opacity .18s,transform .18s;position:fixed;transform:translate(-50%,18px)}.toast.visible{opacity:1;transform:translate(-50%)}.reduce-motion *,.reduce-motion :before,.reduce-motion :after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}@media (width<=720px){.trilogy-panel{max-height:calc(100dvh - max(10px, env(safe-area-inset-top)) - max(10px, env(safe-area-inset-bottom)));padding:28px 20px 24px;overflow-y:auto}.part-selector{grid-template-columns:1fr}.panel .part-card{min-height:64px}.choice-options{grid-template-columns:1fr}.panel .choice-options button{min-height:94px}.quest-card{min-width:min(280px,100vw - 24px)}.settings-panel{gap:12px;padding:34px 22px}.control-reference{max-height:64px;overflow:auto}}@media (orientation:portrait) and (pointer:coarse){.visual-controller[data-mode=touch] .portrait-note{display:block}.touch-look-zone{top:30%;bottom:27%}.visual-actions{grid-template-columns:repeat(2,auto)}}