/* An isolated reading surface; the Downloads page keeps its existing design. */
.ct-reader { --ct-paper: #eeece7; --ct-ink: #171b1d; --ct-muted: #899193; --ct-accent: #f58220; position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; border: 0; background: #171b1d; color: #f5f4f0; overflow: hidden; font-family: 'Funnel Display', sans-serif; }
.ct-reader:not([open]) { display: none; }
.ct-reader[open] { display: block; }
.ct-reader::backdrop { background: #101315; }
.ct-reader-open { overflow: hidden; }
.ct-reader *, .ct-reader *::before, .ct-reader *::after { box-sizing: border-box; }
.ct-reader [hidden] { display: none !important; }
.ct-reader-layout { display: flex; flex-direction: column; height: 100%; height: 100dvh; }
.ct-reader svg { display: block; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.ct-reader button, .ct-reader a, .ct-reader input, .ct-reader select { font: inherit; color: inherit; }
.ct-reader button { cursor: pointer; }
.ct-reader button:disabled { cursor: default; opacity: .32; }
.ct-reader :focus-visible { outline: 2px solid var(--ct-accent); outline-offset: -3px; }
.ct-reader-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex: 0 0 auto; min-height: 82px; padding: 14px 30px; border-bottom: 1px solid #ffffff12; background: #171b1d; }
.ct-reader-identity { display: flex; align-items: center; gap: 18px; min-width: 0; }
.ct-reader-mark { font-size: 28px; font-weight: 750; letter-spacing: -.07em; line-height: 1; padding-right: 20px; border-right: 1px solid #ffffff25; }
.ct-reader-mark span { color: var(--ct-accent); }
.ct-reader-eyebrow { display: block; font-size: 9px; letter-spacing: .18em; color: #aeb3b2; margin-bottom: 4px; }
.ct-reader-header h2 { font-size: 18px; font-weight: 500; line-height: 1.2; margin: 0; letter-spacing: -.02em; }
.ct-reader-header-actions, .ct-reader-option-group { display: flex; align-items: center; gap: 4px; }
.ct-reader-tool { min-width: 40px; height: 40px; padding: 9px 10px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: #d0d4d2; font-size: 12px !important; text-decoration: none; white-space: nowrap; transition: background .15s, color .15s; }
.ct-reader-tool:hover:not(:disabled), .ct-reader-tool[aria-expanded=true], .ct-reader-tool[aria-pressed=true] { background: #ffffff0e; color: #fff; }
.ct-reader-tool[aria-expanded=true] { border-color: #ffffff25; }
.ct-reader-divider { height: 20px; width: 1px; background: #ffffff20; margin: 0 8px; flex-shrink: 0; }
.ct-reader-options { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 24px; min-height: 56px; border-bottom: 1px solid #ffffff0c; flex: 0 0 auto; }
.ct-reader select { background: #222829; border: 1px solid #ffffff22; border-radius: 6px; padding: 7px 9px; width: 112px; min-width: 0; font-size: 12px; height: 34px; color-scheme: dark; }
.ct-reader-workspace { display: flex; min-height: 0; flex: 1 1 0; position: relative; }
.ct-reader-stage { position: relative; flex: 1 1 0; min-width: 0; min-height: 0; display: flex; align-items: safe center; justify-content: safe center; overflow: auto; overscroll-behavior: contain; background: radial-gradient(ellipse at 50% 40%, #edf0ed 0, #d2d8d4 95%); scrollbar-color: #929c95 #d2d8d4; }
.ct-reader-stage:focus { outline: none; }
.ct-reader-stage:focus-visible { outline: 2px solid var(--ct-accent); outline-offset: -3px; }
.ct-reader-book-space { flex: 0 0 auto; position: relative; margin: 32px 40px; filter: drop-shadow(0 20px 24px #182b2045); transition: opacity .2s; }
.ct-reader-book-space.is-preparing { opacity: 0; }
.ct-reader-book-scale { position: absolute; top: 0; left: 0; transform-origin: top left; }
.ct-reader .stf__wrapper { height: 100%; }
.ct-reader-page { background: #fff; overflow: hidden; box-shadow: inset 0 0 0 1px #0000000d; }
.ct-reader-page canvas { display: block; width: 100%; height: 100%; object-fit: contain; }
.ct-reader-page canvas:not([width]), .ct-reader-page:not(.is-rendered) canvas { visibility: hidden; }
.ct-reader-page::after { content: ''; pointer-events: none; position: absolute; inset: 0; background: linear-gradient(90deg, #00000012, transparent 5%, transparent 96%, #00000008); }
.ct-reader-page.--left::after { background: linear-gradient(90deg, transparent 90%, #00000012 98%, #00000024); }
.ct-reader-page.--right::after { background: linear-gradient(90deg, #00000024, #00000012 2%, transparent 10%); }
.ct-reader-page.--hard::after { background: none; }
.ct-reader-page-placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 20px; font-size: 13px; color: #818783; text-align: center; }
.ct-reader-page.is-rendered .ct-reader-page-placeholder { display: none; }
.ct-reader.is-zoomed [data-reader-book] { pointer-events: none; }
.ct-reader.is-zoomed .ct-reader-stage { cursor: auto; }
.ct-reader-loading, .ct-reader-error { position: absolute; z-index: 5; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 30px; color: #3b4640; text-align: center; }
.ct-reader-loading strong { font-size: 17px; font-weight: 500; }
.ct-reader-loading > span:last-child { font-size: 12px; color: #6b756d; }
.ct-reader-spinner { width: 30px; height: 30px; border: 2px solid #20352620; border-top-color: #b65b18; border-radius: 50%; animation: ct-reader-spin .9s linear infinite; margin-bottom: 6px; }
.ct-reader-error h3 { font-size: 22px; font-weight: 500; }
.ct-reader-error p { font-size: 14px; color: #566158; }
.ct-reader-error > div { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; justify-content: center; margin-top: 10px; }
.ct-reader-error a { text-decoration: underline; color: #25382b; font-size: 14px; }
.ct-reader-error-symbol { display: grid; place-items: center; width: 40px; height: 40px; font-size: 24px; border: 1px solid #818b82; border-radius: 50%; margin-bottom: 8px; }
.ct-reader-thumbnails { flex: 0 0 174px; width: 174px; overflow: auto; padding: 18px; background: #1f2525; border-right: 1px solid #ffffff16; scrollbar-width: thin; scrollbar-color: #505b56 transparent; }
.ct-reader-sidebar-heading { font-size: 10px; text-transform: uppercase; letter-spacing: .12em; color: #a6b0a8; margin-bottom: 20px; }
.ct-reader-thumbnails [data-reader-thumbnail-list] { display: grid; gap: 20px; }
.ct-reader-thumbnails button { display: block; width: 100%; padding: 0; border: 0; background: transparent; }
.ct-reader-thumbnails canvas { display: block; width: 100%; aspect-ratio: var(--ct-page-ratio, 1 / 1.414); height: auto; background: #d1d5cf; border-radius: 2px; box-shadow: 0 3px 8px #0003; border: 2px solid transparent; object-fit: contain; }
.ct-reader-thumbnails button[aria-current=page] canvas { border-color: var(--ct-accent); }
.ct-reader-thumbnails button span { display: block; font-size: 10px; color: #9eaaa1; margin-top: 7px; }
.ct-reader-thumbnails button[aria-current=page] span { color: #ffae6b; }
.ct-reader-text-panel { flex: 0 0 300px; width: 300px; overflow: auto; padding: 22px; background: #f8f7f2; color: #26352b; border-left: 1px solid #b8c2b8; }
.ct-reader-text-panel .ct-reader-sidebar-heading { color: #637468; }
.ct-reader-text-panel h3 { font-size: 15px; margin: 20px 0 10px; font-weight: 600; }
.ct-reader-text-panel p { font-size: 14px; line-height: 1.75; color: #394a3f; white-space: pre-wrap; overflow-wrap: anywhere; }
.ct-reader-text-panel a { font-size: 13px; color: #744519; text-decoration: underline; margin-top: 24px; }
.ct-reader-footer { flex: 0 0 auto; padding: 16px 30px 12px; border-top: 1px solid #ffffff0a; background: #171b1d; }
.ct-reader-navigation { display: flex; justify-content: center; align-items: center; gap: 12px; }
.ct-reader-turn { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid #ffffff25; border-radius: 50%; background: #ffffff03; color: #f1f1ec; }
.ct-reader-turn:hover:not(:disabled) { border-color: var(--ct-accent); color: var(--ct-accent); }
.ct-reader-page-form { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #9ba59f; }
.ct-reader-page-form label { margin: 0 3px 0 0; }
.ct-reader-page-form input { width: 49px; min-width: 0; height: 34px; border: 1px solid #ffffff20; background: #222829; color: #f4f4ef; padding: 4px 2px; font-size: 13px; text-align: center; border-radius: 6px; appearance: textfield; -moz-appearance: textfield; font-variant-numeric: tabular-nums; }
.ct-reader-page-form input::-webkit-inner-spin-button, .ct-reader-page-form input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.ct-reader-page-form [data-catalog-total] { min-width: 32px; font-variant-numeric: tabular-nums; }
.ct-reader-progress { max-width: 640px; margin: 14px auto 10px; }
.ct-reader-progress input { --ct-progress: 0%; width: 100%; display: block; appearance: none; -webkit-appearance: none; height: 3px; padding: 0; margin: 0; border: 0; border-radius: 2px; background: linear-gradient(to right, #e8883e var(--ct-progress), #424d46 var(--ct-progress)); cursor: pointer; }
.ct-reader-progress input::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 12px; height: 12px; border: 0; border-radius: 50%; background: #f4a264; box-shadow: 0 0 0 4px #f4a26412; }
.ct-reader-progress input::-moz-range-thumb { width: 12px; height: 12px; border: 0; border-radius: 50%; background: #f4a264; }
.ct-reader-meta { display: flex; justify-content: space-between; gap: 12px; font-size: 10px; color: #939e97; letter-spacing: .03em; }
.ct-reader-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.ct-reader-sr:focus-visible { position: static; width: auto; height: auto; margin: 0; clip-path: none; }
@keyframes ct-reader-spin { to { transform: rotate(360deg); } }
@media (max-width: 740px) {
    .ct-reader-header { min-height: 68px; padding: 12px 14px; gap: 10px; }
    .ct-reader-identity { gap: 10px; }
    .ct-reader-mark { font-size: 24px; padding-right: 12px; }
    .ct-reader-eyebrow { font-size: 8px; letter-spacing: .09em; }
    .ct-reader-header h2 { font-size: 15px; }
    .ct-reader-header-actions { gap: 0; }
    .ct-reader-header-actions .ct-reader-divider, .ct-reader-close-label, .ct-reader-header-actions a span, .ct-reader-mode { display: none; }
    .ct-reader-header-actions .ct-reader-tool { min-width: 36px; width: 36px; padding: 8px; }
    .ct-reader-options { padding: 6px 10px; gap: 2px; min-height: 50px; }
    .ct-reader-option-group { gap: 0; }
    .ct-reader-options .ct-reader-tool { min-width: 36px; width: 36px; padding: 8px; }
    .ct-reader-options .ct-reader-tool span { display: none; }
    .ct-reader-options .ct-reader-divider { display: none; }
    .ct-reader select { width: 96px; padding: 6px; font-size: 11px; }
    .ct-reader-book-space { margin: 20px 12px; }
    .ct-reader-thumbnails { flex-basis: 114px; width: 114px; padding: 12px; }
    .ct-reader-thumbnails .ct-reader-sidebar-heading { font-size: 9px; letter-spacing: 0; }
    .ct-reader-text-panel { position: absolute; z-index: 6; inset: 0 0 0 auto; width: min(84%, 340px); box-shadow: -12px 0 24px #0002; }
    .ct-reader-footer { padding: 12px 18px max(12px, env(safe-area-inset-bottom)); }
    .ct-reader-navigation { gap: 6px; }
    .ct-reader-meta { justify-content: center; font-size: 10px; }
    .ct-reader-hint { display: none; }
    .ct-reader-progress { margin-top: 16px; margin-bottom: 14px; }
}
@media (max-height: 520px) {
    .ct-reader-header { min-height: 48px; padding: 5px 16px; }
    .ct-reader-options { min-height: 42px; padding-top: 0; padding-bottom: 0; }
    .ct-reader-eyebrow, .ct-reader-meta { display: none; }
    .ct-reader-footer { padding-top: 6px; padding-bottom: 8px; }
    .ct-reader-progress { margin-top: 7px; margin-bottom: 4px; }
}
@media (prefers-reduced-motion: reduce) { .ct-reader *, .ct-reader *::before, .ct-reader *::after { animation: none !important; transition: none !important; } }
.ct-reader-layout:fullscreen { width: 100vw; height: 100dvh; background: #171b1d; }
.ct-reader.is-turning .ct-reader-turn { opacity: .6; }