body.is-reading{overflow:hidden}body.is-reading:before{display:none}
.is-reading .app-shell{width:min(100%,600px);height:100dvh;min-height:0;border:0}
.is-reading .topbar,.is-reading .shell-footer{display:none}
.is-reading #story{position:relative;isolation:isolate;padding:0;gap:0;overflow:hidden;background:#0b1713;min-height:0}
.reader-backdrop{position:absolute;inset:-22px;z-index:-3;filter:blur(18px) brightness(.4);overflow:hidden;pointer-events:none}
.reader-backdrop>*{width:100%;height:100%;object-fit:cover}
.reader-art{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.reader-art>*{display:block;width:100%;height:100%;object-fit:contain}
.reader-vignette{position:absolute;inset:0;background:linear-gradient(#07110c66,transparent 28%,transparent 70%,#07110ccc);z-index:-1;pointer-events:none}
.reader-heading{position:absolute;top:calc(15px + env(safe-area-inset-top));left:20px;right:20px;display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.reader-brand{background:none;font-family:Tracker,Arial,sans-serif;font-size:20px;letter-spacing:1px;padding:0;line-height:1.1}
.reader-kicker{font-size:8px;letter-spacing:1.5px;color:#bda579;margin-top:5px}
.reader-heading-actions{display:flex;align-items:center;gap:8px}
.reader-heading #skip-story{background:#10211dc9;border:1px solid #687855;border-radius:3px;padding:8px;color:#e9dec3;font-size:10px}
.reader-locator{position:absolute;left:20px;right:20px;top:calc(76px + env(safe-area-inset-top));font-size:9px;line-height:1.6;letter-spacing:1px;color:#e4c58f;text-shadow:0 1px 4px #000;background:#0d1b16c9;width:fit-content;max-width:calc(100% - 40px);padding:6px 9px;border-left:2px solid #bda579;pointer-events:none}
.reader-copy .reader-line{position:absolute;z-index:2;max-width:78%;margin:0;padding:13px 14px;background:#e9d9b4f7;border:2px solid #20271d;box-shadow:3px 3px 0 #050b0877;color:#19221b;font:600 clamp(15px,3.9vw,18px)/1.45 Arial,sans-serif;animation:reader-line-in .25s ease-out both}
.reader-copy .reader-line.wide{max-width:calc(100% - 40px)}
.reader-speaker{display:block;font-size:9px;line-height:1.4;letter-spacing:1px;font-weight:700;color:#575a48;margin-bottom:7px}
.reader-copy .speech,.reader-copy .recording,.reader-copy .thought{background:#fff7e4;border-radius:20px;font-weight:500}
.reader-copy .recording{border-style:double;border-width:4px;border-radius:10px;font-style:italic}
.reader-copy .thought{border-style:dashed;border-radius:20px;font-style:italic}
.reader-line[data-tail]::before,.reader-line[data-tail]::after{content:'';position:absolute;left:var(--tail-position,50%);clip-path:polygon(0 100%,100% 100%,65% 0);pointer-events:none}
.reader-line[data-tail=up]::before{width:24px;height:20px;top:-21px;background:#20271d}
.reader-line[data-tail=up]::after{width:18px;height:15px;top:-15px;transform:translateX(3px);background:#fff7e4}
.reader-line[data-tail=down]::before{width:24px;height:20px;bottom:-21px;background:#20271d;transform:rotate(180deg)}
.reader-line[data-tail=down]::after{width:18px;height:15px;bottom:-15px;transform:translateX(3px) rotate(180deg);background:#fff7e4}
.reader-bottom{position:absolute;bottom:calc(18px + env(safe-area-inset-bottom));left:20px;right:20px}
.reader-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
#story .reader-dots{display:flex;gap:5px;flex:1;margin:0}#story .reader-dots span{height:3px;flex:1;background:#5d6b58}#story .reader-dots span.done{background:#d7ad73}
#reader-count{font:10px monospace;letter-spacing:1px;color:#d9c392}
.reader-controls{display:flex;gap:10px}.reader-controls #story-back{width:48px;flex:none;border:1px solid #71805b;background:#10211dc9;border-radius:3px;font-size:21px;min-height:48px}.reader-controls #story-next{width:auto;flex:1;min-height:48px;text-align:left;justify-content:space-between}
.reader-status{position:absolute;left:20px;bottom:calc(108px + env(safe-area-inset-bottom));font-size:10px;color:#d8bc8c;pointer-events:none}
#reader-retry{position:absolute;right:20px;bottom:calc(105px + env(safe-area-inset-bottom));background:#18291e;color:#e5cc9e;border:1px solid #687855;border-radius:3px;padding:6px 10px;font-size:10px}
[hidden]{display:none!important}
@keyframes reader-line-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.reader-line{animation:none!important}}