:root{--bg:#f7f5ee;--paper:#fffef9;--ink:#273d34;--muted:#788078;--green:#31594d;--light:#e7ece2;--line:#e3e4d9;--gold:#ac7942}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.65}button,input,textarea,select{font:inherit}button,a,input,select{touch-action:manipulation}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #bb925a;outline-offset:3px}a{color:var(--green)}button{border:0;background:none;color:inherit}h1,h2,h3,p{margin:0}h1,h2,.serif{font-family:Georgia,"Songti SC",STSong,serif}h1{font-size:30px;line-height:1.4;font-weight:600;letter-spacing:1px}h2{font-size:22px;font-weight:600}h3{font-size:16px}small,.muted{color:var(--muted)}.shell{max-width:1060px;margin:auto;padding:32px 32px 120px}.top{display:flex;align-items:center;justify-content:space-between;margin-bottom:35px}.brand{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:600;letter-spacing:3px}.brand img{width:37px;height:37px}.brand small{font-size:11px;letter-spacing:2px;font-weight:400}.round{border:1px solid var(--line);width:42px;height:42px;border-radius:50%;font-size:19px;background:var(--paper)}.eyebrow{color:var(--gold);font-size:11px;letter-spacing:2px;margin-bottom:10px}.greeting{margin-bottom:25px}.greeting p{margin-top:8px;color:var(--muted)}.grid{display:grid;grid-template-columns:1.3fr 1fr;gap:22px;align-items:start}.hero{position:relative;overflow:hidden;background:#e8ede3;border:1px solid #dbe2d5;border-radius:22px;padding:28px;min-height:265px}.hero:after{content:'史';position:absolute;right:12px;top:-28px;font-family:STSong,serif;font-size:240px;color:#31594d09;pointer-events:none}.hero h2{font-size:29px;max-width:290px;line-height:1.55;position:relative}.hero p{color:#637163;margin:14px 0 24px;max-width:290px}.pill{display:inline-flex;align-items:center;gap:6px;background:#fff9;padding:4px 11px;font-size:11px;border-radius:20px;margin-bottom:15px}.primary{display:inline-flex;align-items:center;justify-content:center;gap:24px;border-radius:12px;background:var(--green);color:white;padding:13px 20px;min-height:47px;font-weight:500;text-decoration:none}.primary:disabled{opacity:.6}.section-head{display:flex;justify-content:space-between;align-items:center;margin:25px 0 14px}.section-head span{font-size:12px;color:var(--muted)}.card{border:1px solid var(--line);border-radius:17px;background:var(--paper);padding:21px;margin-bottom:14px}.step{display:flex;gap:16px;align-items:center}.step .number{border-radius:12px;background:var(--light);min-width:43px;height:45px;display:grid;place-items:center;color:#5b715c;font-family:Georgia,serif;font-size:21px}.step p{font-size:12px;color:var(--muted);margin-top:4px}.step .arrow{margin-left:auto;color:var(--muted)}.week{display:flex;justify-content:space-between;margin:19px 0 10px}.day{font-size:11px;text-align:center;color:var(--muted)}.day b{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;margin-top:8px;background:#f0f0e8;font-weight:400}.day.active b{background:var(--green);color:white}.day.done b{background:#dfe8d5;color:var(--green)}.quote{padding:20px 5px;color:#8c8f7e;font-size:13px}.quote span{display:block;margin-top:8px;color:#a0a391;font-size:11px}.nav{position:fixed;bottom:0;left:0;right:0;border-top:1px solid var(--line);background:#fffef9f5;backdrop-filter:blur(16px);padding:9px 10px max(12px,env(safe-area-inset-bottom));display:flex;justify-content:center;gap:50px;z-index:10}.nav button{display:flex;flex-direction:column;align-items:center;gap:2px;color:#90968b;min-width:65px;min-height:50px;font-size:11px}.nav button i{font-size:22px;font-style:normal;line-height:1.3}.nav button.active{color:var(--green);font-weight:600}.content{max-width:720px;margin:auto}.back{display:block;padding:9px 0;margin-bottom:16px;color:var(--muted)}.reading{white-space:pre-line;font-size:16px;line-height:2.1}.resource{background:#e9eee3}.resource a{display:inline-block;margin-top:12px;font-size:14px;font-weight:600}.label{display:block;font-size:13px;margin-bottom:8px;font-weight:500}.question{margin:22px 0}.options{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px}.option{border:1px solid var(--line);border-radius:12px;padding:11px 15px;min-height:45px;background:var(--paper)}.option.selected{background:var(--light);border-color:var(--green);color:var(--green)}.explanation{font-size:13px;color:#607050;margin-top:9px}.error{color:#a34e39}.field{width:100%;border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:12px;min-height:46px;color:var(--ink)}textarea.field{resize:vertical;min-height:110px}.row{display:flex;gap:12px;align-items:center}.row>*{flex:1}.spaced{margin-top:20px}.timeline{margin-top:24px}.era{position:relative;border-left:1px solid #cdd8c5;padding:0 0 25px 28px;margin-left:10px}.era:before{content:'';position:absolute;left:-5px;top:7px;width:9px;height:9px;background:#a6b49b;border-radius:50%}.era h3{font-size:18px;font-family:STSong,serif}.era p{font-size:13px;color:var(--muted);margin-top:5px}.tag{font-size:11px;color:var(--gold);display:inline-block;margin-top:7px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:24px 0}.stat{background:var(--light);border-radius:15px;padding:19px 8px;text-align:center}.stat strong{display:block;font-size:28px;font-weight:400;font-family:Georgia,serif}.stat span{font-size:11px;color:var(--muted)}.empty{padding:35px 22px;text-align:center;border:1px dashed #ccd5c5;border-radius:18px}.empty p{margin-top:10px;color:var(--muted);font-size:13px}.note{white-space:pre-wrap;margin-top:14px;overflow-wrap:anywhere}.smallbtn{padding:8px 12px;border:1px solid var(--line);border-radius:9px;font-size:12px}.notice{border-left:3px solid #bb985d;padding:10px 14px;color:#7d765e;font-size:12px;background:#f2eddf;margin:18px 0}.login{max-width:400px;margin:12vh auto;padding:25px}.login h1{margin:25px 0 12px}.login .primary{width:100%;margin-top:15px}.loading{text-align:center;padding:100px 20px}.full{width:100%}#toast{position:fixed;left:50%;bottom:100px;transform:translateX(-50%);background:#263e35;color:white;max-width:90%;padding:12px 20px;border-radius:12px;font-size:13px;z-index:20;display:none}.article-title{margin-bottom:22px}.article-title p{margin-top:12px;color:var(--muted)}.calendar-btn{width:100%;text-align:left}.review-evidence{font-size:11px;margin-top:15px;color:var(--muted)}.footer-note{font-size:11px;color:var(--muted);margin-top:24px}.switch{margin:16px 0}.welcome-art{height:80px;display:flex;align-items:center;justify-content:center;font-size:40px;color:#99a887}.dangerless{color:var(--muted);font-size:12px} @media(max-width:700px){.shell{padding:22px 20px 110px}.top{margin-bottom:26px}.brand small{display:none}.grid{grid-template-columns:1fr;gap:0}h1{font-size:27px}.hero{padding:24px;min-height:256px}.hero h2{font-size:28px;max-width:260px}.nav{gap:0;justify-content:space-around}.nav button{min-width:60px}.card{padding:19px}.greeting{margin-bottom:22px}.greeting p{font-size:13px}.quote{display:none}.section-head{margin-top:22px}.reading{font-size:15px}.content h1{font-size:26px}}@media(prefers-reduced-motion:no-preference){.card,.hero{animation:appear .3s ease-out}@keyframes appear{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}}

.story-node{margin:18px 0;padding:20px 0;border-top:1px solid #d9ded4}.story-node h3{margin-top:10px}.era summary .tag{margin-left:10px}a{overflow-wrap:anywhere}.story-node .note{white-space:pre-wrap}

/* Consistent reading width, compact hierarchy and accessible answer rows. */
:root{--bg:#f5f4ef;--paper:#fffefa;--ink:#243b34;--muted:#727b75;--line:#e2e5dd;--green:#2d594c;--light:#edf3ec}
body{line-height:1.7;-webkit-font-smoothing:antialiased}
.shell{max-width:1120px;padding:28px 36px 128px}.content{max-width:760px}.top{padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:32px}
h1{letter-spacing:-.5px;font-size:32px;line-height:1.45}h2{font-size:24px;line-height:1.4}h3{line-height:1.65;font-weight:600}
.card{border-radius:16px;padding:24px;margin-bottom:16px;animation:none!important;box-shadow:0 2px 6px #243b3403}.section-head{gap:16px;margin:32px 0 16px;align-items:center}.section-head span{flex-shrink:0}.eyebrow{letter-spacing:1.3px}.article-title{margin:0 0 28px}.article-title p{max-width:620px;line-height:1.8}.article-title h1{max-width:700px}.back{font-size:13px;margin-bottom:20px}
.resource{background:#eff3eb;border-color:#dce5d6}.resource .eyebrow{font-size:11px;color:#66745d;letter-spacing:.7px}.resource h3{font-size:19px;line-height:1.6}.resource a{display:inline-flex;align-items:center;margin-top:16px;padding:8px 14px;border-radius:8px;background:var(--paper);border:1px solid #d5dfcf;text-decoration:none;font-size:13px}.resource .footer-note{margin-top:12px;line-height:1.7}.notice{border-radius:0 10px 10px 0;line-height:1.9;padding:12px 16px}
details.card>summary{cursor:pointer;font-size:14px;font-weight:500}details.card:not([open]){padding:16px 22px}summary{cursor:pointer}details>summary:focus-visible{outline:2px solid var(--green);outline-offset:4px}
.exercise-heading{margin-top:40px}.exercise-heading .eyebrow{margin-bottom:6px;font-size:10px;color:#859086}.exercise-heading>span{font-size:12px}
.question-list{display:grid;gap:16px}.question{margin:0;padding:24px 26px;border-color:#dde3d9;box-shadow:0 3px 12px #243b3403}.question-meta{display:flex;align-items:center;gap:10px;color:#778176;font-size:12px;margin-bottom:13px;line-height:1.4}.question-number{font-size:12px;font-weight:700;color:var(--green);background:#edf2e8;display:grid;place-items:center;width:30px;height:28px;border-radius:7px;font-variant-numeric:tabular-nums}.question-state{margin-left:auto;font-size:11px;color:#8a938b}.question h3{font-size:17px;line-height:1.7;font-weight:600;margin:0 0 17px}.options{display:grid;grid-template-columns:1fr;gap:9px;margin:0}.option{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 14px;border-radius:10px;min-height:48px;font-size:14px;line-height:1.65;background:#fcfcf8;border-color:#e5e8e0;transition:background .15s,border-color .15s}.option-letter{display:grid;place-items:center;flex:0 0 24px;height:24px;border:1px solid #dce1d5;border-radius:6px;color:#83907f;font-size:11px;background:#fffefa}.option-check{margin-left:auto;flex:0 0 16px;color:var(--green);font-size:15px}.option.selected{background:#edf4ec;border-color:#6b907a;color:#234f3d}.option.selected .option-letter{background:var(--green);color:white;border-color:var(--green)}
.answer-feedback{margin-top:14px;padding:14px 16px;border-radius:10px;font-size:13px;line-height:1.8;background:#edf4ec;color:#44624c}.answer-feedback.revisit{background:#f7f0e4;color:#806442}.answer-feedback strong{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin-bottom:5px;gap:12px}.answer-feedback strong span{font-weight:400;font-size:11px}.question-source{margin-top:16px;padding-top:12px;border-top:1px solid #eef0e9;color:#81907f;font-size:12px}.question-source summary{list-style:none;display:flex;align-items:center;justify-content:space-between;width:100%}.question-source summary::-webkit-details-marker{display:none}.question-source summary span{font-size:14px;transform:rotate(45deg)}.question-source[open] summary span{transform:rotate(225deg)}.question-source a{display:block;margin-top:8px;line-height:1.8;font-size:12px;text-underline-offset:3px}
.field{border-radius:10px;background:#fcfcf8;border-color:#dfe4d9}textarea.field{min-height:150px;line-height:1.9}#record-form .label{margin-top:18px;color:#4f6055}#record-form>.label:first-child{margin-top:0}.primary{border-radius:10px}.smallbtn{background:#fffefa;line-height:1.6}.nav{gap:60px;padding-top:10px;box-shadow:0 -4px 20px #243b3403}.story-node{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:20px;margin:16px 0}.story-node h3{font-family:inherit;font-size:17px}.era{padding-left:26px}.era summary{line-height:1.8}.story-node .eyebrow{font-size:10px;letter-spacing:.8px}.era .story-node p{line-height:1.8}.story-node .smallbtn{color:var(--green)}.stats{gap:14px}.stat{border:1px solid #dfe6d8}.hero{border-radius:18px}.hero h2{max-width:440px;font-size:29px;line-height:1.55}.hero p{max-width:400px}.grid{grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr);gap:24px}
@media(hover:hover){.option:hover{border-color:#91a58b;background:#f1f5ed}.option.selected:hover{background:#e7f0e4}.smallbtn:hover,.resource a:hover{background:#eaf0e5}.question-source summary:hover{color:var(--green)}}
@media(max-width:700px){.shell{padding:20px 18px 108px}.top{padding-bottom:15px;margin-bottom:24px}.brand{font-size:21px}.brand img{width:33px;height:33px}.grid{grid-template-columns:1fr;gap:8px}.content h1{font-size:25px;line-height:1.55}.article-title{margin-bottom:22px}.article-title p{font-size:13px}.article-title .eyebrow{font-size:10px;letter-spacing:.6px}.card{padding:20px;border-radius:14px}.resource h3{font-size:17px}.question{padding:18px 16px;margin:0}.question-list{gap:12px}.question h3{font-size:16px;margin-bottom:14px;line-height:1.7}.question-meta{margin-bottom:12px}.option{padding:11px 12px;font-size:14px;gap:10px}.question-source{margin-top:14px}.section-head{gap:10px}.exercise-heading{align-items:flex-end;margin-top:32px}.exercise-heading h2{font-size:22px}.exercise-heading>span{font-size:10px}.nav{gap:0;justify-content:space-around}.story-node{padding:16px}.era{padding-left:20px;margin-left:5px}.era summary .tag{font-size:10px;margin-left:8px}.hero{padding:22px}.hero h2{font-size:26px;max-width:none}.row{align-items:flex-start}.row>*{min-width:0}.stats{gap:8px}.stat{padding:16px 5px}.section-head h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){.option{transition:none}}

.question[hidden]{display:none}.quiz-pages{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;align-items:center}.quiz-pages .active{background:var(--green);color:white;border-color:var(--green)}.quiz-pages>span{margin-left:auto;font-size:12px;color:var(--muted)}.quiz-actions{display:flex;justify-content:space-between;gap:12px;margin:16px 0 24px}

/* Answer states: selection, correct answer and wrong selection are visually distinct. */
.option-check{font-size:17px;font-weight:700}
.option.correct{background:#edf4ec;border-color:#6b907a;color:#234f3d}
.option.correct .option-letter{background:var(--green);border-color:var(--green);color:#fff}
.option.correct .option-check{color:var(--green)}
.option.incorrect{background:#fbefed;border-color:#cf8278;color:#813d35}
.option.incorrect .option-letter{background:#a94f45;border-color:#a94f45;color:#fff}
.option.incorrect .option-check{color:#a94f45}
.question:has(.option.incorrect) .question-state{color:#a94f45;font-weight:600}
.question:has(.option.correct[aria-pressed="true"]) .question-state{color:var(--green);font-weight:600}
@media(hover:hover){.option.incorrect:hover{background:#f8e7e4;border-color:#bd6b60}.option.correct:hover{background:#e7f0e4}}
