:root {
      color-scheme: dark;
      --ink: var(--theme-ink, #f8f0e4);
      --muted: var(--theme-muted, #cabbae);
      --gold: var(--theme-accent, #d8ad66);
      --line: var(--theme-line, rgba(255,255,255,.11));
      --paper: var(--theme-paper, #f3ead8);
      --paper-deep: var(--theme-paper-deep, #e6d8bf);
      --paper-ink: var(--theme-paper-ink, #30271f);
      --site-background-image: var(--theme-site-background, none);
      --hero-banner-image: var(--theme-hero-banner, none);
      --shelf-texture-image: var(--theme-shelf-texture, none);
      --paper-texture-image: var(--theme-paper-texture, none);
      --cover-placeholder-image: var(--theme-cover-placeholder, none);
      --shadow: 0 28px 90px rgba(0,0,0,.48);
      font-family: var(--theme-ui-font, Inter, ui-sans-serif, system-ui, sans-serif);
    }

    * { box-sizing: border-box; }
    [data-module][hidden] { display:none !important; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      min-height: 100vh;
      color: var(--ink);
      background:
        radial-gradient(circle at 18% 5%, rgba(218,170,95,.12), transparent 30rem),
        radial-gradient(circle at 85% 18%, rgba(112,68,45,.18), transparent 32rem),
        var(--site-background-image) center top / cover fixed,
        linear-gradient(180deg, #201712 0%, #100b09 100%);
      overflow-x: hidden;
    }

    button { font: inherit; color: inherit; }
    button:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }

    .page-shell {
      width: min(1560px, calc(100% - 32px));
      margin: 0 auto;
      padding: 24px 0 72px;
    }

    .topbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 8px 0 38px;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      color: var(--ink);
      text-decoration: none;
      font-weight: 800;
      letter-spacing: .02em;
    }

    .brand-mark {
      width: 40px;
      aspect-ratio: 1;
      display: grid;
      place-items: center;
      border: 1px solid rgba(216,173,102,.36);
      border-radius: 12px;
      background: linear-gradient(145deg, rgba(216,173,102,.23), rgba(95,58,38,.18));
    }
    .brand-mark img { width:26px; height:26px; display:block; }
    .ui-icon { width:20px; height:20px; display:block; color:currentColor; }

    .status-pill {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 38px;
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 0 14px;
      background: rgba(255,255,255,.05);
      color: var(--muted);
      font-size: .86rem;
    }

    .status-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #8fc98d;
      box-shadow: 0 0 12px rgba(143,201,141,.5);
    }

    .hero {
      display: grid;
      grid-template-columns: 1.2fr .8fr;
      gap: 40px;
      align-items: end;
      margin-bottom: 54px;
      position:relative;
      isolation:isolate;
    }
    .hero::after {
      content:"";
      position:absolute;
      z-index:-1;
      inset:-34px -18px -30px 38%;
      background:var(--hero-banner-image) right center / cover no-repeat;
      opacity:.72;
      pointer-events:none;
      mask-image:linear-gradient(90deg,transparent 0,#000 28%,#000 100%);
    }

    .eyebrow {
      margin: 0 0 12px;
      color: var(--gold);
      font-size: .78rem;
      font-weight: 800;
      letter-spacing: .18em;
      text-transform: uppercase;
    }

    h1 {
      margin: 0;
      max-width: 12ch;
      font: 500 clamp(3rem, 8vw, 6.6rem)/.91 var(--theme-reading-font, Georgia, "Times New Roman", serif);
      letter-spacing: -.055em;
    }

    .hero-copy {
      margin: 0 0 8px;
      color: var(--muted);
      font-size: clamp(1rem,1.6vw,1.16rem);
      line-height: 1.7;
      max-width: 46ch;
    }

    .section { margin-top: 46px; }
    .section-heading {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 18px;
    }
    .section-heading h2 {
      margin: 0;
      font: 500 clamp(1.7rem,3vw,2.45rem)/1.05 var(--theme-reading-font, Georgia, serif);
      letter-spacing: -.025em;
    }
    .section-heading p {
      margin: 6px 0 0;
      color: var(--muted);
      line-height: 1.55;
      max-width: 56ch;
    }
    .library-collection-status { font-size:.8rem; opacity:.72; margin-top:.3rem; }

    .icon-button {
      width: 42px;
      height: 42px;
      border: 1px solid var(--line);
      border-radius: 50%;
      background: rgba(255,255,255,.055);
      cursor: pointer;
      transition: transform .2s ease, background .2s ease, border-color .2s ease;
    }
    .icon-button:hover { background: rgba(255,255,255,.11); transform: translateY(-1px); }
    .carousel-controls { display: flex; gap: 8px; }

    .recommendation-rail {
      display: grid;
      grid-auto-flow: column;
      grid-auto-columns: minmax(180px,22%);
      gap: 16px;
      overflow-x: auto;
      overscroll-behavior-inline: contain;
      scroll-snap-type: inline mandatory;
      scrollbar-width: thin;
      scrollbar-color: rgba(216,173,102,.55) rgba(255,255,255,.05);
      padding: 4px 2px 18px;
    }

    .recommendation-card {
      scroll-snap-align: start;
      border: 1px solid var(--line);
      border-radius: 22px;
      padding: 12px;
      background: linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
      box-shadow: 0 18px 50px rgba(0,0,0,.18);
      cursor: pointer;
      text-align: left;
      transition: transform .28s cubic-bezier(.2,.8,.2,1), border-color .2s ease;
    }
    .recommendation-card:hover,
    .recommendation-card:focus-visible {
      transform: translateY(-7px) rotateX(2deg);
      border-color: rgba(216,173,102,.45);
      outline: none;
    }

    .cover-art {
      aspect-ratio: 3/4.25;
      border-radius: 14px;
      overflow: hidden;
      box-shadow: 0 16px 30px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.13);
      background: var(--cover-color, #6f4635);
      position: relative;
    }
    .cover-art img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .cover-fallback {
      width: 100%; height: 100%;
      padding: 18px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      color: #fff8ea;
      background:
        radial-gradient(circle at 72% 18%,rgba(255,255,255,.17),transparent 24%),
        linear-gradient(110deg,rgba(255,255,255,.15),transparent 22%,transparent 72%,rgba(0,0,0,.24)),
        var(--cover-placeholder-image) center / cover no-repeat,
        var(--cover-color, #6f4635);
    }
    .cover-fallback small { letter-spacing: .15em; text-transform: uppercase; opacity: .8; }
    .cover-fallback strong { max-width: 8ch; font: 500 clamp(1.2rem,2vw,1.75rem)/.95 var(--theme-reading-font, Georgia,serif); }
    .card-meta { padding: 12px 2px 2px; }
    .card-meta strong { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .card-meta span { display:block; color:var(--muted); font-size:.88rem; margin-top:4px; }

    .library-layout {
      display:block;
      min-width:0;
    }
    .library-layout.has-directory {
      display:grid;
      grid-template-columns:minmax(0,1fr) clamp(220px,18vw,278px);
      gap:clamp(18px,2vw,30px);
      align-items:start;
    }
    .library-main { min-width:0; }

    .library-directory {
      position:sticky;
      top:20px;
      overflow:hidden;
      border:1px solid rgba(216,173,102,.28);
      border-radius:20px;
      color:#ead9bd;
      background:
        linear-gradient(rgba(216,173,102,.055) 1px,transparent 1px),
        linear-gradient(90deg,rgba(216,173,102,.055) 1px,transparent 1px),
        radial-gradient(circle at 72% 4%,rgba(216,173,102,.12),transparent 34%),
        linear-gradient(160deg,rgba(53,36,27,.98),rgba(24,16,13,.98));
      background-size:24px 24px,24px 24px,auto,auto;
      box-shadow:0 24px 70px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.05);
    }
    .library-directory::before {
      content:"";
      position:absolute;
      inset:7px;
      border:1px solid rgba(216,173,102,.12);
      border-radius:14px;
      pointer-events:none;
    }
    .directory-toggle {
      position:relative;
      z-index:2;
      width:100%;
      display:grid;
      grid-template-columns:38px minmax(0,1fr) 22px;
      gap:11px;
      align-items:center;
      border:0;
      border-bottom:1px solid rgba(216,173,102,.16);
      padding:18px 17px 15px;
      color:inherit;
      background:linear-gradient(180deg,rgba(216,173,102,.08),transparent);
      text-align:left;
      cursor:pointer;
    }
    .directory-icon {
      width:38px;
      aspect-ratio:1;
      display:grid;
      place-items:center;
      border:1px solid rgba(216,173,102,.3);
      border-radius:10px;
      background:rgba(216,173,102,.08);
      color:var(--gold);
    }
    .directory-icon img { width:23px; height:23px; }
    .directory-toggle small {
      display:block;
      margin-bottom:3px;
      color:var(--gold);
      font-size:.66rem;
      font-weight:800;
      letter-spacing:.18em;
      text-transform:uppercase;
    }
    .directory-toggle strong {
      display:block;
      overflow:hidden;
      font:500 1.12rem/1.1 var(--theme-reading-font,Georgia,serif);
      white-space:nowrap;
      text-overflow:ellipsis;
    }
    .directory-toggle-mark { color:var(--gold); text-align:center; transition:transform .25s ease; }
    .directory-body {
      position:relative;
      z-index:1;
      max-height:720px;
      padding:16px 14px 18px;
      opacity:1;
      transition:max-height .35s ease,padding .35s ease,opacity .22s ease;
    }
    .library-directory.is-collapsed .directory-body { max-height:0; padding-block:0; opacity:0; overflow:hidden; }
    .library-directory.is-collapsed .directory-toggle { border-bottom-color:transparent; }
    .directory-grid {
      position:absolute;
      inset:12px 10px 10px;
      opacity:.18;
      background:
        linear-gradient(90deg,transparent 0 10%,currentColor 10% 11%,transparent 11% 46%,currentColor 46% 47%,transparent 47% 82%,currentColor 82% 83%,transparent 83%),
        linear-gradient(transparent 0 18%,currentColor 18% 19%,transparent 19% 48%,currentColor 48% 49%,transparent 49% 78%,currentColor 78% 79%,transparent 79%);
      pointer-events:none;
    }
    .directory-list {
      position:relative;
      z-index:1;
      display:grid;
      gap:8px;
      margin:0;
      padding:0;
      list-style:none;
    }
    .directory-link {
      width:100%;
      min-height:48px;
      display:grid;
      grid-template-columns:40px minmax(16px,1fr) minmax(0,1.45fr);
      align-items:center;
      gap:8px;
      border:1px solid transparent;
      border-radius:11px;
      padding:7px 9px;
      color:#d7c7b2;
      background:rgba(11,8,7,.38);
      text-align:left;
      cursor:pointer;
      transition:background .2s ease,border-color .2s ease,transform .2s ease,color .2s ease;
    }
    .directory-link:hover,.directory-link:focus-visible {
      transform:translateX(-2px);
      border-color:rgba(216,173,102,.26);
      background:rgba(216,173,102,.09);
      outline:none;
    }
    .directory-link.is-active {
      color:#fff4de;
      border-color:rgba(216,173,102,.42);
      background:linear-gradient(90deg,rgba(216,173,102,.18),rgba(216,173,102,.045));
      box-shadow:inset 3px 0 var(--gold);
    }
    .directory-code {
      display:grid;
      place-items:center;
      min-height:30px;
      border:1px solid rgba(216,173,102,.34);
      border-radius:7px;
      color:var(--gold);
      background:#17100d;
      font-size:.72rem;
      font-weight:900;
      letter-spacing:.08em;
    }
    .directory-route {
      height:12px;
      border-top:2px solid rgba(216,173,102,.42);
      border-right:2px solid rgba(216,173,102,.42);
      border-radius:0 8px 0 0;
    }
    .directory-list li:nth-child(even) .directory-route {
      border-top:0;
      border-right:0;
      border-bottom:2px solid rgba(216,173,102,.42);
      border-left:2px solid rgba(216,173,102,.42);
      border-radius:0 0 0 8px;
    }
    .directory-label {
      min-width:0;
      font-size:.78rem;
      line-height:1.2;
    }
    .directory-you-are-here {
      position:relative;
      z-index:1;
      display:flex;
      align-items:center;
      gap:9px;
      margin:15px 7px 0;
      padding-top:13px;
      border-top:1px solid rgba(216,173,102,.16);
      color:#bba990;
      font-size:.72rem;
      letter-spacing:.04em;
      text-transform:uppercase;
    }
    .directory-you-are-here span {
      width:9px;
      height:9px;
      border:2px solid #f4cf85;
      border-radius:50%;
      background:#7b3b2a;
      box-shadow:0 0 0 4px rgba(216,173,102,.11),0 0 14px rgba(216,173,102,.38);
    }
    .shelf-row.directory-highlight { animation:directoryShelfPulse 1.15s ease; }
    @keyframes directoryShelfPulse {
      0%,100% { filter:none; }
      35% { filter:brightness(1.22) drop-shadow(0 0 15px rgba(216,173,102,.22)); }
    }

    .library-panel {
      border: 1px solid rgba(255,255,255,.09);
      border-radius: 28px;
      padding: 30px 24px 28px;
      background:
        linear-gradient(90deg,rgba(50,27,18,.5),transparent 10%,transparent 90%,rgba(50,27,18,.5)),
        var(--shelf-texture-image) center / 240px 240px repeat,
        linear-gradient(180deg,rgba(112,70,45,.28),rgba(31,20,15,.75));
      box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.05);
      position: relative;
      overflow: hidden;
    }
    .library-panel::before {
      content:"";
      position:absolute;
      inset:0;
      background:repeating-linear-gradient(90deg,transparent 0 72px,rgba(255,255,255,.018) 73px 74px);
      pointer-events:none;
    }

    .shelf-row {
      position:relative;
      min-height:250px;
      display:flex;
      align-items:flex-end;
      gap:clamp(4px,.55vw,9px);
      padding:22px clamp(12px,1.6vw,24px) 34px;
      perspective:1200px;
      overflow:hidden;
    }
    .shelf-row + .shelf-row { margin-top:30px; }
    .shelf-row::after {
      content:"";
      position:absolute;
      left:0; right:0; bottom:12px;
      height:26px;
      border-radius:3px 3px 11px 11px;
      background:linear-gradient(180deg,#8d5838 0 18%,#5e351f 19% 68%,#3e2418 69% 100%);
      box-shadow:0 14px 16px rgba(0,0,0,.4), inset 0 2px rgba(255,255,255,.14);
    }

    .shelf-book {
      --book-width:42px;
      --book-height:184px;
      --book-color:#6f3c36;
      width:var(--book-width);
      height:var(--book-height);
      flex:1 1 var(--book-width);
      min-width:32px;
      max-width:74px;
      border:0;
      border-radius:4px 5px 3px 3px;
      padding:10px 5px;
      color:rgba(255,248,231,.92);
      background:linear-gradient(90deg,rgba(255,255,255,.12),transparent 12%,transparent 82%,rgba(0,0,0,.28)),var(--book-color);
      box-shadow:inset 3px 0 rgba(255,255,255,.07),inset -3px 0 rgba(0,0,0,.18),4px 9px 12px rgba(0,0,0,.22);
      position:relative;
      z-index:1;
      cursor:pointer;
      transform-origin:center bottom;
      transition:transform .25s cubic-bezier(.18,.78,.24,1),filter .25s ease,box-shadow .25s ease,opacity .2s ease;
    }
    .shelf-book::before,.shelf-book::after {
      content:"";
      position:absolute;
      left:5px; right:5px;
      height:2px;
      background:rgba(242,208,146,.52);
    }
    .shelf-book::before { top:14px; }
    .shelf-book::after { bottom:14px; }
    .shelf-book.has-spine-image {
      background:none;
      box-shadow:4px 9px 12px rgba(0,0,0,.22);
    }
    .shelf-book.has-spine-image::before,
    .shelf-book.has-spine-image::after {
      opacity:0;
    }
    .shelf-book:hover,.shelf-book:focus-visible {
      transform:translateY(-10px) translateZ(32px) rotateY(-9deg);
      filter:brightness(1.11);
      box-shadow:11px 17px 22px rgba(0,0,0,.34);
      outline:none;
      z-index:4;
    }
    .shelf-book[aria-hidden="true"], .recommendation-card[aria-hidden="true"] { opacity:0 !important; }
    .spine-generated {
      position:absolute;
      inset:0;
      z-index:1;
      overflow:hidden;
      border-radius:inherit;
      pointer-events:none;
      user-select:none;
      background:
        linear-gradient(90deg,rgba(255,255,255,.10),transparent 15%,transparent 80%,rgba(0,0,0,.22)),
        var(--book-color);
    }
    .spine-generated::before,.spine-generated::after {
      content:"";
      position:absolute;
      left:5px;
      right:5px;
      height:2px;
      background:rgba(242,208,146,.52);
    }
    .spine-generated::before { top:14px; }
    .spine-generated::after { bottom:14px; }
    .spine-art {
      position:absolute;
      inset:0;
      z-index:2;
      width:100%;
      height:100%;
      object-fit:fill;
      border-radius:inherit;
      pointer-events:none;
      user-select:none;
    }
    .spine-art[hidden] { display:none; }
    .spine-title {
      position:absolute;
      inset:30px 50% 30px auto;
      writing-mode:vertical-rl;
      transform:translateX(50%) rotate(180deg);
      font:500 clamp(.68rem,1vw,.82rem)/1 Georgia,serif;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
      max-height:calc(100% - 60px);
      text-shadow:0 1px 1px rgba(0,0,0,.4);
    }
    .spine-author {
      position:absolute;
      left:50%;
      bottom:20px;
      max-width:calc(100% - 10px);
      transform:translateX(-50%);
      overflow:hidden;
      color:rgba(255,244,220,.72);
      font:700 .46rem/1 system-ui,sans-serif;
      letter-spacing:.05em;
      text-overflow:ellipsis;
      text-transform:uppercase;
      white-space:nowrap;
    }
    .book-tooltip {
      position:absolute;
      left:50%; bottom:calc(100% + 18px);
      width:max-content;
      max-width:220px;
      transform:translate(-50%,6px);
      padding:8px 10px;
      border:1px solid var(--line);
      border-radius:10px;
      background:#17110e;
      color:var(--ink);
      font-size:.75rem;
      line-height:1.35;
      opacity:0;
      pointer-events:none;
      transition:opacity .18s ease, transform .18s ease;
      box-shadow:0 8px 24px rgba(0,0,0,.35);
      z-index:20;
    }
    .shelf-book:hover .book-tooltip,.shelf-book:focus-visible .book-tooltip {
      opacity:1;
      transform:translate(-50%,0);
    }

    .empty-state {
      position: relative;
      z-index: 2;
      min-height: 220px;
      display: grid;
      place-items: center;
      text-align: center;
      color: var(--muted);
      line-height: 1.6;
      padding: 30px;
    }

    /* Reader */
    .interaction-note {
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      align-items:center;
      margin-top:18px;
      color:var(--muted);
      font-size:.9rem;
    }
    .kbd {
      min-width:28px;
      padding:4px 7px;
      border:1px solid rgba(255,255,255,.16);
      border-bottom-width:3px;
      border-radius:7px;
      background:rgba(255,255,255,.06);
      color:var(--ink);
      text-align:center;
      font-size:.78rem;
      line-height:1;
    }

    .reader-overlay {
      position:fixed;
      inset:0;
      z-index:100;
      background:rgba(8,5,4,0);
      backdrop-filter:blur(0);
      pointer-events:none;
      transition:background .35s ease, backdrop-filter .35s ease;
      overflow:hidden;
    }
    .reader-overlay.is-active {
      background:rgba(8,5,4,.9);
      backdrop-filter:blur(10px);
      pointer-events:auto;
    }

    .reader-topbar {
      position:fixed;
      top:14px;
      left:18px;
      right:18px;
      z-index:160;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
      opacity:0;
      transform:translateY(-10px);
      pointer-events:none;
      transition:opacity .25s ease .25s, transform .25s ease .25s;
    }
    .reader-overlay.is-active .reader-topbar {
      opacity:1;
      transform:none;
      pointer-events:auto;
    }
    .reader-titlebar { min-width:0; display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.86); }
    .reader-titlebar strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:min(58vw,760px); }
    .reader-titlebar span { color:rgba(255,255,255,.58); font-size:.86rem; }
    .reader-control {
      border:1px solid rgba(255,255,255,.17);
      border-radius:999px;
      background:rgba(24,16,12,.8);
      color:#fff;
      min-height:42px;
      padding:0 14px;
      cursor:pointer;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
    }
    .reader-control.square { width:42px; padding:0; border-radius:50%; }
    .reader-control:hover { background:rgba(255,255,255,.13); }
    .reader-control[data-disabled="true"] { opacity:.28; cursor:default; pointer-events:none; }

    .floating-book {
      position:fixed;
      top:0;
      left:0;
      width:var(--spread-w,1200px);
      height:var(--book-h,760px);
      transform-origin:top left;
      transform-style:preserve-3d;
      perspective:2200px;
      z-index:120;
      will-change:transform;
    }

    .book-volume {
      position:absolute;
      inset:0;
      transform-style:preserve-3d;
      filter:drop-shadow(0 34px 45px rgba(0,0,0,.6));
    }

    .book-cover {
      position:absolute;
      top:0;
      left:0;
      width:50%;
      height:100%;
      z-index:24;
      overflow:hidden;
      border-radius:16px 5px 5px 16px;
      background:var(--active-color,#704037);
      box-shadow:inset -12px 0 rgba(0,0,0,.16),inset 6px 0 rgba(255,255,255,.06),0 18px 48px rgba(0,0,0,.35);
      /* Collapse from the cover's outer right edge toward the outer left edge.
         The left edge stays anchored while the moving right edge travels left,
         matching the first page as it replaces the cover right-to-left. */
      transform-origin:left center;
      transform:scaleX(1);
      transition:transform 1.15s cubic-bezier(.16,.78,.18,1), box-shadow .85s ease;
      will-change:transform;
      backface-visibility:hidden;
    }
    .book-cover img { width:100%; height:100%; object-fit:cover; display:block; }
    .book-cover-fallback {
      width:100%; height:100%;
      padding:clamp(28px,4vw,64px);
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      color:#fff8ea;
      background:
        radial-gradient(circle at 76% 18%,rgba(255,255,255,.18),transparent 23%),
        linear-gradient(110deg,rgba(255,255,255,.14),transparent 20%,transparent 74%,rgba(0,0,0,.23)),
        var(--cover-placeholder-image) center / cover no-repeat,
        var(--active-color,#704037);
    }
    .book-cover-fallback::before {
      content:"";
      position:absolute;
      inset:18px;
      border:1px solid rgba(255,236,200,.39);
      border-radius:11px 3px 3px 11px;
    }
    .floating-mark,.floating-title,.floating-author { position:relative; z-index:2; }
    .floating-mark { font-size:clamp(.7rem,.9vw,.88rem); letter-spacing:.18em; text-transform:uppercase; opacity:.82; }
    .floating-title { max-width:8ch; font:500 clamp(2.2rem,4vw,5.3rem)/.92 var(--theme-reading-font, Georgia,serif); letter-spacing:-.04em; }
    .floating-author { font-size:clamp(.86rem,1.1vw,1.1rem); opacity:.84; }

    /* Simulated Western book opening.
       The closed cover occupies the left half of the eventual spread. While the
       whole book shifts left, the left page grows over that cover from the
       cover's right edge. The right page uses the center spine as its hinge and
       grows into the previously empty space on the right. */
    .book-spread {
      position:absolute;
      inset:0;
      display:grid;
      grid-template-columns:1fr 1fr;
      transform-style:preserve-3d;
      pointer-events:none;
      z-index:20;
    }
    .reader-page {
      position:relative;
      min-width:0;
      height:100%;
      overflow:hidden;
      color:var(--paper-ink);
      background:
        repeating-linear-gradient(0deg,rgba(84,62,42,.025) 0 1px,transparent 1px 5px),
        radial-gradient(circle at 50% 15%,rgba(255,255,255,.58),transparent 48%),
        var(--paper-texture-image) center / 180px 180px repeat,
        var(--paper);
      box-shadow:inset 0 0 36px rgba(74,48,24,.12);
      transform:scaleX(0);
      transition:transform 1.15s cubic-bezier(.16,.78,.18,1), filter .8s ease;
      will-change:transform;
      backface-visibility:hidden;
      z-index:21;
    }
    .reader-page.left {
      grid-column:1;
      transform-origin:right center;
      border-radius:16px 2px 2px 14px;
      box-shadow:inset -22px 0 30px rgba(75,51,31,.13), inset 0 0 36px rgba(74,48,24,.1);
      z-index:23;
    }
    .reader-page.right {
      grid-column:2;
      transform-origin:left center;
      border-radius:2px 16px 14px 2px;
      box-shadow:inset 22px 0 30px rgba(75,51,31,.13), inset 0 0 36px rgba(74,48,24,.1);
      z-index:22;
    }
    .floating-book.is-opening .reader-page.left,
    .floating-book.is-open .reader-page.left,
    .floating-book.is-opening .reader-page.right,
    .floating-book.is-open .reader-page.right {
      transform:scaleX(1);
    }

    /* The first page expands from the spine toward the left while the cover's
       moving right edge collapses in the same direction. The synchronized
       right-to-left boundary creates the flat cover-flip illusion. A thin strip
       remains at the outer-left edge to suggest the cover has swung away. */
    .floating-book.is-opening .book-cover,
    .floating-book.is-open .book-cover {
      transform:scaleX(.018);
      box-shadow:inset -12px 0 rgba(0,0,0,.2),0 5px 14px rgba(0,0,0,.28);
    }

    /* The replacement page and cover move together; the facing page follows
       from the center hinge into empty space. Closing reverses the sequence. */
    .floating-book.is-opening .reader-page.left,
    .floating-book.is-opening .book-cover { transition-delay:.04s; }
    .floating-book.is-opening .reader-page.right { transition-delay:.18s; }
    .floating-book.is-closing .reader-page.right { transition-delay:0s; }
    .floating-book.is-closing .reader-page.left,
    .floating-book.is-closing .book-cover { transition-delay:.14s; }
    .floating-book.is-open .book-spread { pointer-events:auto; }

    .reader-page.left::after,.reader-page.right::before {
      content:"";
      position:absolute;
      top:0; bottom:0;
      width:34px;
      pointer-events:none;
      z-index:4;
    }
    .reader-page.left::after { right:0; background:linear-gradient(90deg,transparent,rgba(60,39,25,.16)); }
    .reader-page.right::before { left:0; background:linear-gradient(90deg,rgba(60,39,25,.17),transparent); }

    .book-gutter {
      position:absolute;
      left:50%;
      top:1.5%;
      width:12px;
      height:97%;
      transform:translateX(-50%) translateZ(4px) scaleY(.2);
      transform-origin:center;
      background:linear-gradient(90deg,#4a2c1d,#7d5436 48%,#3b2116);
      box-shadow:0 0 12px rgba(0,0,0,.35);
      z-index:30;
      border-radius:4px;
      opacity:0;
      transition:opacity .4s ease .25s, transform .8s cubic-bezier(.2,.8,.2,1) .15s;
    }
    .floating-book.is-opening .book-gutter,
    .floating-book.is-open .book-gutter { opacity:1; transform:translateX(-50%) translateZ(4px) scaleY(1); }

    .page-inner {
      height:100%;
      display:flex;
      flex-direction:column;
      padding:clamp(32px,4.1vh,58px) clamp(30px,3.6vw,68px) clamp(26px,3.4vh,50px);
      overflow:hidden;
    }
    .page-running-head {
      flex:0 0 auto;
      min-height:20px;
      display:flex;
      justify-content:space-between;
      gap:12px;
      color:var(--reader-book-text-color,#352b22);
      opacity:.68;
      font-size:clamp(.62rem,.76vw,.78rem);
      letter-spacing:.12em;
      text-transform:uppercase;
      border-bottom:1px solid rgba(91,67,46,.12);
      padding-bottom:10px;
      margin-bottom:clamp(18px,2.6vh,30px);
    }
    .page-body {
      flex:1;
      min-height:0;
      overflow:hidden;
      font-family:var(--theme-reading-font, Georgia,"Times New Roman",serif);
      font-size:clamp(.84rem,1.06vw,1.18rem);
      line-height:1.66;
      color:var(--reader-book-text-color,#352b22);
      text-wrap:pretty;
    }
    .page-body h2 { margin:0 0 .7em; font:500 clamp(1.55rem,2.5vw,3.1rem)/1.02 var(--theme-reading-font, Georgia,serif); letter-spacing:-.03em; }
    .page-body h3 { margin:0 0 .65em; font:500 clamp(1.15rem,1.55vw,1.8rem)/1.15 var(--theme-reading-font, Georgia,serif); }
    .page-body p { margin:0 0 .95em; }
    .page-body p:first-of-type::first-letter { float:left; font-size:3.45em; line-height:.8; padding:.08em .12em 0 0; color:var(--reader-book-text-color,#352b22); }
    .title-page { height:100%; display:flex; flex-direction:column; justify-content:center; text-align:center; padding:clamp(20px,4vw,70px); }
    .title-page .ornament { color:#9a7147; font-size:1.3rem; margin-bottom:18px; }
    .title-page h2 { margin:0; font-size:clamp(2rem,4vw,4.8rem); }
    .title-page p { margin:18px 0 0; color:var(--reader-book-text-color,#352b22); opacity:.72; font-style:italic; }
    .title-page p:first-of-type::first-letter { float:none; font-size:inherit; line-height:inherit; padding:0; color:inherit; }
    .page-number { flex:0 0 auto; margin-top:12px; color:var(--reader-book-text-color,#352b22); opacity:.62; text-align:center; font:italic .84rem Georgia,serif; }

    .page-turn-zone {
      position:absolute;
      top:0;
      bottom:0;
      width:clamp(70px,9vw,146px);
      z-index:60;
      border:0;
      padding:0;
      display:flex;
      align-items:center;
      color:rgba(78,52,33,.66);
      opacity:.38;
      cursor:pointer;
      transition:opacity .2s ease, background .2s ease;
      background:transparent;
    }
    .page-turn-zone.previous {
      left:0;
      justify-content:flex-start;
      padding-left:clamp(10px,1.7vw,28px);
      border-radius:16px 0 0 14px;
      background:linear-gradient(90deg,rgba(108,73,44,.17),transparent 72%);
    }
    .page-turn-zone.next {
      right:0;
      justify-content:flex-end;
      padding-right:clamp(10px,1.7vw,28px);
      border-radius:0 16px 14px 0;
      background:linear-gradient(270deg,rgba(108,73,44,.17),transparent 72%);
    }
    .page-turn-zone span {
      width:clamp(38px,3.8vw,54px);
      aspect-ratio:1;
      display:grid;
      place-items:center;
      border:1px solid rgba(82,55,35,.28);
      border-radius:50%;
      background:rgba(246,237,218,.72);
      box-shadow:0 9px 22px rgba(75,51,31,.12);
      font-weight:900;
    }
    .page-turn-zone:hover { opacity:1; }
    .page-turn-zone[data-disabled="true"] { opacity:.12; cursor:default; pointer-events:none; }

    .reader-nav {
      position:fixed;
      left:50%;
      bottom:14px;
      z-index:160;
      display:flex;
      align-items:center;
      gap:10px;
      transform:translate(-50%,10px);
      opacity:0;
      pointer-events:none;
      transition:opacity .25s ease .3s,transform .25s ease .3s;
    }
    .reader-overlay.is-active .reader-nav { opacity:1; transform:translate(-50%,0); pointer-events:auto; }
    .page-indicator { min-width:150px; text-align:center; color:rgba(255,255,255,.76); font-size:.86rem; }
    .pdf-zoom-controls {
      position:fixed;
      left:50%;
      bottom:66px;
      z-index:220;
      display:flex;
      align-items:center;
      gap:7px;
      padding:7px;
      border:1px solid rgba(255,255,255,.14);
      border-radius:999px;
      background:rgba(18,12,9,.84);
      box-shadow:0 12px 30px rgba(0,0,0,.28);
      color:rgba(255,255,255,.84);
      opacity:0;
      transform:translate(-50%,8px);
      pointer-events:none;
      transition:opacity .2s ease,transform .2s ease;
      backdrop-filter:blur(10px);
    }
    .pdf-zoom-controls[hidden] { display:none!important; }
    .pdf-zoom-controls.is-active {
      opacity:1;
      transform:translate(-50%,0);
      pointer-events:auto;
    }
    .pdf-zoom-button { font:700 1.25rem/1 system-ui,sans-serif; }
    .pdf-fit-button { min-width:54px; }
    .pdf-zoom-value { min-width:56px; text-align:center; font:700 .78rem/1 system-ui,sans-serif; }
    .pdf-zoom-hint { padding:0 8px 0 2px; color:rgba(255,255,255,.6); font-size:.72rem; white-space:nowrap; }
    .floating-book.pdf-is-zoomed .page-turn-zone { opacity:0; pointer-events:none; }

    .loading-page,.error-page {
      height:100%;
      display:grid;
      place-items:center;
      padding:30px;
      text-align:center;
      color:#6f5b49;
      font-family:Georgia,serif;
      line-height:1.55;
    }

    .page-turn-forward .reader-page.right .page-inner { animation: turnForward .34s ease; }
    .page-turn-back .reader-page.left .page-inner { animation: turnBack .34s ease; }
    @keyframes turnForward { from { opacity:.25; transform:translateX(20px) rotateY(-4deg); } to { opacity:1; transform:none; } }
    @keyframes turnBack { from { opacity:.25; transform:translateX(-20px) rotateY(4deg); } to { opacity:1; transform:none; } }

    .pagination-measure {
      position:fixed;
      left:-99999px;
      top:0;
      visibility:hidden;
      pointer-events:none;
      color:var(--paper-ink);
      background:var(--paper);
      overflow:hidden;
    }

    @media (max-width: 1050px) {
      .library-layout.has-directory { grid-template-columns:minmax(0,1fr) 218px; gap:16px; }
      .directory-link { grid-template-columns:38px minmax(12px,.7fr) minmax(0,1.35fr); padding-inline:7px; }
    }

    @media (max-width: 900px) {
      .library-layout.has-directory { display:flex; flex-direction:column; }
      .library-directory { position:relative; top:auto; width:100%; order:-1; }
      .directory-list { grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
      .directory-body { max-height:900px; }
    }

    @media (max-width: 760px) {
      .hero { grid-template-columns:1fr; gap:20px; }
      .recommendation-rail { grid-auto-columns:minmax(160px,65%); }
      .library-panel { padding-inline:10px; }
      .shelf-row { overflow:hidden; padding-inline:8px; gap:4px; }
      .shelf-book { min-width:28px; max-width:62px; }
      .reader-titlebar span { display:none; }
      .reader-topbar { top:8px; left:8px; right:8px; }
      .reader-titlebar strong { max-width:62vw; font-size:.82rem; }
      .reader-nav { bottom:8px; }
      .page-indicator { min-width:120px; font-size:.78rem; }
      .page-turn-zone { width:56px; }
      .directory-list { grid-template-columns:1fr; }
      .directory-toggle { padding:15px 14px 13px; }
      .page-inner { padding:26px 20px 24px; }
      .page-running-head { display:none; }
      .page-body { font-size:clamp(.72rem,2.4vw,.95rem); line-height:1.5; }
    }

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

/* Theme icon support */
.icon-button .ui-icon,.reader-control .ui-icon{pointer-events:none;}
.page-turn-zone .ui-icon{width:28px;height:28px;}
.title-page .ornament .ui-icon{width:30px;height:30px;margin:0 auto;opacity:.8;}

/* Tag collection module */
.tag-browser { margin-top: 0; margin-bottom: 10px; }
.tag-browser-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(240px,.72fr) minmax(360px,1.28fr);
  gap: 22px 34px;
  align-items: center;
  padding: clamp(20px,3vw,34px);
  border: 1px solid rgba(216,173,102,.24);
  border-radius: 26px;
  background:
    linear-gradient(90deg,rgba(216,173,102,.045) 1px,transparent 1px),
    linear-gradient(rgba(216,173,102,.045) 1px,transparent 1px),
    radial-gradient(circle at 10% 10%,rgba(216,173,102,.13),transparent 32%),
    linear-gradient(145deg,rgba(47,31,24,.94),rgba(18,12,10,.94));
  background-size: 28px 28px,28px 28px,auto,auto;
  box-shadow: 0 24px 70px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.04);
}
.tag-browser-card::after {
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(216,173,102,.1);
  border-radius:19px;
  pointer-events:none;
}
.tag-browser-heading {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:15px;
  align-items:start;
  grid-row:1 / span 3;
}
.tag-browser-heading h2 {
  margin:0;
  font:500 clamp(1.65rem,3vw,2.5rem)/1.02 var(--theme-reading-font,Georgia,serif);
  letter-spacing:-.03em;
}
.tag-browser-heading p:last-child { margin:8px 0 0; color:var(--muted); line-height:1.55; }
.tag-browser-icon {
  width:48px;
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border:1px solid rgba(216,173,102,.32);
  border-radius:14px;
  background:rgba(216,173,102,.08);
}
.tag-browser-icon img { width:27px; height:27px; }
.tag-search-box {
  position:relative;
  z-index:2;
  min-height:54px;
  display:grid;
  grid-template-columns:24px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  padding:0 9px 0 16px;
  border:1px solid rgba(216,173,102,.25);
  border-radius:15px;
  background:rgba(7,5,4,.52);
  box-shadow:inset 0 1px 12px rgba(0,0,0,.18);
}
.tag-search-box:focus-within { border-color:rgba(216,173,102,.58); box-shadow:0 0 0 3px rgba(216,173,102,.08); }
.tag-search-box > img { width:21px; height:21px; opacity:.76; }
.tag-search-box input {
  width:100%;
  border:0;
  outline:0;
  color:var(--ink);
  background:transparent;
  font:inherit;
}
.tag-search-box input::placeholder { color:rgba(202,187,174,.65); }
.tag-search-box input::-webkit-search-cancel-button { display:none; }
.tag-clear {
  min-height:36px;
  border:1px solid rgba(216,173,102,.24);
  border-radius:10px;
  padding:0 12px;
  color:var(--gold);
  background:rgba(216,173,102,.07);
  cursor:pointer;
}
.tag-clear:hover { background:rgba(216,173,102,.14); }
.tag-suggestions,.active-tag-list {
  position:relative;
  z-index:2;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.tag-pill,.active-tag {
  min-height:34px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:999px;
  padding:0 11px;
  color:#d8cbbb;
  background:rgba(255,255,255,.045);
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease;
  font-size:.78rem;
}
.tag-pill span { min-width:20px; padding:2px 6px; border-radius:999px; color:var(--gold); background:rgba(216,173,102,.09); text-align:center; font-size:.68rem; }
.tag-pill:hover,.tag-pill:focus-visible,.active-tag:hover,.active-tag:focus-visible { transform:translateY(-1px); border-color:rgba(216,173,102,.42); outline:none; }
.tag-pill.is-active,.active-tag {
  color:#fff5e4;
  border-color:rgba(216,173,102,.5);
  background:linear-gradient(180deg,rgba(216,173,102,.19),rgba(216,173,102,.08));
}
.active-tag span { color:var(--gold); font-size:1rem; line-height:1; }
.tag-result-summary {
  position:relative;
  z-index:2;
  margin:0;
  color:var(--muted);
  font-size:.78rem;
  letter-spacing:.02em;
}
.tag-no-match { color:var(--muted); font-size:.82rem; padding:7px 2px; }
.recommendation-rail.is-empty { min-height:48px; }
.directory-link { grid-template-columns:40px minmax(16px,.75fr) minmax(0,1.5fr) auto; }
.directory-count {
  min-width:25px;
  color:var(--gold);
  font-size:.68rem;
  text-align:right;
  font-variant-numeric:tabular-nums;
}
.book-tooltip em { color:var(--gold); font-style:normal; font-size:.68rem; }

@media (max-width: 1050px) {
  .tag-browser-card { grid-template-columns:minmax(220px,.7fr) minmax(320px,1.3fr); }
  .directory-link { grid-template-columns:38px minmax(12px,.55fr) minmax(0,1.35fr) auto; }
}
@media (max-width: 760px) {
  .tag-browser-card { grid-template-columns:1fr; gap:16px; padding:20px; }
  .tag-browser-heading { grid-row:auto; grid-template-columns:40px minmax(0,1fr); }
  .tag-browser-icon { width:40px; }
  .tag-search-box { min-height:50px; }
}

/* Collection index can contain many automatically collected tags. */
.library-directory:not(.is-collapsed) .directory-body {
  max-height:min(720px,calc(100vh - 112px));
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(216,173,102,.42) rgba(255,255,255,.04);
}
@media (max-width:900px) {
  .library-directory:not(.is-collapsed) .directory-body { max-height:520px; }
}
@media (prefers-reduced-motion: reduce) {
  .tag-pill,.active-tag,.tag-search-box,.tag-clear { transition-duration:.001ms !important; }
}


/* Library-first layout: keep discovery useful without overpowering the shelves. */
@media (min-width: 761px) {
  .page-shell {
    padding-top: 16px;
  }

  .topbar {
    padding-bottom: 18px;
  }

  .hero {
    gap: 28px;
    margin-bottom: 24px;
  }

  .hero h1 {
    font-size: clamp(2.7rem, 5.2vw, 4.9rem);
  }

  .hero-copy {
    font-size: clamp(.92rem, 1.25vw, 1.04rem);
    line-height: 1.55;
    max-width: 42ch;
  }

  .tag-browser {
    margin-bottom: 0;
  }

  .tag-browser-card {
    grid-template-columns: 184px minmax(280px, 1fr) auto;
    grid-template-rows: 42px auto auto;
    gap: 7px 14px;
    align-items: center;
    padding: 11px 14px;
    border-radius: 18px;
  }

  .tag-browser-card::after {
    inset: 5px;
    border-radius: 13px;
  }

  .tag-browser-heading {
    grid-column: 1;
    grid-row: 1 / span 3;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
  }

  .tag-browser-heading .eyebrow,
  .tag-browser-heading p:last-child {
    display: none;
  }

  .tag-browser-heading h2 {
    font-size: 1.2rem;
    line-height: 1.05;
    letter-spacing: -.015em;
  }

  .tag-browser-icon {
    width: 34px;
    border-radius: 10px;
  }

  .tag-browser-icon img {
    width: 20px;
    height: 20px;
  }

  .tag-search-box {
    grid-column: 2;
    grid-row: 1;
    min-height: 42px;
    border-radius: 12px;
    padding-left: 13px;
  }

  .tag-search-box > img {
    width: 18px;
    height: 18px;
  }

  .tag-clear {
    min-height: 30px;
    padding-inline: 10px;
    border-radius: 8px;
    font-size: .76rem;
  }

  .tag-result-summary {
    grid-column: 3;
    grid-row: 1;
    white-space: nowrap;
    text-align: right;
  }

  .active-tag-list {
    grid-column: 2 / -1;
    grid-row: 2;
  }

  .tag-suggestions {
    grid-column: 2 / -1;
    grid-row: 3;
  }

  .tag-suggestions,
  .active-tag-list {
    flex-wrap: nowrap;
    gap: 6px;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 1px 2px 3px;
    scrollbar-width: thin;
    scrollbar-color: rgba(216,173,102,.38) transparent;
  }

  .tag-pill,
  .active-tag {
    flex: 0 0 auto;
    min-height: 28px;
    padding-inline: 9px;
    font-size: .72rem;
  }

  #featured-section {
    margin-top: 22px;
  }

  #featured-section .section-heading {
    align-items: center;
    margin-bottom: 9px;
  }

  #featured-section .section-heading h2 {
    font-size: clamp(1.25rem, 2vw, 1.65rem);
  }

  #featured-section .section-heading p {
    display: none;
  }

  #featured-section .icon-button {
    width: 34px;
    height: 34px;
  }

  #featured-section .ui-icon {
    width: 16px;
    height: 16px;
  }

  .recommendation-rail {
    grid-auto-columns: clamp(96px, 8.2vw, 124px);
    gap: 10px;
    padding: 2px 2px 8px;
  }

  .recommendation-card {
    border-radius: 14px;
    padding: 6px;
  }

  .recommendation-card:hover,
  .recommendation-card:focus-visible {
    transform: translateY(-4px) rotateX(1deg);
  }

  .recommendation-card .cover-art {
    border-radius: 9px;
    box-shadow: 0 10px 20px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.12);
  }

  .recommendation-card .cover-fallback {
    padding: 10px;
  }

  .recommendation-card .cover-fallback small {
    font-size: .52rem;
  }

  .recommendation-card .cover-fallback strong {
    font-size: .9rem;
  }

  .recommendation-card .card-meta {
    padding: 7px 1px 1px;
  }

  .recommendation-card .card-meta strong {
    font-size: .76rem;
  }

  .recommendation-card .card-meta span {
    margin-top: 2px;
    font-size: .67rem;
  }

  #library-section {
    margin-top: 24px;
  }

  #library-section > .section-heading {
    margin-bottom: 12px;
  }
}

@media (min-width: 1200px) and (min-height: 720px) {
  .hero {
    margin-bottom: 18px;
  }

  #featured-section {
    margin-top: 18px;
  }

  #library-section {
    margin-top: 18px;
  }
}

/* Invite-only community module */
.topbar-actions{display:flex;align-items:center;gap:10px}.account-button{display:flex;align-items:center;gap:9px;border:1px solid rgba(216,173,102,.25);border-radius:999px;background:rgba(22,14,11,.64);color:var(--ink);padding:8px 13px;cursor:pointer;font:inherit}.account-button:hover{border-color:rgba(216,173,102,.55)}.register-button{text-decoration:none;background:rgba(142,91,52,.26)}.account-button:disabled{cursor:not-allowed;opacity:.76;border-color:rgba(216,173,102,.18);background:rgba(76,61,52,.38)}.account-button:disabled:hover{border-color:rgba(216,173,102,.18)}.account-dot{width:8px;height:8px;border-radius:50%;background:#8f7868;box-shadow:0 0 0 3px rgba(143,120,104,.12)}.account-dot.is-online{background:#79a97c;box-shadow:0 0 0 3px rgba(121,169,124,.14)}
.community-modal{position:fixed;inset:0;z-index:500;display:grid;place-items:center;padding:20px;background:rgba(7,5,4,.72);backdrop-filter:blur(12px);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}.community-modal.is-open{opacity:1;visibility:visible}.community-modal-card{position:relative;width:min(500px,100%);padding:34px;border:1px solid rgba(216,173,102,.28);border-radius:24px;background:linear-gradient(145deg,#302018,#17100d);box-shadow:0 35px 110px rgba(0,0,0,.5)}.community-modal-card h2{margin:.15em 0 .6em;font:500 clamp(2rem,5vw,3.4rem)/1 var(--theme-reading-font,Georgia,serif)}.community-modal-close{position:absolute;top:13px;right:13px;width:38px;height:38px;border:1px solid rgba(216,173,102,.23);border-radius:50%;background:rgba(0,0,0,.18);color:var(--ink);font-size:1.45rem;cursor:pointer}.community-login-form{display:grid;gap:14px}.community-login-form label{display:grid;gap:6px;color:var(--muted)}.community-login-form input,.discussion-compose textarea,.inline-comment-form textarea{width:100%;border:1px solid rgba(108,78,54,.27);border-radius:10px;background:rgba(255,255,255,.52);color:#30261f;padding:11px 12px;font:inherit;resize:vertical}.community-login-form input{background:rgba(8,5,4,.55);color:var(--ink);border-color:rgba(216,173,102,.22)}.community-register-prompt,.discussion-signin-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.community-register-prompt{padding-top:4px;border-top:1px solid rgba(216,173,102,.14)}.community-primary,.community-link-button{display:inline-flex;justify-content:center;align-items:center;border:1px solid rgba(216,173,102,.32);border-radius:10px;background:linear-gradient(135deg,#9b673e,#72472e);color:#fff7eb;padding:10px 14px;text-decoration:none;font-weight:700;cursor:pointer}.community-muted,.community-form-message{color:var(--muted)}.community-account-summary,.discussion-member{display:flex;align-items:center;gap:12px;margin:14px 0}.community-account-summary div,.discussion-member div{display:grid}.community-account-summary span,.discussion-member small{color:var(--muted)}.community-avatar,.comment-avatar{display:grid;place-items:center;border-radius:50%;background:#70462e;color:#fff3e2;font-family:Georgia,serif}.community-avatar{width:44px;height:44px;font-size:1.25rem}.community-account-actions{display:flex;gap:10px;flex-wrap:wrap}.community-account-actions button{border:1px solid rgba(216,173,102,.25);border-radius:10px;background:rgba(0,0,0,.18);color:var(--ink);padding:10px 14px;cursor:pointer}.community-notice{border-left:3px solid #d1a464;padding:9px 12px;background:rgba(209,164,100,.08)}
.reader-mode-tabs{position:absolute;top:12px;left:50%;z-index:115;display:flex;transform:translateX(-50%);padding:4px;border:1px solid rgba(91,67,46,.18);border-radius:999px;background:rgba(245,235,216,.9);box-shadow:0 8px 26px rgba(56,39,25,.15);opacity:0;pointer-events:none;transition:opacity .25s ease .65s}.floating-book.is-open .reader-mode-tabs{opacity:1;pointer-events:auto}.reader-mode-tab{border:0;border-radius:999px;background:transparent;color:#725d4b;padding:7px 13px;cursor:pointer;font:700 .75rem/1 system-ui,sans-serif;letter-spacing:.04em}.reader-mode-tab.is-active{background:#5f3b28;color:#fff5e7;box-shadow:0 4px 12px rgba(70,43,27,.2)}.reader-mode-tab span{font-weight:500;opacity:.82}
.discussion-spread{position:absolute;inset:0;z-index:90;display:grid;grid-template-columns:minmax(250px,.34fr) minmax(0,.66fr);overflow:hidden;border-radius:15px;background:var(--paper);color:#352b22;box-shadow:inset 0 0 0 1px rgba(84,61,42,.14);opacity:0;transition:opacity .26s ease}.floating-book.discussion-mode .discussion-spread{opacity:1}.floating-book.discussion-mode .book-spread{visibility:hidden}.floating-book.discussion-mode .page-turn-zone{display:none}.reader-overlay.discussion-mode .reader-nav{display:none}.discussion-sidebar{position:relative;overflow:auto;padding:clamp(48px,6vh,76px) clamp(22px,2.6vw,40px) 30px;background:linear-gradient(90deg,rgba(214,193,157,.45),rgba(246,238,221,.88));border-right:1px solid rgba(93,68,47,.16);box-shadow:inset -18px 0 34px rgba(87,60,38,.08)}.discussion-book-heading h2{margin:.1em 0;font:500 clamp(1.65rem,2.5vw,3rem)/1.02 var(--theme-reading-font,Georgia,serif);letter-spacing:-.03em}.discussion-book-heading>p:last-child{margin:.5em 0 1.6em;color:#7d6857;font-style:italic}.discussion-lock{display:grid;gap:3px;border:1px solid rgba(141,79,59,.24);border-radius:11px;background:rgba(164,91,68,.08);padding:12px;margin:0 0 16px}.discussion-lock span{font-size:.84rem;color:#755d4c}.discussion-compose{display:grid;gap:9px;margin-top:17px}.discussion-compose label{font-weight:700}.discussion-compose textarea{min-height:130px}.discussion-form-message{min-height:20px;margin:0;color:#755d4c;font-size:.82rem}.discussion-signin{display:grid;gap:12px;border-top:1px solid rgba(91,67,46,.15);padding-top:18px}.discussion-signin p,.discussion-signin small{margin:0;color:#755d4c}.discussion-refresh{width:100%;margin-top:14px;border:1px solid rgba(91,67,46,.2);border-radius:9px;background:rgba(255,255,255,.3);color:#5f4c3d;padding:8px;cursor:pointer}.community-honeypot{position:absolute!important;left:-99999px!important}
.discussion-thread{overflow:auto;padding:clamp(48px,6vh,76px) clamp(24px,3.3vw,58px) 40px;background:linear-gradient(90deg,rgba(255,255,255,.18),transparent 5%),var(--paper);font-family:system-ui,sans-serif}.discussion-thread-head{position:sticky;top:-1px;z-index:3;display:flex;justify-content:space-between;padding-bottom:13px;margin-bottom:12px;border-bottom:1px solid rgba(91,67,46,.14);background:linear-gradient(var(--paper) 84%,transparent)}.discussion-thread-head div{display:grid}.discussion-thread-head span{color:#806e5e;font-size:.77rem}.discussion-comments{display:grid;gap:14px}.discussion-comment{position:relative;border:1px solid rgba(91,67,46,.15);border-radius:13px;background:rgba(255,255,255,.3);padding:14px 16px;box-shadow:0 8px 22px rgba(87,60,38,.05)}.discussion-comment.is-moderated{border-style:dashed;background:rgba(157,107,68,.05)}.discussion-comment>header{display:flex;justify-content:space-between;gap:12px;align-items:center}.discussion-comment>header>div{display:flex;align-items:center;gap:8px}.comment-avatar{width:28px;height:28px;font-size:.85rem}.comment-role,.comment-state{border:1px solid rgba(91,67,46,.18);border-radius:999px;padding:2px 7px;color:#765f4c;font-size:.65rem;text-transform:uppercase}.discussion-comment time{color:#8a7563;font-size:.72rem}.comment-body{margin:12px 0;line-height:1.58;white-space:normal}.discussion-comment>footer{display:flex;justify-content:space-between;gap:12px;align-items:center;color:#8a7563;font-size:.72rem}.discussion-comment>footer div{display:flex;gap:5px;flex-wrap:wrap}.discussion-comment>footer button,.inline-comment-form button{border:0;background:transparent;color:#765339;padding:4px 6px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.discussion-comment>footer .discussion-reply-action{display:inline-flex;align-items:center;min-height:28px;font-weight:700;color:#684328}
.discussion-comment>footer .discussion-reply-action[disabled]{opacity:.55;cursor:not-allowed;text-decoration:none}
.discussion-replies{display:grid;gap:10px;margin:13px 0 0 30px;padding-left:14px;border-left:2px solid rgba(108,78,54,.12)}.discussion-replies .discussion-comment{background:rgba(255,255,255,.2)}.comment-inline-form{margin-top:10px}.inline-comment-form{display:grid;gap:8px}.inline-comment-form>div{display:flex;gap:8px}.inline-comment-form .community-primary{color:#fff7eb;text-decoration:none}.discussion-empty,.discussion-loading{min-height:260px;display:grid;place-content:center;text-align:center;color:#806e5e}.discussion-empty strong,.discussion-empty span{display:block}.discussion-empty strong{font:500 1.5rem Georgia,serif;color:#5b493a}
@media(max-width:850px){.account-button-label{display:none}.discussion-spread{grid-template-columns:1fr}.discussion-sidebar{max-height:42%;border-right:0;border-bottom:1px solid rgba(93,68,47,.16);padding:55px 22px 18px}.discussion-thread{padding:22px}.reader-mode-tabs{top:7px}.discussion-replies{margin-left:10px}.community-modal-card{padding:28px 22px}}
.request-invite-button{text-decoration:none;background:rgba(75,104,87,.24)}

/* Unified account, registration, and invitation-request modal */
.community-modal-card{max-height:min(92vh,860px);overflow:auto;overscroll-behavior:contain}
.community-login-form textarea{width:100%;border:1px solid rgba(216,173,102,.22);border-radius:10px;background:rgba(8,5,4,.55);color:var(--ink);padding:11px 12px;font:inherit;resize:vertical;min-height:130px}
.community-login-form textarea::placeholder,.community-login-form input::placeholder{color:rgba(238,222,199,.5)}
.community-login-form small{font-weight:400;color:var(--muted)}
.community-request-banner{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 18px;padding:13px 15px;border:1px solid rgba(126,172,139,.34);border-radius:13px;background:linear-gradient(135deg,rgba(70,112,83,.3),rgba(35,67,51,.18));color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.community-request-banner:hover{border-color:rgba(143,197,157,.66);transform:translateY(-1px)}
.community-request-banner span{color:var(--muted)}
.community-request-banner strong{white-space:nowrap;color:#e8f4e8}
.community-modal-switch{display:flex;justify-content:flex-end;margin:0 0 14px}
.community-register-prompt button{font:inherit}
@media(max-width:540px){.community-request-banner{align-items:flex-start;flex-direction:column}.community-modal-switch{justify-content:stretch}.community-modal-switch .community-link-button{width:100%}}


/* Shared community modal base with dedicated child views. */
body.community-modal-open{overflow:hidden}
.community-modal-view{display:none}
.community-modal-view.is-active{display:block;animation:community-view-in .18s ease both}
.community-modal-view[hidden]{display:none!important}
.community-modal-view--signin,.community-modal-view--register,.community-modal-view--request{min-width:0}
@keyframes community-view-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}

/* PDF reader fallback and visible format marker. */
.recommendation-card .cover-art{position:relative}
.card-format{position:absolute;right:7px;bottom:7px;z-index:2;border:1px solid rgba(255,255,255,.32);border-radius:999px;background:rgba(16,10,8,.78);color:#fff7eb;padding:3px 6px;font:700 .56rem/1 system-ui,sans-serif;letter-spacing:.08em}

/* PDF.js two-page book reader -------------------------------------------------
   PDF source pages use the existing paper leaves. The first spread follows a
   Western binding convention: blank verso on the left, source page 1 on the
   right; later spreads show 2–3, 4–5, and so on. */
.floating-book.has-pdf-pages .reader-page {
  display:grid;
  place-items:stretch;
}
.floating-book.has-pdf-pages .reader-page::after,
.floating-book.has-pdf-pages .reader-page::before {
  pointer-events:none;
}
.pdf-page-view {
  position:relative;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:grid;
  place-items:stretch;
  overflow:hidden;
  padding:clamp(16px,2.1vw,34px);
  contain:layout paint;
  background:
    linear-gradient(rgba(255,255,255,.16),rgba(255,255,255,.16)),
    var(--paper-texture-image) center / 180px 180px repeat,
    var(--paper);
}
.pdf-page-frame {
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  cursor:zoom-in;
  touch-action:none;
  user-select:none;
  outline:none;
}
.pdf-page-view.is-zoomed .pdf-page-frame { cursor:grab; }
.pdf-page-view.is-zoomed .pdf-page-frame.is-dragging { cursor:grabbing; }
.pdf-page-view.is-active-pdf-page .pdf-page-frame { box-shadow:inset 0 0 0 1px rgba(117,82,48,.2); }
.pdf-page-view.is-blank {
  color:rgba(111,83,58,.22);
}
.pdf-blank-ornament {
  font-size:clamp(.8rem,1.2vw,1.15rem);
  transform:rotate(45deg);
}
.pdf-page-image {
  display:block;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  object-fit:contain;
  object-position:center;
  opacity:0;
  background:#fff;
  box-shadow:0 8px 28px rgba(52,35,22,.18),0 0 0 1px rgba(57,40,28,.12);
  transform:translate3d(var(--pdf-pan-x,0),var(--pdf-pan-y,0),0) scale(var(--pdf-zoom,1));
  transform-origin:center center;
  will-change:transform;
  transition:opacity .22s ease,transform .08s ease-out;
  pointer-events:none;
}
.pdf-page-frame.is-dragging .pdf-page-image { transition:opacity .22s ease; }
.pdf-page-image.is-rendered { opacity:1; }
.pdf-page-loading {
  position:absolute;
  inset:0;
  z-index:5;
  display:grid;
  place-items:center;
  padding:24px;
  color:#765f4c;
  text-align:center;
  font:italic clamp(.78rem,1vw,.95rem)/1.4 var(--theme-reading-font,Georgia,serif);
  pointer-events:none;
}
.pdf-page-loading[hidden] { display:none !important; }
.pdf-source-page-number {
  position:absolute;
  left:50%;
  bottom:clamp(8px,1.2vh,15px);
  transform:translateX(-50%);
  color:#8d7865;
  font:italic .76rem/1 Georgia,serif;
  pointer-events:none;
}
.page-turn-forward .reader-page.right .pdf-page-view { animation:pdfTurnForward .34s ease; }
.page-turn-back .reader-page.left .pdf-page-view { animation:pdfTurnBack .34s ease; }
@keyframes pdfTurnForward {
  from { opacity:.25; transform:translateX(20px) rotateY(-4deg); }
  to { opacity:1; transform:none; }
}
@keyframes pdfTurnBack {
  from { opacity:.25; transform:translateX(-20px) rotateY(4deg); }
  to { opacity:1; transform:none; }
}
.pdf-error-link {
  display:inline-block;
  margin-top:14px;
  border:1px solid rgba(74,49,31,.24);
  border-radius:999px;
  padding:8px 13px;
  color:#5c3f2d;
  background:rgba(255,255,255,.45);
  font:700 .78rem/1 system-ui,sans-serif;
  text-decoration:none;
}
.pdf-error-link:hover { background:#fff; }

@media (max-width:700px) {
  .pdf-page-view { padding:10px; }
  .pdf-source-page-number { bottom:5px; font-size:.68rem; }
}


/* Exact artwork selection and optional dFlip standalone reader ---------------- */
.book-cover-art,.spine-art{display:block;width:100%;height:100%;object-fit:cover}
.shelf-book>.spine-art{position:absolute;inset:0;z-index:3;border-radius:inherit}
.book-spread{cursor:default}
.floating-book.is-open:not(.has-dflip-reader) .book-spread{cursor:ew-resize}
.dflip-reader-layer{position:absolute;inset:clamp(12px,1.4vw,24px);z-index:55;overflow:hidden;border-radius:10px;background:#211a17;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.dflip-reader-layer .lantern-dflip-book,.dflip-reader-layer ._df_book{width:100%!important;height:100%!important;min-height:100%!important}
.floating-book.has-dflip-reader .reader-page{visibility:hidden}
.floating-book.has-dflip-reader .book-gutter{opacity:0}
.floating-book.has-dflip-reader .page-turn-zone{display:none}
@media(max-width:700px){.dflip-reader-layer{inset:6px}}
/* Hidden discussion view must not cover the reading pages or intercept page-edge clicks. */
.discussion-spread[hidden]{display:none!important;pointer-events:none!important}
.floating-book:not(.discussion-mode) .discussion-spread{pointer-events:none}
.floating-book.discussion-mode .discussion-spread{pointer-events:auto}


/* Configurable introduction */
.introduction{display:grid;grid-template-columns:58px minmax(0,1fr);gap:18px;align-items:start;max-width:980px;margin-top:16px;padding:20px 22px;border:1px solid rgba(216,173,102,.16);border-radius:20px;background:linear-gradient(145deg,rgba(216,173,102,.075),rgba(255,255,255,.025));box-shadow:0 18px 55px rgba(0,0,0,.16)}
.introduction-mark{width:58px;aspect-ratio:1;display:grid;place-items:center;border:1px solid rgba(216,173,102,.25);border-radius:16px;background:rgba(216,173,102,.08)}
.introduction-mark img{width:31px;height:31px}.introduction h2{margin:0;font:500 clamp(1.55rem,2.5vw,2.35rem)/1.08 var(--theme-reading-font,Georgia,serif)}.introduction p:last-child{max-width:72ch;margin:.65rem 0 0;color:var(--muted);line-height:1.65}

/* Stronger mobile layout: single-page reader, compact shelves, usable account controls. */
@media (max-width:700px){
  .page-shell{width:min(100% - 20px,1560px);padding:12px 0 46px}
  .topbar{align-items:flex-start;gap:12px;padding:4px 0 18px}.brand{min-width:0;gap:9px}.brand-mark{width:34px;border-radius:10px}.brand-mark img{width:22px;height:22px}.brand>span:last-child{max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem}
  .topbar-actions{gap:5px}.account-button{padding:7px 8px;font-size:.72rem}.register-button{display:flex}
  .hero{margin-bottom:16px;gap:12px}.hero::after{inset:-12px -10px -10px 22%;opacity:.42}.hero h1{max-width:10ch;font-size:clamp(2.35rem,14vw,4rem);line-height:.94}.hero-copy{font-size:.93rem;line-height:1.55}
  .introduction{grid-template-columns:42px minmax(0,1fr);gap:12px;margin-top:12px;padding:15px;border-radius:16px}.introduction-mark{width:42px;border-radius:12px}.introduction-mark img{width:23px;height:23px}.introduction h2{font-size:1.35rem}.introduction p:last-child{font-size:.88rem;line-height:1.52}
  .section{margin-top:24px}.section-heading{align-items:flex-start;margin-bottom:11px}.section-heading h2{font-size:1.55rem}.section-heading p{font-size:.84rem}
  .tag-browser-card{padding:14px;border-radius:16px}.tag-browser-heading{grid-template-columns:34px minmax(0,1fr);gap:9px}.tag-browser-icon{width:34px}.tag-browser-heading p:last-child{display:none}.tag-search-box{min-height:42px}.tag-suggestions,.active-tag-list{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}.tag-pill,.active-tag{flex:0 0 auto}
  .recommendation-rail{grid-auto-columns:minmax(112px,38%);gap:9px}.recommendation-card{padding:6px;border-radius:13px}.recommendation-card .card-meta strong{font-size:.75rem}.recommendation-card .card-meta span{font-size:.66rem}
  .library-panel{border-radius:18px;padding:12px 5px 15px}.shelf-row{min-height:184px;padding:14px 4px 28px;gap:3px}.shelf-row+.shelf-row{margin-top:16px}.shelf-row::after{bottom:8px;height:20px}.shelf-book{min-width:22px;max-width:48px;padding-inline:2px}.spine-title{inset:25px 50% 24px auto;font-size:.6rem}.spine-author{display:none}.book-tooltip{display:none}.interaction-note{font-size:.72rem;gap:6px}.kbd{min-width:24px;padding:3px 5px}
  .floating-book .book-cover{width:100%;border-radius:14px;transform-origin:left center}.floating-book .reader-page{left:0;width:100%;border-radius:14px}.floating-book .reader-page.left{display:none}.floating-book .reader-page.right{left:0;transform-origin:left center}.floating-book .book-gutter{display:none}.floating-book .book-spread{grid-template-columns:minmax(0,1fr);border-radius:14px}.floating-book .reader-page.right{grid-column:1}.floating-book.is-opening .reader-page.right,.floating-book.is-open .reader-page.right{transform:scaleX(1)}
  .reader-overlay.is-active{backdrop-filter:blur(6px)}.reader-topbar{top:6px;left:6px;right:6px}.reader-titlebar strong{max-width:65vw;font-size:.78rem}.reader-control.square{width:38px;min-height:38px}.reader-nav{bottom:6px;gap:6px}.page-indicator{min-width:105px;padding:8px 10px;font-size:.72rem}.page-turn-zone{width:22%;opacity:.28}.page-turn-zone span{width:34px;height:54px}.page-inner{padding:28px 23px 25px}.page-body{font-size:clamp(.88rem,3.7vw,1.02rem);line-height:1.55}.page-number{font-size:.67rem}
  .pdf-page-frame{inset:18px 14px 27px}.pdf-source-page-number{bottom:8px}.reader-mode-tabs{top:7px}.reader-mode-tab{padding:6px 9px;font-size:.68rem}
  .pdf-zoom-controls{bottom:56px;gap:4px;padding:5px}.pdf-zoom-controls .reader-control.square{width:34px;min-height:34px}.pdf-fit-button{min-height:34px;min-width:46px;padding:0 10px}.pdf-zoom-value{min-width:48px;font-size:.7rem}.pdf-zoom-hint{display:none}
  .discussion-spread{grid-template-columns:1fr}.discussion-sidebar{max-height:38%;padding:48px 16px 14px}.discussion-thread{padding:16px}.discussion-book-heading h2{font-size:1.45rem}.discussion-compose textarea{min-height:90px}
  .community-modal{padding:10px}.community-modal-card{width:100%;max-height:94vh;border-radius:18px;padding:26px 16px 18px}.community-modal-card h2{font-size:2rem}.community-modal-close{top:8px;right:8px}
}

@media(max-width:700px){.page-turn-back .reader-page.right .page-inner{animation:turnBack .34s ease}.page-turn-back .reader-page.right .pdf-page-view{animation:pdfTurnBack .34s ease}}


/* Threaded reading-room discussions and local post search. */
.discussion-thread-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,360px);gap:10px 18px;align-items:end}
.discussion-thread-summary{display:grid;min-width:0}
.discussion-search{display:grid;grid-template-columns:auto minmax(120px,1fr) auto;gap:7px;align-items:center;color:#765f4c;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.discussion-search input{min-width:0;width:100%;height:36px;border:1px solid rgba(91,67,46,.2);border-radius:10px;background:rgba(255,255,255,.46);padding:0 10px;color:#44352b;font:500 .82rem/1 system-ui,sans-serif;letter-spacing:0;text-transform:none;outline:none}
.discussion-search input:focus{border-color:rgba(117,77,45,.5);box-shadow:0 0 0 3px rgba(151,105,65,.12)}
.discussion-search button{border:0;background:transparent;color:#765339;padding:5px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.discussion-search button[hidden]{display:none}
.discussion-search-status{grid-column:1/-1;margin:0;color:#806e5e;font-size:.72rem}
.discussion-replies{position:relative;display:grid;gap:10px;margin:15px 0 0 20px;padding-left:22px;border-left:0}
.discussion-replies::before{content:"";position:absolute;left:7px;top:-7px;bottom:20px;width:2px;border-radius:2px;background:linear-gradient(rgba(116,82,55,.32),rgba(116,82,55,.1))}
.discussion-replies>.discussion-comment::before{content:"";position:absolute;left:-15px;top:25px;width:15px;border-top:2px solid rgba(116,82,55,.25)}
.discussion-comment.is-search-match{border-color:rgba(151,105,65,.55);box-shadow:0 0 0 3px rgba(151,105,65,.1),0 8px 22px rgba(87,60,38,.05)}
.discussion-comment.is-search-context{background:rgba(255,255,255,.18)}
@media(max-width:850px){.discussion-thread-head{grid-template-columns:1fr}.discussion-search{grid-template-columns:auto minmax(0,1fr) auto}.discussion-replies{margin-left:6px;padding-left:17px}.discussion-replies::before{left:5px}.discussion-replies>.discussion-comment::before{left:-12px;width:12px}}
@media(max-width:480px){.discussion-search{grid-template-columns:1fr auto}.discussion-search>span{grid-column:1/-1}.discussion-replies{margin-left:0;padding-left:13px}.discussion-comment{padding:12px}.discussion-comment>header{align-items:flex-start}.discussion-comment>header time{white-space:nowrap}}

/* Collapsible heavy discussion trees -------------------------------------- */
.discussion-reply-toggle{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin:10px 0 0;
  border:0;
  border-radius:999px;
  padding:7px 11px;
  background:rgba(105,73,48,.09);
  color:#6f4d34;
  font:700 .76rem/1 system-ui,sans-serif;
  cursor:pointer;
}
.discussion-reply-toggle::before{content:"▸";font-size:.82rem;transition:transform .18s ease}
.discussion-reply-toggle[aria-expanded="true"]::before{transform:rotate(90deg)}
.discussion-reply-toggle:hover,.discussion-reply-toggle:focus-visible{background:rgba(105,73,48,.16);outline:2px solid rgba(112,76,47,.18);outline-offset:2px}
.discussion-replies.is-collapsed{display:none!important}

/* Reply form contrast: keep the action clearly visible on light paper pages. */
.inline-comment-form button.community-primary,
.comment-inline-form button.community-primary {
  border:1px solid #5c3825;
  background:linear-gradient(135deg,#7b4a2d,#4f2f20);
  color:#fffaf1;
  text-decoration:none;
  box-shadow:0 4px 12px rgba(68,39,24,.18);
}
.inline-comment-form button.community-primary:hover,
.comment-inline-form button.community-primary:hover {
  background:linear-gradient(135deg,#8c5837,#5f3926);
}

/* Performance containment: off-screen shelves/comments avoid unnecessary layout work. */
.shelf-row{content-visibility:auto;contain-intrinsic-size:auto 240px;contain:layout paint style}
.discussion-comment{content-visibility:auto;contain-intrinsic-size:auto 150px}
.shelf-book{backface-visibility:hidden}

/* Book metadata, artwork states, and richer shelf previews ------------------ */
.cover-fallback strong,
.book-cover-fallback strong {
  max-width:100%;
  overflow:hidden;
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
  text-wrap:balance;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:6;
}
.cover-fallback strong {
  font:500 clamp(.92rem,1.45vw,1.5rem)/1.02 var(--theme-reading-font,Georgia,serif);
}
.cover-fallback strong.is-long-title { font-size:clamp(.78rem,1.18vw,1.2rem); }
.cover-fallback strong.is-very-long-title { font-size:clamp(.68rem,1vw,1rem); -webkit-line-clamp:8; }
.book-cover-fallback strong {
  position:relative;
  z-index:2;
  font:500 clamp(1.8rem,3.5vw,4.6rem)/.98 var(--theme-reading-font,Georgia,serif);
  letter-spacing:-.035em;
  max-height:62%;
}
.book-cover-fallback strong.is-long-title { font-size:clamp(1.45rem,2.8vw,3.6rem); }
.book-cover-fallback strong.is-very-long-title { font-size:clamp(1.15rem,2.25vw,2.8rem); -webkit-line-clamp:8; }
.book-cover-fallback > small,
.book-cover-fallback > span { position:relative; z-index:2; }

.cover-error,.book-cover-error {
  width:100%;height:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;padding:18px;text-align:center;
  color:#ffdad7;background:#090606;
  border:4px solid #d52f2f;
  box-shadow:inset 0 0 0 2px #000;
}
.cover-error strong,.book-cover-error strong { color:#ff4a4a;letter-spacing:.12em;font:800 .78rem/1 system-ui,sans-serif; }
.cover-error span,.book-cover-error span { max-width:24ch;font:650 .72rem/1.35 system-ui,sans-serif;overflow-wrap:anywhere; }
.book-cover-error strong { font-size:clamp(1rem,2vw,1.8rem); }
.book-cover-error span { font-size:clamp(.78rem,1.15vw,1rem); }
.spine-art-error {
  position:absolute;inset:0;z-index:3;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;overflow:hidden;border-radius:inherit;
  color:#ffdad7;background:#080505;border:2px solid #d52f2f;
}
.spine-art-error strong { color:#ff3737;font:900 1.4rem/1 system-ui,sans-serif; }
.spine-art-error span { writing-mode:vertical-rl;transform:rotate(180deg);font:800 .5rem/1 system-ui,sans-serif;letter-spacing:.09em; }

.book-tooltip {
  left:50%;
  bottom:calc(100% + 10px);
  width:clamp(270px,24vw,370px);
  max-width:min(370px,80vw);
  padding:15px 17px 16px;
  border-color:rgba(216,173,102,.42);
  border-radius:14px;
  background:linear-gradient(145deg,#2d211a,#17110e);
  text-align:left;
  font-size:.82rem;
  line-height:1.5;
  pointer-events:auto;
  box-shadow:0 16px 42px rgba(0,0,0,.5);
}
.book-tooltip::after {
  content:"";position:absolute;left:0;right:0;top:100%;height:14px;
}
.book-tooltip strong { display:block;color:#fff4dc;font:600 1rem/1.2 var(--theme-reading-font,Georgia,serif);margin-bottom:5px; }
.book-tooltip > span { display:block;color:var(--gold);font-size:.72rem;letter-spacing:.04em;text-transform:uppercase; }
.book-tooltip p { margin:9px 0 0;color:#e8ddca;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6;overflow:hidden; }
.shelf-book:hover .book-tooltip,.shelf-book:focus-visible .book-tooltip,.book-tooltip:hover { opacity:1;transform:translate(-50%,0); }

.reader-edit-tab { border-color:rgba(218,177,105,.42); }

/* In-reader Book Editor ---------------------------------------------------- */
.book-editor-modal {
  position:fixed;inset:0;z-index:1000;display:grid;place-items:center;
  padding:clamp(12px,3vw,36px);background:rgba(9,6,5,.82);backdrop-filter:blur(8px);
}
.book-editor-modal[hidden] { display:none !important; }
.book-editor-dialog {
  width:min(900px,96vw);max-height:92vh;overflow:auto;
  border:1px solid rgba(216,173,102,.38);border-radius:20px;
  background:#241a15;color:#f7eddc;box-shadow:0 28px 90px rgba(0,0,0,.7);
}
.book-editor-heading { position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px;background:#241a15;border-bottom:1px solid rgba(255,255,255,.09); }
.book-editor-heading h2 { margin:0;font:500 1.55rem/1.1 var(--theme-reading-font,Georgia,serif); }
.book-editor-close { width:38px;height:38px;border-radius:50%;font-size:1.25rem; }
.book-editor-form { padding:20px 22px 24px;display:grid;grid-template-columns:1fr 1fr;gap:16px; }
.book-editor-form fieldset { min-width:0;margin:0;padding:16px;border:1px solid rgba(255,255,255,.1);border-radius:14px;display:grid;gap:12px; }
.book-editor-form fieldset.full { grid-column:1/-1; }
.book-editor-form label { display:grid;gap:6px;color:#e4d7c3;font-size:.82rem; }
.book-editor-form input,.book-editor-form textarea,.book-editor-form select { width:100%;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:#130e0b;color:#fff5e5;padding:10px 11px;font:inherit; }
.book-editor-form textarea { resize:vertical; }
.book-editor-check { display:flex !important;grid-template-columns:auto 1fr !important;align-items:center;gap:9px !important; }
.book-editor-check input { width:auto; }
.book-editor-file-status { margin:0;color:#cbbba4;font-size:.75rem;overflow-wrap:anywhere; }
.book-editor-file-status.is-error { color:#ff7373;font-weight:700; }
.book-editor-actions { grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:10px; }
.book-editor-message { color:#e6c98f;font-size:.82rem; }
@media(max-width:700px){.book-editor-form{grid-template-columns:1fr;padding:14px}.book-editor-form fieldset.full{grid-column:auto}.book-tooltip{display:none}}
/* Let the larger description previews extend beyond the wooden shelf frame. */
.library-panel,.shelf-row { overflow:visible; }
.shelf-book:nth-child(-n+4) .book-tooltip { left:0;transform:translate(0,6px); }
.shelf-book:nth-child(-n+4):hover .book-tooltip,.shelf-book:nth-child(-n+4):focus-visible .book-tooltip { transform:translate(0,0); }
.shelf-book:nth-last-child(-n+4) .book-tooltip { left:auto;right:0;transform:translate(0,6px); }
.shelf-book:nth-last-child(-n+4):hover .book-tooltip,.shelf-book:nth-last-child(-n+4):focus-visible .book-tooltip { transform:translate(0,0); }


/* Viewport-level shelf preview ------------------------------------------- */
.book-tooltip { display:none !important; }
.shelf-book-preview {
  position:fixed;
  left:0;
  top:0;
  z-index:950;
  width:clamp(290px,26vw,420px);
  max-width:calc(100vw - 24px);
  max-height:min(46vh,420px);
  overflow:auto;
  padding:16px 18px 17px;
  border:1px solid rgba(216,173,102,.48);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(48,35,27,.98),rgba(20,14,11,.98));
  color:#f5ead8;
  text-align:left;
  pointer-events:none;
  opacity:0;
  visibility:hidden;
  transition:opacity .12s ease,visibility 0s linear .12s;
  box-shadow:0 20px 54px rgba(0,0,0,.58),inset 0 1px rgba(255,255,255,.05);
  contain:layout paint style;
}
.shelf-book-preview.is-visible { opacity:1;visibility:visible;transition-delay:0s; }
.shelf-book-preview-title {
  display:block;
  margin:0 0 5px;
  color:#fff4dc;
  font:600 1.08rem/1.22 var(--theme-reading-font,Georgia,serif);
  overflow-wrap:anywhere;
}
.shelf-book-preview-meta {
  display:block;
  color:var(--gold);
  font-size:.74rem;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.shelf-book-preview-description {
  margin:10px 0 0;
  color:#e8ddca;
  font-size:.86rem;
  line-height:1.52;
  white-space:normal;
  overflow-wrap:anywhere;
}
@media(max-width:700px) {
  .shelf-book-preview { display:none !important; }
}

/* Quiet PDF loading state -------------------------------------------------- */
.visually-hidden {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}
.pdf-page-loading.is-error { color:#8b2424; font-style:normal; font-weight:700; }


/* Mobile reader hard guarantee: one full-size page, never a half-spread.
   JS adds .is-mobile-reader using visualViewport/window width. These rules are
   intentionally independent of the grid-based desktop spread so the active
   page always occupies the entire book on phones and responsive emulation. */
.floating-book.is-mobile-reader .book-spread {
  display:block !important;
  grid-template-columns:none !important;
}
.floating-book.is-mobile-reader .reader-page.left {
  display:none !important;
}
.floating-book.is-mobile-reader .reader-page.right {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  grid-column:auto !important;
  border-radius:14px !important;
  transform-origin:left center !important;
}
.floating-book.is-mobile-reader .book-cover {
  width:100% !important;
  border-radius:14px !important;
}
.floating-book.is-mobile-reader .book-gutter { display:none !important; }
.floating-book.is-mobile-reader .reader-page.right::before { display:none !important; }

@media (max-width:900px) {
  .floating-book .book-spread { display:block !important; grid-template-columns:none !important; }
  .floating-book .reader-page.left { display:none !important; }
  .floating-book .reader-page.right {
    position:absolute !important; inset:0 !important; width:100% !important; height:100% !important;
    grid-column:auto !important; border-radius:14px !important;
  }
  .floating-book .book-cover { width:100% !important; }
  .floating-book .book-gutter { display:none !important; }
}

/* mobile-single-page-v3: corrected real-newline override */

/* v80 mobile discussion: combine desktop sidebar/composer and thread into one scroll page. */
@media (max-width:850px){
  .floating-book.discussion-mode .discussion-spread{
    display:block;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  .floating-book.discussion-mode .discussion-sidebar{
    max-height:none;
    overflow:visible;
    border-right:0;
    border-bottom:1px solid rgba(93,68,47,.16);
    box-shadow:none;
    padding:58px 20px 22px;
  }
  .floating-book.discussion-mode .discussion-thread{
    overflow:visible;
    min-height:auto;
    padding:22px 20px 34px;
  }
  .floating-book.discussion-mode .discussion-thread-head{
    position:static;
    top:auto;
    background:transparent;
  }
  .floating-book.discussion-mode .discussion-compose textarea{
    min-height:120px;
  }
}
@media (max-width:480px){
  .floating-book.discussion-mode .discussion-sidebar{padding:52px 14px 18px}
  .floating-book.discussion-mode .discussion-thread{padding:18px 14px 28px}
}

/* v82 discussion auto-refresh */
.discussion-auto-refresh-note{
  display:block;
  margin:7px 2px 0;
  color:#7d6857;
  font-size:.76rem;
  line-height:1.35;
  text-align:center;
}

/* v83: permanent admin delete + more visible message caret */
.discussion-admin-delete{
  color:#8f1d1d;
  border-color:rgba(143,29,29,.34);
}
.discussion-admin-delete:hover{background:rgba(143,29,29,.08)}
.discussion-compose textarea,
.inline-comment-form textarea{
  caret-color:#b45309;
  caret-shape:block;
}
.discussion-thick-caret{
  position:fixed;
  width:3px;
  min-height:16px;
  border-radius:2px;
  background:#b45309;
  box-shadow:0 0 0 1px rgba(255,255,255,.4),0 0 5px rgba(180,83,9,.35);
  pointer-events:none;
  z-index:2147483646;
  animation:lantern-caret-blink 1.05s steps(1,end) infinite;
}
.discussion-caret-mirror{
  position:fixed;
  left:-100000px;
  top:0;
  visibility:hidden;
  pointer-events:none;
  overflow:hidden;
  white-space:pre-wrap;
}
@keyframes lantern-caret-blink{0%,48%{opacity:1}49%,100%{opacity:.18}}

/* v83 language switch */
.language-switcher{display:inline-flex;align-items:center;margin-right:4px}
.language-switch-select{
  min-height:34px;
  padding:5px 28px 5px 9px;
  border:1px solid rgba(216,173,102,.25);
  border-radius:999px;
  background:rgba(22,14,11,.64);
  color:var(--ink);
  font:inherit;
  font-size:.8rem;
  cursor:pointer;
}
.reader-topbar .language-switcher{margin-left:auto;margin-right:8px}
@media(max-width:720px){.language-switch-select{max-width:112px;font-size:.76rem;padding-right:20px}}

/* v86 admin unread discussion ribbon */
.shelf-book,.recommendation-card,.cover-art{position:relative}
.book-new-post-badge{
  position:absolute;
  z-index:80;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:5px 9px;
  border:2px solid #fff;
  border-radius:7px;
  background:#e00024;
  color:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,.48),0 0 0 2px rgba(224,0,36,.28);
  font-size:.68rem;
  font-weight:900;
  line-height:1;
  letter-spacing:.06em;
  text-transform:uppercase;
  white-space:nowrap;
  pointer-events:none;
}
.recommendation-card .book-new-post-badge{
  top:-9px;
  left:50%;
  right:auto;
  transform:translateX(-50%);
}
.shelf-book .book-new-post-badge{
  top:-32px;
  left:50%;
  right:auto;
  min-width:72px;
  transform:translateX(-50%);
}
.shelf-row{overflow:visible!important}
@media(max-width:720px){
  .shelf-book .book-new-post-badge{
    top:-28px;
    min-width:64px;
    padding:4px 7px;
    font-size:.6rem;
  }
}


/* v90 deep-linked discussion post */
.discussion-comment.is-deep-link-target{
  position:relative;
  z-index:2;
  outline:4px solid #c62828;
  outline-offset:4px;
  box-shadow:0 0 0 8px rgba(198,40,40,.14),0 8px 28px rgba(0,0,0,.2);
  animation:lantern-post-target-pulse .9s ease-in-out 2;
}
@keyframes lantern-post-target-pulse{
  0%,100%{outline-color:#c62828}
  50%{outline-color:#ff5252}
}


/* v92 direct reader page */
body.direct-reader-page{
  min-height:100vh;
  overflow:hidden;
}
body.direct-reader-page>.page-shell{
  position:fixed!important;
  left:-10000px!important;
  top:0!important;
  width:1200px!important;
  height:900px!important;
  opacity:0!important;
  pointer-events:none!important;
}
.direct-reader-source{
  position:fixed;
  left:50%;
  top:50%;
  width:28px;
  height:40px;
  margin:-20px 0 0 -14px;
  opacity:0;
  pointer-events:none;
  border:0;
}
.direct-reader-status{
  position:fixed;
  inset:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#1b120e;
  color:#f6eee7;
  text-align:center;
  padding:24px;
}
.direct-reader-status[hidden]{display:none!important}
.direct-reader-status strong{font-size:1.15rem}
.direct-reader-status span{opacity:.75}
body.direct-reader-page .reader-overlay{z-index:100}


/* v108 account settings --------------------------------------------------- */
#user-settings-modal .community-modal-card{width:min(560px,100%)}
#user-settings-content{display:grid;gap:16px}
.account-settings-section{display:grid;gap:13px;padding:16px;border:1px solid rgba(216,173,102,.15);border-radius:14px;background:rgba(255,255,255,.025)}
.account-settings-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.account-settings-section-head h3{margin:0;color:var(--ink);font:600 1.05rem/1.3 system-ui,sans-serif}
.account-settings-section-head p{margin:3px 0 0;color:var(--muted);font-size:.88rem}
.account-settings-section input[readonly]{opacity:.72;cursor:default}
.account-settings-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.account-settings-actions .community-form-message{margin:0;flex:1;min-width:180px}
.settings-toggle-row{display:flex!important;align-items:flex-start;gap:12px!important;padding:12px 13px;border:1px solid rgba(216,173,102,.16);border-radius:11px;background:rgba(255,255,255,.025);cursor:pointer}
.settings-toggle-row input[type="checkbox"]{width:20px!important;height:20px!important;min-width:20px;margin:2px 0 0;padding:0;accent-color:#a96f43;cursor:pointer}
.settings-toggle-row input[type="checkbox"]:disabled{cursor:not-allowed;opacity:.5}
.settings-toggle-copy{display:grid;gap:3px;color:var(--ink)}
.settings-toggle-copy strong{font-size:.95rem}
.settings-toggle-copy small{color:var(--muted);line-height:1.4}
.account-security-status{display:inline-flex;align-items:center;justify-content:center;min-width:54px;padding:3px 9px;border:1px solid rgba(216,173,102,.22);border-radius:999px;color:var(--muted);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.account-security-status.is-enabled{border-color:rgba(121,169,124,.42);color:#a9d5ad;background:rgba(121,169,124,.08)}
.community-modal--confirm{z-index:560;background:rgba(5,3,2,.82)}
.community-confirm-card{width:min(430px,100%)!important}
.community-confirm-card h2{font-size:clamp(1.8rem,5vw,2.7rem)}
@media(max-width:600px){.account-settings-section{padding:13px}.account-settings-section-head{gap:9px}.account-settings-actions{align-items:stretch;flex-direction:column}.account-settings-actions button{width:100%}}