:root {
  --bg: #f4f2ec;
  --card: #ffffff;
  --ink: #20251f;
  --muted: #6d746d;
  --line: #d8ddd6;
  --accent: #6d8f72;
  --accent-dark: #4e6f54;
  --soft: #eaf0ea;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
}
.page-shell { max-width: 980px; margin: 0 auto; padding: 40px 22px 64px; }
.hero { display: grid; grid-template-columns: minmax(220px, 320px) 1fr; gap: 40px; align-items: center; }
.cover-placeholder {
  aspect-ratio: 2 / 3;
  background: linear-gradient(160deg, #233126, #607766);
  color: white;
  padding: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 8px;
  box-shadow: 0 12px 40px rgba(0,0,0,.14);
}
.cover-kicker { font-size: 12px; letter-spacing: .18em; opacity: .78; }
.cover-title { font-size: clamp(42px, 6vw, 68px); font-weight: 800; line-height: .94; }
.cover-subtitle { font-size: 18px; line-height: 1.25; max-width: 13ch; }
.cover-author { font-size: 18px; font-weight: 700; letter-spacing: .08em; }
.eyebrow { margin: 0 0 6px; color: var(--accent-dark); text-transform: uppercase; letter-spacing: .13em; font-size: 12px; font-weight: 800; }
h1 { font-size: clamp(42px, 6vw, 68px); margin: 0 0 10px; line-height: 1; }
.subtitle { font-size: 22px; max-width: 28ch; margin: 0 0 14px; }
.byline { font-weight: 700; margin: 0 0 22px; }
.note, .small-note { color: var(--muted); }
.player-card, .chapters-section {
  margin-top: 42px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 24px;
}
.player-card h2, .chapters-section h2 { margin: 0; }
audio { width: 100%; margin-top: 18px; }
.player-actions { display: flex; gap: 10px; margin-top: 14px; }
button {
  appearance: none;
  border: 1px solid var(--line);
  background: var(--soft);
  color: var(--ink);
  padding: 10px 14px;
  border-radius: 8px;
  font-weight: 700;
  cursor: pointer;
}
button:hover { border-color: var(--accent); }
button:disabled { opacity: .45; cursor: not-allowed; }
.section-head { display: flex; justify-content: space-between; gap: 24px; align-items: end; }
.small-note { max-width: 360px; font-size: 14px; margin: 0; }
.chapter-list { list-style: none; padding: 0; margin: 20px 0 0; border-top: 1px solid var(--line); }
.chapter-item { display: grid; grid-template-columns: 52px 1fr auto; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line); }
.chapter-number { color: var(--muted); font-variant-numeric: tabular-nums; }
.chapter-title { font-weight: 700; }
.chapter-unavailable { color: var(--muted); font-size: 13px; }
.chapter-item.active .chapter-title { color: var(--accent-dark); }
.play-btn { min-width: 76px; }
code { background: #f0f2ef; padding: 2px 5px; border-radius: 4px; }
@media (max-width: 700px) {
  .page-shell { padding: 24px 16px 46px; }
  .hero { grid-template-columns: 1fr; }
  .cover-placeholder { max-width: 320px; width: 78%; margin: 0 auto; }
  .section-head { display: block; }
  .small-note { margin-top: 10px; }
  .chapter-item { grid-template-columns: 42px 1fr; }
  .play-btn { grid-column: 2; width: fit-content; }
}

.cover-wrap{min-width:0}.cover-image{display:block;width:100%;max-width:310px;height:auto;border-radius:12px;border:1px solid var(--line);object-fit:cover}

.password-gate{position:fixed;inset:0;background:#f5f3ed;display:flex;align-items:center;justify-content:center;padding:24px;z-index:9999}.password-box{max-width:460px;width:100%;background:white;border:1px solid #ddd7cb;border-radius:18px;padding:30px}.password-box h1{margin:6px 0 10px}.password-box form{display:grid;gap:12px;margin-top:20px}.password-box input{font:inherit;padding:12px 14px;border:1px solid #bbb;border-radius:10px}.password-box button{font:inherit;padding:12px 16px;border:0;border-radius:10px;background:#1f5138;color:white;font-weight:700;cursor:pointer}.password-error{min-height:1.2em;margin:0;color:#9b1c1c}.password-gate.hidden{display:none}