/* BOOK CLUB · LIVING LEARNING ENGINES (public/bookclub-engines.js).
   Builds on the shared engine classes (cv-*, xw-*, lc-*, ph-*); only Book Club
   specifics live here, all prefixed bc-. Obsidian + gold, phone first. */

/* ── Conversation + ATHOS ── */
.bc-pick { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-top: 4px; }
.bc-pick label { display: grid; gap: 4px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #c9a54c; min-width: 0; flex: 1 1 200px; }
.bc-pick select { width: 100%; min-width: 0; background: #120d05; color: #f3e8cc; border: 1px solid rgba(227,183,74,.45); border-radius: 12px; padding: 9px 10px; font: inherit; font-size: 15px; text-transform: none; letter-spacing: 0; }
.bc-pick .btn { flex: 0 0 auto; }
.bc-turn p { margin: 6px 0; font-size: 16px; color: #f6efdc; line-height: 1.5; }
.bc-q { margin: 10px 0 6px; padding: 10px 14px; border-left: 3px solid #e3b74a; border-radius: 0 12px 12px 0; background: rgba(227,183,74,.08); }
.bc-q p { margin: 4px 0 0; font-family: "Frank Ruhl Libre", Georgia, serif; font-size: 17px; color: #fbe9b6; }
.bc-lane { display: grid; gap: 2px; margin: 8px 0 0 !important; padding: 8px 12px; border-radius: 12px; font-size: 14.5px !important; }
.bc-lane b, .bc-ask b { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.bc-text { background: rgba(127,184,230,.08); border: 1px solid rgba(127,184,230,.35); color: #dcebf7 !important; }
.bc-text b { color: #7fb8e6; }
.bc-int { background: rgba(224,138,106,.07); border: 1px solid rgba(224,138,106,.35); color: #f3ddd2 !important; }
.bc-int b { color: #e08a6a; }
.bc-ask { display: grid; gap: 2px; margin: 10px 0 0 !important; color: #bff0e9 !important; }
.bc-ask b { color: #3fc6b8; }
.bc-drop { font-size: 12.5px !important; }
.bc-talk .cv-turn { max-width: min(92%, 680px); }
@media (max-width: 640px) { .bc-talk .cv-hero { min-height: 560px; } .bc-talk .cv-turn { max-width: 100%; } }

/* ── shared Book Club engine page ── */
.bc-page { display: grid; gap: 18px; min-width: 0; }
.bc-sec { padding: clamp(16px, 2.4vw, 24px); border-radius: 20px; min-width: 0; }
.bc-sec h2 { margin: 4px 0 6px; font-family: var(--display); color: #f6d77e; font-size: clamp(20px, 3vw, 26px); }
.bc-sec > p { color: var(--text-2); max-width: 72ch; }
.bc-quote { margin: 10px 0; padding: 12px 16px; border-left: 3px solid #e3b74a; border-radius: 0 14px 14px 0; background: rgba(227,183,74,.07); font-family: "Frank Ruhl Libre", Georgia, serif; font-size: 18px; line-height: 1.55; color: #fbe9b6; }
.bc-quote cite { display: block; margin-top: 6px; font-family: Inter, system-ui, sans-serif; font-style: normal; font-size: 12.5px; color: #bdb39f; }
.bc-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 16px; align-items: start; }
.bc-opt { display: grid; gap: 4px; width: 100%; text-align: left; padding: 11px 14px; border-radius: 14px; border: 1px solid rgba(227,183,74,.32); background: rgba(5,5,5,.55); color: #f3ecda; font: inherit; font-size: 15px; cursor: pointer; }
.bc-opt:hover, .bc-opt:focus-visible { border-color: #f6d77e; outline: none; }
.bc-opt.is-picked { border-color: #f6d77e; background: rgba(227,183,74,.16); }
.bc-opt.is-best { border-color: #3fc58a; box-shadow: inset 0 0 0 1px #3fc58a; }
.bc-opt:disabled { cursor: default; }
.bc-opts { display: grid; gap: 8px; margin: 10px 0; }
.bc-why { margin: 8px 0 0; color: #e9e1cf; }
.bc-why b { color: #f6d77e; }
.bc-note { font-size: 13px; color: var(--text-2); }
.bc-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.bc-area { width: 100%; box-sizing: border-box; background: #0d0a06; color: #f6efdc; border: 1px solid rgba(227,183,74,.4); border-radius: 14px; padding: 12px; font: inherit; font-size: 16px; resize: vertical; min-height: 96px; }
.bc-tag { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #f6d77e; }
.bc-lock { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #3fc6b8; }

/* ── Living Parable ── */
.bc-parable .pb-scene .ph-obj { cursor: pointer; outline: none; }
.bc-plines { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.bc-plines li { padding: 8px 12px; border-radius: 12px; background: #120d05; border: 1px solid rgba(227,183,74,.3); transition: opacity .3s, filter .3s; }
.bc-plines li b { display: block; color: #f6d77e; font-size: 13px; letter-spacing: .04em; }
.bc-plines li q { display: block; margin-top: 2px; font-family: "Frank Ruhl Libre", Georgia, serif; font-size: 16px; color: #f6efdc; quotes: "“" "”"; }
.bc-plines li.pb-hidden { opacity: .25; filter: blur(3px); }
.bc-parable .pb-tag i { font-style: italic; color: #fbe9b6; }
@media (max-width: 760px) { .bc-parable .pb-hero { grid-template-columns: 1fr; } }

/* ── Wave Interpretation ── */
.bc-wstage { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #000; border-radius: 22px 22px 0 0; }
.bc-wframe { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.02); transition: opacity 1.1s ease, transform 3.4s ease; }
.bc-wframe.on { opacity: 1; transform: scale(1.09); }
.bc-wcap { position: absolute; left: 12px; right: 12px; bottom: 12px; padding: 8px 12px; border-radius: 12px; background: rgba(0,0,0,.66); color: #fbe9b6; font-family: "Frank Ruhl Libre", Georgia, serif; font-size: clamp(14px, 1.8vw, 18px); pointer-events: none; }
.bc-wave .wv-model q { font-family: "Frank Ruhl Libre", Georgia, serif; color: #f6efdc; }
.bc-wave .wv-opt.is-best { border-color: #3fc58a; box-shadow: inset 0 0 0 1px #3fc58a; }
@media (prefers-reduced-motion: reduce) { .bc-wframe { transition: opacity .2s; transform: none !important; } }

/* ── Simulation ── */
.bc-case { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 20px; align-items: start; }
.bc-case-img { position: relative; border-radius: 16px; overflow: hidden; border: 1px solid rgba(227,183,74,.3); aspect-ratio: 16 / 10; background: #000; }
.bc-case-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bc-case-img .bc-tag { position: absolute; left: 10px; top: 10px; padding: 4px 10px; border-radius: 999px; background: rgba(0,0,0,.66); }
.bc-case-body { display: grid; gap: 8px; min-width: 0; }
.bc-case-body > p { margin: 0; color: #e9e1cf; }
.bc-reveal { display: grid; gap: 8px; margin-top: 10px; padding: 14px; border-radius: 14px; border: 1px solid rgba(63,198,184,.4); background: rgba(63,198,184,.05); }
.bc-reveal p { margin: 0; }
.bc-rubric { border: 1px solid rgba(227,183,74,.3); border-radius: 12px; padding: 10px 12px; display: grid; gap: 6px; }
.bc-rubric legend { color: #f6d77e; font-weight: 600; padding: 0 4px; }
.bc-rubric label { display: flex; gap: 8px; align-items: flex-start; color: #e9e1cf; font-size: 15px; }
@media (max-width: 820px) { .bc-case { grid-template-columns: 1fr; } }

/* ── Blind Replay ── */
.bc-cut { display: grid; gap: 10px; }
.bc-cut-h { display: flex; gap: 14px; align-items: center; }
.bc-cut-h img { width: 120px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 12px; border: 1px solid rgba(227,183,74,.3); flex: none; }
.bc-cut-h h2 { margin: 2px 0 0; }
.bc-text-page { padding: 16px 18px; border-radius: 14px; background: #f3ead6; color: #2a2116; font-family: "Frank Ruhl Libre", Georgia, serif; font-size: 17.5px; line-height: 1.6; }
.bc-text-page p { margin: 0 0 .6em; }
.bc-elided { font-family: Inter, system-ui, sans-serif; font-size: 14px; color: #6b5a3e; font-style: italic; }
.bc-cutline { position: relative; margin: 6px 0 0 !important; height: 34px; background: repeating-linear-gradient(0deg, rgba(42,33,22,.14) 0 9px, transparent 9px 16px); border-radius: 6px; display: grid; place-items: center; }
.bc-cutline span { font-family: Inter, system-ui, sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #6b5a3e; background: #f3ead6; padding: 2px 10px; border-radius: 999px; }
.bc-revealed { background: #fbf5e6; box-shadow: inset 4px 0 0 #3fc6b8; }
@media (max-width: 520px) { .bc-cut-h img { width: 84px; } .bc-text-page { font-size: 16.5px; padding: 14px; } }
