/* Reader pages. Tokens match the home page. */
:root{
  --ink:#0B1120; --panel:#131C31; --line:#24304C; --paper:#EDE8DC; --dim:#97A3BC; --gold:#E8B44C;
  --t-timeoff:#E8B44C; --t-running:#96B478; --t-vote:#7D9CC9; --t-snap:#C08552; --t-destroyer:#A493E3;
  --display:"Archivo","Arial Narrow",Impact,sans-serif;
  --body:"Newsreader",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono","SF Mono",Menlo,Consolas,monospace;
  --read-size:1.2rem;
  color-scheme:dark;
}
:root[data-size="0"]{ --read-size:1.06rem; }
:root[data-size="2"]{ --read-size:1.36rem; }
:root[data-size="3"]{ --read-size:1.52rem; }
:root[data-theme="paper"]{
  --ink:#F4EFE3; --panel:#EAE3D3; --line:#D6CDB9; --paper:#1C2332; --dim:#5A6377;
  color-scheme:light;
}

/* --tint is set per page (body) and per book card; --accent must be computed where --tint lives */
body, .book{ --accent:var(--tint, var(--gold)); }
:root[data-theme="paper"] body, :root[data-theme="paper"] .book{ --accent:color-mix(in srgb, var(--tint, var(--gold)) 58%, #1C2332); }

*{ margin:0; padding:0; box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{ background:var(--ink); color:var(--paper); font-family:var(--body); font-size:1.075rem; line-height:1.65;
  -webkit-font-smoothing:antialiased; min-height:100vh; display:flex; flex-direction:column; }
a{ color:var(--accent); text-decoration:none; }
a:hover{ text-decoration:underline; text-underline-offset:3px; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:2px; }
.eyebrow{ font-family:var(--mono); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); font-weight:400; }

/* ---------- top bar ---------- */
.bar{ position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--ink) 90%, transparent);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.bar-in{ max-width:1100px; margin:0 auto; padding:12px 16px; display:flex; align-items:center; justify-content:space-between; gap:12px; position:relative; }
.crumbs{ display:flex; align-items:center; gap:10px; min-width:0; font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; }
.crumbs a{ color:var(--dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.crumbs a:hover{ color:var(--paper); text-decoration:none; }
.crumbs .wordmark{ color:var(--paper); letter-spacing:.2em; }
.crumbs .sep{ color:var(--line); }
.crumbs .wordmark{ display:inline-flex; align-items:center; flex:none; }
.wm-home{ display:none; }
@media (max-width:520px){
  /* phones: the name does not fit, so the home link becomes a house icon with a full-size tap area */
  .crumbs .wm-name{ display:none; }
  .wm-home{ display:block; }
  .crumbs .wordmark{ width:40px; height:40px; margin:-8px -6px -8px -10px; justify-content:center; border-radius:6px; }
  .crumbs .wordmark:active{ background:var(--panel); }
}
.aa{ font-family:var(--body); font-size:1.05rem; background:none; border:1px solid var(--line); color:var(--paper);
  border-radius:4px; padding:3px 11px; cursor:pointer; flex:none; }
.aa:hover,.aa[aria-expanded="true"]{ border-color:var(--accent); color:var(--accent); }
.prefs{ position:absolute; right:16px; top:calc(100% + 8px); background:var(--panel); border:1px solid var(--line);
  border-radius:8px; padding:12px 14px; display:grid; gap:10px; box-shadow:0 12px 30px rgba(0,0,0,.35); }
.prefs[hidden]{ display:none; }
.prefs-row{ display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); }
.prefs-row span{ width:44px; }
.prefs button{ font-family:var(--mono); font-size:.72rem; background:var(--ink); color:var(--paper); border:1px solid var(--line);
  border-radius:4px; padding:6px 10px; cursor:pointer; min-width:64px; }
.prefs button:hover,.prefs button[aria-pressed="true"]{ border-color:var(--accent); color:var(--accent); }
.progress{ height:2px; background:transparent; }
.progress span{ display:block; height:100%; width:0; background:var(--accent); transition:width .1s linear; }

/* ---------- chapter ---------- */
.reader{ flex:1; width:100%; max-width:40rem; margin:0 auto; padding:56px 20px 40px; }
.ch-head{ margin-bottom:44px; }
.ch-count{ font-family:var(--mono); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); }
.ch-head h1{ font-family:var(--display); font-weight:800; font-stretch:105%; font-size:clamp(2rem, 6vw, 3.1rem); line-height:1.05; margin-top:12px; text-wrap:balance; }
.ch-sub{ margin-top:12px; font-family:var(--mono); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); }
.ch-time{ margin-top:18px; font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; color:var(--dim); }
.prose{ font-size:var(--read-size); line-height:1.72; hyphens:auto; -webkit-hyphens:auto; overflow-wrap:break-word; }
.prose p{ margin:0 0 1.05em; }
.prose em{ font-style:italic; }
.prose img{ max-width:100%; height:auto; }
.legal .prose{ font-size:1.02rem; line-height:1.65; hyphens:manual; -webkit-hyphens:manual; }
.legal .prose h2{ font-family:var(--display); font-weight:700; font-size:1.25rem; margin:1.8em 0 .5em; }
.legal .prose ul{ margin:0 0 1.05em; padding-left:1.2em; }
.legal .prose li{ margin:0 0 .7em; }
.legal .prose a:not(.btn){ color:var(--gold); }
.prose hr.scene{ border:0; margin:2.2em 0; text-align:center; height:1em; }
.prose hr.scene::after{ content:"*  *  *"; font-family:var(--mono); color:var(--accent); letter-spacing:.5em; white-space:pre; }
.marker{ margin:2.6em 0 1.6em; padding-top:1.6em; border-top:1px solid var(--line); display:grid; gap:4px;
  font-family:var(--mono); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); }
.marker span:first-child{ color:var(--accent); }
.the-end{ margin-top:2.4em !important; text-align:center; font-family:var(--mono); font-size:.8rem; letter-spacing:.3em; text-transform:uppercase; color:var(--accent); }
.pager{ margin-top:56px; padding-top:28px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.pn{ display:flex; flex-direction:column; gap:4px; padding:16px 18px; border:1px solid var(--line); border-radius:6px; background:var(--panel); min-width:0; }
.pn:hover{ text-decoration:none; border-color:var(--accent); }
.pn small{ font-family:var(--mono); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); }
.pn span{ font-family:var(--display); font-weight:700; font-size:1.02rem; color:var(--paper); line-height:1.25; overflow-wrap:anywhere; }
.pn.next{ text-align:right; }
@media (max-width:480px){ .pager{ grid-template-columns:1fr; } .pn.next{ order:-1; } }

/* ---------- rate + comment ---------- */
.respond{ margin-top:56px; padding-top:32px; border-top:1px solid var(--line); display:grid; gap:40px; }
.respond[hidden]{ display:none; }
.stars{ display:flex; gap:4px; margin-top:10px; }
.stars button{ background:none; border:0; cursor:pointer; font-size:2rem; line-height:1; padding:4px 3px; color:var(--line); transition:color .1s ease, transform .1s ease; }
.stars button.on, .stars button.hover{ color:var(--accent); }
.stars button:hover{ transform:scale(1.12); }
.rate-note{ margin-top:6px; font-family:var(--mono); font-size:.72rem; letter-spacing:.06em; color:var(--dim); }
.c-list{ list-style:none; margin-top:14px; display:grid; gap:14px; }
.c-list li{ background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:14px 16px; }
.c-list li.mine{ border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); }
.c-meta{ font-family:var(--mono); font-size:.7rem; letter-spacing:.06em; color:var(--dim); }
.c-meta strong{ color:var(--paper); font-weight:500; }
.c-body{ margin-top:6px; white-space:pre-wrap; overflow-wrap:anywhere; font-size:1rem; line-height:1.55; }
.c-form{ margin-top:22px; display:grid; gap:8px; }
.c-label{ font-family:var(--mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); margin-top:6px; }
.c-label small{ text-transform:none; letter-spacing:0; }
.c-form input, .c-form textarea{ width:100%; background:var(--ink); color:var(--paper); border:1px solid var(--line); border-radius:4px;
  padding:11px 12px; font-family:var(--body); font-size:1rem; line-height:1.5; }
.c-form input:focus, .c-form textarea:focus{ outline:2px solid var(--accent); outline-offset:1px; border-color:transparent; }
.c-form textarea{ resize:vertical; min-height:110px; }
.c-actions{ margin-top:8px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.c-actions .btn{ border:0; cursor:pointer; }
.c-actions .btn:disabled{ opacity:.6; cursor:wait; }
.c-status{ font-family:var(--mono); font-size:.7rem; color:var(--dim); letter-spacing:.04em; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* ---------- email signup ---------- */
.signup{ margin-top:48px; padding:24px 22px; background:var(--panel); border:1px solid var(--line); border-radius:8px; }
.su-head{ font-family:var(--display); font-weight:750; font-size:1.3rem; line-height:1.2; margin-top:8px; }
.su-sub{ margin-top:6px; color:var(--dim); font-size:.95rem; }
.su-form{ margin-top:16px; display:flex; gap:10px; flex-wrap:wrap; }
.su-form[hidden]{ display:none; }
.su-form input[type=email]{ flex:1 1 220px; min-width:0; background:var(--ink); color:var(--paper); border:1px solid var(--line); border-radius:4px;
  padding:12px 12px; font-family:var(--mono); font-size:.9rem; }
.su-form input[type=email]:focus{ outline:2px solid var(--accent); outline-offset:1px; border-color:transparent; }
.su-form .btn{ border:0; cursor:pointer; }
.su-form .btn:disabled{ opacity:.6; cursor:wait; }
.su-status{ margin-top:10px; font-family:var(--mono); font-size:.74rem; color:var(--dim); }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---------- covers (same as home page) ---------- */
.cover.has-img{ display:block; padding:0; background:#0B1120; overflow:hidden; }
.cover.has-img img{ display:block; width:100%; height:100%; object-fit:cover; }
.cover{ aspect-ratio:2/3; display:flex; flex-direction:column; justify-content:space-between; padding:18px;
  background:radial-gradient(120% 90% at 20% 0%, color-mix(in srgb, var(--tint) 28%, transparent), transparent 60%), var(--panel);
  border-bottom:2px solid var(--tint); }
.cover .scale-tag{ font-family:var(--mono); font-size:.62rem; letter-spacing:.14em; color:var(--tint); text-transform:uppercase; }
.cover .scale-tag sup{ font-size:.65em; }
.cover .title{ font-family:var(--display); font-weight:900; font-size:1.7rem; line-height:1.02; color:var(--paper); overflow-wrap:break-word; }
.cover .cover-author{ font-family:var(--mono); font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:var(--dim); margin-top:10px; }
:root[data-theme="paper"] .cover .scale-tag{ color:var(--accent); }

/* ---------- book contents page ---------- */
.book-page{ flex:1; width:100%; max-width:1000px; margin:0 auto; padding:56px 20px 40px; }
.book-hero{ display:grid; grid-template-columns:220px 1fr; gap:44px; align-items:start; }
.book-hero .cover{ border-radius:6px; border:1px solid var(--line); border-bottom:2px solid var(--tint); }
.book-info h1{ font-family:var(--display); font-weight:900; font-stretch:105%; font-size:clamp(2.2rem, 7vw, 4rem); line-height:.98; margin-top:12px; }
.byline{ margin-top:10px; font-family:var(--mono); font-size:.8rem; letter-spacing:.08em; color:var(--dim); }
.blurb{ margin-top:22px; font-size:1.15rem; max-width:36rem; }
.cta-row{ margin-top:28px; display:flex; gap:12px; flex-wrap:wrap; }
.btn{ display:inline-block; padding:13px 24px; border-radius:3px; font-family:var(--mono); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; }
.btn:hover{ text-decoration:none; }
.btn-solid{ background:var(--accent); color:var(--ink); font-weight:500; }
.btn-ghost{ border:1px solid var(--line); color:var(--paper); }
.btn-ghost:hover{ border-color:var(--accent); color:var(--accent); }
.btn[hidden]{ display:none; }
.free-note{ margin-top:18px; font-family:var(--mono); font-size:.66rem; letter-spacing:.08em; color:var(--dim); }
.toc{ margin-top:64px; }
.toc ol{ list-style:none; margin-top:16px; border-top:1px solid var(--line); }
.toc li a{ display:grid; grid-template-columns:2.6rem 1fr auto; gap:12px; align-items:baseline; padding:14px 4px; border-bottom:1px solid var(--line); color:var(--paper); }
.toc li a:hover{ text-decoration:none; background:var(--panel); }
.toc-n{ font-family:var(--mono); font-size:.74rem; color:var(--accent); }
.toc-t{ font-family:var(--display); font-weight:600; font-size:1.05rem; line-height:1.3; }
.toc-t small{ display:block; font-family:var(--mono); font-weight:400; font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); margin-top:3px; }
.toc-m{ font-family:var(--mono); font-size:.68rem; color:var(--dim); white-space:nowrap; }
.toc li.here a{ background:var(--panel); }
.toc li.here .toc-m::before{ content:"◆ "; color:var(--accent); }
@media (max-width:640px){ .book-hero{ grid-template-columns:1fr; gap:28px; } .book-hero .cover{ max-width:150px; } }

/* ---------- library ---------- */
.library{ flex:1; width:100%; max-width:1100px; margin:0 auto; padding:64px 20px 40px; }
.library h1{ font-family:var(--display); font-weight:800; font-stretch:105%; font-size:clamp(2rem, 6vw, 3.4rem); line-height:1.05; margin-top:12px; }
.library .sub{ margin-top:16px; color:var(--dim); max-width:40rem; }
.library .sub strong{ color:var(--paper); font-weight:600; }
.shelf{ margin-top:44px; display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:22px; }
.book{ background:var(--panel); border:1px solid var(--line); border-radius:6px; overflow:hidden; transition:transform .15s ease, border-color .15s ease; }
.book:hover{ transform:translateY(-4px); border-color:var(--tint); }
.book-link{ display:flex; flex-direction:column; height:100%; color:inherit; }
.book-link:hover{ text-decoration:none; }
.book-body{ padding:16px 18px 18px; display:flex; flex-direction:column; gap:10px; flex:1; }
.book-body p{ font-size:.92rem; color:var(--dim); line-height:1.55; }
.book-body p:first-child{ flex:1; }
.book-body .meta{ font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; }
.book-body .go{ font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--tint); }
:root[data-theme="paper"] .book-body .go{ color:var(--accent); }
@media (prefers-reduced-motion:reduce){ .book{ transition:none; } .book:hover{ transform:none; } .progress span{ transition:none; } }

/* ---------- footer ---------- */
.foot{ border-top:1px solid var(--line); padding:28px 0 40px; margin-top:24px; }
.foot-in{ max-width:1100px; margin:0 auto; padding:0 20px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  font-family:var(--mono); font-size:.7rem; color:var(--dim); letter-spacing:.06em; }
.foot a{ color:var(--dim); } .foot a:hover{ color:var(--accent); }

@media (max-width:560px){
  .shelf .book-link{ flex-direction:row; }
  .shelf .cover.has-img{ flex:0 0 38%; height:auto; align-self:flex-start; border-bottom:0; border-right:2px solid var(--tint); }
  .shelf .book-body{ padding:12px 14px; }
}

/* ---------- chapter audio ---------- */
.listen{ margin:6px 0 30px; display:grid; gap:8px; }
.listen-label{ font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); margin:0; }
.listen audio{ width:100%; }
.listen-more{ margin:0; font-family:var(--mono); font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--dim); }

/* ---------- listen page ---------- */
.listen-page .ways{ margin-top:44px; max-width:44rem; }
.listen-page .ways h2{ margin-bottom:14px; }
.listen-page .apps{ display:flex; flex-wrap:wrap; gap:12px; }
.listen-page .note{ color:var(--dim); margin:0; }
.listen-page .apps + .note{ margin-top:18px; }
.feed-row{ margin-top:10px; display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.feed-row code{ font-family:var(--mono); font-size:.82rem; background:var(--panel); border:1px solid var(--line); border-radius:3px;
  padding:11px 14px; overflow-wrap:anywhere; flex:1 1 18rem; }
.feed-row .btn{ cursor:pointer; background:none; }
.dl-book{ font-family:var(--display); font-weight:700; font-size:1.15rem; margin:22px 0 8px; color:var(--paper); }
.dl-list{ list-style:none; border-top:1px solid var(--line); }
.dl-list a{ display:flex; gap:14px; align-items:baseline; padding:12px 2px; border-bottom:1px solid var(--line); color:var(--paper); }
.dl-list a:hover{ text-decoration:none; color:var(--accent); }
.dl-n{ font-family:var(--mono); font-size:.75rem; color:var(--dim); min-width:1.6em; }
.dl-t{ flex:1; }
.dl-m{ font-family:var(--mono); font-size:.72rem; color:var(--dim); white-space:nowrap; }
.dl-sub{ font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); margin:18px 0 6px; }
.dl-whole .dl-t{ display:flex; flex-direction:column; gap:2px; }
.dl-whole strong{ font-weight:600; color:var(--accent); }
.dl-whole small{ font-size:.86rem; color:var(--dim); }
.dl-help{ margin:14px 0 6px; padding:14px 16px; background:var(--panel); border:1px solid var(--line); border-radius:4px; font-size:.95rem; color:var(--dim); }
.dl-help p{ margin:0 0 6px; color:var(--paper); }
.dl-help ul{ margin:0; padding-left:1.1em; display:grid; gap:6px; }
.dl-help strong{ color:var(--paper); font-weight:600; }

/* ---------- audiobook player (/listen/<book>/) ---------- */
.player{ flex:1; width:100%; max-width:40rem; margin:0 auto; padding:40px 20px 40px; }
.pl-head{ display:grid; grid-template-columns:112px 1fr; gap:22px; align-items:center; }
.pl-head .cover{ border-radius:5px; border:1px solid var(--line); border-bottom:2px solid var(--tint); }
.pl-head h1{ font-family:var(--display); font-weight:800; font-size:clamp(1.5rem, 5vw, 2.2rem); line-height:1.08; margin-top:8px; text-wrap:balance; }
.pl-now{ margin-top:28px; background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:22px 20px 18px; text-align:center; }
.pl-ch{ font-family:var(--mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); }
.pl-title{ font-family:var(--display); font-weight:700; font-size:1.3rem; line-height:1.25; margin-top:6px; min-height:1.6em; }
.pl-seek{ width:100%; margin:18px 0 4px; accent-color:var(--accent); height:28px; cursor:pointer; }
.pl-times{ display:flex; justify-content:space-between; font-family:var(--mono); font-size:.72rem; color:var(--dim); font-variant-numeric:tabular-nums; }
.pl-controls{ margin-top:14px; display:flex; align-items:center; justify-content:center; gap:clamp(8px, 4vw, 22px); }
.pl-controls button{ background:none; border:0; color:var(--paper); cursor:pointer; display:grid; place-items:center; border-radius:50%; }
.pl-controls button:active{ background:color-mix(in srgb, var(--paper) 10%, transparent); }
.pl-small{ width:44px; height:44px; color:var(--dim) !important; }
.pl-skip{ width:54px; height:54px; position:relative; }
.pl-skip span{ position:absolute; font-family:var(--mono); font-size:.58rem; top:50%; left:50%; transform:translate(-50%,-38%); }
.pl-play{ width:76px; height:76px; background:var(--accent) !important; color:var(--ink) !important; box-shadow:0 6px 24px color-mix(in srgb, var(--accent) 35%, transparent); }
.pl-play .i-play{ width:0; height:0; margin-left:6px; border-left:24px solid currentColor; border-top:15px solid transparent; border-bottom:15px solid transparent; }
.pl-play .i-pause{ display:none; width:22px; height:26px; border-left:7px solid currentColor; border-right:7px solid currentColor; }
.pl-play.is-playing .i-play{ display:none; } .pl-play.is-playing .i-pause{ display:block; }
.pl-row{ margin-top:12px; display:flex; justify-content:center; }
.pl-speed{ font-family:var(--mono); font-size:.78rem; color:var(--paper); background:none; border:1px solid var(--line); border-radius:999px; padding:6px 14px; cursor:pointer; min-width:64px; }
.pl-msg{ margin-top:10px; font-size:.9rem; color:var(--accent); min-height:0; }
.pl-msg:empty{ display:none; }
.pl-save{ margin-top:22px; }
.pl-save-row{ display:flex; flex-wrap:wrap; gap:10px; }
.pl-save .btn{ cursor:pointer; border:0; }
.pl-save .btn-ghost{ border:1px solid var(--line); background:none; }
.pl-save .btn[disabled]{ opacity:.6; cursor:default; }
.pl-save.is-saved .pl-note{ color:var(--accent); }
.pl-save.is-saved .pl-note::before{ content:"✓ "; }
.pl-bar{ margin-top:12px; height:6px; border-radius:3px; background:var(--line); overflow:hidden; }
.pl-bar span{ display:block; height:100%; width:0; background:var(--accent); transition:width .2s; }
.pl-note{ margin-top:10px; font-size:.95rem; color:var(--dim); }
.pl-ios{ margin-top:14px; padding:12px 14px; border:1px dashed var(--line); border-radius:6px; font-size:.92rem; color:var(--dim); }
.pl-ios strong{ color:var(--paper); font-weight:600; }
.player .toc{ margin-top:40px; }
.pl-list button{ width:100%; display:grid; grid-template-columns:2.6rem 1fr auto; gap:12px; align-items:baseline; padding:14px 4px; border:0;
  border-bottom:1px solid var(--line); background:none; color:var(--paper); text-align:left; font:inherit; cursor:pointer; }
.pl-list button:hover{ background:var(--panel); }
.pl-list li.here button{ background:var(--panel); }
.pl-list li.here .toc-m::before{ content:"▶ "; color:var(--accent); }
.pl-list li.is-locked button{ color:var(--dim); }
.pl-list li.is-locked .toc-m::after{ content:" · full book"; }
.pl-locked{ margin-top:18px; }
.pl-locked .locked-actions{ justify-content:center; }
.pl-more{ margin-top:28px; font-size:.95rem; color:var(--dim); }
@media (max-width:480px){ .pl-head{ grid-template-columns:84px 1fr; gap:16px; } .player{ padding-top:28px; } }

/* listen page: one card per audiobook */
.pl-cards{ margin-top:28px; display:grid; gap:18px; max-width:44rem; }
.pl-card{ display:grid; grid-template-columns:120px 1fr; gap:20px; align-items:start; background:var(--panel); border:1px solid var(--line);
  border-left:3px solid var(--tint); border-radius:8px; padding:16px; }
.pl-card .cover{ border-radius:4px; }
.pl-card h2{ font-family:var(--display); font-weight:800; font-size:1.35rem; line-height:1.15; }
.pl-card .meta{ margin-top:6px; font-family:var(--mono); font-size:.7rem; letter-spacing:.08em; color:var(--dim); }
.pl-card .cta-row{ margin-top:14px; display:flex; flex-wrap:wrap; gap:10px; }
.pl-card .btn-solid{ background:var(--tint); }
.pl-card .note{ margin-top:10px; font-size:.9rem; }
@media (max-width:480px){ .pl-card{ grid-template-columns:84px 1fr; gap:14px; } }
.pl-apple{ margin-top:18px; border-color:var(--accent); padding:14px; border:1px solid var(--line); border-radius:6px; font-size:.92rem; color:var(--dim); display:grid; gap:10px; }
.pl-apple strong{ color:var(--paper); font-weight:600; }
.pl-apple .btn{ justify-self:start; }
.pl-apple-alt{ font-size:.85rem; }
.pl-apple code{ font-family:var(--mono); font-size:.78rem; color:var(--paper); overflow-wrap:anywhere; }
.pl-inapp{ margin-top:20px; padding:12px 14px; border:1px solid var(--accent); border-radius:6px; font-size:.95rem; color:var(--paper); }
.pl-log{ margin-top:28px; font-size:.85rem; color:var(--dim); }
.pl-log summary{ cursor:pointer; font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; }
.pl-log-row{ display:flex; gap:10px; margin:12px 0; }
.pl-log-row .btn{ cursor:pointer; background:none; padding:8px 14px; }
.pl-log pre{ white-space:pre-wrap; overflow-wrap:anywhere; font-family:var(--mono); font-size:.72rem; line-height:1.5; background:var(--panel);
  border:1px solid var(--line); border-radius:4px; padding:10px; max-height:360px; overflow:auto; }

.feed-label{ margin-top:14px; font-size:.9rem; color:var(--dim, #97A3BC); }

/* ---- paywall: locked chapter panel, account page */
.locked{ margin:2.4em 0 1em; padding:22px 22px 18px; border:1px solid var(--line); border-radius:6px; background:var(--panel); font-size:1rem; line-height:1.6; }
.locked-eyebrow{ font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin:0 0 8px; }
.locked-actions{ display:flex; gap:10px; flex-wrap:wrap; margin:16px 0 0; }
.listen-locked{ font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; color:var(--dim); margin:0 0 22px; }
.listen-locked a{ color:inherit; text-decoration:underline; text-underline-offset:3px; }
.account .prose{ font-size:1.02rem; line-height:1.65; }
.account h2{ font-family:var(--display); font-weight:700; font-size:1.25rem; margin:1.6em 0 .5em; }
.a-box{ border:1px solid var(--line); border-radius:6px; padding:18px 20px; margin:18px 0; background:var(--panel); }
.a-box[hidden], .account [hidden]{ display:none !important; }
.a-form{ display:flex; gap:10px; flex-wrap:wrap; margin:12px 0 6px; }
.a-form input{ flex:1 1 220px; min-width:0; background:var(--ink); color:var(--paper); border:1px solid var(--line); border-radius:4px; padding:12px 14px; font:inherit; }
.a-form input:focus{ outline:2px solid var(--accent); outline-offset:1px; border-color:transparent; }
.a-form input.a-code{ letter-spacing:.4em; font-family:var(--mono); flex:0 1 200px; }
.a-form .btn, .account button.btn{ border:0; cursor:pointer; }
.a-form .btn:disabled, .account button.btn:disabled{ opacity:.6; cursor:wait; }
.a-check{ display:flex; gap:8px; align-items:flex-start; font-size:.9rem; color:var(--dim); margin:4px 0 0; }
.a-msg{ min-height:1.4em; font-size:.92rem; color:var(--accent); margin:8px 0 0; }
.a-books{ list-style:none; padding:0; margin:10px 0 0; }
.a-books li{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--line); }
.a-books li:first-child{ border-top:0; }
.a-books .a-pick{ display:flex; gap:8px; flex-wrap:wrap; }
.a-books button{ background:none; border:1px solid var(--line); color:var(--paper); border-radius:3px; padding:7px 12px; font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; }
.a-books button:hover{ border-color:var(--accent); color:var(--accent); }
.a-books .a-chosen{ font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); }
@media (max-width:520px){ .a-books li{ flex-direction:column; align-items:flex-start; gap:8px; } }
.a-preview{ border-color:var(--accent); }
.a-del{ margin:28px 0 0; font-size:.9rem; color:var(--dim); }
.a-box > :first-child{ margin-top:0; }
.a-link{ background:none; border:0; color:var(--dim); text-decoration:underline; cursor:pointer; font:inherit; padding:0; }