:root {
  --ink: #102238;
  --ink-2: #263b53;
  --muted: #5d6d7f;
  --blue: #1769aa;
  --blue-dark: #0f4f84;
  --blue-soft: #e8f2fb;
  --mint: #dff2e8;
  --mint-ink: #267356;
  --yellow: #f8d866;
  --yellow-soft: #fff8d7;
  --paper: #f7f9fc;
  --surface: #ffffff;
  --line: #d6dee8;
  --line-strong: #9dabb9;
  --danger: #a43f45;
  --danger-soft: #fff0f1;
  --shadow: 0 18px 54px rgba(16, 34, 56, 0.12);
  --max: 1180px;
  --header-height: 72px;
}

* { box-sizing: border-box; }
html { color-scheme: light; scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}
button, input, select, textarea { font: inherit; }
button, a { touch-action: manipulation; -webkit-tap-highlight-color: rgba(23, 105, 170, 0.12); }
button { color: inherit; }
a { color: var(--blue); }
p { text-wrap: pretty; }
h1, h2, h3 { color: var(--ink); line-height: 1.2; text-wrap: balance; }
h1 { margin: 0; font-size: clamp(2.25rem, 5vw, 3.9rem); letter-spacing: -0.045em; }
h2 { margin: 0; font-size: clamp(1.45rem, 2.8vw, 2.15rem); letter-spacing: -0.025em; }
h3 { margin: 0; font-size: 1.08rem; }

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 10px;
  left: 10px;
  padding: 9px 14px;
  color: white;
  background: var(--ink);
  transform: translateY(-160%);
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: sticky;
  z-index: 40;
  top: 0;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: var(--header-height);
  padding-inline: max(22px, calc((100vw - var(--max)) / 2));
  border-bottom: 1px solid rgba(157, 171, 185, 0.55);
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(14px);
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  width: max-content;
  color: var(--ink);
  text-decoration: none;
}
.brand-mark {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  color: white;
  background: var(--ink);
  font: 800 0.78rem/1 Consolas, "Cascadia Mono", monospace;
  letter-spacing: 0.05em;
}
.brand-copy { display: grid; line-height: 1.15; }
.brand-copy strong { font-size: 0.98rem; }
.brand-copy small { margin-top: 4px; color: var(--muted); font-size: 0.64rem; letter-spacing: 0.04em; }
.main-nav { display: flex; align-items: stretch; gap: 34px; height: var(--header-height); }
.main-nav a {
  display: grid;
  place-items: center;
  border-bottom: 3px solid transparent;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 700;
  text-decoration: none;
}
.main-nav a:hover,
.main-nav a[aria-current="page"] { border-bottom-color: var(--blue); color: var(--blue); }
.identity-button {
  justify-self: end;
  max-width: 180px;
  padding: 8px 12px;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: transparent;
  font-size: 0.82rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

main { min-height: calc(100vh - 160px); }
.page-shell { width: min(var(--max), calc(100% - 40px)); margin-inline: auto; padding: 58px 0 82px; }
.narrow { width: min(940px, calc(100% - 40px)); }
.eyebrow {
  margin: 0 0 9px;
  color: var(--blue);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.lede { max-width: 760px; color: var(--muted); font-size: 1.04rem; }
.muted { color: var(--muted); }
.mono { font-family: Consolas, "Cascadia Mono", monospace; }

/* 首页：90 分钟课堂时间轴既是说明，也是进入练习的主控制。 */
.classroom-hero { border-bottom: 1px solid var(--line); background: var(--surface); }
.classroom-hero-inner { width: min(var(--max), calc(100% - 40px)); margin-inline: auto; padding: 68px 0 62px; }
.hero-layout { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(440px, 1.05fr); gap: clamp(42px, 7vw, 92px); align-items: center; }
.hero-kicker { display: flex; gap: 12px; align-items: center; margin-bottom: 22px; color: var(--muted); font-size: 0.83rem; font-weight: 700; }
.live-dot { width: 9px; height: 9px; border: 2px solid white; border-radius: 50%; background: var(--mint-ink); box-shadow: 0 0 0 3px var(--mint); }
.classroom-hero h1 { max-width: 620px; }
.classroom-hero h1 em { color: var(--blue); font-style: normal; }
.hero-copy .lede { margin: 23px 0 0; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.trust-note { margin: 18px 0 0; color: var(--muted); font-size: 0.8rem; }
.class-console {
  border: 1px solid var(--line-strong);
  border-top: 5px solid var(--ink);
  background: var(--paper);
  box-shadow: var(--shadow);
}
.console-heading { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 17px 20px; border-bottom: 1px solid var(--line); }
.console-heading strong { font-size: 0.92rem; }
.console-heading span { color: var(--muted); font: 700 0.76rem/1 Consolas, monospace; }
.lesson-timeline { display: grid; grid-template-columns: 2fr 3fr 1fr; min-height: 230px; }
.timeline-step { position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 24px 20px 21px; border-right: 1px solid var(--line); background: var(--surface); }
.timeline-step:last-child { border-right: 0; }
.timeline-step.exercise { color: white; background: var(--blue); }
.timeline-step.exercise h2,
.timeline-step.exercise .timeline-minutes { color: white; }
.timeline-step .timeline-order { color: var(--muted); font: 800 0.7rem/1 Consolas, monospace; }
.timeline-step.exercise .timeline-order { color: rgba(255, 255, 255, 0.68); }
.timeline-minutes { display: block; margin-top: 24px; color: var(--ink); font: 800 clamp(2rem, 4vw, 3.2rem)/1 Consolas, "Cascadia Mono", monospace; letter-spacing: -0.06em; }
.timeline-step h2 { margin-top: 9px; font-size: 1.04rem; letter-spacing: 0; }
.timeline-step p { margin: 8px 0 0; color: var(--muted); font-size: 0.76rem; line-height: 1.55; }
.timeline-step.exercise p { color: rgba(255, 255, 255, 0.76); }
.timeline-launch {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 22px;
  padding-top: 15px;
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  color: white;
  background: transparent;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  font-weight: 800;
  font-family: inherit;
  text-decoration: none;
  cursor: pointer;
}
.timeline-launch:hover { color: var(--yellow); }
.console-foot { display: flex; justify-content: space-between; gap: 16px; padding: 13px 20px; color: var(--muted); font-size: 0.75rem; }
.status-live { color: var(--mint-ink); font-weight: 800; }

.home-lower { width: min(var(--max), calc(100% - 40px)); margin-inline: auto; padding: 56px 0 76px; }
.section-intro { display: flex; justify-content: space-between; gap: 30px; align-items: end; margin-bottom: 24px; }
.section-intro p { max-width: 570px; margin: 0; color: var(--muted); }
.home-modules { display: grid; grid-template-columns: repeat(3, 1fr); border-block: 1px solid var(--line-strong); }
.home-module { position: relative; min-height: 220px; padding: 26px 28px 30px; border-right: 1px solid var(--line); color: var(--ink); background: var(--surface); text-decoration: none; }
.home-module:last-child { border-right: 0; }
.home-module:hover { background: var(--blue-soft); }
.home-module-label { color: var(--blue); font: 800 0.7rem/1 Consolas, monospace; }
.home-module h3 { margin-top: 31px; font-size: 1.32rem; }
.home-module p { margin: 10px 0 28px; color: var(--muted); font-size: 0.9rem; }
.home-module-arrow { position: absolute; right: 28px; bottom: 24px; font-size: 1.25rem; }
.status-strip { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 26px; border: 1px solid var(--line); background: var(--surface); }
.status-item { padding: 18px 22px; border-right: 1px solid var(--line); }
.status-item:last-child { border-right: 0; }
.status-item strong { display: block; color: var(--blue); font: 800 1.3rem/1.2 Consolas, monospace; }
.status-item span { color: var(--muted); font-size: 0.78rem; }

.page-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 30px; align-items: end; margin-bottom: 42px; padding-bottom: 26px; border-bottom: 1px solid var(--line-strong); }
.page-heading .lede { margin: 15px 0 0; }
.video-recommendation { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 20px; align-items: center; margin-bottom: 42px; padding: 22px 24px; border-left: 5px solid var(--blue); background: var(--blue-soft); }
.video-badge { display: grid; place-items: center; width: 44px; height: 44px; border: 2px solid var(--blue); border-radius: 50%; color: var(--blue); font-size: 0.8rem; }
.video-recommendation p { margin: 3px 0 0; color: var(--muted); font-size: 0.85rem; }
.text-link { font-weight: 800; white-space: nowrap; }

/* 讲义目录：保持书目式层级，知识正文只出现在单节页面。 */
.notes-index-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 42px; align-items: end; margin-bottom: 34px; }
.notes-index-heading .lede { margin: 17px 0 0; }
.notes-edition { display: grid; grid-template-columns: auto auto; gap: 3px 12px; align-items: baseline; padding: 5px 0 3px 28px; border-left: 1px solid var(--line-strong); }
.notes-edition strong { color: var(--ink); font: 500 2.15rem/1.05 Georgia, "Times New Roman", serif; }
.notes-edition span { color: var(--muted); font-size: 0.76rem; }
.directory-heading { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 0 2px 12px; border-bottom: 2px solid var(--ink); color: var(--muted); font-size: 0.76rem; }
.directory-heading span:first-child { color: var(--ink); font-weight: 900; letter-spacing: 0.1em; }
.chapter-directory,
.section-directory { margin: 0; padding: 0; list-style: none; }
.chapter-entry { display: grid; grid-template-columns: 76px minmax(0, 1fr) 28px; gap: 26px; align-items: center; min-height: 154px; padding: 26px 7px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.chapter-entry:hover { padding-inline: 15px 4px; background: linear-gradient(90deg, rgba(232,242,251,0.78), transparent 76%); }
.chapter-folio { color: var(--blue); font: 500 2.35rem/1 Georgia, "Times New Roman", serif; }
.chapter-entry-copy { display: grid; }
.chapter-entry-copy small { margin-bottom: 5px; color: var(--muted); font-size: 0.7rem; font-weight: 800; letter-spacing: 0.06em; }
.chapter-entry-copy strong { font-family: "Songti SC", "STSong", SimSun, serif; font-size: clamp(1.35rem, 2.7vw, 1.85rem); font-weight: 700; }
.chapter-entry-copy > span { max-width: 760px; margin-top: 7px; color: var(--muted); font-size: 0.9rem; }
.directory-arrow { justify-self: end; color: var(--blue); font-size: 1.25rem; transition: transform 140ms ease; }
a:hover > .directory-arrow { transform: translateX(4px); }

.breadcrumbs { display: flex; flex-wrap: wrap; gap: 7px 10px; align-items: center; margin-bottom: 34px; color: var(--muted); font-size: 0.76rem; }
.breadcrumbs a { color: var(--muted); }
.breadcrumbs [aria-current="page"] { color: var(--ink); }
.chapter-heading { display: grid; grid-template-columns: 122px minmax(0, 1fr); gap: 32px; align-items: start; padding: 34px 0 39px; border-block: 2px solid var(--ink); }
.chapter-display-number { color: var(--blue); font: 400 5.8rem/0.88 Georgia, "Times New Roman", serif; letter-spacing: -0.06em; }
.chapter-heading h1 { font-family: "Songti SC", "STSong", SimSun, serif; font-size: clamp(2.2rem, 5vw, 3.6rem); letter-spacing: -0.035em; }
.chapter-heading .lede { margin: 15px 0 0; }
.chapter-reading-note { display: grid; grid-template-columns: 90px 1fr; gap: 22px; margin: 30px 0 12px 154px; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.chapter-reading-note strong { color: var(--blue); font-size: 0.76rem; letter-spacing: 0.08em; }
.chapter-reading-note p { max-width: 720px; margin: 0; color: var(--muted); font-size: 0.88rem; }
.section-directory { margin-left: 154px; }
.section-entry { display: grid; grid-template-columns: 66px minmax(0, 1fr) 26px; gap: 20px; align-items: center; min-height: 116px; padding: 20px 5px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.section-entry:hover { background: linear-gradient(90deg, rgba(255,255,255,0), var(--surface) 14%, var(--surface)); }
.section-number { color: var(--blue); font: 600 1rem/1 Georgia, "Times New Roman", serif; }
.section-entry-copy { display: grid; }
.section-entry-copy strong { font-family: "Songti SC", "STSong", SimSun, serif; font-size: 1.2rem; }
.section-entry-copy > span { margin-top: 4px; color: var(--muted); font-size: 0.84rem; }
.section-entry-copy small { width: max-content; margin-top: 7px; padding-top: 5px; border-top: 1px solid var(--line); color: var(--muted); font-size: 0.66rem; }
.back-to-directory { margin: 30px 0 0 154px; }

/* 单节讲义：连续纸张、宋体正文、编号结论与完整例题。 */
.lecture-shell { width: min(1260px, calc(100% - 40px)); margin-inline: auto; padding: 34px 0 86px; }
.lecture-layout { display: grid; grid-template-columns: 170px minmax(0, 880px); gap: 36px; justify-content: center; align-items: start; }
.lecture-toc { position: sticky; top: calc(var(--header-height) + 28px); display: grid; gap: 5px; padding: 21px 0; border-block: 2px solid var(--ink); }
.lecture-toc p { margin: 0 0 6px; color: var(--blue); font: 500 1.7rem/1 Georgia, "Times New Roman", serif; }
.lecture-toc strong { margin-bottom: 8px; font-size: 0.73rem; letter-spacing: 0.08em; }
.lecture-toc a { min-height: 34px; padding: 5px 0; color: var(--muted); font-size: 0.78rem; text-decoration: none; }
.lecture-toc a:hover { color: var(--blue); }
.lecture-paper { padding: clamp(42px, 6vw, 72px) clamp(28px, 7vw, 86px); border: 1px solid #cfd7df; border-top: 5px solid var(--ink); background: #fffefb; box-shadow: 0 24px 60px rgba(16,34,56,0.09); font-family: "Songti SC", "STSong", SimSun, serif; }
.lecture-title { padding-bottom: 38px; border-bottom: 1px solid var(--ink); }
.lecture-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 35px; color: var(--muted); font-family: "Microsoft YaHei UI", "Microsoft YaHei", sans-serif; font-size: 0.68rem; font-weight: 800; letter-spacing: 0.08em; }
.lecture-meta span:first-child { color: var(--blue); }
.lecture-section-number { margin: 0 0 6px; color: var(--blue); font: 500 1.1rem/1 Georgia, "Times New Roman", serif; }
.lecture-title h1 { font-family: inherit; font-size: clamp(2.25rem, 6vw, 4.15rem); font-weight: 700; letter-spacing: -0.045em; }
.lecture-title > p:last-child { max-width: 660px; margin: 20px 0 0; color: #4d5b69; font-size: 1rem; line-height: 1.9; }
.lecture-section { scroll-margin-top: calc(var(--header-height) + 25px); padding-top: 48px; }
.lecture-section-heading { display: grid; grid-template-columns: 42px 1fr; gap: 18px; align-items: baseline; margin-bottom: 25px; padding-bottom: 12px; border-bottom: 1px solid #9ba6b0; }
.lecture-section-heading > span { color: var(--blue); font: 600 0.72rem/1 Consolas, monospace; }
.lecture-section-heading h2 { font-family: inherit; font-size: 1.48rem; letter-spacing: 0; }
.objective-list,
.condition-list,
.pitfall-list { margin: 0; padding: 0; list-style: none; }
.objective-list { counter-reset: objective; }
.objective-list li { display: grid; grid-template-columns: 26px 1fr; gap: 12px; padding: 8px 0; line-height: 1.9; }
.objective-list li::before { counter-increment: objective; content: counter(objective, decimal-leading-zero); color: var(--blue); font: 600 0.7rem/2.7 Consolas, monospace; }
.lecture-results { border-top: 1px solid var(--ink); }
.lecture-result { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 24px; padding: 27px 0 30px; border-bottom: 1px solid var(--line); }
.margin-label { padding-top: 4px; color: var(--blue); font: 800 0.66rem/1.5 "Microsoft YaHei UI", sans-serif; letter-spacing: 0.03em; }
.lecture-result h3 { font-family: inherit; font-size: 1.08rem; }
.lecture-result p { margin: 9px 0 0; line-height: 1.95; }
.lecture-equation { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-top: 17px; padding: 17px 0 11px; overflow-x: auto; border-top: 1px dotted var(--line-strong); font-size: 1.12rem; text-align: center; }
.equation-number { color: var(--muted); font: 400 0.72rem/1 Georgia, serif; white-space: nowrap; }
.condition-list { padding: 3px 0 3px 21px; border-left: 3px solid var(--blue); }
.condition-list li { position: relative; padding: 7px 0 7px 24px; line-height: 1.9; }
.condition-list li::before { position: absolute; top: 1.15em; left: 0; width: 7px; height: 7px; border: 1px solid var(--blue); border-radius: 50%; content: ""; }
.worked-example { margin-top: 8px; border-block: 2px solid var(--ink); }
.worked-example > header { display: grid; grid-template-columns: 90px 1fr; gap: 14px; align-items: baseline; padding: 18px 0 15px; border-bottom: 1px solid var(--line); }
.worked-example > header span { color: var(--blue); font: 800 0.68rem/1.5 "Microsoft YaHei UI", sans-serif; }
.worked-example > header h3 { font-family: inherit; font-size: 1.12rem; }
.example-problem { display: grid; grid-template-columns: 68px minmax(0, 1fr); gap: 22px; padding: 23px 0; overflow-x: auto; border-bottom: 1px solid var(--line); }
.example-problem > strong { color: var(--muted); font: 800 0.7rem/1.7 "Microsoft YaHei UI", sans-serif; }
.example-problem p { margin: 0; font-size: 1.02rem; line-height: 2; }
.solution-steps { margin: 0; padding: 7px 0 5px; list-style: none; }
.solution-steps li { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 22px; padding: 20px 0; border-bottom: 1px dotted var(--line-strong); }
.solution-steps li:last-child { border-bottom: 0; }
.solution-index { color: var(--blue); font: 500 1rem/1.75 Georgia, serif; }
.solution-steps strong { display: block; font-weight: 700; line-height: 1.9; }
.solution-steps p { display: grid; grid-template-columns: 125px 1fr; gap: 12px; margin: 9px 0 0; color: var(--muted); font-size: 0.82rem; line-height: 1.8; }
.solution-steps p span { color: var(--blue); font-family: "Microsoft YaHei UI", sans-serif; font-size: 0.67rem; font-weight: 900; letter-spacing: 0.03em; }
.example-answer { display: grid; grid-template-columns: 68px minmax(0, 1fr); gap: 22px; align-items: baseline; padding: 19px 0; border-top: 1px solid var(--ink); }
.example-answer > span { color: var(--blue); font: 900 0.7rem/1 "Microsoft YaHei UI", sans-serif; letter-spacing: 0.08em; }
.example-answer > strong { font-size: 1.06rem; }
.pitfall-list { counter-reset: pitfall; }
.pitfall-list li { counter-increment: pitfall; position: relative; margin-bottom: 10px; padding: 14px 17px 14px 52px; border-block: 1px solid #e2d69c; background: #fffdf0; line-height: 1.85; }
.pitfall-list li::before { position: absolute; top: 14px; left: 17px; color: #826c13; content: "!" counter(pitfall); font: 900 0.73rem/1.9 Consolas, monospace; }
.lecture-source { margin: 42px 0 0; padding-top: 14px; border-top: 1px solid var(--line); color: var(--muted); font-family: "Microsoft YaHei UI", sans-serif; font-size: 0.7rem; }
.lecture-practice { display: grid; grid-template-columns: 1fr auto; gap: 28px; align-items: center; margin-top: 48px; padding: 26px 0; border-block: 2px solid var(--ink); }
.lecture-practice span { color: var(--blue); font-family: "Microsoft YaHei UI", sans-serif; font-size: 0.68rem; font-weight: 900; letter-spacing: 0.08em; }
.lecture-practice h2 { margin-top: 5px; font-family: inherit; font-size: 1.28rem; letter-spacing: 0; }
.lecture-practice p { margin: 7px 0 0; color: var(--muted); font-size: 0.8rem; }
.lecture-practice .button { font-family: "Microsoft YaHei UI", sans-serif; white-space: nowrap; }
.lecture-pagination { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 34px; font-family: "Microsoft YaHei UI", sans-serif; }
.lecture-pagination a { display: grid; gap: 5px; color: var(--ink); text-decoration: none; }
.lecture-pagination a.next { text-align: right; }
.lecture-pagination span { color: var(--muted); font-size: 0.67rem; }
.lecture-pagination strong { color: var(--blue); font-size: 0.78rem; }

.math-copy { font-family: "Cambria Math", "STIX Two Math", "Times New Roman", "Songti SC", serif; }
.math-matrix { display: inline-block; max-width: 100%; margin-inline: 0.18em; vertical-align: -0.58em; white-space: nowrap; font-family: "Cambria Math", "STIX Two Math", "Times New Roman", serif; font-size: 1.04em; }
.math-matrix mtable { line-height: 1.08; }
.math-matrix mtd { padding-inline: 0.06em; }
.question-prompt,
.past-prompt,
.result-item p,
.example-problem,
.example-answer,
.lecture-equation { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }

/* 练习入口 */
.practice-launch-grid { display: grid; grid-template-columns: 1.08fr 0.92fr; gap: 22px; }
.classroom-panel { position: relative; overflow: hidden; padding: 30px; border: 1px solid var(--ink); color: white; background: var(--ink); }
.classroom-panel::before { position: absolute; top: 0; right: 0; width: 96px; height: 8px; background: var(--yellow); content: ""; }
.classroom-panel h2 { color: white; }
.classroom-panel > p { max-width: 600px; color: rgba(255,255,255,0.74); }
.classroom-specs { display: grid; grid-template-columns: repeat(3, 1fr); margin: 25px 0 28px; border-block: 1px solid rgba(255,255,255,0.2); }
.classroom-spec { padding: 16px 13px; border-right: 1px solid rgba(255,255,255,0.2); }
.classroom-spec:first-child { padding-left: 0; }
.classroom-spec:last-child { border-right: 0; }
.classroom-spec strong { display: block; color: white; font: 800 1.25rem/1.2 Consolas, monospace; }
.classroom-spec span { color: rgba(255,255,255,0.62); font-size: 0.72rem; }
.classroom-panel .button.primary { border-color: var(--yellow); color: var(--ink); background: var(--yellow); }
.control-panel { padding: 30px; border: 1px solid var(--line-strong); background: var(--surface); }
.classroom-panel h2,
.control-panel h2 { margin: 0 0 23px; line-height: 1.2; }
.field { display: grid; gap: 7px; margin: 0 0 19px; font-weight: 700; }
.field input, .field select, .field textarea, .teacher-key {
  width: 100%;
  padding: 11px 12px;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  color: var(--ink);
  background: var(--surface);
}
.field textarea { resize: vertical; }
.method-lock { margin-bottom: 19px; padding: 13px 14px; border-left: 4px solid var(--yellow); background: var(--yellow-soft); }
.practice-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 22px; border: 1px solid var(--line); background: var(--line); }
.fact { padding: 18px 20px; background: var(--surface); }
.fact strong { display: block; margin-bottom: 5px; color: var(--blue); font-size: 0.92rem; }
.fact p { margin: 0; color: var(--muted); font-size: 0.8rem; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  padding: 9px 18px;
  border: 1px solid var(--blue);
  border-radius: 4px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}
.button.primary { color: white; background: var(--blue); }
.button.primary:hover { background: var(--blue-dark); }
.button.secondary { color: var(--blue); background: var(--surface); }
.button.ghost { border-color: var(--line-strong); background: transparent; }
.button.block { width: 100%; }
.button.small { min-height: 36px; padding: 6px 12px; font-size: 0.78rem; }
.button:disabled { cursor: wait; opacity: 0.65; }

/* 答题工作台 */
.quiz-page { width: min(var(--max), calc(100% - 40px)); margin-inline: auto; padding: 34px 0 80px; }
.quiz-head { display: flex; justify-content: space-between; gap: 26px; align-items: end; margin-bottom: 22px; }
.quiz-head h1 { font-size: clamp(1.8rem, 4vw, 2.7rem); }
.quiz-head p { margin: 8px 0 0; color: var(--muted); }
.quiz-toolbar {
  position: sticky;
  z-index: 20;
  top: var(--header-height);
  display: grid;
  grid-template-columns: auto minmax(160px, 1fr) auto auto;
  gap: 15px;
  align-items: center;
  margin-bottom: 22px;
  padding: 13px 16px;
  border: 1px solid var(--line-strong);
  background: rgba(255,255,255,0.97);
  box-shadow: 0 8px 24px rgba(16,34,56,0.08);
}
.answered-label { min-width: 76px; font: 800 0.84rem/1 Consolas, monospace; }
.progress-track { width: 100%; height: 8px; overflow: hidden; border: 0; border-radius: 0; background: #dfe6ee; }
.progress-track::-webkit-progress-bar { background: #dfe6ee; }
.progress-track::-webkit-progress-value { background: var(--mint-ink); }
.progress-track::-moz-progress-bar { background: var(--mint-ink); }
.quiz-timer { display: grid; min-width: 116px; padding-left: 15px; border-left: 1px solid var(--line); text-align: right; }
.quiz-timer small { color: var(--muted); font-size: 0.66rem; }
.quiz-timer strong { font: 800 1.08rem/1.25 Consolas, monospace; }
.quiz-timer.overtime strong { color: var(--danger); font-family: inherit; font-size: 0.82rem; }
.quiz-layout { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 24px; align-items: start; }
.question-navigator { position: sticky; top: 150px; padding: 19px; border: 1px solid var(--line); background: var(--surface); }
.question-navigator h2 { margin-bottom: 13px; font-size: 0.9rem; }
.question-map { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; }
.question-jump { display: grid; place-items: center; aspect-ratio: 1; border: 1px solid var(--line); border-radius: 3px; color: var(--muted); background: var(--surface); font: 700 0.74rem/1 Consolas, monospace; cursor: pointer; }
.question-jump.answered { border-color: var(--mint-ink); color: var(--mint-ink); background: var(--mint); }
.question-jump:hover { border-color: var(--blue); color: var(--blue); }
.navigator-key { display: flex; gap: 12px; margin-top: 14px; color: var(--muted); font-size: 0.68rem; }
.key-swatch { display: inline-block; width: 10px; height: 10px; margin-right: 4px; border: 1px solid var(--line); vertical-align: -1px; }
.key-swatch.done { border-color: var(--mint-ink); background: var(--mint); }
.question-card { scroll-margin-top: 165px; margin-bottom: 15px; padding: 25px 27px; border: 1px solid var(--line); border-left: 4px solid var(--blue); background: var(--surface); }
.question-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin-bottom: 15px; color: var(--muted); font-size: 0.76rem; }
.question-number { color: var(--ink); }
.method-chip { display: inline-block; padding: 3px 8px; color: var(--blue-dark); background: var(--blue-soft); font-size: 0.74rem; }
.question-prompt { margin: 0 0 20px; font-size: 1.02rem; font-weight: 700; }
.options { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; margin: 0; padding: 0; border: 0; }
.option { display: flex; gap: 10px; align-items: center; min-height: 46px; padding: 10px 12px; border: 1px solid var(--line); cursor: pointer; }
.option > span { min-width: 0; overflow-x: auto; }
.option:hover { border-color: var(--line-strong); }
.option:has(input:checked) { border-color: var(--blue); background: var(--blue-soft); }
.fill-answer { width: min(360px, 100%); padding: 11px 12px; border: 1px solid var(--line-strong); }
.quiz-submit { display: flex; justify-content: flex-end; gap: 10px; margin-top: 28px; }
.draft-note { margin: 11px 0 0; color: var(--muted); font-size: 0.72rem; }

.result-hero { display: grid; grid-template-columns: auto 1fr; gap: 26px; align-items: center; margin-bottom: 32px; padding: 28px; border: 1px solid var(--mint-ink); background: var(--mint); }
.score-ring { display: grid; place-items: center; width: 108px; aspect-ratio: 1; border: 7px solid var(--mint-ink); border-radius: 50%; font: 900 1.5rem/1 Consolas, monospace; }
.result-hero p { margin-bottom: 0; }
.result-item { margin-bottom: 12px; padding: 18px 20px; border-left: 4px solid var(--mint-ink); background: var(--surface); }
.result-item.wrong { border-left-color: var(--danger); }
.result-item p { margin: 6px 0; }

.category-nav { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 32px; }
.category-nav a { padding: 7px 12px; border: 1px solid var(--line); color: var(--ink-2); background: var(--surface); text-decoration: none; }
.category-nav a:hover { border-color: var(--blue); color: var(--blue); }
.past-category { scroll-margin-top: 100px; margin-bottom: 47px; }
.category-heading { margin-bottom: 18px; padding-bottom: 13px; border-bottom: 2px solid var(--ink); }
.category-heading p { margin: 7px 0 0; color: var(--muted); }
.past-question { display: grid; grid-template-columns: 45px minmax(0, 1fr); column-gap: 22px; align-items: baseline; padding: 26px 0; border-bottom: 1px solid var(--line); }
.past-index { color: var(--blue); font: 900 0.82rem/1.75 Consolas, monospace; }
.past-prompt { margin: 0; font-family: "Songti SC", "STSong", SimSun, serif; font-size: 1.12rem; font-weight: 600; line-height: 1.75; letter-spacing: 0; }
.past-question-detail { grid-column: 2; min-width: 0; padding-top: 12px; }
.past-question p { margin: 0 0 12px; }
.past-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; color: var(--muted); font-size: 0.77rem; }
.answer-box { margin-top: 13px; padding: 12px 15px; border-left: 4px solid var(--yellow); background: var(--yellow-soft); }
.answer-box summary { color: var(--blue-dark); font-weight: 800; cursor: pointer; }

.teacher-summary { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 22px; border: 1px solid var(--line); background: var(--surface); }
.teacher-summary-item { padding: 17px 20px; border-right: 1px solid var(--line); }
.teacher-summary-item:last-child { border-right: 0; }
.teacher-summary-item strong { display: block; font: 800 1.3rem/1.2 Consolas, monospace; }
.teacher-summary-item span { color: var(--muted); font-size: 0.76rem; }
.teacher-controls { display: grid; grid-template-columns: 1fr auto; gap: 11px; margin-bottom: 20px; }
.table-wrap { overflow-x: auto; border: 1px solid var(--line); background: var(--surface); }
table { width: 100%; border-collapse: collapse; }
caption { padding: 12px 14px; color: var(--muted); text-align: left; font-size: 0.76rem; }
th, td { padding: 12px 14px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--ink-2); background: #edf2f7; font-size: 0.76rem; white-space: nowrap; }
td { font-size: 0.84rem; }
td { overflow-wrap: anywhere; }
td small { color: var(--muted); overflow-wrap: anywhere; }
.ai-badge { display: inline-block; padding: 2px 7px; font-weight: 800; white-space: nowrap; }
.ai-badge.used { color: #735300; background: var(--yellow-soft); }
.ai-badge.clean { color: var(--mint-ink); background: var(--mint); }

.dialog { width: min(620px, calc(100% - 28px)); max-height: calc(100vh - 28px); padding: 0; overflow: auto; overscroll-behavior: contain; border: 1px solid var(--line-strong); border-radius: 7px; color: var(--ink); box-shadow: 0 30px 90px rgba(16,34,56,0.3); }
.dialog::backdrop { background: rgba(16,34,56,0.62); backdrop-filter: blur(3px); }
.dialog form { padding: 29px; }
.dialog-heading { margin-bottom: 21px; }
.dialog-heading p:last-child { margin-bottom: 0; color: var(--muted); }
.declaration-options { display: grid; gap: 9px; margin: 0 0 19px; padding: 0; border: 0; }
.declaration-options label { display: flex; gap: 12px; padding: 14px; border: 1px solid var(--line); cursor: pointer; }
.declaration-options label:has(input:checked) { border-color: var(--blue); background: var(--blue-soft); }
.declaration-options span { display: grid; }
.declaration-options small { color: var(--muted); }
.dialog-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 23px; }
.segmented { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 21px; border: 1px solid var(--line-strong); }
.segmented button { padding: 9px; border: 0; background: var(--surface); cursor: pointer; }
.segmented button.active { color: white; background: var(--blue); }
.form-error { min-height: 1.25em; color: var(--danger); }
.hidden { display: none !important; }
.loading, .empty-state { padding: 48px 20px; color: var(--muted); text-align: center; }
.error-state { padding: 21px; border-left: 4px solid var(--danger); background: var(--danger-soft); }
.error-state p { margin-bottom: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.site-footer { display: flex; justify-content: space-between; gap: 24px; align-items: center; padding: 25px max(22px, calc((100vw - var(--max)) / 2)); border-top: 1px solid var(--line); color: var(--muted); background: var(--surface); font-size: 0.78rem; }
.site-footer strong { color: var(--ink); }
.site-footer p { margin: 2px 0 0; }
.site-footer a { font-weight: 700; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px 20px; align-items: center; }
.footer-links span { color: var(--muted); }
.privacy-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.privacy-item { padding: 22px; border: 1px solid var(--line); background: var(--surface); }
.privacy-item h2 { font-size: 1.12rem; }
.privacy-item p { margin-bottom: 0; color: var(--muted); }
.privacy-note { margin-top: 20px; padding: 17px 20px; border-left: 4px solid var(--yellow); background: var(--yellow-soft); }
.privacy-note p { margin: 0; }
.table-pagination { display: flex; justify-content: flex-end; gap: 14px; align-items: center; margin-top: 14px; }
.table-pagination span { color: var(--muted); font-size: 0.78rem; font-variant-numeric: tabular-nums; }

:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }

@media (max-width: 900px) {
  .hero-layout { grid-template-columns: 1fr; }
  .class-console { max-width: 680px; }
  .practice-launch-grid { grid-template-columns: 1fr; }
  .quiz-layout { grid-template-columns: 1fr; }
  .question-navigator { position: static; padding: 15px; }
  .question-map { grid-template-columns: repeat(10, minmax(30px, 1fr)); }
  .navigator-key { display: none; }
  .teacher-summary { grid-template-columns: repeat(2, 1fr); }
  .teacher-summary-item:nth-child(2) { border-right: 0; }
  .teacher-summary-item:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
  .lecture-layout { grid-template-columns: 1fr; }
  .lecture-toc { position: static; display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; padding: 11px 0; }
  .lecture-toc p { margin: 0 7px 0 0; }
  .lecture-toc strong { margin: 0 6px 0 0; }
  .lecture-toc a { display: inline-flex; align-items: center; min-height: 44px; }
}

@media (max-width: 760px) {
  :root { --header-height: 62px; }
  body { padding-bottom: calc(58px + env(safe-area-inset-bottom)); }
  .site-header { grid-template-columns: 1fr auto; min-height: var(--header-height); padding-inline: 16px; backdrop-filter: none; }
  .brand-copy small { display: none; }
  .main-nav { position: fixed; z-index: 60; right: 0; bottom: 0; left: 0; min-height: calc(58px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); justify-content: stretch; gap: 0; border-top: 1px solid var(--line); background: var(--surface); }
  .main-nav a { flex: 1; border-top: 3px solid transparent; border-bottom: 0; }
  .main-nav a:hover, .main-nav a[aria-current="page"] { border-top-color: var(--blue); border-bottom: 0; }
  .identity-button { max-width: 120px; font-size: 0.75rem; }
  .classroom-hero-inner { padding: 46px 0 42px; }
  .hero-actions .button { width: 100%; }
  .lesson-timeline { grid-template-columns: 1fr; }
  .timeline-step { min-height: 138px; border-right: 0; border-bottom: 1px solid var(--line); }
  .timeline-step:last-child { border-bottom: 0; }
  .timeline-minutes { margin-top: 12px; font-size: 2.25rem; }
  .timeline-launch { margin-top: 15px; }
  .console-foot { align-items: flex-start; flex-direction: column; }
  .home-lower { padding: 42px 0 56px; }
  .section-intro { align-items: flex-start; flex-direction: column; gap: 9px; }
  .home-modules { grid-template-columns: 1fr; }
  .home-module { min-height: 172px; border-right: 0; border-bottom: 1px solid var(--line); }
  .home-module:last-child { border-bottom: 0; }
  .status-strip, .teacher-summary { grid-template-columns: 1fr; }
  .status-item, .teacher-summary-item { border-right: 0; border-bottom: 1px solid var(--line); }
  .status-item:last-child, .teacher-summary-item:last-child { border-bottom: 0; }
  .page-shell { padding-top: 40px; }
  .page-heading { grid-template-columns: 1fr; gap: 13px; }
  .video-recommendation { grid-template-columns: auto 1fr; }
  .video-recommendation .text-link { grid-column: 1 / -1; }
  .notes-index-heading { grid-template-columns: 1fr; gap: 22px; }
  .notes-edition { grid-template-columns: auto auto auto auto; justify-content: start; padding: 16px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  .chapter-entry { grid-template-columns: 50px minmax(0, 1fr) 20px; gap: 15px; min-height: 132px; }
  .chapter-folio { font-size: 1.8rem; }
  .chapter-entry-copy strong { font-size: 1.24rem; }
  .chapter-entry-copy > span { font-size: 0.82rem; }
  .chapter-heading { grid-template-columns: 64px 1fr; gap: 18px; padding-block: 26px; }
  .chapter-display-number { font-size: 3.8rem; }
  .chapter-reading-note,
  .section-directory,
  .back-to-directory { margin-left: 0; }
  .chapter-reading-note { grid-template-columns: 1fr; gap: 7px; margin-top: 22px; }
  .section-entry { grid-template-columns: 48px minmax(0, 1fr) 18px; gap: 13px; min-height: 110px; }
  .lecture-shell { width: min(100% - 24px, 1260px); padding-top: 24px; }
  .lecture-paper { padding: 34px 18px; }
  .lecture-title h1 { font-size: clamp(2.1rem, 12vw, 3.2rem); }
  .lecture-section { padding-top: 39px; }
  .lecture-section-heading { grid-template-columns: 32px 1fr; gap: 10px; }
  .lecture-result { grid-template-columns: 1fr; gap: 7px; }
  .margin-label { padding-top: 0; }
  .lecture-equation { min-width: 0; }
  .worked-example > header { grid-template-columns: 1fr; gap: 5px; }
  .example-problem { grid-template-columns: 1fr; gap: 7px; }
  .solution-steps li { grid-template-columns: 34px minmax(0, 1fr); gap: 12px; }
  .solution-steps p { grid-template-columns: 1fr; gap: 2px; }
  .example-answer { grid-template-columns: 1fr; gap: 7px; }
  .lecture-practice { grid-template-columns: 1fr; }
  .lecture-practice .button { width: 100%; }
  .lecture-pagination { grid-template-columns: 1fr; gap: 18px; }
  .lecture-pagination a.next { text-align: left; }
  .classroom-panel, .control-panel { padding: 24px 20px; }
  .classroom-specs { grid-template-columns: 1fr; }
  .classroom-spec { padding: 10px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,0.18); }
  .classroom-spec:last-child { border-bottom: 0; }
  .practice-facts { grid-template-columns: 1fr; }
  .quiz-page { width: min(100% - 24px, var(--max)); padding-top: 24px; }
  .quiz-head { align-items: flex-start; flex-direction: column; }
  .quiz-toolbar { top: var(--header-height); grid-template-columns: auto 1fr auto; gap: 10px; padding: 10px; }
  .quiz-toolbar .toolbar-submit { display: none; }
  .quiz-timer { min-width: 94px; padding-left: 9px; }
  .question-navigator { overflow-x: auto; }
  .question-map { grid-template-columns: repeat(25, 34px); }
  .question-card { scroll-margin-top: 145px; padding: 21px 18px; }
  .options { grid-template-columns: 1fr; }
  .result-hero { grid-template-columns: 1fr; }
  .score-ring { width: 88px; }
  .past-question { grid-template-columns: 30px minmax(0, 1fr); column-gap: 12px; }
  .past-question-detail { grid-column: 2; }
  .past-prompt { font-size: 1.02rem; }
  .teacher-controls { grid-template-columns: 1fr; }
  .dialog form { padding: 23px 19px; }
  .dialog-actions { flex-direction: column-reverse; }
  .dialog-actions .button { width: 100%; }
  .privacy-grid { grid-template-columns: 1fr; }
  .site-footer { align-items: flex-start; flex-direction: column; margin-bottom: 0; padding: 24px 18px; }
  .footer-links { justify-content: flex-start; flex-direction: column; align-items: flex-start; gap: 7px; }
  .table-pagination { justify-content: space-between; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}