/* assets/css/books.css — BMD Stories */

.bk-kicker{
  display:inline-flex;
  align-items:center;
  width:fit-content;
  gap:8px;
  margin:0 0 12px;
  color:var(--accent3);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.bk-hero{ padding:52px 0 24px; }
.bk-hero-grid{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:18px; align-items:stretch; }
.bk-hero-card{ padding:34px; min-height:330px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; position:relative; box-shadow:var(--shadow-soft); }
.bk-hero-card::before{ content:""; position:absolute; inset:-20%; background:radial-gradient(circle at 22% 12%, rgba(255,45,45,.24), transparent 36%), radial-gradient(circle at 86% 8%, rgba(78,161,255,.16), transparent 32%); pointer-events:none; }
.bk-hero-card > *{ position:relative; }
.bk-hero-card h1{ margin:0 0 14px; font-family:var(--font-display); font-size:clamp(34px,6vw,72px); line-height:.95; letter-spacing:.05em; text-transform:uppercase; }
.bk-hero-card p{ margin:0; max-width:760px; color:var(--content-soft); font-size:15px; line-height:1.75; }
.bk-hero-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:24px; }
.bk-stats{ padding:18px; display:grid; gap:12px; align-content:stretch; box-shadow:var(--shadow-soft); }
.bk-stat{ border:1px solid var(--panel-border); border-radius:18px; background:var(--panel-bg); padding:16px; }
.bk-stat span{ display:block; margin-bottom:7px; color:var(--label-text); font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:900; }
.bk-stat strong{ font-family:var(--font-display); font-size:24px; }

.bk-shelf,.bk-book-hero,.bk-toc-section,.bk-reader-shell{ padding:32px 0 72px; }
.bk-section-head{ display:flex; align-items:end; justify-content:space-between; gap:18px; margin-bottom:18px; }
.bk-section-head h2{ margin:0; font-family:var(--font-display); text-transform:uppercase; letter-spacing:.06em; font-size:26px; }
.bk-section-head p{ margin:0; max-width:560px; color:var(--content-muted); font-size:13px; line-height:1.65; }

.bk-empty{ padding:24px; display:flex; flex-direction:column; gap:10px; color:var(--content-muted); }
.bk-empty strong{ color:var(--text); font-size:18px; }

.bk-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.bk-card{ overflow:hidden; box-shadow:var(--shadow-soft); transition:transform .18s ease, border-color .18s ease, background .18s ease; }
.bk-card:hover{ transform:translateY(-3px); border-color:var(--panel-border-hover); }
.bk-card-cover{ display:block; padding:14px 14px 0; text-decoration:none; }
.bk-cover{ aspect-ratio:2/3; border-radius:20px; overflow:hidden; border:1px solid var(--media-border); background:linear-gradient(135deg, var(--media-warm), var(--media-cool)); box-shadow:var(--card-shadow); }
.bk-cover img{ width:100%; height:100%; display:block; object-fit:cover; }
.bk-cover-placeholder{ display:grid; place-items:center; padding:22px; text-align:center; }
.bk-cover-placeholder span{ font-family:var(--font-display); font-size:28px; text-transform:uppercase; letter-spacing:.08em; }
.bk-cover-placeholder small{ color:var(--content-muted); }
.bk-card-body{ padding:16px; }
.bk-card-meta,.bk-card-foot,.bk-book-meta,.bk-reader-meta{ display:flex; gap:8px; flex-wrap:wrap; }
.bk-card-meta span,.bk-card-foot span,.bk-book-meta span,.bk-reader-meta span,.bk-end-chip{ display:inline-flex; align-items:center; min-height:28px; padding:0 10px; border:1px solid var(--label-border); border-radius:999px; background:var(--label-bg); color:var(--label-text); font-size:11px; font-weight:800; }
.bk-card h3{ margin:12px 0 6px; font-family:var(--font-display); letter-spacing:.05em; text-transform:uppercase; font-size:20px; }
.bk-card h3 a{ color:inherit; text-decoration:none; }
.bk-card-subtitle{ margin:0 0 10px; color:var(--accent3); font-weight:800; font-size:13px; }
.bk-card-desc{ margin:0 0 14px; color:var(--content-soft); font-size:13px; line-height:1.65; }
.bk-card-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }

.bk-book-panel{ display:grid; grid-template-columns:minmax(240px,360px) minmax(0,1fr); gap:28px; padding:24px; box-shadow:var(--shadow-soft); }
.bk-cover-large{ max-width:360px; width:100%; }
.bk-book-info{ align-self:center; }
.bk-breadcrumbs{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:20px; color:var(--content-muted); font-size:13px; }
.bk-breadcrumbs a{ color:inherit; text-decoration:none; }
.bk-breadcrumbs a:hover{ color:var(--text); }
.bk-book-info h1{ margin:0 0 12px; font-family:var(--font-display); font-size:clamp(34px,6vw,76px); line-height:.94; letter-spacing:.06em; text-transform:uppercase; }
.bk-book-subtitle{ margin:0 0 14px; color:var(--accent3); font-weight:900; font-size:18px; }
.bk-book-desc{ margin:0 0 18px; max-width:780px; color:var(--content-soft); line-height:1.75; }
.bk-book-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:20px; }

.bk-toc-list{ display:grid; gap:10px; }
.bk-toc-row{ display:grid; grid-template-columns:120px minmax(0,1fr) auto auto; align-items:center; gap:14px; padding:14px 16px; color:inherit; text-decoration:none; transition:transform .16s ease, border-color .16s ease; }
.bk-toc-row:hover{ transform:translateY(-1px); border-color:var(--panel-border-hover); }
.bk-toc-num{ color:var(--accent3); font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.bk-toc-row strong{ font-size:15px; }
.bk-toc-row > span:not(.bk-toc-num):not(.bk-toc-go){ color:var(--content-muted); font-size:12px; }
.bk-toc-go{ font-weight:900; font-size:12px; }

.bk-reader-progress{ position:fixed; left:0; right:0; top:0; height:4px; z-index:9999; background:transparent; }
.bk-reader-progress span{ display:block; width:0%; height:100%; background:var(--paint-line); box-shadow:0 0 18px var(--paint-line-glow); transition:width .08s linear; }
.bk-reader-shell{ padding-top:34px; }
.bk-reader-top{ position:sticky; top:12px; z-index:25; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px; margin-bottom:18px; backdrop-filter:blur(18px); }
.bk-reader-back{ color:var(--content-soft); text-decoration:none; font-size:13px; font-weight:900; }
.bk-reader-jump{ display:flex; align-items:center; gap:8px; margin:0; }
.bk-reader-jump label{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--label-text); font-weight:900; }
.bk-reader-jump select{ width:min(360px,54vw); height:40px; border-radius:14px; border:1px solid var(--field-border, var(--ui-border)); background:rgba(15,18,26,.92); color:var(--text); padding:0 12px; }
.bk-reader-tools{ display:flex; gap:8px; }
.bk-reader-tools button{ height:38px; min-width:38px; border-radius:14px; border:1px solid var(--ui-border); background:var(--ui-bg); color:var(--text); font-weight:900; cursor:pointer; }
.bk-reader-tools button:hover{ border-color:var(--ui-border-hover); background:var(--ui-bg-hover); }
.bk-reader-card{ max-width:880px; margin:0 auto; padding:clamp(24px,5vw,62px); box-shadow:var(--shadow); }
.bk-reader-head{ text-align:center; margin-bottom:36px; padding-bottom:24px; border-bottom:1px solid var(--panel-border); }
.bk-reader-head h1{ margin:0 0 8px; font-family:var(--font-display); font-size:clamp(30px,5vw,58px); text-transform:uppercase; letter-spacing:.08em; }
.bk-reader-head p{ margin:0 0 16px; color:var(--accent3); font-weight:900; }
.bk-reader-meta{ justify-content:center; }
.bk-reader-content{ --reader-font:19px; font-family:Georgia, 'Times New Roman', serif; font-size:var(--reader-font); line-height:1.92; color:var(--text); }
.bk-reader-p{ margin:0 0 1.28em; }
.bk-reader-p.is-memory{ padding:18px 20px; border-left:3px solid var(--accent); border-radius:16px; background:var(--accent-wash); color:var(--content-soft); font-style:italic; }
.bk-reader-p.is-dialogue{ color:var(--content-soft); }
.bk-reader-p.is-line{ text-align:center; color:var(--accent3); letter-spacing:.14em; text-transform:uppercase; font-family:var(--font-display); font-size:.9em; }
.bk-reader-bottom{ max-width:880px; margin:18px auto 0; display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:center; }
.bk-reader-bottom > *:last-child{ justify-self:end; }

html[data-bk-reading-theme="sepia"] body{ background:#18130f; }
html[data-bk-reading-theme="sepia"] .bk-reader-card{ background:rgba(255,244,222,.86); color:#211914; border-color:rgba(70,45,24,.18); }
html[data-bk-reading-theme="sepia"] .bk-reader-content, html[data-bk-reading-theme="sepia"] .bk-reader-head h1{ color:#211914; }
html[data-bk-reading-theme="sepia"] .bk-reader-p.is-memory{ color:#33261d; background:rgba(120,74,36,.10); }
html[data-bk-reading-theme="sepia"] .bk-reader-head{ border-bottom-color:rgba(70,45,24,.16); }

@media(max-width:980px){
  .bk-hero-grid,.bk-book-panel{ grid-template-columns:1fr; }
  .bk-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .bk-cover-large{ max-width:300px; margin:0 auto; }
  .bk-section-head{ align-items:flex-start; flex-direction:column; }
  .bk-toc-row{ grid-template-columns:1fr; }
  .bk-reader-top{ position:relative; top:auto; flex-wrap:wrap; }
}

@media(max-width:640px){
  .bk-hero{ padding-top:28px; }
  .bk-hero-card{ padding:24px; min-height:280px; }
  .bk-grid{ grid-template-columns:1fr; }
  .bk-book-panel{ padding:16px; }
  .bk-reader-card{ padding:24px 18px; }
  .bk-reader-content{ --reader-font:18px; line-height:1.82; }
  .bk-reader-jump{ width:100%; order:3; }
  .bk-reader-jump select{ width:100%; }
  .bk-reader-bottom{ grid-template-columns:1fr; }
  .bk-reader-bottom > *{ justify-self:stretch !important; text-align:center; justify-content:center; }
}