/* Dedicated reader. Only the middle pane scrolls; book and navigation stay in view. */
body.bookcrux-reader-page { background: #151819; color: #f5f5f3; overflow: hidden; padding: 0 !important; }
.bookcrux-reader { --reader-gold: #edb936; --reader-muted: #b4b8bb; position: fixed; inset: 0; height: 100%; height: 100dvh; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; background: radial-gradient(ellipse at 80% 40%, #1c2021 0, #151819 70%); color: #f5f5f3; font: 400 17px/1.65 system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; z-index: 100; }
.bookcrux-reader *, .bookcrux-reader *::before, .bookcrux-reader *::after { box-sizing: border-box; }
.bookcrux-reader [hidden] { display: none !important; }
.bookcrux-reader button, .bookcrux-reader a { -webkit-tap-highlight-color: transparent; }
.bookcrux-reader button { font: inherit; cursor: pointer; }
.bookcrux-reader a { color: var(--reader-gold); }
.bookcrux-reader button:focus-visible, .bookcrux-reader a:focus-visible { outline: 2px solid var(--reader-gold); outline-offset: 4px; }
.bookcrux-reader button:disabled { opacity: .38; cursor: default; }
.reader-header { padding: max(6px, env(safe-area-inset-top)) 16px 4px; background: #171a1bf5; border-bottom: 1px solid #ffffff06; }
.reader-header-inner, .reader-content, .reader-footer-inner { width: 100%; max-width: 780px; margin-inline: auto; }
.reader-header-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; align-items: center; }
.reader-book { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; }
.reader-icon-button { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; padding: 9px; border: 0; border-radius: 10px; color: #f5f5f3 !important; background: transparent; text-decoration: none; font-size: 32px !important; }
.reader-icon-button:hover { background: #ffffff09; }
.reader-icon-button svg { width: 26px; height: 26px; }
.reader-cover { display: block; width: 28px; height: 38px; object-fit: cover; border-radius: 5px; flex-shrink: 0; background: #343839; }
.reader-book-title { flex: 1; min-width: 0; }
.reader-book-title h1 { font: 700 clamp(16px, 4vw, 18px)/1.25 system-ui, sans-serif; letter-spacing: -.2px; margin: 0 0 2px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.reader-book-title p { color: var(--reader-muted); font-size: 12px; line-height: 1.3; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.reader-bookmark[aria-pressed="true"] { color: var(--reader-gold) !important; }
.reader-bookmark[aria-pressed="true"] svg { fill: #edb93633; }
.reader-progress-row { display: flex; align-items: center; gap: 7px; min-width: 0; margin: 0; }
.reader-progress-row progress { display: block; appearance: none; -webkit-appearance: none; flex: 1; min-width: 0; height: 4px; overflow: hidden; border: 0; border-radius: 999px; background: #34383b; color: var(--reader-gold); }
.reader-progress-row progress::-webkit-progress-bar { background: #34383b; border-radius: 999px; }
.reader-progress-row progress::-webkit-progress-value { background: var(--reader-gold); border-radius: 999px; }
.reader-progress-row progress::-moz-progress-bar { background: var(--reader-gold); border-radius: 999px; }
.reader-progress-row > span { font-size: 11px; min-width: 3ch; color: #c8ccce; text-align: end; font-variant-numeric: tabular-nums; }
.reader-position { display: flex; justify-content: space-between; align-items: center; gap: 8px; width: auto; min-height: 28px; padding: 3px 0; white-space: nowrap; border: 0; background: none; color: #d2d5d6; font-size: 11px !important; text-align: start; }
.reader-jump-label { color: #979fa3; }
.reader-scroll { min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; touch-action: pan-y pinch-zoom; scrollbar-color: #4a4f50 transparent; padding: 26px 24px 20px; outline: 0; }
.reader-screen { overflow-wrap: anywhere; }
.bookcrux-reader .reader-eyebrow { color: #b8bdc0; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; font-weight: 600; margin: 0 0 8px; }
.bookcrux-reader .reader-screen h2 { margin: 0 0 18px; font: 750 clamp(27px, 6.8vw, 40px)/1.14 system-ui, sans-serif; letter-spacing: -.7px; color: #f6f6f4; }
.reader-screen h2:focus { outline: none; }
.bookcrux-reader .reader-screen > section + section h2 { font-size: 23px; margin-top: 30px; }
.bookcrux-reader .reader-screen p { margin: 0 0 16px; }
.reader-screen p, .reader-screen li, .reader-screen section > div { color: #d4d6d7; }
.reader-screen p, .reader-screen li { font-size: 17px; line-height: 1.65; }
.reader-screen ul { padding-inline-start: 24px; }
.reader-screen li { margin-bottom: 12px; }
.reader-screen .bookcrux-summary-crux { background: none; border: 0; border-radius: 0; padding: 0; margin-bottom: 28px; }
.reader-block { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: start; gap: 14px; margin: 20px 0; }
.reader-block-icon { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: #ffffff09; color: #d6d9da; }
.reader-block-icon svg { width: 22px; height: 22px; }
.bookcrux-reader .reader-block h3 { margin: 0 0 6px; color: #bcc1c4; font: 600 12px/1.5 system-ui, sans-serif; letter-spacing: 1.6px; text-transform: uppercase; }
.reader-block p:last-child { margin-bottom: 0; }
.reader-block-idea { padding: 18px 16px; border: 1px solid #e7af322b; border-radius: 12px; background: linear-gradient(115deg, #e7af3210, #e7af3208); }
.reader-block-idea .reader-block-icon { background: linear-gradient(145deg, #efc452, #bd881c); color: #fff8dd; }
.bookcrux-reader .reader-block-idea h3 { color: #efbd42; }
.bookcrux-reader .reader-block-idea p { color: #f2f0e9; font-size: 18px; line-height: 1.55; }
.reader-about { margin-top: 28px; padding-top: 22px; border-top: 1px solid #ffffff15; color: #959da1; font-size: 13px; }
.reader-about p { font-size: 13px; }
.reader-about a { display: inline-flex; align-items: center; gap: 8px; margin-inline-end: 14px; }
.reader-explore svg { width: 20px; height: 20px; }
.reader-swipe-hint { display: flex; justify-content: center; align-items: center; gap: 18px; color: #8c9498; font-size: 19px; margin: 25px 0 0; }
.reader-swipe-hint span { font-size: 12px; }
.reader-footer { padding: 6px 14px max(6px, env(safe-area-inset-bottom)); border-top: 1px solid #ffffff18; background: #202425f5; border-radius: 12px 12px 0 0; }
.reader-footer-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.reader-footer button { min-height: 44px; display: flex; justify-content: center; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 8px; font-weight: 650; font-size: 15px; }
.reader-footer svg { width: 20px; height: 20px; flex-shrink: 0; }
.reader-previous { border: 1px solid #727b8066; color: #e4e6e7; background: #252a2d; }
.reader-next { border: 1px solid #f3c950; color: #17191a; background: linear-gradient(115deg, #e9b333, #c99425); box-shadow: inset 0 1px 0 #ffe49566; }
.reader-next:active, .reader-previous:active { filter: brightness(.92); }
.reader-index { position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; justify-content: center; background: #000b; padding: 20px; }
.reader-index-panel { display: flex; flex-direction: column; width: 100%; max-width: 520px; max-height: 85%; background: #202526; border: 1px solid #41484b; border-radius: 18px; padding: 20px; box-shadow: 0 20px 80px #0008; }
.reader-index-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.reader-index-heading h2 { font: 700 22px/1.3 system-ui, sans-serif; margin: 0; color: #f5f5f3; }
.reader-index-panel nav { overflow-y: auto; margin-top: 14px; }
.reader-index-item { display: block; text-align: start; width: 100%; background: transparent; color: #e5e7e8; border: 1px solid transparent; border-radius: 10px; padding: 12px; margin: 4px 0; }
.reader-index-item span { display: block; line-height: 1.4; }
.reader-index-item span:first-child { font-size: 11px; color: #aab1b4; margin-bottom: 4px; }
.reader-index-item[aria-current] { border-color: #efbd4255; background: #efbd4210; color: #f3c653; }
.reader-notice { position: absolute; z-index: 6; inset-inline: 20px; bottom: calc(66px + env(safe-area-inset-bottom)); width: fit-content; max-width: calc(100% - 40px); margin: 0 auto; padding: 10px 16px; border: 1px solid #566067; border-radius: 10px; background: #30383c; color: #f5f5f3; font-size: 14px; box-shadow: 0 8px 24px #0006; }
.reader-announcement { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (min-width: 800px) { .reader-scroll { padding-top: 38px; } .reader-swipe-hint { display: none; } }
@media (max-width: 360px) { .reader-header { padding-inline: 12px; } .reader-book { gap: 8px; } .reader-scroll { padding-inline: 18px; } .reader-block { grid-template-columns: 30px minmax(0,1fr); gap: 10px; } .reader-block-icon { width: 30px; height: 30px; } .reader-block-idea { padding: 14px 12px; } .reader-footer button { font-size: 15px; gap: 8px; } }
@media (max-height: 500px) and (orientation: landscape) { .reader-cover { width: 28px; height: 38px; } .reader-header { padding-top: max(5px, env(safe-area-inset-top)); }  }
@media (prefers-reduced-motion: reduce) { .bookcrux-reader * { scroll-behavior: auto !important; } }
@media print { body.bookcrux-reader-page { overflow: visible; } .bookcrux-reader { position: static; height: auto; display: block; background: white; color: black; } .reader-scroll { overflow: visible; padding: 0; } .reader-screen[hidden] { display: block !important; } .reader-footer, .reader-index, .reader-progress-row, .reader-position, .reader-icon-button, .reader-swipe-hint { display: none !important; } .bookcrux-reader .reader-screen h2, .reader-screen p, .reader-screen li { color: black; } }

.reader-book-intro { text-align: center; margin: 18px auto 28px; max-width: 600px; }
.reader-book-intro img { display: block; width: 144px; height: 200px; object-fit: contain; margin: 0 auto 16px; border-radius: 6px; background: #202425; box-shadow: 0 10px 28px #0005; }
.bookcrux-reader .reader-book-intro .reader-intro-title { font: 700 clamp(23px, 5.5vw, 32px)/1.25 system-ui, sans-serif; color: #f5f5f3; margin: 0 0 6px; overflow-wrap: anywhere; }
.bookcrux-reader .reader-book-intro .reader-intro-author { font-size: 15px; line-height: 1.5; color: var(--reader-muted); margin: 0; }
[data-bs-theme="light"] body.bookcrux-reader-page { background: #f7f9fa; color: #172027; }
[data-bs-theme="light"] .bookcrux-reader { --reader-muted: #60727c; background: radial-gradient(ellipse at 80% 40%, #ffffff 0, #f7f9fa 70%); color: #172027; }
[data-bs-theme="light"] .reader-header { background: #ffffffee; border-bottom-color: #dbe3e6; }
[data-bs-theme="light"] .reader-footer { background: #ffffffee; border-top-color: #dbe3e6; }
[data-bs-theme="light"] .reader-icon-button { color: #172027 !important; }
[data-bs-theme="light"] .reader-book-title h1, [data-bs-theme="light"] .bookcrux-reader .reader-screen h2, [data-bs-theme="light"] .bookcrux-reader .reader-book-intro .reader-intro-title { color: #172027; }
[data-bs-theme="light"] .reader-screen p, [data-bs-theme="light"] .reader-screen li, [data-bs-theme="light"] .reader-screen section > div { color: #334952; }
[data-bs-theme="light"] .reader-position { color: #334952; }
[data-bs-theme="light"] .reader-previous { border-color: #aebdc3; color: #263940; background: #eef3f5; }
[data-bs-theme="light"] .reader-index-panel { background: #ffffff; border-color: #cbd5da; }
[data-bs-theme="light"] .reader-index-heading h2, [data-bs-theme="light"] .reader-index-item { color: #172027; }

/* Highlight only Contents; preserve the control's dimensions and plain progress text. */
.reader-position .reader-jump-label {
    border-radius: 5px;
    box-shadow: inset 0 0 0 1px #edb93680;
    background: #edb93614;
    color: var(--reader-gold);
}
.reader-position:hover .reader-jump-label,
.reader-position[aria-expanded="true"] .reader-jump-label {
    box-shadow: inset 0 0 0 1px var(--reader-gold);
    background: #edb93626;
}
[data-bs-theme="light"] .reader-position .reader-jump-label {
    color: #795600;
    box-shadow: inset 0 0 0 1px #98701780;
    background: #edb9361a;
}
[data-bs-theme="light"] .reader-position:hover .reader-jump-label,
[data-bs-theme="light"] .reader-position[aria-expanded="true"] .reader-jump-label {
    box-shadow: inset 0 0 0 1px #987017;
    background: #edb93630;
}