*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#101820;color:#eef3f5;font-family:system-ui,sans-serif}body{display:flex;flex-direction:column;align-items:center}#player{position:relative;width:min(100vw,450px,55.125dvh);aspect-ratio:9/16;margin:1dvh auto;overflow:hidden}canvas{display:block;touch-action:none}.player-ui{position:absolute;inset:0;pointer-events:none;color:var(--player-text, #eef3f5);font-size:clamp(14px,3.8vw,18px);padding:12px}.player-ui header{position:absolute;top:max(8px,env(safe-area-inset-top));left:12px;right:12px;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:8px}.player-ui header strong{font-size:.8em;text-shadow:0 1px 4px #000;color:var(--player-accent, #71e0ad)}.player-ui button,.player-ui input,.player-ui summary{pointer-events:auto}.player-ui button{min-height:44px;border:1px solid var(--player-accent, #71e0ad);border-radius:var(--player-radius, 8px);padding:8px 10px;background:color-mix(in srgb,var(--player-surface, #16232d) 82%,transparent);color:inherit;font:inherit;text-align:left;cursor:pointer}.player-ui button:disabled{opacity:.6;cursor:default}.player-ui :focus-visible{outline:3px solid #f0c66c;outline-offset:2px}.player-ui p{white-space:pre-line;line-height:1.4;margin:6px 0}.player-ui h2{font-size:1.3em}.character-presentation{position:absolute;inset:0;z-index:0;pointer-events:none}.character-layer{position:absolute;inset:0}.speaker-portrait{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;margin:0}.character-presentation [hidden],.player-ui [hidden]{display:none!important}.player-bottom{position:absolute;bottom:max(26px,env(safe-area-inset-bottom));left:12px;right:12px;z-index:2;display:flex;flex-direction:column;gap:8px;max-height:54%}.dialogue-overlay,.scene-instructions,.feedback-component,.media-message{background:color-mix(in srgb,var(--player-surface, #16232d) 80%,transparent);border-radius:var(--player-radius, 8px);padding:8px 10px}.dialogue-overlay{pointer-events:auto;min-height:0;display:flex;flex-direction:column;font-size:.85em}.current-line{max-height:18dvh;overflow:auto;overscroll-behavior:contain}.current-line strong{color:var(--player-accent, #71e0ad)}.dialogue-overlay>button{font-size:.8em;min-height:32px;align-self:flex-start;border:none;background:transparent;padding:3px 0}.transcript-history{overflow:auto;max-height:20dvh;overscroll-behavior:contain;border-top:1px solid #77949f;padding-top:6px}.actions{display:flex;flex-direction:column;gap:6px;overflow:auto;max-height:20dvh;min-height:0;flex-shrink:0;overscroll-behavior:contain;pointer-events:auto}.actions:empty{display:none}.actions button{flex-shrink:0;font-size:.85em}.scene-instructions{position:absolute;top:62px;left:12px;right:12px;max-height:25%;overflow:auto;pointer-events:auto;z-index:4;font-size:.8em}.player-feedback{position:absolute;top:62px;left:12px;right:12px;z-index:3;display:grid;gap:5px;max-height:32%;overflow:auto;pointer-events:auto;overscroll-behavior:contain}.player-feedback:not([hidden]):not(:empty)+.scene-instructions{top:36%}.feedback-component{display:grid;grid-template-columns:1fr auto;gap:2px 8px;font-size:.75em}.feedback-component strong,.feedback-component span{grid-column:1/-1}.feedback-component progress{width:100%;accent-color:var(--player-accent, #71e0ad)}.feedback-component[data-kind=awareness] progress{accent-color:var(--player-danger, #ffb48e)}.feedback-component[data-completed=true]{border:1px solid var(--player-accent, #71e0ad)}.storage-feedback{position:absolute;bottom:4px;left:12px;right:12px;text-align:center;font-size:.65em;text-shadow:0 1px 3px #000;opacity:1;transition:opacity .25s;animation:feedback-in .25s}.storage-feedback.fading{opacity:0}@keyframes feedback-in{0%{opacity:0}to{opacity:1}}.loading-feedback{position:absolute;inset:45% 8% auto;z-index:5;padding:12px;text-align:center;background:#16232dcc;border-radius:8px;opacity:0;animation:feedback-in .25s .35s forwards}.loading-feedback.finished{animation:none;opacity:0;transition:opacity .25s}.modal-shade{position:absolute;inset:0;z-index:20;pointer-events:auto;background:#09121d88;display:flex;align-items:center;justify-content:center;padding:16px}.modal{max-height:95%;overflow:auto;overscroll-behavior:contain;width:100%;background:color-mix(in srgb,var(--player-surface, #16232d) 93%,transparent);border:1px solid #78939e;border-radius:12px;padding:16px}.modal label{display:flex;align-items:center;gap:10px;min-height:44px}.modal input{width:22px;height:22px}.modal button{width:100%;margin-top:10px}.large-text{font-size:clamp(17px,4.5vw,22px)}#status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.player-ui[data-paused=true] *{animation-play-state:paused!important}.player-ui[data-reduced-motion=true] *{animation:none!important;transition:none!important}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.loading-feedback{opacity:1}}.results-screen{background:var(--player-surface, #16232d)}.results-content{position:absolute;inset:76px 16px 32px;overflow:auto;overscroll-behavior:contain;pointer-events:auto;display:flex;flex-direction:column;gap:20px}.results-summary h1{font-size:1.6em;color:var(--player-accent, #71e0ad);margin:12px 0 24px}.results-content .actions{flex-shrink:0;max-height:none}.results-content .dialogue-overlay{background:transparent}.results-content .transcript-history{max-height:25dvh}.results-screen .player-feedback{display:none}.transcript-history>p{padding:10px 0;margin:0;border-bottom:1px solid color-mix(in srgb,var(--player-text) 14%,transparent);line-height:1.55}.transcript-history strong{color:var(--player-accent, #71e0ad)}.transcript-history>p[data-kind=action]{color:#f0d39a;font-style:italic;padding-left:10px;border-left:2px solid currentColor}.transcript-history>p[data-kind=action] strong{color:inherit}.transcript-history>p[data-kind=choice] strong{color:#a9d7ff}.player-ui header{background:transparent}.transcript-history strong{color:inherit}.transcript-history>p[data-kind=completion]{color:#9de1b2;font-style:italic}.transcript-history>p[data-kind=interception]{color:#ffb2bb;font-style:italic}.transcript-history>p[data-kind=narration],.transcript-history>p[data-kind=action]{color:#d2d8de;font-style:italic}.transcript-context{display:block;margin-top:6px;color:#e0e4e9;font-style:normal}.feedback-component{opacity:1;transition:none}.feedback-component.fading{opacity:0}.feedback-component[data-tone=positive]>strong{color:#9de1b2}.feedback-component[data-tone=negative]>strong{color:#ffb2bb}.player-ui[data-reduced-motion=true] .feedback-component{transition:none}.modal label:has(input[type=range]){display:grid;grid-template-columns:10rem minmax(6rem,1fr);align-items:center;gap:.5rem}.modal input[type=range]{width:100%;height:1.5rem;padding:0}.current-line[data-kind=completion]{color:#9de1b2;font-style:italic}.current-line[data-kind=interception]{color:#ffb2bb;font-style:italic}.current-line .subtitle{color:#e0e4e9;font-style:normal;white-space:pre-line}.player-bottom.focus-hidden,.player-bottom.focus-hidden *{pointer-events:none!important}.floating-feedback{position:absolute;inset:0;z-index:3;pointer-events:none}.floating-feedback .feedback-component{position:absolute;box-sizing:border-box;pointer-events:none}.player-feedback{pointer-events:none;overflow:hidden;max-height:none}.player-ui :is(.current-line,.transcript-history,.actions,.results-content,.scene-instructions,.player-feedback,.modal){scrollbar-width:thin;scrollbar-color:var(--player-accent, #71e0ad) transparent;overscroll-behavior:contain}.player-ui :is(.current-line,.transcript-history,.actions,.results-content,.scene-instructions,.player-feedback,.modal)::-webkit-scrollbar{width:6px;height:6px}.player-ui :is(.current-line,.transcript-history,.actions,.results-content,.scene-instructions,.player-feedback,.modal)::-webkit-scrollbar-thumb{background:var(--player-accent, #71e0ad);border-radius:var(--player-radius, 8px)}.player-ui :is(.current-line,.transcript-history,.actions,.results-content,.scene-instructions,.player-feedback,.modal)::-webkit-scrollbar-track{background:transparent}@media(forced-colors:active){.player-ui :is(.current-line,.transcript-history,.actions,.results-content,.scene-instructions,.player-feedback,.modal){scrollbar-color:auto}}.actions button[data-visited=true]{border-style:dashed;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:.2em}.results-summary{max-width:52rem;margin-inline:auto}.results-summary p{white-space:pre-wrap}.results-score{font-size:1.5rem;font-weight:700;color:var(--player-accent)}.results-counts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.results-counts dd{margin:.3rem 0;font-size:1.6rem}.results-summary details{margin-block:1rem;padding:.8rem;border:1px solid currentColor;border-radius:8px}.results-summary article{padding-block:.8rem;border-bottom:1px solid currentColor}.result-share-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-block:1rem}.result-sharing canvas{max-width:100%;height:auto}.share-text-preview{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;-webkit-user-select:text;user-select:text}.result-sharing input{box-sizing:border-box;width:100%}.ending-artwork{display:block;width:100%;max-height:45vh;object-fit:contain;border-radius:var(--player-radius);margin-bottom:1rem}.ending-actions{display:grid;gap:.8rem;margin-top:1.2rem}.ending-action-link{display:block;padding:.7rem .9rem;border:1px solid currentColor;border-radius:var(--player-radius);color:inherit;text-decoration:none;overflow-wrap:anywhere}.ending-action-link.primary{background:var(--player-accent, #71e0ad);color:var(--player-surface, #16232d);font-weight:700}.ending-actions [aria-disabled=true]{opacity:.5;cursor:default}.ending-action details{margin-top:.35rem;font-size:.85em}.ending-link-fallback{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center;padding:.5rem 0}.ending-link-fallback input{max-width:100%;min-width:0}.ending-actions a:focus-visible{outline:2px solid currentColor;outline-offset:3px}.ending-action details{border:0;padding:0;background:transparent}.ending-link-fallback a{color:var(--player-accent, #71e0ad)}