/* 课件平台公共样式 v1.0 · 支持主题色切换 */
:root{
  --acc:#5b4b8a; --dark:#2d2545; --light:#f3effa;
  --ink:#1a2332; --bg:#faf8f4; --card:#fff; --line:#e8e2d8;
  --gold:#b08d3e; --ok:#2e7d52; --bad:#c0392b;
}
[data-theme="blue"]{--acc:#1d5c7a;--dark:#0f3446;--light:#e8f2f7;--bg:#f6f9fa;--line:#dde8ec}
[data-theme="green"]{--acc:#2e7d52;--dark:#14432b;--light:#e8f5ec;--bg:#f6faf7;--line:#d8e8de}
[data-theme="red"]{--acc:#a83b4a;--dark:#5c1d26;--light:#fbeef0;--bg:#fdf8f8;--line:#eedde0}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{font-family:-apple-system,"PingFang SC","Noto Sans SC",sans-serif;background:var(--bg);color:var(--ink);line-height:1.85;font-size:16px}
.wrap{max-width:640px;margin:0 auto;padding:0 18px 80px}
header.course-hd{background:linear-gradient(135deg,var(--dark) 0%,var(--acc) 70%,color-mix(in srgb,var(--acc) 70%,#fff) 100%);color:#fff;padding:44px 22px 36px;text-align:center}
header.course-hd .tag{display:inline-block;border:1px solid rgba(255,255,255,.4);border-radius:20px;padding:2px 14px;font-size:12px;letter-spacing:2px;margin-bottom:14px;opacity:.9}
header.course-hd h1{font-size:26px;font-weight:700;letter-spacing:1px}
header.course-hd p{margin-top:10px;font-size:14px;opacity:.85}
.backbar{max-width:640px;margin:0 auto;padding:12px 18px 4px;position:relative;z-index:5}
.backbar a{background:rgba(255,255,255,.92);backdrop-filter:blur(4px)}
.backbar a{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#8a8fa3;text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:20px;padding:5px 14px}
.toc{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin-top:10px;position:relative;box-shadow:0 4px 14px rgba(30,20,60,.1)}
.toc a{display:flex;gap:10px;padding:7px 0;color:var(--ink);text-decoration:none;font-size:15px;border-bottom:1px dashed #eee}
.toc a:last-child{border:none}
.toc a .t-no{color:var(--gold);font-weight:700;font-size:13px;width:20px;flex:none}
.sec{margin-top:34px}
.sec-head{display:flex;align-items:baseline;gap:10px;border-bottom:2px solid var(--acc);padding-bottom:8px;margin-bottom:16px}
.sec-head .no{font-size:13px;color:var(--gold);font-weight:700;letter-spacing:1px}
.sec-head h2{font-size:20px;font-weight:700}
.audio-bar{display:flex;align-items:center;gap:12px;background:var(--light);border:1px solid color-mix(in srgb,var(--acc) 25%,#fff);border-radius:14px;padding:12px 14px;margin:14px 0}
.audio-bar .ab-icon{width:38px;height:38px;flex:none;border-radius:50%;background:var(--acc);display:flex;align-items:center;justify-content:center}
.audio-bar .ab-icon svg{width:16px;height:16px;fill:#fff}
.audio-bar .ab-info{flex:1;min-width:0}
.audio-bar .ab-title{font-size:14px;font-weight:600;color:var(--acc)}
.audio-bar audio{width:100%;height:36px;margin-top:4px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;margin:14px 0;box-shadow:0 1px 4px rgba(30,20,60,.05)}
.card h3{font-size:16px;color:var(--acc);margin-bottom:8px}
p.txt{margin:10px 0}
.eq{background:color-mix(in srgb,var(--light) 60%,#f2f0ea);border-radius:10px;padding:12px 14px;text-align:center;font-size:17px;margin:12px 0;overflow-x:auto;white-space:nowrap;font-family:"Times New Roman",serif}
.eq sub{font-size:11px}
.cond{font-size:11px;vertical-align:super;color:#666;font-family:-apple-system,"PingFang SC",sans-serif}
.hl{background:linear-gradient(transparent 62%,color-mix(in srgb,var(--acc) 28%,#fff) 62%);font-weight:600}
.key{background:linear-gradient(135deg,var(--dark),var(--acc));color:#fff;border-radius:14px;padding:18px 20px;margin:16px 0;font-size:17px;line-height:1.9}
.key .k-tag{font-size:12px;letter-spacing:2px;color:color-mix(in srgb,var(--light) 80%,#d4c48a);display:block;margin-bottom:6px}
.qbox{background:#fff;border-left:4px solid var(--gold);border-radius:0 12px 12px 0;padding:12px 16px;margin:10px 0;font-size:15px}
.qbox .q-no{font-weight:700;color:var(--gold);margin-right:6px}
.math{border:1.5px dashed var(--gold);border-radius:14px;margin:14px 0;overflow:hidden}
.math summary{list-style:none;cursor:pointer;padding:13px 16px;font-weight:600;color:var(--gold);display:flex;align-items:center;gap:8px;background:#fdfaf2}
.math summary::-webkit-details-marker{display:none}
.math summary::after{content:"展开 ▾";margin-left:auto;font-size:12px;font-weight:400;color:#999}
.math[open] summary::after{content:"收起 ▴"}
.math .m-body{padding:4px 16px 16px;background:#fffdf7;font-size:15px}
.quiz{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;margin:16px 0}
.quiz .q-tag{display:inline-block;background:var(--acc);color:#fff;font-size:12px;border-radius:6px;padding:2px 10px;margin-bottom:10px}
.quiz .q-stem{font-weight:600;margin-bottom:12px}
.opt{display:block;width:100%;text-align:left;background:color-mix(in srgb,var(--light) 55%,#fff);border:1.5px solid var(--line);border-radius:10px;padding:11px 14px;margin:8px 0;font-size:15px;color:var(--ink);cursor:pointer;transition:.15s}
.opt.correct{background:#e8f5ec;border-color:var(--ok);color:var(--ok);font-weight:600}
.opt.wrong{background:#fdecea;border-color:var(--bad);color:var(--bad)}
.fb{display:none;border-radius:10px;padding:12px 14px;margin-top:10px;font-size:14px;line-height:1.7}
.fb.show{display:block}
.fb.good{background:#e8f5ec;color:#1d5c38}
.fb.bad{background:#fdecea;color:#8f2b20}
.steps .step{border-left:3px solid color-mix(in srgb,var(--acc) 30%,#fff);padding:10px 0 10px 16px;margin-left:8px;position:relative;display:none}
.steps .step.on{display:block;animation:fadein .3s}
.steps .step::before{content:attr(data-n);position:absolute;left:-13px;top:12px;width:24px;height:24px;border-radius:50%;background:var(--acc);color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center;font-weight:700}
.steps .step .s-name{font-weight:700;color:var(--acc);font-size:15px}
.next-btn{display:block;width:100%;background:var(--acc);color:#fff;border:none;border-radius:12px;padding:13px;font-size:16px;font-weight:600;margin-top:12px;cursor:pointer}
.next-btn.done{background:#aaa}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.pit{display:flex;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;margin:10px 0;font-size:15px}
.pit .p-no,.pit .p-ic{flex:none;width:28px;height:28px;border-radius:50%;background:#fdecea;color:var(--bad);font-weight:700;display:flex;align-items:center;justify-content:center;font-size:14px}
.pit b{color:var(--bad)}
.vs{display:flex;gap:10px;margin:12px 0}
.vs>div{flex:1;border-radius:12px;padding:12px;font-size:14px;line-height:1.7}
.vs .v-l{background:var(--light);border:1px solid color-mix(in srgb,var(--acc) 22%,#fff)}
.vs .v-r{background:#fdf6e8;border:1px solid #ecd9ad}
.vs b{display:block;margin-bottom:4px}
.warn{background:#fdf6e8;border:1.5px dashed var(--gold);border-radius:12px;padding:13px 16px;margin:12px 0;font-size:14px;line-height:1.8}
.warn b{color:var(--gold)}
.check3{background:#f0f7f2;border:1px solid #cfe5d6;border-radius:12px;padding:14px 16px;margin:12px 0;font-size:15px}
.check3 b{color:var(--ok)}
.floors .floor{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:8px 0;display:flex;gap:12px;align-items:flex-start}
.floors .floor .f-no{flex:none;font-size:22px}
.flow .f-step{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 16px;margin:0 0 4px}
.flow .f-step .f-q{font-weight:700;color:var(--acc)}
.flow .f-step .f-out{font-size:13px;color:var(--bad);margin-top:4px}
.flow .f-arrow{text-align:center;color:var(--acc);font-size:18px;margin:2px 0}
table.knot{width:100%;border-collapse:collapse;font-size:14px;margin:12px 0}
table.knot th{background:var(--acc);color:#fff;padding:8px;font-weight:600}
table.knot td{border:1px solid var(--line);padding:8px;background:#fff}
table.ratio{margin:10px auto;border-collapse:collapse;font-family:"Times New Roman",serif;font-size:16px}
table.ratio td{padding:4px 16px;text-align:center}
table.ratio tr.r1 td{font-weight:600}
table.ratio tr.r2 td{color:var(--acc);border-top:1px solid #ddd}
footer{text-align:center;padding:40px 20px 30px;color:#999;font-size:12px;line-height:2}
