.reader-shell{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:calc(100svh - var(--enclosure-top,48px) - var(--enclosure-bottom,32px) - 2 * var(--enclosure-edge,8px) - 20px);min-height:520px;max-height:1100px;background:var(--listen-panel);border:1px solid var(--listen-line)}
.reader-transport{display:flex;align-items:center;gap:12px;padding:10px 14px;min-width:0;border-bottom:1px solid var(--listen-line);font:12px var(--listen-mono);color:var(--listen-text)}
.reader-transport label{display:flex;align-items:center;gap:7px;min-width:0}.reader-chapter{flex:0 1 40%}.reader-chapter select{width:100%;min-width:0}.reader-position{flex:1}.reader-position input{width:100%;min-width:60px;accent-color:var(--listen-cyan)}
.reader-shell select{background:var(--listen-panel);color:var(--listen-text);border:1px solid var(--listen-line);font:inherit;padding:6px}.reader-shell .viewport-play{position:static;transform:none;min-width:76px;padding:8px;min-height:34px;flex-direction:row}
.reader-shell .text-media-viewport{position:relative!important;inset:auto!important;width:100%!important;height:100%!important;min-height:0!important;max-height:none;border:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden}
.reader-shell .text-media-viewport::after{display:none}.reading-stage{min-width:0;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);overflow:hidden}.has-demonstration .reading-stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.reader-shell .text-media-viewport .viewport-lines{position:relative!important;inset:auto!important;transform:none!important;width:auto!important;height:auto!important;min-width:0;min-height:0;margin:0;padding:20px 26px;display:flex;flex-direction:column;justify-content:center;gap:18px;overflow:hidden}
.reader-shell .viewport-line{display:block;flex:0 0 auto;min-width:0;max-width:100%;line-height:1.3;letter-spacing:-.025em;overflow-wrap:anywhere;white-space:normal;animation:none;overflow:visible}
.reader-shell .text-media-viewport:not(.wrap-mode) .viewport-line{white-space:nowrap}
.reader-shell .viewport-bezel-bottom{position:relative;inset:auto;display:flex;flex-wrap:wrap;gap:10px;padding:9px 14px;min-width:0;justify-content:space-between;background:var(--listen-panel)}
.reader-shell .viewport-bezel-bottom>#viewport-title{flex:1;min-width:100px;max-width:35%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reader-shell .viewport-controls{position:static;display:flex!important;flex-wrap:wrap;gap:6px;margin-left:auto;min-width:0;max-width:100%}.reader-speed{display:flex;align-items:center;gap:6px;font:11px var(--listen-mono)}
.reader-shell .demonstration-panel{position:relative;inset:auto;width:auto;min-width:0;min-height:0;margin:0;border:0;border-left:1px solid var(--listen-line);box-shadow:none;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;background:var(--listen-panel);overflow:hidden}
.reader-shell .demonstration-panel>canvas{width:100%;height:100%;min-height:0;object-fit:contain;display:block}.reader-shell .demonstration-header{min-width:0}.reader-shell .demonstration-caption{font-size:10px;padding:6px 10px}.reader-shell .device-qr-corner{padding:5px 8px}.reader-shell .device-qr-corner canvas{width:92px;height:92px;min-height:92px}
.reader-shell .listen-ticker{position:relative!important;inset:auto!important;display:grid;grid-template-columns:auto minmax(0,1fr);border:0;border-top:1px solid var(--listen-line);min-height:40px;background:var(--listen-panel)}
.equation-ticker-label{font:10px var(--listen-mono);align-self:center;padding:0 12px;color:var(--listen-cyan)}.equation-ticker-window{overflow:hidden;min-width:0}.reader-shell .ticker-track{height:40px;animation:equation-scroll var(--equation-cycle,535s) linear infinite}.reader-shell .ticker-track button{font-size:10px;letter-spacing:0;text-transform:none}.reader-shell .listen-ticker:hover .ticker-track,.reader-shell .listen-ticker:focus-within .ticker-track{animation-play-state:paused}.reader-shell .listen-ticker:focus-within .equation-ticker-window{overflow-x:auto}.reader-shell .ticker-track button[aria-current=true]{color:var(--listen-cyan);box-shadow:inset 0 -2px var(--listen-cyan)}
.reader-shell .equation-ticker-window{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-x;overscroll-behavior-x:contain;scroll-behavior:auto}.equation-ticker-window::-webkit-scrollbar{display:none}.reader-shell .ticker-track{animation:none!important;transform:none!important;position:relative;will-change:auto}.reader-shell .ticker-track button{flex-shrink:0}.reader-shell .ticker-track button:focus-visible{outline:2px solid var(--listen-cyan);outline-offset:-3px}
.viewport-fullscreen .reader-shell{position:fixed;top:calc(var(--enclosure-edge,0px) + var(--enclosure-top,0px));bottom:calc(var(--enclosure-edge,0px) + var(--enclosure-bottom,0px));left:var(--enclosure-edge,0px);right:var(--enclosure-edge,0px);height:auto;min-height:0;max-height:none;z-index:1000}
@media(max-width:700px){.reader-shell{min-height:600px}.reader-transport{flex-wrap:wrap;gap:8px;padding:8px}.reader-chapter{flex:1}.reader-position{flex-basis:100%}.has-demonstration .reading-stage{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1.15fr)}.reader-shell .text-media-viewport .viewport-lines{padding:12px 16px;gap:8px}.reader-shell .demonstration-panel{border-left:0;border-top:1px solid var(--listen-line);grid-template-columns:minmax(0,1fr) 94px;grid-template-rows:auto minmax(0,1fr)}.reader-shell .demonstration-header{grid-column:1/-1;font-size:10px;padding:4px 8px}.reader-shell .demonstration-caption{display:none}.reader-shell .device-qr-corner{grid-column:2;grid-row:2;padding:3px;align-self:center;border-top:0}.reader-shell .device-qr-corner>span{display:none}.reader-shell .device-qr-corner canvas{width:82px;height:82px;min-height:82px}.reader-shell .viewport-bezel-bottom{gap:5px;padding:6px}.reader-shell .viewport-bezel-bottom>#viewport-title{display:none}.reader-shell .viewport-controls{gap:4px}.reader-shell .viewport-control{min-height:28px;padding:5px!important}.equation-ticker-label{padding:0 7px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.reader-shell .ticker-track{animation:none}.equation-ticker-window{overflow-x:auto}}
.reading-stage{position:relative}.understanding-prompt{position:absolute;z-index:6;left:16px;bottom:16px;width:calc(50% - 32px);padding:18px;background:var(--listen-panel);color:var(--listen-text);border:1px solid var(--listen-cyan);font:14px/1.5 var(--listen-mono);box-sizing:border-box}.understanding-prompt[hidden]{display:none}.understanding-prompt h2{margin:0 0 8px;font:600 19px/1.3 var(--listen-mono)}.understanding-prompt p{margin:6px 0}.understanding-topic{font-size:12px;color:var(--listen-dim)}.understanding-prompt>div{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.demonstration-panel[data-learning-pause] canvas{opacity:1!important}@media(max-width:700px){.understanding-prompt{top:10px;bottom:auto;left:10px;width:calc(100% - 20px);padding:12px}.understanding-prompt h2{font-size:16px}}
