.story-chapters{display:flex;gap:10px;margin:0 0 30px}.story-chapter{font-size:13px;padding:7px 14px;color:#8b9fab;border:1px solid #3e4f5d;border-radius:30px}.story-chapter.active{color:var(--lime);border-color:#6b8d56;background:#28352a}.quiz-helper{max-width:900px;line-height:1.9;font-size:16px;margin:20px 0 26px;color:#c0d0d8;border-left:2px solid #648653;padding-left:17px}.option{padding-bottom:23px}.option-diagram{width:160px;height:95px;display:block;margin:0 0 14px;opacity:.9;transition:transform .2s}.option:hover .option-diagram{transform:translateY(-3px)}.option.selected .option-diagram{opacity:1}.option-label{margin-bottom:8px}.option h2{margin-top:3px}.gallery-card{display:grid;grid-template-rows:156px auto auto 1fr;align-content:start;gap:6px;min-height:290px;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#36534555,#1f2c3c)}.gallery-mascot{width:100%;height:160px;object-fit:contain;transition:transform .3s}.gallery-card:hover .gallery-mascot{transform:scale(1.09) rotate(-3deg)}.gallery-card strong{margin:0;font-size:19px}.gallery-card p{line-height:1.7}.result-art{background:radial-gradient(ellipse,#67836025,transparent 72%)}.result-mascot{width:100%;height:340px}.result-hero{min-height:390px}.profile-mascot{width:190px;height:210px;object-fit:contain}.profile-intro{display:grid;grid-template-columns:190px 1fr;gap:25px;align-items:center}.code-summary{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.code-summary span{padding:5px 11px;border:1px solid #58715f;border-radius:6px;font-size:14px;color:var(--lime)}
.radar-section{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:40px;border:1px solid #43585b;border-radius:16px;background:linear-gradient(125deg,#1a2c2d,#172633);padding:28px;margin:38px 0}.radar-chart-panel{text-align:center}.radar-chart-panel .section-label{margin-bottom:0}.preference-radar{display:block;width:100%;max-width:440px;margin:auto}.radar-caption{font-size:13px;color:#9eb7b5;margin:-10px 0 0;line-height:1.7}.code-explanation h2{font-size:27px;font-weight:400;margin:0 0 13px}.code-explanation>p{color:var(--muted);font-size:14px;line-height:1.8}.code-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:19px}.code-card{padding:16px;background:#263b3888;border:1px solid #58716566;border-radius:9px}.code-position{font-size:12px;color:#96aba8}.code-card h3{font-size:20px;font-weight:400;margin:8px 0 7px;color:#d5efb5}.code-card h3 strong{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:6px;background:var(--lime);color:#203025;font:21px ui-monospace,monospace;margin-right:7px}.code-card p{font-size:13px;color:#b0c7c6;margin:0;line-height:1.7}.code-card .axis-note{font-size:11px;margin-top:10px;color:#8ca79c}.code-card .axis-bar{margin:10px 0 6px;height:5px}.historical-section{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:37px 0}.history-person,.history-quote{border-radius:13px;padding:29px;background:#1c2c3b;border:1px solid #4e596a}.history-person h2{font-size:31px;font-weight:400;margin:11px 0 5px}.history-era{font:12px ui-monospace,monospace;color:#aabcca}.history-person .history-basis{font-size:15px;color:#b1c7d0;line-height:1.8}.history-comparison{font-size:18px;color:#e0ebd5;line-height:1.6}.history-note{font-size:12px;color:#8ea8b5;line-height:1.8;margin:15px 0 0}.source-link{font-size:12px;color:#c4dea8;text-decoration-thickness:1px;text-underline-offset:3px}.history-quote{background:linear-gradient(130deg,#334133,#1e302e);border-color:#637857;display:flex;flex-direction:column;justify-content:center}.history-quote blockquote{margin:13px 0 15px;font-family:Georgia,serif;font-size:24px;line-height:1.5;color:#d6eabc}.history-quote .quote-translation{font-size:19px;line-height:1.6;margin:0 0 17px;color:#eef1dc}.history-quote .quote-chinese{font-family:Huninn;font-size:28px;line-height:1.5}.quote-credit{color:#9ebcaf;font-size:13px;display:flex;gap:12px;flex-wrap:wrap;align-items:center}.lesson-tabs{display:flex;gap:9px;flex-wrap:wrap;margin:20px 0}.lesson-tab{padding:10px 16px;border:1px solid #4c6471;border-radius:7px;background:#243445;color:#b7cbd5;font-size:14px}.lesson-tab[aria-selected=true]{background:var(--lime);border-color:var(--lime);color:#203025}.lesson-tab small{display:block;font-size:10px;opacity:.8;letter-spacing:.05em}.lesson-stage{padding:0;background:none;display:block;min-height:0}.lesson-shell{background:#f5f3e9;color:#263e45;border-radius:12px;padding:28px;line-height:1.75}.lesson-topic{font-size:12px;color:#5c7e47;margin:0 0 4px}.lesson-heading h3{font-weight:400;font-size:26px;margin:0 0 14px;line-height:1.45}.lesson-question{font-size:18px;max-width:950px;line-height:1.8;margin:0 0 18px}.lesson-options{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.lesson-choice{background:#e1e9d7;border:1px solid #93a883;border-radius:7px;padding:9px 23px;color:#304337;font-size:17px}.lesson-choice:hover{background:#d0e2b9}.lesson-choice[aria-pressed=true]{background:#708d51;color:#fff;border-color:#708d51}.lesson-feedback{font-size:15px;color:#426c31;min-height:27px;margin:8px 0 14px}.lesson-hint-toggle{background:#30483a;color:#e7eed6;border-radius:6px;padding:8px 17px;font-size:14px}.lesson-explorer{display:grid;grid-template-columns:1.1fr .9fr;gap:27px;border-top:1px solid #cad2c0;margin-top:25px;padding-top:22px;align-items:center}.lesson-explorer-note{font-size:13px;color:#657764;line-height:1.7;margin:0 0 16px}.lesson-diagram{width:100%;height:auto;display:block;border-radius:8px;background:#e9edde;overflow:visible}.lesson-slider{width:100%;accent-color:#668743;margin:17px 0;cursor:pointer}.lesson-state{font-size:17px;color:#385b2c;line-height:1.8;margin:10px 0}.lesson-steps{font-size:15px;padding-left:23px;color:#39513d;line-height:1.9;margin-top:16px}.lesson-transfer{font-size:14px;color:#5a705b;background:#e4eadb;padding:13px 16px;border-radius:6px;margin-top:18px}.lesson-shell label{font-size:15px}.sound-settings{max-width:620px;margin:auto}.sound-row{display:flex;justify-content:space-between;align-items:center;gap:25px;border-bottom:1px solid var(--line);padding:16px 0 22px}.sound-row h3{font-weight:400;font-size:21px;margin:0 0 4px}.sound-row p{margin:0;color:#a6bfca;font-size:14px;max-width:390px;line-height:1.7}.sound-switch{border:1px solid #5c7268;border-radius:30px;padding:8px 17px;min-width:85px;background:#263841;font-size:14px}.sound-switch[aria-pressed=true]{background:var(--lime);color:#25382a}.volume-control{display:block;margin:23px 0 10px;font-size:15px;color:#c3d4da}.volume-control input{display:block;margin-top:15px;width:100%;accent-color:var(--lime)}.audio-note{font-size:12px;color:#94afba;line-height:1.8}.share-card-details{font-size:12px;color:#9eb6bf;line-height:1.8}.radar-shape{animation:radar-reveal .8s ease-out both}@keyframes radar-reveal{from{opacity:0}to{opacity:1}}
@media(max-width:1000px){.radar-section{grid-template-columns:.8fr 1.2fr;gap:20px;padding:22px}.code-grid{gap:10px}.code-card{padding:13px}.historical-section{gap:16px}.history-person,.history-quote{padding:23px}.history-quote blockquote{font-size:21px}.gallery-card{grid-template-rows:155px auto auto 1fr}.lesson-explorer{gap:20px}}
@media(max-width:700px){.story-chapters{gap:6px;margin-bottom:22px}.story-chapter{font-size:10px;padding:5px 9px;flex:1;text-align:center;white-space:nowrap}.quiz-helper{font-size:14px;margin:14px 0 21px;line-height:1.8;padding-left:12px}.option{min-height:196px;padding:17px 18px}.option.selected{padding:16px 17px}.option-diagram{width:130px;height:72px;margin:0 0 5px}.option-label{margin-bottom:0}.option h2{font-size:21px}.gallery-card{grid-template-rows:128px auto auto 1fr;min-height:254px;padding:11px;gap:4px}.gallery-mascot{height:130px}.gallery-card strong{font-size:16px}.gallery-card p{font-size:12px}.result-hero{min-height:0}.result-art{height:230px}.result-mascot{height:260px}.profile-intro{grid-template-columns:1fr;gap:0}.profile-mascot{width:170px;height:180px;margin:auto}.code-summary{gap:6px;margin:13px 0}.code-summary span{font-size:12px}.radar-section{grid-template-columns:1fr;margin:28px 0;padding:22px 15px;gap:25px}.preference-radar{max-width:390px}.radar-caption{font-size:12px;margin-top:-13px}.code-explanation h2{font-size:24px}.code-explanation>p{font-size:13px}.code-grid{gap:10px;margin-top:15px}.code-card{padding:12px}.code-position{font-size:10px}.code-card h3{font-size:17px;white-space:nowrap}.code-card h3 strong{width:27px;height:27px;font-size:18px;margin-right:4px}.code-card p{font-size:12px}.code-card .axis-note{font-size:10px}.historical-section{grid-template-columns:1fr;margin:27px 0;gap:14px}.history-person,.history-quote{padding:22px}.history-person h2{font-size:28px}.history-comparison{font-size:17px}.history-person .history-basis{font-size:14px}.history-quote blockquote{font-size:22px}.history-quote .quote-translation{font-size:17px}.history-quote .quote-chinese{font-size:25px}.lesson-tabs{gap:7px;margin:17px 0}.lesson-tab{flex:1 1 40%;padding:9px 12px;font-size:14px}.lesson-tab small{font-size:10px}.lesson-shell{padding:20px 16px}.lesson-heading h3{font-size:23px}.lesson-question{font-size:16px;line-height:1.8}.lesson-options{gap:8px;margin:16px 0}.lesson-choice{padding:7px 15px;font-size:15px;flex:1}.lesson-feedback{font-size:14px}.lesson-explorer{grid-template-columns:1fr;gap:14px;padding-top:17px;margin-top:19px}.lesson-state{font-size:16px}.lesson-steps{font-size:14px}.lesson-transfer{font-size:13px}.lesson-explorer-note{font-size:12px}.sound-row{gap:18px}.sound-row h3{font-size:19px}.sound-row p{font-size:13px}.sound-switch{padding:7px 13px;min-width:73px;font-size:13px}.share-card-details{font-size:11px}.source-link{font-size:12px}.quote-credit{font-size:12px}}
.lesson-answer-fieldset{border:0;padding:0;margin:0;min-width:0}.lesson-answer-fieldset legend{font-size:14px;color:#58744b}.lesson-hint-intro,.lesson-state,.lesson-explorer-note,.lesson-reasoning,.lesson-transfer{grid-column:1/-1}.lesson-hint-intro{font-size:16px;margin:0}.lesson-diagram{padding:15px;background:#213c3c;color:#e4efdf}.lesson-diagram svg{display:block;width:100%;height:auto;max-height:290px}.lesson-slider input[type=range]{display:block;width:100%;margin:20px 0 9px;accent-color:#68864d;cursor:pointer}.lesson-slider-scale{display:flex;justify-content:space-between;font-size:12px;color:#6d8068}.lesson-feedback p{margin:6px 0 0;color:#50684b;font-size:14px;line-height:1.8}.lesson-reasoning summary{cursor:pointer;color:#416c32;font-size:15px}.lesson-feedback[data-correct=false]{color:#915b25}.lesson-choice.is-incorrect{background:#bf874d;color:white;border-color:#bf874d}.lesson-state[data-match=true]{background:#d7e6c8;padding:10px 13px;border-radius:6px}.lesson-state{margin:0}.lesson-explorer-note{margin:0}.lesson-transfer{margin-top:0}.lesson-shell{overflow:hidden}.history-quote .source-link{align-self:start}
@media(prefers-reduced-motion:reduce){.radar-shape{animation:none}}
@media(max-width:700px){.lesson-options{display:grid;grid-template-columns:1fr 1fr}.lesson-choice{padding:9px 8px;min-height:44px;min-width:0}}

/* Let the padded diagram panel grow with its SVG; cap the SVG itself. */
@media(max-width:700px){.lesson-diagram svg{max-height:250px}}