/* ============================================================
   deck.css —— HTML 课件设计系统 v0.2（编辑设计感）
   与 deck.js / annotator.js / katex/ 配套使用
   ============================================================ */
:root{
  --paper:#F6F3EA;      /* 纸面 */
  --ink:#181611;        /* 墨 */
  --mut:#8C8676;        /* 灰墨 */
  --acc:#C2452A;        /* 朱红（唯一点缀色） */
  --line:rgba(24,22,17,.18);
  --hair:1px solid var(--line);
  --fs:clamp(13px, 0.72vw + 0.85vh, 21px);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden}
body{
  font-size:var(--fs);
  font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
  background:var(--paper);color:var(--ink);
  -webkit-font-smoothing:antialiased;
}
.en{font-family:"Helvetica Neue",Arial,sans-serif;text-transform:uppercase;letter-spacing:.24em}
.serif{font-family:"Noto Serif SC","Songti SC","STSong",serif}
.tabnum{font-variant-numeric:tabular-nums}

/* ---------- 固定家具 ---------- */
#top{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:baseline;padding:1.3em 2.4em .9em;border-bottom:var(--hair);background:linear-gradient(var(--paper) 82%,transparent);font-size:.72em}
#top .l{display:flex;gap:1.4em;align-items:baseline}
#top .brand{font-weight:700;letter-spacing:.14em}
#top .crumb{color:var(--mut);letter-spacing:.1em}
#top .r{color:var(--mut);letter-spacing:.14em}
#top .r b{color:var(--acc);font-weight:700}
#bot{position:fixed;bottom:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:baseline;padding:.9em 2.4em 1.15em;font-size:.72em;color:var(--mut)}
#hint{letter-spacing:.14em}
#page{font-size:1.05em;color:var(--ink);letter-spacing:.1em}
#page b{color:var(--acc)}
#prog{position:fixed;bottom:0;left:0;height:2px;width:0;background:var(--acc);z-index:60;transition:width .4s}
button.navb{position:fixed;bottom:.85em;z-index:55;border:1px solid var(--line);background:transparent;width:2.4em;height:2.4em;border-radius:50%;cursor:pointer;font-size:.9em;color:var(--ink);transition:all .2s}
button.navb:hover{background:var(--ink);color:var(--paper)}
#prev{right:7.2em}#next{right:2.4em}
/* 嵌入模式（对比页/目录页用） */
.embed #top,.embed #bot,.embed #prog,.embed .navb,.embed #inkfab{display:none}
.embed .slide{padding:2.4em 3.5vw}

/* ---------- 幻灯片框架 ---------- */
.slide{position:fixed;inset:0;display:none;flex-direction:column;justify-content:center;padding:4.4em 6vw 4.2em;z-index:1}
.slide.on{display:flex;animation:in .5s cubic-bezier(.16,.7,.3,1)}
@keyframes in{from{opacity:0;transform:translateY(.8em)}to{opacity:1;transform:none}}
.wrap{width:min(74em,100%);margin:0 auto}

/* ---------- 文字层级 ---------- */
.kicker{display:flex;align-items:center;gap:1em;font-size:.75em;color:var(--mut);letter-spacing:.2em;margin-bottom:1.1em}
.kicker::before{content:"";width:2.6em;height:1px;background:var(--acc)}
h1{font-size:3.4em;font-weight:900;line-height:1.12;letter-spacing:.02em}
h2{font-size:2em;font-weight:800;letter-spacing:.02em;display:flex;align-items:baseline;gap:.7em}
h2 .no{font-family:Georgia,serif;font-style:italic;color:var(--acc);font-size:.62em;font-weight:400}
.sub{font-size:1.05em;color:var(--mut);letter-spacing:.04em}
.stars{color:var(--acc);letter-spacing:.1em}

/* ---------- 逐步揭示 ---------- */
.rv{opacity:0;transform:translateY(.7em);transition:opacity .45s cubic-bezier(.16,.7,.3,1),transform .45s cubic-bezier(.16,.7,.3,1)}
.rv.show{opacity:1;transform:none}

/* ---------- A1 封面 ---------- */
.cover .wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:3em;align-items:center}
.cover .rule{width:4.5em;height:.3em;background:var(--acc);margin:1.5em 0}
.cover h1{font-size:4.1em}
.cover .en-cap{margin-top:1.2em;font-size:.78em;color:var(--mut)}
.cover .objs{margin-top:2.4em;border-top:var(--hair)}
.cover .objs li{list-style:none;display:flex;gap:1.4em;align-items:baseline;padding:.85em 0;border-bottom:var(--hair);font-size:.98em}
.cover .objs .n{font-family:Georgia,serif;font-style:italic;color:var(--acc);width:2.2em;flex:none}
.cover .fig svg{width:100%;height:auto}
.cover .fig .cap{margin-top:.8em;font-size:.68em;color:var(--mut);letter-spacing:.2em;text-align:center}

/* ---------- A2 目录式路线 ---------- */
.toc{border-top:var(--hair);margin-top:.6em}
.trow{display:grid;grid-template-columns:4.2em 11em 1fr 4.5em;align-items:baseline;gap:1em;padding:1.05em .2em;border-bottom:var(--hair);cursor:pointer;transition:background .2s,padding .2s}
.trow:hover{background:rgba(24,22,17,.045);padding-left:.9em}
.trow .n{font-family:Georgia,serif;font-style:italic;font-size:1.5em;color:var(--acc)}
.trow .t{font-weight:800;font-size:1.12em}
.trow .d{color:var(--mut);font-size:.86em}
.trow .m{font-size:.8em;color:var(--mut);text-align:right;letter-spacing:.08em}

/* ---------- A3 分隔页（黑场） ---------- */
.divider{background:#141310;color:var(--paper)}
.divider .wrap{display:grid;grid-template-columns:auto 1fr;gap:3.2em;align-items:center}
.divider .dno{font-family:Georgia,serif;font-style:italic;font-size:9.5em;line-height:1;color:transparent;-webkit-text-stroke:2px rgba(246,243,234,.55)}
.divider .dt{border-left:1px solid rgba(246,243,234,.3);padding-left:2.2em}
.divider h1{color:var(--paper);font-size:3em}
.divider .tick{width:3.4em;height:.26em;background:var(--acc);margin-bottom:1.1em}
.divider .meta{margin-top:1.6em;font-size:.78em;letter-spacing:.18em;color:rgba(246,243,234,.6)}
.divider .meta b{color:var(--paper)}
.divider .note{margin-top:1.4em;max-width:34em;line-height:1.8;color:rgba(246,243,234,.85);font-size:.95em}

/* ---------- A4 陈述页（核心论点大字） ---------- */
.stmt .wrap{max-width:60em}
.stmt .big{font-family:"Noto Serif SC","Songti SC","STSong",serif;font-size:2.5em;line-height:1.55;font-weight:700}
.stmt .big mark{background:linear-gradient(transparent 64%,rgba(194,69,42,.3) 64%);color:inherit;padding:0 .08em}
.stmt .big u{text-decoration:none;border-bottom:2px solid var(--acc)}
.stmt .foot{margin-top:1.6em;color:var(--mut);font-size:.85em;letter-spacing:.1em}

/* ---------- B1 定义框 ---------- */
.defbox{border:var(--hair);padding:1.2em 1.4em}
.defbox .dt{font-size:.72em;letter-spacing:.24em;color:var(--mut);margin-bottom:.5em}
.defbox p{line-height:1.75;font-size:1em}
.defbox p b{color:var(--acc)}

/* ---------- B2 细线知识表（并列关系） ---------- */
.tbl{display:grid;grid-template-columns:1fr 1fr;border:var(--hair);border-bottom:none}
.cell{border-bottom:var(--hair);padding:1.25em 1.5em 1.35em;display:flex;gap:1.3em;align-items:baseline}
.cell:nth-child(odd){border-right:var(--hair)}
.cell .cn{font-family:Georgia,serif;font-style:italic;color:var(--mut);font-size:1.1em;width:1.9em;flex:none}
.cell .cl{font-weight:800;font-size:1.05em}
.cell .cd{color:var(--ink);opacity:.82;line-height:1.65;font-size:.92em;margin-top:.3em}
.cell .cd b{color:var(--acc)}
.kgrid{display:grid;grid-template-columns:.85fr 1.15fr;gap:2.4em;align-items:start}
.kfig svg{width:100%;height:auto}
.kfig .cap{font-size:.68em;color:var(--mut);letter-spacing:.2em;text-align:center;margin-top:.6em}

/* ---------- B3 判定/步骤路径（递进） ---------- */
.jrow{display:grid;grid-template-columns:3.6em 1fr auto;gap:1.2em;align-items:baseline;padding:.9em .2em;border-bottom:var(--hair)}
.jrow:first-of-type{border-top:var(--hair)}
.jrow .n{font-family:Georgia,serif;font-style:italic;color:var(--acc);font-size:1.3em}
.jrow .c{line-height:1.6}
.jrow .c b{color:var(--acc)}
.jrow .st{font-size:.72em;letter-spacing:.2em;color:var(--mut)}

/* ---------- B4 公式条 ---------- */
.fbar{display:flex;gap:2.6em;flex-wrap:wrap;align-items:baseline;border:var(--hair);padding:1em 1.6em;margin-top:1.3em}
.fbar .fl{font-size:.72em;letter-spacing:.24em;color:var(--mut)}
.fbar .f{font-size:1.15em}
.formula{font-size:1.1em}
.katex{font-size:1.05em}

/* ---------- B5 推导链（因果/演化） ---------- */
.chain{display:flex;align-items:center;flex-wrap:wrap;gap:.2em 0}
.cnode{border:1px solid var(--ink);padding:.55em 1.1em;font-weight:700;background:var(--paper);white-space:nowrap}
.cnode.hot{background:var(--ink);color:var(--paper)}
.carr{display:flex;flex-direction:column;align-items:center;padding:0 .55em}
.carr i{font-style:normal;font-size:.72em;color:var(--acc);white-space:nowrap}
.carr .ln{width:3em;border-top:1.5px solid var(--ink);position:relative}
.carr .ln::after{content:"";position:absolute;right:-.05em;top:-.32em;border-left:.6em solid var(--ink);border-top:.3em solid transparent;border-bottom:.3em solid transparent}

/* ---------- B6 概念关系图（层级/分类） ---------- */
.tree{display:flex;justify-content:center}
.tree svg{width:min(46em,100%);height:auto}

/* ---------- B7 对照表（多维并列比较） ---------- */
table.cmp{border-collapse:collapse;width:100%}
.cmp th,.cmp td{border:var(--hair);padding:.55em .9em;text-align:center;font-size:.88em}
.cmp th{background:rgba(24,22,17,.05);font-weight:800;letter-spacing:.06em}
.cmp td:first-child{text-align:left;font-weight:700}
.cmp .y{color:var(--acc);font-weight:800}
.cmp .n{color:var(--mut)}

/* ---------- B8 提示/警示条 ---------- */
.think{border-left:3px solid var(--acc);padding:.2em 0 .2em 1.2em;line-height:1.75;font-size:.95em}
.think .tl{font-size:.78em;letter-spacing:.2em;color:var(--acc);font-weight:800;margin-bottom:.3em}
.think.gray{border-color:var(--mut)}.think.gray .tl{color:var(--mut)}
.warnline{display:flex;gap:1em;align-items:baseline;font-size:.9em;margin-top:1.1em}
.warnline .w{color:var(--acc);font-weight:800;letter-spacing:.1em;flex:none}

/* ---------- C1 例题 ---------- */
.qgrid{display:grid;grid-template-columns:1.15fr .85fr;gap:3em;align-items:center}
.qtext{font-family:"Noto Serif SC","Songti SC","STSong",serif;font-size:1.5em;line-height:2;font-weight:600}
.qtext .uq{border-bottom:2px solid var(--acc);padding-bottom:.1em}
.qmeta{display:flex;gap:2em;font-size:.75em;letter-spacing:.18em;color:var(--mut);margin-bottom:1.4em}
.qmeta b{color:var(--acc)}

/* ---------- C2 分步解析 ---------- */
.srow{display:grid;grid-template-columns:3.4em 8.5em 1fr;gap:1.4em;align-items:baseline;padding:.85em 0;border-top:var(--hair)}
.srow .n{font-family:Georgia,serif;font-style:italic;font-size:1.6em;color:var(--acc)}
.srow .t{font-weight:800;font-size:1em}
.srow .d{line-height:1.7;color:var(--ink);font-size:.95em}
.srow .d em{font-style:normal;border-bottom:1px solid var(--acc)}
.answerline{margin-top:1.2em;border-top:2px solid var(--ink);padding-top:.9em;display:flex;gap:1.6em;align-items:baseline;font-size:1.15em;font-weight:700}
.answerline .al{font-size:.68em;letter-spacing:.26em;color:var(--acc);font-weight:800}

/* ---------- C2+ 分栏解析：左步骤 + 右联动图 ---------- */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:2.6em;align-items:center}
.split .srow{grid-template-columns:2.8em 6.2em 1fr}
.flow{display:flex;flex-direction:column}
svg g.rv{transition:opacity .45s ease}

/* ---------- C3 易错对照（正误） ---------- */
.erow{display:grid;grid-template-columns:2.6em 1fr 1fr;gap:1.6em;align-items:baseline;padding:1.05em 0;border-top:var(--hair)}
.erow .n{font-family:Georgia,serif;font-style:italic;font-size:1.4em;color:var(--acc)}
.erow .bad{color:var(--mut);text-decoration:line-through;text-decoration-color:var(--acc);line-height:1.6}
.erow .ok{line-height:1.6}
.erow .ok b{color:var(--acc)}
.ex,.cx{font-weight:800;margin-right:.5em}
.ex{color:var(--acc)} .cx{color:var(--ink)}

/* ---------- C4 变式练习（双栏） ---------- */
.vgrid{display:grid;grid-template-columns:1fr 1fr;border:var(--hair)}
.vcell{padding:1.5em 1.7em}
.vcell:first-child{border-right:var(--hair)}
.vcell .vh{font-size:.72em;letter-spacing:.24em;color:var(--mut);margin-bottom:.8em}
.vcell p{line-height:1.8}
.vcell p b{color:var(--acc)}
.key{display:inline-block;margin-top:.7em;border:1px solid var(--ink);padding:.35em 1em;font-weight:700;font-size:.9em}
.say{margin-top:1.3em;border-top:var(--hair);padding-top:1em;font-size:.95em;line-height:1.75}
.say .sl{font-size:.72em;letter-spacing:.24em;color:var(--mut);display:block;margin-bottom:.4em}
.say b{color:var(--acc)}

/* ---------- C5 选择检测（点击判对错） ---------- */
.opts{display:grid;grid-template-columns:1fr 1fr;gap:.7em;margin-top:.9em}
.opt{border:var(--hair);padding:.8em 1em;display:flex;gap:.9em;align-items:baseline;cursor:pointer;transition:background .15s;line-height:1.5}
.opt:hover{background:rgba(24,22,17,.04)}
.opt .ol{font-family:Georgia,serif;font-style:italic;color:var(--acc);font-weight:700;flex:none}
.opt.right{border-color:#1FA97A}
.opt.right::after{content:"✓";color:#1FA97A;font-weight:800;margin-left:auto}
.opt.wrong{border-color:var(--acc)}
.opt.wrong::after{content:"✗";color:var(--acc);font-weight:800;margin-left:auto}
.opt.wrong{opacity:.55}

/* ---------- C6 填空揭答（点击显答案） ---------- */
.blank{display:inline-block;min-width:3em;border-bottom:1.5px dashed var(--ink);text-align:center;color:transparent;cursor:pointer;padding:0 .3em;transition:color .2s}
.blank.on{color:var(--acc);border-bottom-style:solid;font-weight:700}

/* ---------- D1 小结 ---------- */
.recap{display:grid;grid-template-columns:repeat(3,1fr);border:var(--hair)}
.rc{padding:1.4em 1.5em;border-right:var(--hair)}
.rc:last-child{border-right:none}
.rc .rh{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.9em}
.rc .rh b{font-size:1.02em}
.rc .rh span{font-family:Georgia,serif;font-style:italic;color:var(--mut);font-size:.85em}
.rc ul{list-style:none}
.rc li{line-height:1.9;font-size:.92em;color:var(--ink);opacity:.85}
.rc li::before{content:"—";color:var(--acc);margin-right:.6em}
.nextbar{margin-top:1.4em;background:#141310;color:var(--paper);padding:1.15em 1.6em;display:flex;justify-content:space-between;align-items:baseline;gap:2em}
.nextbar b{font-size:1.05em;letter-spacing:.04em}
.nextbar .nx{font-size:.75em;letter-spacing:.2em;color:rgba(246,243,234,.6)}
.nextbar .nx i{font-style:normal;color:var(--acc)}

/* ---------- 讲义小块样式（独立讲义文档用） ---------- */
.t-time{display:inline-block;border:1px solid var(--ink);font-size:.72em;letter-spacing:.12em;padding:.15em .7em;font-weight:700}
.t-ink{border-left:3px solid var(--acc);padding-left:.9em;margin-top:.8em;color:var(--ink)}
.t-ink::before{content:"板书 / INK";display:block;font-size:.68em;letter-spacing:.22em;color:var(--acc);font-weight:800;margin-bottom:.2em}
/* 分步讲稿段：data-rv 编号对应课件中的揭示组 */
.tb-step{border-left:2px solid var(--line);padding:.15em 0 .15em 1em;margin:.7em 0}
.tb-step::before{content:"STEP "attr(data-rv);display:block;font-size:.64em;letter-spacing:.2em;color:var(--mut);font-weight:800;margin-bottom:.15em}

/* ---------- 独立教师讲义翻阅器 *_教师讲义.html（手机优先：电脑讲课、手机看稿） ---------- */
body.handout{overflow:hidden;height:100vh;height:100dvh;display:flex;flex-direction:column}
.hd-top{flex:none;display:flex;justify-content:space-between;align-items:baseline;gap:1em;border-bottom:var(--hair);padding:.85em 1.2em;font-size:.82em}
.hd-top .lt{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-top .lt em{font-style:normal;color:var(--mut);font-weight:400;font-size:.85em}
.hd-top .rp{font-family:Georgia,serif;font-style:italic;color:var(--acc);white-space:nowrap}
.hd-main{flex:1;overflow:auto;-webkit-overflow-scrolling:touch}
.hd-in{max-width:44em;margin:0 auto;padding:1.5em 1.3em 2.5em;font-size:1.02em}
.hp{display:none;line-height:1.85}
.hp.on{display:block;animation:fadein .3s ease}
.hp-h{display:flex;align-items:baseline;gap:.9em;border-bottom:2px solid var(--ink);padding-bottom:.6em;margin-bottom:.8em;flex-wrap:wrap}
.hp-h .pn{font-family:Georgia,serif;font-style:italic;font-size:1.9em;font-weight:800;color:var(--acc)}
.hp-h .ps{font-size:.78em;letter-spacing:.14em;color:var(--mut)}
.hp-h .t-time{margin-left:auto}
.hp-goal{border:var(--hair);border-left:3px solid var(--ink);padding:.45em .9em;margin:0 0 .9em;font-size:.88em}
.hp-goal::before{content:"目标 / GOAL";display:block;font-size:.72em;letter-spacing:.22em;color:var(--mut);font-weight:800;margin-bottom:.1em}
.hp-b h4{font-size:.7em;letter-spacing:.24em;color:var(--mut);margin:1.2em 0 .35em;font-weight:800}
.hp-b h4:first-child{margin-top:.4em}
.hp-b p{margin:.3em 0}
.hp-b ol{padding-left:1.4em;margin:.3em 0}
.hp-b ol li{margin:.2em 0}
.hp-b ul{list-style:none;padding:0}
.hp-b li{padding-left:1.1em;position:relative;margin:.25em 0}
.hp-b li::before{content:"—";color:var(--acc);position:absolute;left:0}
.hp-b b{color:var(--acc)}
.hp-b .tb-step{border-left-color:var(--acc);margin:.85em 0}
.hp-b .tb-step::before{color:var(--acc)}
.hd-nav{flex:none;display:flex;border-top:var(--hair);background:var(--paper)}
.hd-nav>button{flex:1;padding:1em 0;border:none;background:none;font:inherit;font-weight:800;font-size:.95em;letter-spacing:.12em;color:var(--ink);cursor:pointer}
.hd-nav>button:active{background:rgba(24,22,17,.07)}
.hd-nav .mid{flex:none;display:flex;align-items:center;gap:.5em;padding:0 .8em;font-family:Georgia,serif;font-style:italic}
.hd-nav .mid button{border:1px solid var(--ink);background:none;padding:.3em .8em;font:inherit;font-size:.72em;letter-spacing:.1em;cursor:pointer}
/* 目录浮层：课件页码 × 讲义页一一对应 */
.hd-idx{display:none;position:fixed;inset:0;background:var(--paper);z-index:9;overflow:auto;padding:1.6em 1.3em 4em}
body.idx-on .hd-idx{display:block}
.hd-idx .ht{display:flex;justify-content:space-between;align-items:baseline;border-bottom:2px solid var(--ink);padding-bottom:.8em;margin-bottom:.4em;font-weight:800}
.hd-idx a{display:flex;gap:.9em;align-items:baseline;color:var(--ink);text-decoration:none;padding:.8em 0;border-bottom:var(--hair);font-size:1.02em}
.hd-idx a b{font-family:Georgia,serif;font-style:italic;color:var(--acc);font-weight:400;min-width:1.8em}
.hd-idx .x{border:1px solid var(--ink);background:none;padding:.3em .9em;font:inherit;font-size:.8em;cursor:pointer}

/* ---------- 打印 ---------- */
@media print{
  .slide{display:flex !important;position:static;inset:auto;min-height:100vh;page-break-after:always}
  .rv{opacity:1 !important;transform:none !important}
  #top,#bot,#prog,.navb,#inkfab{display:none !important}
  .divider,.nextbar{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  /* 讲义文档打印：去界面家具、全部页块平铺 */
  body.handout{overflow:visible;height:auto;display:block}
  body.handout .hd-top,body.handout .hd-nav,body.handout .hd-idx{display:none !important}
  body.handout .hd-main{overflow:visible}
  body.handout .hp{display:block !important;padding:1.4em 0;border-bottom:var(--hair);break-inside:avoid}
  body.handout .hp-h .pn{font-size:1.4em}
}
