.reader{--reader-text:21px;--reader-stage:40%;--reader-highlight:#f2d9a2;grid-template-columns:minmax(0,1fr);grid-template-areas:"bar""stage""text""nav";grid-template-rows:auto minmax(0, var(--reader-stage)) minmax(0, 1fr) auto;background:var(--bg);height:100dvh;display:grid;overflow:hidden}.reader[data-large=true]{--reader-text:27px}.reader[data-stage=off]{grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"bar""text""nav"}.reader[data-stage=book]{--reader-stage:min(75vw, 55%)}.reader-bar{align-items:center;gap:var(--space-2);min-height:48px;padding-top:env(safe-area-inset-top,0px);padding-inline:var(--space-2);border-bottom:1px solid var(--line);background:var(--surface);grid-area:bar;display:flex}.reader-title{min-width:0;font-size:var(--fs-body);white-space:nowrap;text-overflow:ellipsis;flex:auto;font-weight:700;overflow:hidden}.reader-modes{border-radius:var(--radius-control);background:var(--surface-2);flex:none;gap:2px;padding:2px;display:inline-flex}.reader-mode{min-height:44px;color:var(--ink);font-size:var(--fs-meta);white-space:nowrap;transition:background-color .15s ease, transform .15s var(--ease);background:0 0;border:0;border-radius:8px;padding:0 12px;font-weight:700}.reader-mode[aria-pressed=true]{background:var(--surface);box-shadow:var(--shadow-card)}.reader-mode:active{transform:scale(.96)}.reader-aa{font-family:var(--font-display);font-size:var(--fs-lead);flex:none}.reader-stage{background:var(--surface-3);grid-area:stage;min-height:0;position:relative;overflow:hidden}.reader-stage canvas{width:100%;height:100%;display:block}.reader[data-kind=illustrated] .reader-stage{touch-action:none}.reader[data-kind=editorial] .reader-stage{touch-action:pan-y}.reader-scene-status{left:var(--space-3);right:var(--space-3);bottom:var(--space-2);font-size:var(--fs-meta);color:var(--ink);text-align:center;pointer-events:none;position:absolute}.reader-scene-status:not(:empty){border-radius:var(--radius-s);background:var(--surface);padding:6px 10px}.reader-panel{overscroll-behavior:contain;touch-action:pan-y;min-height:0;padding:var(--space-4) var(--gutter) var(--space-5);grid-area:text;overflow-y:auto}.reader-sheet{gap:var(--space-3);flex-direction:column;max-width:62ch;margin:0 auto;display:flex}.reader-heading{font-size:var(--fs-h3)}.reader h1:focus-visible{outline:0}.reader-words{font-size:var(--reader-text);line-height:1.65}.reader-words button{border-radius:var(--radius-s);font:inherit;color:inherit;line-height:inherit;text-underline-offset:5px;background:0 0;border:0;padding:0;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;display:inline}.reader-word{border-radius:var(--radius-s);position:relative}.reader-word:before{content:"";position:absolute;inset:-6px -4px}.reader-word.highlight{background:var(--reader-highlight);box-shadow:0 0 0 2px var(--reader-highlight)}.reader-hint{align-items:center;gap:6px;display:flex}.reader-notice{max-width:62ch;margin:0 auto var(--space-3);align-items:center;gap:6px;display:flex}.reader-cover{align-items:center;gap:var(--space-3);text-align:center;flex-direction:column;max-width:460px;margin:0 auto;display:flex}.reader-cover-art{border-radius:var(--radius);width:auto;max-height:45dvh}.reader-cover-title{font-size:var(--fs-h2)}.reader-cover-actions{align-items:stretch;gap:var(--space-2);width:100%;margin-top:var(--space-2);flex-direction:column;display:flex}.reader-page-art{border-radius:var(--radius);width:100%}.reader-end{gap:var(--space-3);flex-direction:column;max-width:62ch;margin:0 auto;display:flex}.reader-end-title{font-size:var(--fs-h2)}.reader-dedication{color:var(--accent-text);font-style:italic}.reader-end-actions{gap:var(--space-2);margin-top:var(--space-2);flex-wrap:wrap;display:flex}.reader-nav{gap:var(--space-2);padding:var(--space-1) var(--gutter);padding-bottom:calc(var(--space-1) + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);background:var(--surface);touch-action:pan-y;grid-area:nav;display:grid;container:reader-nav/inline-size}.reader-steps{align-items:center;gap:var(--space-3);min-height:48px;display:flex}.reader-progress{min-width:0;font-size:var(--fs-meta);font-variant-numeric:tabular-nums;flex-direction:column;flex:auto;align-items:center;gap:6px;font-weight:700;display:flex}.reader-progress .bar{width:100%}.reader-progress>span:last-child{white-space:nowrap}.reader-audio{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.reader-play{background:var(--ink);width:48px;height:48px;color:var(--surface);transition:transform .15s var(--ease);border:0;border-radius:50%;flex:none;position:relative}.reader-play:active{transform:scale(.96)}.reader-play-icon{transition:opacity .3s var(--ease), transform .3s var(--ease), filter .3s var(--ease);place-items:center;display:grid;position:absolute;inset:0}.reader-play[data-playing=false] .reader-play-icon[data-icon=pause],.reader-play[data-playing=true] .reader-play-icon[data-icon=play]{opacity:0;filter:blur(4px);transform:scale(.25)}.reader-track{background:var(--line);border-radius:2px;flex:80px;min-width:60px;height:4px;overflow:hidden}.reader-track>i{background:var(--ink);transform-origin:0;height:100%;transition:transform .2s linear;display:block}.reader-time{font-size:var(--fs-meta);white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink-muted);flex:none}.reader-narrate{flex:none;min-height:44px}@container reader-nav not (min-width:23rem){.reader-audio{gap:6px var(--space-3);grid-template:"play track narrate"1fr"play time narrate"1fr/auto minmax(0,1fr) auto;display:grid}.reader-play{grid-area:play}.reader-track{grid-area:track;align-self:end;min-width:0}.reader-time{grid-area:time;align-self:start;line-height:1}.reader-narrate{grid-area:narrate}}@container reader-nav not (min-width:24rem){.reader-steps[data-locked] .btn-secondary{min-width:48px;padding:0}.reader-steps[data-locked] .reader-step-label{clip:rect(0, 0, 0, 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}@container reader-nav not (min-width:22rem){.reader-steps{gap:var(--space-2)}.reader-steps .btn-secondary{min-width:48px;padding:0}.reader-step-label{clip:rect(0, 0, 0, 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.reader-steps .btn-primary{white-space:normal;text-wrap:balance;padding-inline:16px 14px;line-height:1.1}}@container reader-nav not (min-width:18rem){.reader-steps .btn-primary{padding-inline:14px}.reader-steps .btn-primary svg{display:none}.reader-audio{column-gap:var(--space-1)}.reader-narrate{padding-inline:var(--space-2)}}.reader>audio{display:none}.reader-loading{min-height:100dvh}.reader-exit{justify-content:center;min-height:100dvh}@media (hover:hover) and (pointer:fine){.reader-mode:hover{color:var(--accent-text)}.reader-words button:hover{background:var(--surface-2)}}@media (max-width:700px){.reader,.reader[data-stage=book]{--reader-stage:min(75vw, 45%)}.reader-mode{padding:0 10px}.reader-panel{padding:var(--space-3) var(--gutter) var(--space-4)}}@media (max-width:480px){.reader-bar{gap:var(--space-1)}.reader-mode{padding:0 8px}}@media (max-width:700px),(max-height:500px) and (orientation:landscape){.reader[data-stage=on] .reader-sheet>.eyebrow{display:none}.reader-hint{font-size:var(--fs-meta)}}@media (min-width:961px),(min-width:701px) and (orientation:landscape),(max-height:500px) and (orientation:landscape){.reader[data-stage=on],.reader[data-stage=book]{grid-template:"bar bar""stage text"minmax(0,1fr)"stage nav"/minmax(0,1fr) max(40%,20rem)}.reader-sheet{gap:var(--space-4)}}