*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg: #0e0e0e;--ink: #d4c9b0;--ink-dim: #6b6357;--ink-faint: #2e2b27;--accent: #8a7a65}html,body{height:100%}body{background:var(--bg);color:var(--ink);font-family:Georgia,serif}#app{min-height:100vh}.setup-overlay{max-width:700px;width:100%;margin:0 auto;padding:4rem 6rem;display:flex;flex-direction:column;gap:.8rem}.setup-row{display:flex;align-items:baseline;gap:.6rem}body.dyslexic{font-family:Atkinson Hyperlegible,sans-serif}#dyslexic-label{display:flex;align-items:center;gap:.3rem;font-size:.75rem;color:var(--ink-faint);cursor:pointer;-webkit-user-select:none;user-select:none;letter-spacing:.08em}#dyslexic-label:hover{color:var(--ink-dim)}#dyslexic-check{accent-color:var(--accent);cursor:pointer}.setup-overlay input[type=text]{background:transparent;border:none;border-bottom:1px solid var(--ink-faint);color:var(--ink-dim);font-family:inherit;font-size:1.25rem;line-height:1.8;padding:0 0 .1rem;width:280px;outline:none;transition:border-color .2s,color .2s}.setup-overlay input[type=text]::placeholder{color:var(--ink-faint)}.setup-overlay input[type=text]:not(:placeholder-shown){color:var(--ink)}#begin-btn{padding:0;display:flex;align-items:center}#begin-btn svg{width:16px;height:16px;color:var(--ink-dim);transition:color .2s}#begin-btn:hover:not(:disabled) svg{color:var(--ink)}#begin-btn:disabled svg{opacity:.2}button{background:transparent;border:none;color:var(--ink-dim);font-family:inherit;font-size:.8rem;letter-spacing:.12em;cursor:pointer;padding:.3rem .5rem;transition:color .2s}button:hover:not(:disabled){color:var(--ink)}button:disabled{opacity:.3;cursor:default}.page{position:relative;width:100vw;min-height:100vh}#yt-player{position:fixed;top:1.2rem;right:1.2rem;width:120px;height:68px;opacity:.35;border-radius:3px;overflow:hidden;pointer-events:none}#volume-wrap{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:.5rem}#volume-wrap[hidden]{display:none}#volume-icon{width:14px;height:14px;color:var(--ink-dim);flex-shrink:0}#volume-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:80px;height:2px;background:var(--ink-faint);outline:none;border-radius:1px;cursor:pointer}#volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:10px;height:10px;border-radius:50%;background:var(--ink-dim);cursor:pointer;transition:background .2s}#volume-slider:hover::-webkit-slider-thumb{background:var(--ink)}.canvas{flex:1;padding:4rem 6rem;max-width:700px;width:100%;margin:0 auto;font-size:1.25rem;line-height:1.8;letter-spacing:.01em;min-height:100vh;word-break:break-word;white-space:pre-wrap;outline:none}.canvas s{color:var(--ink-dim);text-decoration:line-through;text-decoration-color:var(--ink-faint)}.cursor{display:inline-block;width:2px;height:1.1em;background:var(--accent);vertical-align:text-bottom;margin-left:1px;animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}#seal-btn{position:fixed;bottom:1.5rem;right:1.8rem;font-size:.75rem;letter-spacing:.18em}a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--ink-faint);transition:text-decoration-color .2s}a:hover{text-decoration-color:var(--ink)}.done{display:flex;flex-direction:column;align-items:center;gap:1.4rem;text-align:center}.done-message{font-size:1.1rem;color:var(--ink);letter-spacing:.05em}.done-link{font-size:.85rem;color:var(--accent);font-family:monospace}#again-btn{margin-top:.5rem}.play-again{cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--ink-faint);transition:text-decoration-color .2s;color:var(--ink-dim)}.play-again:hover{text-decoration-color:var(--ink);color:var(--ink)}