/* shell.css — 课程书架 · 阅读器外壳（书架/书籍美学 · v3） */
:root{
  --bg:#f3ede1; --ink:#2a251f; --sub:#7a6f60; --line:#d8cdb8;
  --accent:#9a3412; --soft:#ece3d2; --bar:#fbf7ee; --shadow:rgba(60,42,20,.14);
  --shelf:#5a3d28; --shelf-edge:#3d2818;
  --book-ink:#f7f1e6;   /* 书封面文字：固定奶白，不受主题影响 */
  /* 课程内容表面/语义色（浅色） */
  --card:#ffffff; --card2:#fbf7ee;
  --ok:#166534; --bad:#b91c1c; --blue:#1e40af;
  --ok-bg:#eafaf0; --ok-border:#9bd9b0;
  --bad-bg:#fdeaea; --bad-border:#e9b4b4;
}
[data-theme="dark"]{
  --bg:#16140f; --ink:#ece4d4; --sub:#9a8f7c; --line:#2c271f;
  --accent:#e08a4a; --soft:#221e17; --bar:#1c1913; --shadow:rgba(0,0,0,.5);
  --shelf:#2a2118; --shelf-edge:#15110b;
  /* 课程内容表面/语义色（暗色） */
  --card:#211c16; --card2:#1a1610;
  --ok:#4ade80; --bad:#f87171; --blue:#93b4ff;
  --ok-bg:#1a2e22; --ok-border:#3a6e48;
  --bad-bg:#2e1a1a; --bad-border:#6e3a3a;
}
* { box-sizing:border-box; }
html,body{ margin:0; min-height:100%; }
body{
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(154,52,18,.06), transparent 60%),
    var(--bg);
  color:var(--ink);
  font-family:"Georgia","Times New Roman","Songti SC","STSong",serif;
  -webkit-font-smoothing:antialiased;
}

/* ---------- 顶部常驻栏（阅读器） ---------- */
.reader-bar{
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; gap:10px;
  padding:10px 16px; background:var(--bar);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 6px var(--shadow);
}
.reader-bar .title{ flex:1; font-weight:700; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:.3px; }
.reader-bar button{
  font:inherit; font-size:13px; cursor:pointer;
  border:1px solid var(--line); background:var(--soft); color:var(--ink);
  border-radius:8px; padding:5px 10px; line-height:1;
  transition:transform .12s ease, border-color .15s;
}
.reader-bar button:hover{ transform:translateY(-1px); border-color:var(--accent); }
.reader-bar .theme{ display:flex; gap:4px; }
.reader-bar .theme button.active{ border-color:var(--accent); color:var(--accent); font-weight:700; }
.reader-bar .back{ font-weight:700; }
.reader-bar .bm{ font-size:16px; }
.reader-bar .bm.on{ color:var(--accent); }
.reader-bar .nav{ display:flex; gap:6px; }

/* 目录下拉 */
.toc-menu{
  position:fixed; top:54px; right:16px; z-index:30;
  background:var(--bar); border:1px solid var(--line); border-radius:10px;
  box-shadow:0 8px 24px var(--shadow); padding:6px; min-width:250px;
  max-height:62vh; overflow:auto; display:none;
}
.toc-menu.open{ display:block; }
.toc-menu .toc-h{ font-size:11px; opacity:.6; padding:4px 10px; letter-spacing:1px; }
.toc-menu button{
  display:block; width:100%; text-align:left; font:inherit; font-size:13px;
  background:none; border:none; color:var(--ink); padding:8px 10px;
  border-radius:6px; cursor:pointer;
}
.toc-menu button:hover{ background:var(--soft); }
.toc-menu button.cur{ color:var(--accent); font-weight:700; }

/* ---------- 滚动容器 ---------- */
#content{ max-width:820px; margin:0 auto; padding:26px 20px 120px; }
#content img{ max-width:100%; height:auto; }
#content a{ color:var(--accent); }

/* ---------- 书架首页 ---------- */
.shelf{ max-width:1040px; margin:0 auto; padding:48px 24px 80px; }
.shelf-head{ margin-bottom:34px; }
.shelf-head h1{ font-size:34px; margin:0 0 6px; letter-spacing:.5px; font-family:"Palatino Linotype","Book Antiqua",Georgia,serif; }
.shelf-head .sub{ color:var(--sub); font-size:15px; font-style:italic; }

.bookshelf{
  position:relative;
  background:linear-gradient(180deg,var(--shelf) 0%,var(--shelf-edge) 100%);
  border-radius:10px 10px 4px 4px;
  padding:30px 28px 0;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.08), 0 14px 30px var(--shadow);
}
.bookshelf::after{
  content:""; display:block; height:16px; margin:26px -28px 0;
  background:linear-gradient(180deg,var(--shelf-edge),rgba(0,0,0,.35));
  border-radius:0 0 4px 4px; box-shadow:0 6px 12px rgba(0,0,0,.25);
}
.book-row{ display:flex; flex-wrap:wrap; gap:18px 28px; align-items:flex-end; }

/* 一门课 = 一本书 */
.book{
  position:relative; width:180px; height:240px; cursor:pointer; text-decoration:none;
  color:var(--book-ink);
  border-radius:3px 7px 7px 3px;
  background:linear-gradient(90deg, rgba(0,0,0,.25), rgba(0,0,0,0) 8%, rgba(0,0,0,0) 92%, rgba(255,255,255,.14)),
             var(--bc, #7c2d12);
  border-left:8px solid rgba(0,0,0,.3);
  box-shadow:3px 0 0 rgba(0,0,0,.12), 6px 6px 14px rgba(0,0,0,.32);
  padding:16px 14px; overflow:hidden;
  transition:transform .18s cubic-bezier(.2,.8,.3,1.2), box-shadow .18s;
  display:flex; flex-direction:column;
}
.book:hover{ transform:translateY(-12px) rotate(-1deg); box-shadow:4px 0 0 rgba(0,0,0,.12), 10px 16px 26px rgba(0,0,0,.4); }
.book .bm-dot{ position:absolute; top:10px; right:10px; font-size:13px; opacity:0; transition:opacity .15s; }
.book.bm .bm-dot{ opacity:1; }
.book .cover-kicker{ font-size:11px; letter-spacing:2px; opacity:.7; text-transform:uppercase; }
.book .cover-t{ margin-top:8px; font-weight:700; font-size:19px; line-height:1.2; font-family:"Palatino Linotype","Book Antiqua",Georgia,serif; }
.book .cover-meta{ margin-top:auto; font-size:12px; opacity:.88; }
.book .spine-line{ margin-top:10px; height:2px; background:rgba(255,255,255,.3); width:60%; }

/* 书架 skeleton */
.skeleton-row{ display:flex; gap:28px; }
.skeleton-book{
  width:180px; height:240px; border-radius:3px 7px 7px 3px;
  background:linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,.14), rgba(255,255,255,.05));
  background-size:200% 100%; animation:shimmer 1.2s infinite;
}
@keyframes shimmer{ 0%{background-position:200% 0} 100%{background-position:-200% 0} }

.shelf-note{ margin-top:26px; color:var(--sub); font-size:13px; font-style:italic; }

/* ===== toast 轻提示 ===== */
#toast{
  position:fixed; bottom:40px; left:50%; transform:translateX(-50%);
  background:var(--ink); color:var(--bg); padding:10px 24px;
  border-radius:20px; font-size:14px; font-weight:600;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  opacity:0; pointer-events:none; z-index:1000;
  transition:opacity .25s ease, transform .25s ease;
}
#toast.in{ opacity:1; transform:translateX(-50%) translateY(-6px); }
#toast.out{ opacity:0; transform:translateX(-50%) translateY(12px); }

/* ===== 桌面端工具栏放大 ===== */
@media (min-width:900px){
  .reader-bar{ gap:14px; padding:12px 24px; }
  .reader-bar button{ font-size:14px; padding:7px 14px; border-radius:10px; }
  .reader-bar .title{ font-size:16px; }
  .reader-bar .back{ font-size:14px; }
  .reader-bar .bm{ font-size:18px; }
  .reader-bar .theme button{ font-size:15px; padding:5px 10px; }
  .reader-bar .nav button{ font-size:16px; padding:5px 12px; }
  .reader-bar .nav{ gap:8px; }
}

/* ===== 移动端自适应 ===== */

@media (max-width:600px){
  /* 工具栏：缩小间距、隐藏文字标签只留图标 */
  .reader-bar{ gap:4px; padding:6px 8px; }
  .reader-bar button{ font-size:12px; padding:4px 6px; white-space:nowrap; }
  .reader-bar .btn-label{ display:none; }      /* 书架/目录只显图标 ‹ ☰ */
  .reader-bar .title{ font-size:13px; }
  .reader-bar .back{ font-weight:700; padding-left:4px; padding-right:4px; }
  .reader-bar .bm{ font-size:14px; }
  .reader-bar .nav{ gap:3px; }
  .reader-bar .theme{ gap:2px; }
  /* 目录下拉适配 */
  .toc-menu{ top:44px; right:8px; min-width:200px; max-height:55vh; }

  /* 内容区内边距 */
  #content{ padding:16px 12px 80px; }

  /* 覆盖注入课程样式（用 #content 提高特异度） */
  #content .wrap{ padding:24px 14px 48px; }
  #content h1{ font-size:24px; }
  #content h2{ font-size:17px; margin:28px 0 8px; }
  #content .lead{ font-size:15px; }
  #content p{ font-size:15px; }
  #content code{ font-size:12.5px; }
  #content pre{ font-size:11px; padding:10px 12px; }
  #content .schema .key{ flex:0 0 auto; min-width:60px; font-size:13px; }
  #content .schema .val{ font-size:13.5px; }
  #content .schema .row{ gap:8px; }
  #content .pit div{ font-size:13.5px; padding:9px 12px; }
  #content .pcard{ padding:12px 14px; }
  #content .pcard h3{ font-size:15px; }
  #content .box{ padding:12px 14px; font-size:15px; }
  #content .reminder{ padding:12px 14px; font-size:13.5px; }
  #content .quiz{ padding:6px 14px 14px; }
  #content .opt{ font-size:14px; padding:8px 12px; }
  #content .qh{ font-size:15px; }
  #content .timeline{ font-size:11.5px; padding:10px 12px; }
  #content footer{ font-size:12px; }
}

/* 超窄屏（<400px）：schema 卡片标签与正文上下堆叠，避免正文被挤成 6 字/行 */
@media (max-width:400px){
  #content .schema .row{ flex-direction:column; gap:2px; align-items:flex-start; }
  #content .schema .key{ min-width:0; font-size:12.5px; border-bottom:1px dashed var(--line); padding-bottom:2px; margin-bottom:2px; }
  #content .schema .val{ font-size:13px; }
  #content .wrap{ padding:20px 12px 40px; }
}

/* 书架（已有） */
@media (max-width:560px){
  .book{ width:150px; height:200px; }
  .skeleton-book{ width:150px; height:200px; }
  .shelf-head h1{ font-size:26px; }
}