/* Reader styles are intentionally scoped so the catalog keeps its own theme. */
.reader-modal-overlay {
  --reader-bg:#0c0f14; --reader-panel:#181d25; --reader-text:#f2efe8;
  --reader-accent:#d5ba86; --reader-accent-ink:#211c13;
  --reader-muted:#979da8; --reader-line:#303641; --reader-control:#222934; --reader-active:#394150;
  position:fixed; inset:0; z-index:100; height:100dvh; background:var(--reader-bg); color:var(--reader-text);
  display:flex; flex-direction:column; font-family:Inter,Arial,sans-serif; color-scheme:dark;
}
body.reader-active { overflow:hidden; }
.reader-modal-overlay button { font:inherit; color:inherit; cursor:pointer; text-transform:none; letter-spacing:normal; box-shadow:none; }
.reader-modal-overlay button:focus-visible,.reader-modal-overlay input:focus-visible,.reader-modal-overlay textarea:focus-visible,.reader-modal-overlay summary:focus-visible { outline:2px solid currentColor; outline-offset:4px; }
.reader-modal-overlay button:disabled { opacity:.25; cursor:default; }
.reader-modal-overlay .reader-top-bar { flex:none; height:76px; min-height:76px; padding:10px 12px; gap:12px; display:flex; align-items:center; justify-content:space-between; background:var(--reader-bg); border:0; backdrop-filter:none; z-index:2; }
.reader-modal-overlay .reader-icon { flex:none; width:44px; height:44px; display:grid; place-items:center; border:0; border-radius:50%; background:transparent; padding:10px; }
.reader-modal-overlay svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.reader-modal-overlay .reader-back { width:48px; height:48px; border:1px solid var(--reader-line); border-radius:14px; padding:12px; }
.reader-modal-overlay .reader-chapter-select { display:flex; align-items:center; justify-content:center; gap:7px; white-space:nowrap; border:1px solid var(--reader-line); border-radius:14px; background:var(--reader-control); padding:12px 15px; color:var(--reader-text); font-weight:650; font-size:17px; }
.reader-chapter-select svg { width:16px; height:16px; stroke-width:3; }
.reader-modal-overlay .reader-counter { display:flex; align-items:baseline; justify-content:center; white-space:nowrap; gap:4px; border:0; padding:7px 0; background:transparent; }
.reader-counter b { color:var(--reader-accent); font-size:23px; font-weight:750; }
.reader-counter span { font-size:14px; font-weight:750; }
.reader-modal-overlay .reader-icon.is-saved svg { fill:currentColor; }
.reader-modal-overlay .reader-progress { position:relative; flex:none; top:auto; left:auto; right:auto; width:100%; height:2px; z-index:2; background:var(--reader-line); }
.reader-modal-overlay .reader-progress-fill { background:var(--reader-accent); height:100%; }
.reader-modal-overlay .reader-content { position:relative; min-height:0; flex:1; width:100%; overflow:auto; padding:0; display:flex; flex-direction:column; align-items:center; background:var(--reader-bg); scrollbar-width:thin; }
.reader-modal-overlay .reader-content.is-slides { overflow:hidden; }
.reader-modal-overlay .reader-slides { position:relative; width:100%; height:100%; min-height:0; display:flex; justify-content:center; align-items:center; touch-action:pan-y pinch-zoom; }
.reader-slide-page { position:relative; max-width:100%; max-height:100%; display:flex; flex-direction:column; align-items:center; }
.reader-modal-overlay .reader-slide-page .reader-page-img { display:block; max-height:calc(100dvh - 178px); max-width:100%; width:auto; height:auto; object-fit:contain; margin:0; }
.reader-modal-overlay .reader-page-wrap { position:relative; content-visibility:visible; contain-intrinsic-size:none; }
.reader-modal-overlay .reader-page-img { max-width:100%; display:block; margin:0 auto; }
.reader-modal-overlay .feed-fit-width .reader-page-img { width:100%; }
.reader-modal-overlay .feed-fit-original { max-width:100%; overflow:auto; }
.reader-modal-overlay .feed-fit-original .reader-page-img { max-width:none; }
.reader-modal-overlay .feed-fit-page .reader-page-img { width:auto; max-height:calc(100dvh - 178px); margin:0 auto; }
.reader-modal-overlay .reader-page-stamp { display:block; padding:5px 14px; margin:0 auto; background:var(--reader-bg); color:var(--reader-text); width:max-content; font-size:18px; font-weight:700; line-height:1.3; font-variant-numeric:tabular-nums; }
.reader-page-stamp small { font-size:15px; font-weight:700; }
.reader-modal-overlay .reader-tap-zone { position:absolute; inset-block:0; width:30%; z-index:3; background:transparent; border:0; padding:0; border-radius:0; }
.reader-modal-overlay .reader-tap-zone.left { left:0; }
.reader-modal-overlay .reader-tap-zone.right { right:0; }
.reader-modal-overlay .reader-tap-zone:active { background:#ffffff04; }
.reader-modal-overlay .reader-center-zone { position:absolute; inset:0 30%; z-index:3; border:0; background:transparent; }
.reader-modal-overlay .reader-bottom-bar { flex:none; height:100px; padding:10px 20px max(10px,env(safe-area-inset-bottom)); display:flex; justify-content:center; align-items:center; gap:48px; background:var(--reader-bg); }
.reader-modal-overlay .reader-notes-button { width:auto; height:46px; padding:0 18px; display:flex; gap:9px; border-radius:14px; background:var(--reader-control); border:1px solid var(--reader-line); color:var(--reader-text); font-size:13px; font-weight:600; }
.reader-modal-overlay .reader-notes-button svg { width:23px; height:23px; }
.reader-modal-overlay .reader-neighbor { background:transparent; border:0; font-size:30px; width:40px; height:44px; color:var(--reader-muted); }
.reader-modal-overlay .reader-neighbor:disabled { visibility:hidden; }
.reader-message { margin:auto; padding:28px; text-align:center; color:var(--reader-muted); }
.reader-message button,.reader-slide-error button { border:1px solid var(--reader-line); border-radius:20px; background:var(--reader-control); padding:10px 22px; }
.reader-slide-error { position:absolute; inset:0; min-width:240px; min-height:150px; display:flex; flex-direction:column; justify-content:center; align-items:center; background:var(--reader-bg); z-index:4; }
.reader-modal-overlay .reader-page-skeleton { background:var(--reader-panel); border:0; border-radius:0; }
.reader-modal-overlay .reader-page-skeleton span { color:var(--reader-muted); }
.reader-modal-overlay .reader-chapter-end { padding:32px 16px; margin:20px 0; background:var(--reader-panel); border:1px solid var(--reader-line); border-radius:16px; box-shadow:none; }
.reader-modal-overlay .reader-chapter-end b { color:var(--reader-text); }
.reader-modal-overlay .primary { background:var(--reader-control); color:var(--reader-text); border:1px solid var(--reader-line); border-radius:22px; }
.reader-sheet-backdrop { position:absolute; inset:0; z-index:10; background:#0008; display:flex; align-items:flex-end; justify-content:center; }
.reader-sheet { width:100%; max-width:560px; max-height:min(80dvh,850px); display:flex; flex-direction:column; background:var(--reader-panel); border:1px solid var(--reader-line); border-bottom:0; border-radius:22px 22px 0 0; padding:22px 20px 0; box-shadow:0 -6px 30px #0002; outline:none; }
.reader-sheet-heading { display:flex; flex:none; align-items:center; justify-content:space-between; gap:10px; padding:0 0 20px; }
.reader-sheet-heading h2 { margin:0; font-size:23px; font-weight:750; letter-spacing:-.6px; text-transform:none; color:var(--reader-text); line-height:1.25; }
.reader-modal-overlay .reader-sheet-heading button { border:0; background:transparent; color:var(--reader-muted); padding:8px 2px; font-size:16px; font-weight:700; }
.reader-sheet-scroll { min-height:0; overflow:auto; overscroll-behavior:contain; padding:0 0 max(10px,env(safe-area-inset-bottom)); scrollbar-width:thin; }
.reader-setting { border:0; border-radius:12px; background:var(--reader-control); padding:19px 18px; margin-bottom:12px; }
.reader-setting h3 { margin:0; font-size:18px; font-weight:700; line-height:1.3; color:var(--reader-text); }
.reader-setting p { color:var(--reader-muted); font-size:15px; line-height:1.45; margin:5px 0 0; }
.reader-segments { display:flex; padding:4px; border-radius:11px; background:var(--reader-bg); margin-top:15px; gap:0; }
.reader-modal-overlay .reader-segments button { flex:1; min-width:0; padding:12px 8px; font-size:15px; font-weight:650; color:var(--reader-muted); border:0; border-radius:8px; background:transparent; white-space:nowrap; }
.reader-modal-overlay .reader-segments button[aria-pressed="true"] { background:var(--reader-accent); color:var(--reader-accent-ink); box-shadow:0 2px 8px #0002; }
.reader-setting-row { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:82px; }
.reader-setting-row .reader-segments { margin:0; flex:none; }
.reader-setting-row .reader-segments button { padding:9px 12px; }
.reader-modal-overlay .reader-switch { position:relative; flex:none; width:48px; height:29px; padding:0; border:0; border-radius:30px; background:#555; }
.reader-switch:after { content:""; position:absolute; width:21px; height:21px; left:4px; top:4px; border-radius:50%; background:#ddd; transition:transform .16s; }
.reader-modal-overlay .reader-switch[aria-checked="true"] { background:var(--reader-accent); }
.reader-switch[aria-checked="true"]:after { background:var(--reader-accent-ink); transform:translateX(19px); }
.reader-extra summary { cursor:pointer; color:var(--reader-muted); }
.reader-extra label,.reader-range,.reader-jump-form label { display:block; font-size:15px; line-height:1.5; margin-top:16px; }
.reader-extra select,.reader-search,.reader-jump-form input,.reader-note { display:block; width:100%; margin:8px 0; background:var(--reader-control); color:var(--reader-text); border:1px solid var(--reader-line); padding:12px; border-radius:12px; font:inherit; }
.reader-extra button,.reader-jump-form button { border:0; border-radius:24px; padding:12px 18px; background:var(--reader-active); margin:12px 0 0; }
.reader-modal-overlay input[type="range"] { display:block; width:100%; padding:0; margin:18px 0; accent-color:#bbb; }
.reader-range b { float:right; }
.reader-picker-group h3 { color:var(--reader-muted); font-size:14px; margin:20px 0 8px; }
.reader-picker-group button { display:block; width:100%; border:0; border-bottom:1px solid var(--reader-line); background:transparent; text-align:left; padding:14px 8px; }
.reader-picker-group button[aria-current="true"] { background:var(--reader-active); border-radius:8px; }
.reader-note { min-height:200px; resize:vertical; }
.reader-notes-hint { color:var(--reader-muted); line-height:1.5; font-size:14px; }
.reader-modal-overlay.reader-theme-light { --reader-bg:#f6f3ed; --reader-panel:#fffdfa; --reader-text:#25272d; --reader-muted:#74757a; --reader-line:#dedbd5; --reader-control:#ece9e3; --reader-active:#ded8cc; --reader-accent:#886731; --reader-accent-ink:#fffaf0; color-scheme:light; }
.reader-theme-light .reader-notes-button { background:var(--reader-control); }
.reader-modal-overlay.reader-zen .reader-top-bar,.reader-modal-overlay.reader-zen .reader-progress,.reader-modal-overlay.reader-zen .reader-bottom-bar { display:none; }
.reader-modal-overlay.reader-zen .reader-slide-page .reader-page-img { max-height:calc(100dvh - 38px); }
.reader-modal-overlay .reader-zen-restore { position:absolute; right:12px; top:12px; background:#222c; color:white; border:1px solid #7778; border-radius:22px; padding:8px 13px; z-index:4; }
@media(min-width:700px) { .reader-modal-overlay .reader-top-bar { justify-content:center; gap:28px; } .reader-sheet { margin-bottom:20px; border-bottom:1px solid var(--reader-line); border-radius:25px; } }
@media(max-width:380px) { .reader-modal-overlay .reader-top-bar { gap:4px; padding:8px; height:66px; min-height:66px; } .reader-modal-overlay .reader-icon { width:36px; height:40px; padding:7px; } .reader-modal-overlay .reader-back { width:42px; height:42px; } .reader-modal-overlay .reader-chapter-select { font-size:15px; padding:10px; } .reader-counter b { font-size:21px; } .reader-counter span { font-size:12px; } .reader-sheet { padding:20px 15px 0; } .reader-setting { padding:17px 15px; } .reader-setting p { font-size:13px; } .reader-modal-overlay .reader-segments button { font-size:13px; } .reader-modal-overlay .reader-slide-page .reader-page-img { max-height:calc(100dvh - 168px); } }
@media(prefers-reduced-motion:reduce) { .reader-modal-overlay *, .reader-modal-overlay *:after { transition:none!important; animation:none!important; } }
/* Neutralize the catalog's mobile toolbar rules. */
.reader-modal-overlay .reader-top-bar { flex-wrap:nowrap; }
.reader-modal-overlay .reader-counter b { width:auto; order:0; text-align:initial; overflow:visible; font-size:23px; }
@media(max-width:380px) { .reader-modal-overlay .reader-counter b { font-size:21px; } }
.reader-modal-overlay { width:100vw; max-width:100vw; right:auto; overflow:hidden; }
@media(min-width:381px) and (max-width:699px) { .reader-modal-overlay .reader-top-bar { gap:6px; } }

.reader-sheet-eyebrow { display:block; margin-bottom:6px; color:var(--reader-accent); font-size:10px; font-weight:700; letter-spacing:2px; }
.reader-modal-overlay .reader-icon[aria-expanded="true"] { background:var(--reader-control); color:var(--reader-accent); }
.reader-modal-overlay input[type="range"] { accent-color:var(--reader-accent); }