
:root{
  --ink:#17242d;--muted:#5f6f78;--paper:#f6f1e7;--paper-2:#fffdf8;
  --navy:#24465a;--blue:#53788b;--teal:#6f918f;--gold:#b08a4a;
  --rust:#8b5c44;--line:#d8d1c4;--ok:#2f6e59;--warn:#9a5f27;
  --shadow:0 18px 50px rgba(33,45,51,.12);--radius:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:linear-gradient(180deg,#f2ede3 0,#faf8f3 22rem,#f7f4ed 100%);color:var(--ink);font-family:"Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;line-height:1.75}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
img,svg{max-width:100%;display:block}
.site-header{position:sticky;top:0;z-index:50;background:rgba(246,241,231,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(36,70,90,.12)}
.nav-wrap{max-width:1220px;margin:auto;display:flex;align-items:center;gap:18px;padding:12px 22px}
.brand{font-weight:900;letter-spacing:.06em;color:var(--navy);white-space:nowrap}.brand small{display:block;font-size:.66rem;color:var(--muted);letter-spacing:.12em}
.nav-links{display:flex;gap:8px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.nav-link,.back-btn{border:1px solid rgba(36,70,90,.15);background:rgba(255,255,255,.58);padding:8px 14px;border-radius:999px;font-size:.92rem}.nav-link:hover,.back-btn:hover{background:#fff;border-color:rgba(36,70,90,.35)}
main{overflow:hidden}.container{width:min(1180px,calc(100% - 36px));margin:auto}
.hero{position:relative;min-height:620px;display:grid;align-items:center;padding:70px 0 58px;background:#1d3b4b;color:white;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,38,50,.96) 0%,rgba(16,38,50,.78) 44%,rgba(16,38,50,.18) 74%,rgba(16,38,50,.08) 100%);z-index:-1}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 82% 28%,rgba(216,183,116,.28),transparent 24%),linear-gradient(0deg,rgba(18,33,41,.48),transparent 50%);z-index:-1}
.hero-visual{position:absolute;inset:0;z-index:-2;background-position:center;background-size:cover}
.hero-content{max-width:700px}.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:#f0d79f;font-weight:800}.eyebrow::before{content:"";width:38px;height:2px;background:#f0d79f}
h1{font-size:clamp(2.5rem,6vw,5.4rem);line-height:1.08;margin:18px 0 18px;letter-spacing:-.04em}.hero h2{font-size:clamp(1.35rem,2.5vw,2.1rem);line-height:1.35;margin:0 0 24px;font-weight:700;color:#f4ead6}.lead{font-size:1.08rem;max-width:62ch;color:rgba(255,255,255,.88)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:12px 20px;font-weight:800;cursor:pointer;transition:.2s}.btn-primary{background:#f0d79f;color:#1d3b4b}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,0,0,.2)}.btn-secondary{background:rgba(255,255,255,.12);color:white;border:1px solid rgba(255,255,255,.3)}
.visual-label{position:absolute;right:22px;bottom:18px;background:rgba(10,27,35,.72);border:1px solid rgba(255,255,255,.25);color:#fff;padding:5px 10px;border-radius:999px;font-size:.75rem}
.section{padding:78px 0}.section.alt{background:rgba(255,255,255,.58);border-block:1px solid rgba(36,70,90,.08)}
.section-head{max-width:850px;margin-bottom:34px}.kicker{color:var(--rust);font-weight:900;letter-spacing:.08em;font-size:.8rem}.section h2{font-size:clamp(1.9rem,3.5vw,3rem);line-height:1.2;color:var(--navy);margin:8px 0 14px}.section-intro{font-size:1.08rem;color:var(--muted)}
.question-box{background:linear-gradient(135deg,#24465a,#335f70);color:white;border-radius:var(--radius);padding:32px;box-shadow:var(--shadow)}.question-box strong{color:#f0d79f}.question-box blockquote{font-size:clamp(1.35rem,2.3vw,2rem);font-weight:800;line-height:1.45;margin:0}
.grid{display:grid;gap:20px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:var(--paper-2);border:1px solid rgba(36,70,90,.11);border-radius:20px;padding:24px;box-shadow:0 10px 30px rgba(33,45,51,.06)}.card h3{margin:0 0 10px;color:var(--navy);font-size:1.22rem}.card p{margin:0;color:var(--muted)}
.stage-card{position:relative;overflow:hidden;min-height:255px;display:flex;flex-direction:column;justify-content:flex-end;color:white;background:#2a5265;border-radius:22px;padding:22px}.stage-card::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(16,35,44,.95),rgba(16,35,44,.05));z-index:0}.stage-card>*{position:relative;z-index:1}.stage-no{position:absolute;top:16px;left:18px;font-size:2.5rem;font-weight:900;color:rgba(255,255,255,.28)}.stage-time{font-size:.78rem;color:#efd69e;font-weight:800}.stage-card h3{margin:5px 0 6px;font-size:1.35rem}.stage-card p{margin:0;font-size:.92rem;color:rgba(255,255,255,.78)}
.timeline{position:relative;margin-top:24px}.timeline::before{content:"";position:absolute;left:21px;top:0;bottom:0;width:2px;background:linear-gradient(var(--gold),var(--blue))}.timeline-item{position:relative;padding:0 0 32px 62px}.timeline-dot{position:absolute;left:8px;top:3px;width:28px;height:28px;border-radius:50%;background:var(--paper-2);border:7px solid var(--gold);box-shadow:0 0 0 4px rgba(176,138,74,.15)}.timeline-item h3{margin:0;color:var(--navy)}.timeline-time{font-weight:900;color:var(--rust)}
.thread-card{border-left:5px solid var(--teal)}.thread-no{font-size:.72rem;font-weight:900;color:var(--rust);letter-spacing:.08em}
.map-panel,.diagram-panel{background:#e9e3d7;border:1px solid rgba(36,70,90,.12);border-radius:24px;overflow:hidden;position:relative}.map-panel img,.diagram-panel img{width:100%;height:auto}.map-caption{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:14px 18px;background:rgba(255,255,255,.8);font-size:.84rem;color:var(--muted)}
.lesson-card{display:grid;grid-template-columns:130px 1fr;gap:20px;align-items:center;background:var(--paper-2);padding:18px;border:1px solid rgba(36,70,90,.12);border-radius:22px;transition:.2s}.lesson-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.lesson-thumb{height:110px;border-radius:16px;overflow:hidden;background:#315969}.lesson-thumb img{width:100%;height:100%;object-fit:cover}.lesson-meta{font-size:.78rem;font-weight:900;color:var(--rust)}.lesson-card h3{margin:3px 0 4px;color:var(--navy)}.lesson-card p{margin:0;color:var(--muted)}
.lesson-shell{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:30px;align-items:start}.lesson-nav{position:sticky;top:84px;background:var(--paper-2);border:1px solid rgba(36,70,90,.12);border-radius:20px;padding:18px}.lesson-nav h3{margin:0 0 8px;color:var(--navy)}.lesson-nav a{display:block;padding:7px 9px;border-radius:10px;color:var(--muted);font-size:.9rem}.lesson-nav a:hover,.lesson-nav a.active{background:#edf1ef;color:var(--navy);font-weight:800}.progress-line{height:8px;background:#e4ded2;border-radius:99px;overflow:hidden;margin:14px 0}.progress-line span{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--gold));width:0;transition:.35s}
.content-block{padding:30px;background:var(--paper-2);border:1px solid rgba(36,70,90,.1);border-radius:24px;margin-bottom:24px}.content-block h2{font-size:clamp(1.55rem,3vw,2.35rem);margin:0 0 16px;color:var(--navy)}.content-block h3{color:var(--navy)}.content-block p{font-size:1.02rem}.content-block .key-line{font-size:1.2rem;font-weight:800;color:var(--rust);border-left:4px solid var(--gold);padding-left:16px}
.callout{border-radius:18px;padding:20px;margin:20px 0}.callout.info{background:#e9f0f1;border:1px solid #cbdadd}.callout.warn{background:#f6eadc;border:1px solid #e6cfb3}.callout.good{background:#e5efea;border:1px solid #c6dbd1}.callout h4{margin:0 0 6px;color:var(--navy)}
.evidence-card{background:#fbf5e9;border:1px solid #dfcfb3;border-radius:20px;overflow:hidden;margin:22px 0}.evidence-head{padding:16px 20px;background:#e8dac0;display:flex;justify-content:space-between;gap:16px;align-items:center}.evidence-head strong{color:#5e4328}.evidence-grade{font-size:.74rem;border:1px solid #9d7f54;border-radius:999px;padding:4px 9px}.evidence-body{padding:20px}.evidence-sides{display:grid;grid-template-columns:1fr 1fr;gap:14px}.evidence-side{border-radius:14px;padding:15px}.evidence-side.can{background:#e4eee7}.evidence-side.cannot{background:#f2e6dc}.evidence-side h4{margin:0 0 6px;color:var(--navy)}
.interaction{background:#1f4253;color:white;border-radius:22px;padding:24px;margin:24px 0;box-shadow:var(--shadow)}.interaction h3{margin:0 0 6px;color:#fff}.interaction .instruction{color:rgba(255,255,255,.75);margin:0 0 16px}.options{display:grid;gap:10px}.option-btn{width:100%;text-align:left;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:white;padding:12px 14px;border-radius:13px;cursor:pointer}.option-btn:hover,.option-btn.selected{background:rgba(255,255,255,.18);border-color:#efd69e}.option-btn.correct{background:rgba(82,147,116,.42);border-color:#b8e2cb}.option-btn.wrong{background:rgba(170,79,59,.38);border-color:#f0b5aa}.interaction-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.check-btn{background:#efd69e;color:#203d4a;border:0;border-radius:999px;padding:10px 17px;font-weight:900;cursor:pointer}.reset-btn{background:transparent;color:white;border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:9px 16px;cursor:pointer}.feedback{display:none;margin-top:15px;padding:13px 15px;border-radius:13px;background:rgba(255,255,255,.1)}.feedback.show{display:block}.mini-question{padding:15px 0;border-top:1px solid rgba(255,255,255,.15)}.mini-question:first-child{border-top:0}
.compare-grid{display:grid;grid-template-columns:150px 1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden;margin:20px 0}.compare-grid>div{background:var(--paper-2);padding:15px}.compare-grid .head{background:#315969;color:white;font-weight:900}.compare-grid .dimension{font-weight:900;color:var(--navy);background:#ece7dc}
.pill-list{display:flex;gap:9px;flex-wrap:wrap}.pill{padding:7px 12px;border-radius:999px;background:#e8ece9;color:var(--navy);font-weight:700;font-size:.88rem}
.summary-box{background:linear-gradient(135deg,#6f918f,#24465a);color:white;border-radius:24px;padding:30px}.summary-box h2{color:white}.summary-box .big-idea{font-size:1.35rem;font-weight:900;color:#f5deb1}
.page-nav{display:flex;justify-content:space-between;gap:16px;margin:34px 0}.page-nav a{flex:1;background:var(--paper-2);border:1px solid rgba(36,70,90,.14);border-radius:18px;padding:17px}.page-nav a:last-child{text-align:right}.page-nav small{display:block;color:var(--muted)}
.footer{padding:40px 0;border-top:1px solid rgba(36,70,90,.12);color:var(--muted);font-size:.88rem}.footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.toast{position:fixed;right:20px;bottom:20px;background:#1f4253;color:white;padding:13px 17px;border-radius:14px;box-shadow:var(--shadow);transform:translateY(100px);opacity:0;transition:.25s;z-index:100}.toast.show{transform:translateY(0);opacity:1}
@media(max-width:900px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}.lesson-shell{grid-template-columns:1fr}.lesson-nav{position:relative;top:auto;order:-1}.hero{min-height:570px}.compare-grid{grid-template-columns:110px 1fr 1fr;font-size:.9rem}}
@media(max-width:650px){.nav-wrap{padding:10px 14px}.nav-links{display:none}.container{width:min(100% - 24px,1180px)}.hero{min-height:640px;padding:54px 0}.hero::before{background:linear-gradient(180deg,rgba(16,38,50,.55),rgba(16,38,50,.95) 65%)}.hero-content{padding-top:160px}.visual-label{right:12px;bottom:12px}.section{padding:54px 0}.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.lesson-card{grid-template-columns:90px 1fr}.lesson-thumb{height:90px}.evidence-sides{grid-template-columns:1fr}.content-block{padding:22px}.compare-grid{grid-template-columns:1fr}.compare-grid .head:nth-child(2),.compare-grid .head:nth-child(3){display:none}.compare-grid .dimension{border-top:6px solid var(--line)}.page-nav{flex-direction:column}.page-nav a:last-child{text-align:left}}


/* V0.1.1：接入天智清醒历史全站导航 */
.global-nav { display:flex; align-items:center; gap:6px; margin-left:auto; }
.global-nav a { padding:8px 11px; border-radius:10px; color:rgba(255,255,255,.82); font-size:.88rem; font-weight:700; }
.global-nav a:hover,.global-nav a:focus-visible { color:#fff; background:rgba(255,255,255,.11); }
@media(max-width:650px){.global-nav{display:none}.brand{margin-right:auto}.nav-wrap{gap:10px}}


/* V0.2.0：第二课史料来源与因果分层 */
.source-meta{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:14px;padding-top:13px;border-top:1px dashed rgba(94,67,40,.25);font-size:.84rem;color:#695942}
.source-link{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#fffaf0;border:1px solid #d9c6a7;color:#5e4328;font-weight:800}
.source-link:hover{background:#fff;border-color:#9d7f54}
.fact-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0}
.fact-strip>div{background:#edf1ef;border:1px solid rgba(36,70,90,.1);border-radius:16px;padding:14px}.fact-strip strong{display:block;color:var(--rust);font-size:1.05rem}.fact-strip span{font-size:.87rem;color:var(--muted)}
@media(max-width:760px){.fact-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.fact-strip{grid-template-columns:1fr}}


/* V0.3.0：第三课战争系统诊断 */
.diagnosis-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0}
.diagnosis-card{display:flex;flex-direction:column;gap:6px;background:#edf1ef;border:1px solid rgba(36,70,90,.12);border-radius:17px;padding:16px}
.diagnosis-card strong{color:var(--rust);font-size:1.02rem}.diagnosis-card span{color:var(--muted);font-size:.9rem}
@media(max-width:820px){.diagnosis-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.diagnosis-grid{grid-template-columns:1fr}}


/* V0.4.0：第四课条约阅读 */
.clause-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:20px 0}.clause-card{background:#f4eee2;border:1px solid rgba(86,66,43,.17);border-radius:18px;padding:17px;min-height:170px}.clause-card>span{display:inline-flex;padding:4px 9px;border-radius:999px;background:#24465a;color:#fff;font-size:.78rem;font-weight:750}.clause-card h3{margin:12px 0 8px;color:var(--rust);font-size:1.05rem}.clause-card p{font-size:.9rem;color:var(--muted)}
.sequence-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:20px 0}.sequence-strip article{display:flex;align-items:center;gap:14px;background:#edf1ef;border:1px solid rgba(36,70,90,.14);border-radius:17px;padding:17px}.sequence-strip strong{font-size:1.45rem;color:var(--rust)}.sequence-strip span{color:var(--ink);font-weight:650}
@media(max-width:1050px){.clause-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:720px){.clause-grid{grid-template-columns:1fr 1fr}.sequence-strip{grid-template-columns:1fr}}@media(max-width:470px){.clause-grid{grid-template-columns:1fr}}


/* V0.5.0：第五课历史分期与概念辨析 */
.turning-point-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:20px 0}.turning-point-strip article{background:#edf1ef;border:1px solid rgba(36,70,90,.13);border-radius:18px;padding:17px}.turning-point-strip strong{display:block;color:var(--rust);font-size:1.05rem;margin-bottom:6px}.turning-point-strip span{color:var(--muted);font-size:.9rem}
.change-layer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0}.change-layer-grid article{background:#f4eee2;border:1px solid rgba(86,66,43,.16);border-radius:18px;padding:18px}.change-layer-grid article>span{display:inline-flex;padding:4px 10px;border-radius:999px;background:#24465a;color:#fff;font-size:.78rem;font-weight:800}.change-layer-grid h3{margin:12px 0 7px}.change-layer-grid p{font-size:.92rem;color:var(--muted)}
.concept-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}.concept-grid article{background:#edf1ef;border:1px solid rgba(36,70,90,.13);border-radius:18px;padding:19px}.concept-grid h3{margin-top:0}.concept-grid p{color:var(--muted)}
.chapter-review{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:22px 0}.chapter-review article{background:#edf1ef;border:1px solid rgba(36,70,90,.12);border-radius:17px;padding:15px}.chapter-review strong{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--rust);color:#fff}.chapter-review h3{font-size:1rem;margin:10px 0 5px}.chapter-review p{font-size:.86rem;color:var(--muted)}
@media(max-width:1000px){.chapter-review{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.turning-point-strip,.change-layer-grid{grid-template-columns:1fr}.concept-grid{grid-template-columns:1fr}.chapter-review{grid-template-columns:1fr 1fr}}@media(max-width:470px){.chapter-review{grid-template-columns:1fr}}


/* V0.6.0：第二章入口与第六课 */
.factor-chain{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:22px 0}.factor-chain article{position:relative;background:#edf1ef;border:1px solid rgba(36,70,90,.13);border-radius:18px;padding:18px}.factor-chain article:not(:last-child)::after{content:"→";position:absolute;right:-18px;top:42%;z-index:2;color:var(--rust);font-size:1.45rem;font-weight:900}.factor-chain strong{display:block;color:var(--rust);margin-bottom:7px}.factor-chain p{font-size:.9rem;color:var(--muted)}
.source-type-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:20px 0}.source-type-row article{background:#f4eee2;border:1px solid rgba(86,66,43,.16);border-radius:18px;padding:17px}.source-type-row h3{margin-top:0}.source-type-row p{color:var(--muted);font-size:.92rem}
.chapter-bridge{display:flex;align-items:center;justify-content:space-between;gap:18px;background:#173746;color:#fff;border-radius:22px;padding:22px 24px;margin:24px 0}.chapter-bridge p{margin:0;color:#dce7e6}.chapter-bridge .btn{flex:0 0 auto}
@media(max-width:900px){.factor-chain{grid-template-columns:1fr 1fr}.factor-chain article:nth-child(2)::after{display:none}.source-type-row{grid-template-columns:1fr}}
@media(max-width:620px){.factor-chain{grid-template-columns:1fr}.factor-chain article::after{display:none}.chapter-bridge{display:block}.chapter-bridge .btn{margin-top:14px}}


/* V0.7.0：第七课《太平天国的理想与困境》 */
.policy-layers{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:20px 0}.policy-layers article{background:#edf1ef;border:1px solid rgba(36,70,90,.13);border-radius:18px;padding:16px;min-height:135px}.policy-layers strong{display:block;color:var(--rust);margin-bottom:8px}.policy-layers p{font-size:.9rem;color:var(--muted)}
.plan-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}.plan-pair article{background:#f4eee2;border:1px solid rgba(86,66,43,.16);border-radius:20px;padding:20px}.plan-pair h3{margin-top:0}.plan-pair ul{padding-left:1.2rem;color:var(--muted)}
@media(max-width:900px){.policy-layers{grid-template-columns:1fr 1fr}.plan-pair{grid-template-columns:1fr}}
@media(max-width:620px){.policy-layers{grid-template-columns:1fr}}


/* V0.8.0：第八课《第二次鸦片战争》 */
.treaty-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:22px 0}.treaty-steps article{background:#f4eee2;border:1px solid rgba(86,66,43,.16);border-radius:20px;padding:20px;min-height:180px}.treaty-steps h3{margin-top:0;color:var(--rust)}.role-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}.role-grid article{background:#edf1ef;border:1px solid rgba(36,70,90,.13);border-radius:20px;padding:20px}.role-grid h3{margin-top:0}
@media(max-width:820px){.treaty-steps{grid-template-columns:1fr}.role-grid{grid-template-columns:1fr}}


/* V0.9.0：第九课《洋务运动》 */
.system-note{background:#eef1ed;border-left:5px solid var(--teal);padding:18px 20px;border-radius:0 18px 18px 0;margin:20px 0}.comparison-band{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}.comparison-band article{background:#f4eee2;border:1px solid rgba(86,66,43,.16);border-radius:20px;padding:20px}.comparison-band h3{margin-top:0;color:var(--rust)}
@media(max-width:820px){.comparison-band{grid-template-columns:1fr}}


/* V1.0.0：第十课《近代工业怎样出现》 */
.process-list{display:grid;gap:14px;margin:20px 0}.process-list article{display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:start;background:#f4eee2;border:1px solid rgba(86,66,43,.16);border-radius:18px;padding:16px 18px}.process-list b{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--navy);color:white}.process-list h3{margin:2px 0 6px;color:var(--rust)}


/* V1.1.0：第三章与第十一课《甲午中日战争》 */
.system-note{border-left:5px solid var(--gold);background:#f4eee2;padding:16px 18px;border-radius:0 16px 16px 0;margin:18px 0}.system-note strong{color:var(--rust)}


/* V1.2.0：第十二课《马关条约》与民族危机 */
.treaty-quote{background:#f3e6c9;border:1px solid #c8b99f;border-radius:18px;padding:18px 20px;margin:18px 0}.treaty-quote strong{color:var(--rust)}


/* V1.3.0：第十三课戊戌变法 */
.reform-chain{background:#f3e6c9;border:1px solid #c8b99f;border-radius:18px;padding:18px 20px;margin:18px 0}.reform-chain strong{color:var(--rust)}
