/* Premium physical-book presentation shared by full editions and free samples. */
#readerView {
  --premium-wood: url('assets/textures/reader-dark-walnut.webp');
  --premium-paper: url('assets/textures/reader-ivory-paper.webp');
  --reader-font: 'Iowan Old Style', 'Palatino Linotype', 'Book Antiqua', Georgia, serif;
  --reader-font-size: 19px;
  --reader-line-height: 1.64;
  --reader-v2-measure: 58ch;
  --reader-paragraph-gap: .18em;
  --reader-v2-page-margin: 50px;
  --accent: #8f2730;
  background-color: #0b0907;
  background-image: var(--premium-wood);
  background-position: center;
  background-size: cover;
}

#readerView[data-theme='paper'] {
  --reader-bg: #0b0907;
  --reader-page: #f5efe3;
  --reader-text: #2c251f;
  --reader-muted: #776c60;
  --reader-border: rgba(72, 53, 38, .24);
  background-color: #0b0907;
  background-image: var(--premium-wood);
}

#readerView[data-theme='sepia'] {
  --reader-bg: #0b0907;
  --reader-page: #e3cda9;
  --reader-text: #37291f;
  --reader-muted: #75614e;
  --reader-border: rgba(78, 49, 29, .28);
  background-color: #0b0907;
  background-image: var(--premium-wood);
}

#readerView[data-theme='night'] {
  --reader-bg: #080706;
  --reader-page: #191613;
  --reader-text: #e7dcc6;
  --reader-muted: #ad9e87;
  --reader-border: rgba(232, 214, 182, .17);
  --accent: #c58367;
  background-color: #080706;
  background-image: var(--premium-wood);
}

#readerView[data-theme='lamp'] {
  --reader-bg: #080604;
  --reader-page: #17120e;
  --reader-text: #ead9b6;
  --reader-muted: #b5a17e;
  --reader-border: rgba(236, 203, 148, .19);
  --accent: #d29a59;
  --lamp-inner: .13;
  --lamp-outer: .055;
  background-color: #080604;
  background-image: radial-gradient(circle at 52% 38%, rgba(227, 148, 66, var(--lamp-inner)) 0, rgba(165, 88, 35, var(--lamp-outer)) 32%, transparent 68%), var(--premium-wood);
}

#readerView[data-theme='lamp'][data-lamp-level='off'] { --lamp-inner: 0; --lamp-outer: 0; }
#readerView[data-theme='lamp'][data-lamp-level='low'] { --lamp-inner: .07; --lamp-outer: .029; }
#readerView[data-theme='lamp'][data-lamp-level='medium'] { --lamp-inner: .13; --lamp-outer: .055; }
#readerView[data-theme='lamp'][data-lamp-level='high'] { --lamp-inner: .2; --lamp-outer: .084; }

#readerView[data-theme='oled'] {
  --reader-bg: #000;
  --reader-page: #000;
  --reader-text: #dedbd4;
  --reader-muted: #9f9b94;
  --reader-border: #242321;
  --accent: #c7866d;
  background: #000;
}

#readerView:is([data-theme='paper'], [data-theme='sepia'], [data-theme='night'], [data-theme='lamp'], [data-theme='oled']) .reader-topbar,
#readerView:is([data-theme='paper'], [data-theme='sepia'], [data-theme='night'], [data-theme='lamp'], [data-theme='oled']) .reader-footer {
  color: #eee8dc;
  background: rgba(8, 7, 6, .82);
}

/* The top bar mirrors a quiet printed-book control strip. */
#readerView .reader-topbar {
  min-height: calc(58px + var(--safe-top));
  padding: calc(7px + var(--safe-top)) calc(18px + var(--safe-right)) 7px calc(20px + var(--safe-left));
  display: flex;
  align-items: center;
  gap: 8px;
  color: #eee8dc;
  background: rgba(8, 7, 6, .8);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 0 6px 24px rgba(0, 0, 0, .12);
  backdrop-filter: blur(12px);
}

#readerView .reader-brand {
  order: 1;
  min-width: 0;
  margin-right: auto;
  display: flex;
  align-items: center;
  gap: 14px;
  white-space: nowrap;
}

#readerView .reader-wordmark {
  font: 500 17px/1 var(--reader-font);
  color: #f2ece1;
}

#readerView .reader-brand-rule {
  width: 1px;
  height: 22px;
  background: rgba(255, 255, 255, .2);
}

#readerView #readerBookTitle {
  max-width: min(34vw, 520px);
  overflow: hidden;
  color: #bdb3a4;
  font: italic 15px/1.2 var(--reader-font);
  text-overflow: ellipsis;
}

#readerView > .reader-topbar > #chapterMenuButton { order: 2; }
#readerView .topbar-actions { order: 3; gap: 1px; }
#readerView > .reader-topbar > #exitReaderButton { order: 4; }

#readerView .chapter-pill {
  width: auto;
  max-width: none;
  min-width: 84px;
  height: 44px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #fff8ed;
  border: 1px solid rgba(229, 183, 117, .36);
  border-radius: 3px;
  background: rgba(255, 255, 255, .075);
  box-shadow: inset 0 -2px 0 rgba(181, 107, 88, .42);
}

#readerView .chapter-pill::before {
  content: '☰';
  color: #e5b775;
  font: 15px/1 Arial, sans-serif;
}

#readerView .chapter-pill::after {
  content: 'Contents';
  font: 700 12px/1 var(--store-sans);
  letter-spacing: .02em;
}

#readerView .chapter-pill > span,
#readerView .chapter-pill > strong { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

#readerView .topbar-actions .icon-button,
#readerView > .reader-topbar > #exitReaderButton {
  width: 44px;
  min-width: 44px;
  height: 44px;
  padding: 0;
  color: #e7dfd3;
  border: 0;
  border-radius: 3px;
  background: transparent;
  box-shadow: none;
}

#readerView .topbar-actions .icon-button:hover,
#readerView .topbar-actions .icon-button:focus-visible,
#readerView > .reader-topbar > #exitReaderButton:hover,
#readerView > .reader-topbar > #exitReaderButton:focus-visible,
#readerView .chapter-pill:hover,
#readerView .chapter-pill:focus-visible { background: rgba(255, 255, 255, .09); }

#readerView .topbar-actions .icon-button small { display: none; }
#readerView > .reader-topbar > #exitReaderButton { font-size: 25px; }

/* The physical spread deliberately occupies the room like a real open book. */
#readerView[data-reader-view='spread'] {
  --flipbook-width: min(1580px, calc(100vw - clamp(104px, 8vw, 172px)));
  --flipbook-height: min(850px, calc(100dvh - 126px));
  --flipbook-pad-x: clamp(48px, 4.1vw, 76px);
  --flipbook-pad-y: clamp(42px, 5vh, 64px);
}

#readerView[data-reader-view='spread'].flipbook-spread-mode .reader-stage {
  inset: calc(58px + var(--safe-top)) 0 calc(34px + var(--safe-bottom));
}

#readerView[data-reader-view='spread'].flipbook-spread-mode .pages-viewport { padding: 8px 0 28px; }

/* Pagination and the visual page mirrors must share one exact page height. */
#readerView[data-reader-view='spread'] :is(#measurePage, #pagesTrack > .page-sheet) {
  height: var(--flipbook-height);
  min-height: var(--flipbook-height);
  max-height: var(--flipbook-height);
}

#readerView .flipbook-spread {
  filter: drop-shadow(0 24px 28px rgba(0, 0, 0, .52));
}

#readerView .flipbook-cover-underlay {
  display: block;
  position: absolute;
  z-index: -2;
  inset: -10px -14px -16px;
  border-radius: 9px 9px 16px 16px;
  background-color: #2d1b14;
  background-image: var(--premium-wood);
  background-position: center;
  background-size: cover;
  box-shadow: 0 20px 36px rgba(0, 0, 0, .6), 0 3px 0 #b19a7e, 0 7px 0 #7a6652, 0 11px 0 #4d3e32;
}

#readerView .flipbook-spread::before,
#readerView .flipbook-spread::after {
  content: '';
  position: absolute;
  z-index: -1;
  top: 7px;
  bottom: 5px;
  width: 12px;
  display: block;
  pointer-events: none;
  background-color: #e6dcc9;
  background-image: var(--premium-paper);
  background-size: cover;
  opacity: .94;
  box-shadow: 0 1px 0 rgba(77, 57, 40, .24), 0 4px 0 rgba(235, 226, 210, .82), 0 6px 0 rgba(77, 57, 40, .2);
}

#readerView .flipbook-spread::before { left: -9px; border-radius: 5px 0 0 8px; }
#readerView .flipbook-spread::after { right: -9px; border-radius: 0 5px 8px 0; }

#readerView[data-theme='paper'] :is(.page-sheet:not(.measure-page), .flipbook-physical-page, .flipbook-leaf-face),
#readerView[data-theme='sepia'] :is(.page-sheet:not(.measure-page), .flipbook-physical-page, .flipbook-leaf-face) {
  background-color: var(--reader-page);
  background-image: var(--premium-paper);
  background-size: cover;
  background-blend-mode: multiply;
}

#readerView[data-theme='night'] :is(.page-sheet:not(.measure-page), .flipbook-physical-page, .flipbook-leaf-face),
#readerView[data-theme='lamp'] :is(.page-sheet:not(.measure-page), .flipbook-physical-page, .flipbook-leaf-face) {
  background-color: var(--reader-page);
  background-image: var(--premium-paper);
  background-size: cover;
  background-blend-mode: soft-light;
}

#readerView .flipbook-physical-page,
#readerView .flipbook-leaf-face {
  border-color: rgba(81, 61, 45, .28);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .32) inset;
}

/* Facing pages use print-scale leading; semantic pagination stays slightly
   more conservative so a visual mirror can never crowd the folio. */
#readerView[data-reader-view='spread'] :is(.flipbook-physical-page, .flipbook-leaf-face) .reader-block-paragraph {
  font-size: 18px;
  line-height: 1.56;
}

#readerView .flipbook-left-page {
  border-radius: 4px 0 0 8px;
  box-shadow: inset -40px 0 44px -43px rgba(40, 23, 13, .82), inset 5px 0 12px -8px rgba(71, 46, 29, .4);
}

#readerView .flipbook-right-page {
  border-radius: 0 4px 8px 0;
  box-shadow: inset 40px 0 44px -43px rgba(40, 23, 13, .82), inset -5px 0 12px -8px rgba(71, 46, 29, .4);
}

#readerView .flipbook-spine {
  width: 32px;
  background: linear-gradient(90deg, transparent, rgba(55, 36, 24, .2) 36%, rgba(255, 255, 255, .12) 50%, rgba(55, 36, 24, .2) 64%, transparent);
  box-shadow: none;
}

#readerView .reader-block-chapter-heading {
  margin-bottom: clamp(34px, 5vh, 58px);
  text-align: center;
}

#readerView .reader-block-chapter-heading :is(.part-label, .chapter-label, h1) { margin-inline: auto; text-align: center; }
#readerView .reader-block-chapter-heading .part-label { color: var(--reader-muted); font-weight: 600; letter-spacing: .3em; }
#readerView .reader-block-chapter-heading .chapter-label { color: var(--reader-muted); font: 500 12px/1.4 var(--reader-font); letter-spacing: .22em; }
#readerView .reader-block-chapter-heading h1 { max-width: 16ch; font-size: clamp(35px, 3vw, 50px); font-weight: 500; line-height: 1.05; letter-spacing: -.025em; }

#readerView .reader-block-paragraph {
  margin-block-end: 0;
  color: var(--reader-text);
  font-family: var(--reader-font);
  font-size: var(--reader-font-size);
  line-height: var(--reader-line-height);
  hanging-punctuation: first last;
  text-wrap: pretty;
}

#readerView .reader-block-paragraph + .reader-block-paragraph { margin-block-start: .12em; text-indent: 1.25em; }
#readerView .reader-dropcap { text-indent: 0; }
#readerView .reader-dropcap::first-letter { color: var(--accent); font-size: 3.55em; font-weight: 500; }
#readerView .page-number { bottom: 14px; color: var(--reader-muted); font: 500 10px/1 var(--reader-font); letter-spacing: .08em; }

#readerView .reader-footer {
  min-height: calc(34px + var(--safe-bottom));
  padding: 3px 28px calc(3px + var(--safe-bottom));
  color: #c6bcae;
  background: rgba(8, 7, 6, .76);
  border-top-color: rgba(255, 255, 255, .07);
  backdrop-filter: blur(10px);
}

#readerView .reader-page-summary { color: #c6bcae; }
#readerView .progress-track { width: min(920px, 72vw); background: rgba(255, 255, 255, .12); }
#readerView .progress-bar { background: #b56b58; }
#readerView .reader-tools-dock { display: none; }

/* Contents stays dark and independent of the paper theme, matching the reference. */
#readerView .toc-drawer {
  width: min(330px, 92vw);
  padding: calc(20px + var(--safe-top)) 18px calc(18px + var(--safe-bottom));
  color: #ddd5ca;
  background: rgba(18, 18, 18, .985);
  border-right: 1px solid rgba(255, 255, 255, .1);
  box-shadow: 16px 0 44px rgba(0, 0, 0, .42);
}

#readerView .toc-drawer .drawer-header h2 { margin: 2px 0 16px; color: #f1ebe2; font-size: 22px; }
#readerView .toc-drawer .eyebrow { color: #92877a; }
#readerView .toc-drawer .icon-button { color: #ddd5ca; border-color: rgba(255, 255, 255, .14); background: transparent; }
#readerView .toc-drawer .toc-search { height: 42px; margin-bottom: 8px; color: #e9e2d8; background: #242321; border-color: rgba(255, 255, 255, .12); }
#readerView .toc-drawer .toc-search::placeholder { color: #8f887f; }
#readerView .toc-list { min-height: 220px; padding-right: 5px; scrollbar-color: #6f6860 #242321; }
#readerView .toc-part { padding: 12px 7px 7px; color: #998f83; background: #121212; }
#readerView .toc-item { min-height: 42px; padding: 7px 7px; color: #cfc7bc; border-color: rgba(255, 255, 255, .065); border-radius: 2px; }
#readerView .toc-item .toc-title { font-size: 14px; }
#readerView .toc-item.active { color: #fff7ed; background: rgba(133, 35, 45, .44); box-shadow: inset 3px 0 0 #c75b64; }
#readerView .toc-item.active .toc-number { color: #efb1b4; }
#readerView .toc-saved-pages { border-top-color: rgba(255, 255, 255, .1); }
#readerView .toc-drawer :is(.bookmark-help, .toc-chapter-summary) { color: #968e84; }

/* On a true desktop spread, Contents is part of the reading desk instead of a
   modal. The book keeps two visible, readable pages and recentres in the room. */
@media (min-width: 1440px) {
  #readerView[data-reader-view='spread'].flipbook-spread-mode {
    --desktop-toc-width: clamp(284px, 18vw, 330px);
  }

  #readerView[data-reader-view='spread'].flipbook-spread-mode .toc-drawer {
    top: calc(58px + var(--safe-top));
    bottom: calc(34px + var(--safe-bottom));
    width: var(--desktop-toc-width);
    height: auto;
    padding: 18px 15px 14px;
    border-radius: 0;
    box-shadow: 10px 0 30px rgba(0, 0, 0, .34);
  }

  #readerView[data-reader-view='spread'].flipbook-spread-mode:has(.toc-drawer.open) {
    --flipbook-width: min(1460px, calc(100vw - var(--desktop-toc-width) - 58px));
  }

  #readerView[data-reader-view='spread'].flipbook-spread-mode:has(.toc-drawer.open) .reader-stage {
    left: var(--desktop-toc-width);
    transition: left .24s cubic-bezier(.22, 1, .36, 1);
  }

  #readerView[data-reader-view='spread'].flipbook-spread-mode:has(.toc-drawer.open) .reader-footer {
    left: var(--desktop-toc-width);
  }

  #readerView[data-reader-view='spread'].flipbook-spread-mode:has(.toc-drawer.open) .drawer-backdrop {
    display: none;
  }
}

/* Appearance is progressive: essentials first, advanced controls collapsed. */
#readerView .settings-drawer {
  width: min(420px, 94vw);
  color: #e8e0d5;
  background: #171614;
  border-left: 1px solid rgba(255, 255, 255, .1);
  box-shadow: -18px 0 54px rgba(0, 0, 0, .4);
}

#readerView .settings-drawer .drawer-header h2 { color: #f4ede2; }
#readerView .settings-drawer :is(legend, .setting-row, .reader-setting-label) { color: #c0b6a9; }
#readerView .settings-drawer :is(.theme-options, .font-options, .lamp-intensity-options) { margin: 18px 0; padding: 0; border: 0; }
#readerView .settings-drawer :is(.theme-options, .font-options, .lamp-intensity-options) legend { margin-bottom: 9px; font: 700 10px/1.3 var(--store-sans); letter-spacing: .13em; text-transform: uppercase; }
#readerView .settings-drawer :is(.theme-options, .font-options, .lamp-intensity-options) button,
#readerView .reader-feature-tools button {
  min-height: 40px;
  margin: 0 5px 7px 0;
  padding: 0 12px;
  color: #ded5ca;
  background: #22201d;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 3px;
}

#readerView .settings-drawer button[aria-pressed='true'] { color: #fff8ec; border-color: #c99661; box-shadow: inset 0 -2px 0 #c99661; }
#readerView .reader-feature-tools { margin: 20px 0; padding: 17px 0 10px; border-top: 1px solid rgba(255, 255, 255, .1); border-bottom: 1px solid rgba(255, 255, 255, .1); }
#readerView .reader-feature-tools::before { content: 'READER TOOLS'; display: block; margin-bottom: 9px; color: #968c80; font: 700 10px/1.3 var(--store-sans); letter-spacing: .13em; }
#readerView .reader-advanced-settings { margin: 10px 0 22px; border-top: 1px solid rgba(255, 255, 255, .1); }
#readerView .reader-advanced-settings summary { min-height: 48px; display: flex; align-items: center; color: #d8cfc3; font: 600 13px/1.4 var(--store-sans); cursor: pointer; }
#readerView .reader-advanced-settings-body { padding: 2px 0 18px; }
#readerView .reader-extra-controls { flex-wrap: wrap; }
#readerView .reader-extra-controls .icon-button { min-width: 72px; min-height: 46px; color: #ddd4c8; background: #22201d; border: 1px solid rgba(255, 255, 255, .13); }

/* A printed colophon-style purchase page replaces the old scrolling sample modal. */
#readerView .sample-gate-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding-inline: clamp(34px, 7vw, 86px);
  text-align: center;
}

#readerView .sample-gate-ornament {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  color: var(--reader-page);
  background: var(--accent);
  border-radius: 50%;
  font: 500 27px/1 var(--reader-font);
}

#readerView .sample-gate-page .sample-gate-kicker { margin: 0; color: var(--accent); font: 800 10px/1.3 var(--store-sans); letter-spacing: .2em; }
#readerView .sample-gate-page h1 { max-width: 12ch; margin: 0; color: var(--reader-text); font: 500 clamp(38px, 5vw, 64px)/.98 var(--reader-font); letter-spacing: -.035em; }
#readerView .sample-gate-page > p:not(.sample-gate-kicker) { max-width: 38ch; margin: 0; color: var(--reader-muted); font: 400 17px/1.6 var(--reader-font); }
#readerView .sample-gate-page > button { min-height: 50px; padding: 0 22px; color: #fff8ef; background: var(--accent); border: 0; border-radius: 3px; font: 700 13px/1 var(--store-sans); }
#readerView .sample-gate-page > small { max-width: 42ch; color: var(--reader-muted); line-height: 1.5; }

#readerView :is(button, input, summary):focus-visible { outline: 3px solid #e5b775; outline-offset: 3px; }

@media (max-width: 899px) {
  #readerView { --reader-v2-measure: 64ch; --reader-v2-page-margin: clamp(22px, 7vw, 48px); }
  #readerView .reader-topbar { min-height: calc(56px + var(--safe-top)); padding-inline: calc(9px + var(--safe-left)) calc(9px + var(--safe-right)); }
  #readerView .reader-stage { inset: calc(56px + var(--safe-top)) 0 calc(36px + var(--safe-bottom)); }
  #readerView[data-reader-view='single'] .measure-page { height: calc(100dvh - 56px - 36px - var(--safe-top) - var(--safe-bottom)); }
  #readerView .reader-wordmark { font-size: 15px; }
  #readerView #readerBookTitle { max-width: 25vw; font-size: 13px; }
  #readerView .chapter-pill { min-width: 90px; width: auto; padding: 0 10px; }
  #readerView .topbar-actions .icon-button,
  #readerView > .reader-topbar > #exitReaderButton { width: 42px; min-width: 42px; }
  #readerView[data-reader-view='single'] .page-sheet:not(.measure-page) { border-radius: 0; box-shadow: none; }
  #readerView .reader-block-chapter-heading { margin-top: clamp(24px, 7vh, 70px); }
  #readerView .reader-block-chapter-heading h1 { font-size: clamp(36px, 10vw, 52px); }
  #readerView .reader-footer { min-height: calc(36px + var(--safe-bottom)); }
}

@media (max-width: 560px) {
  #readerView .reader-brand-rule,
  #readerView #readerBookTitle { display: none; }
  #readerView .reader-brand { gap: 0; }
  #readerView .reader-wordmark { font-size: 14px; }
  #readerView .topbar-actions { gap: 0; }
  #readerView .topbar-actions .icon-button,
  #readerView > .reader-topbar > #exitReaderButton { width: 40px; min-width: 40px; }
  #readerView .chapter-pill { width: auto; min-width: 86px; padding-inline: 8px; }
  #readerView .page-controls button { min-width: 44px; min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  #readerView *, #readerView *::before, #readerView *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
