/* CourseStack 中文教材系统：tokens → typography → layout → components → responsive. */
:root { --reader-ink:#eef2ea; --reader-muted:#9aa79a; --reader-accent:#63e68c; --reader-accent-soft:rgba(99,230,140,.12); --reader-accent-strong:#3fcf72; --reader-line:#232922; --reader-paper:#0b0e0c; --reader-soft:#12160f; --reader-radius:6px; --reader-font:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif; }
body.reader { --pb-ink:var(--reader-ink); --pb-muted:var(--reader-muted); --pb-line:var(--reader-line); --pb-accent:var(--reader-accent); --pb-accent-soft:var(--reader-accent-soft); --pb-accent-dark:var(--reader-accent-strong); --pb-paper:var(--reader-soft); --pb-reading-width:790px; margin:0; background:var(--reader-paper)!important; color:var(--reader-ink); font-family:var(--reader-font); font-size:16px; line-height:1.85; }
.reader a { color:var(--reader-accent); text-underline-offset:4px; }
.reader button,.reader input,.reader textarea { font:inherit; }
.reader :focus-visible { outline:3px solid var(--reader-accent); outline-offset:3px; }
.reader [hidden] { display:none!important; }
.reader-header { min-height:64px; border-bottom:1px solid var(--reader-line); display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 max(24px,calc((100vw - 1200px)/2)); background:var(--reader-soft); }
.reader-header a { text-decoration:none; }
.reader-brand { font:700 25px Georgia,serif; color:var(--reader-ink)!important; }
.reader-header nav { display:flex; gap:24px; font-size:14px; }
.reader-wrap { max-width:1200px; margin:auto; padding:40px 28px 80px; }
.reader h1 { font-size:clamp(28px,3vw,42px); line-height:1.4; letter-spacing:-.035em; color:var(--reader-ink); }
.reader h2 { font-size:24px; line-height:1.5; margin:42px 0 18px; }
.reader h3 { font-size:18px; line-height:1.55; }
.reader .muted,.reader .eyebrow { color:var(--reader-muted); font-size:14px; }
.reader-lede { max-width:760px; color:var(--reader-muted); font-size:17px; }
.reader-course-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,320px); align-items:end; gap:56px; margin-bottom:46px; }
.reader-course-hero h1 { margin:20px 0 14px; }
.reader-course-question { align-self:stretch; margin-top:22px; padding:18px 20px 20px; border-top:3px solid var(--reader-line); border-inline:1px solid var(--reader-line); border-bottom:1px solid var(--reader-line); border-radius:0 0 6px 6px; background:var(--reader-soft); }
.reader-course-question > span { color:var(--reader-accent); font:700 11px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.1em; }
.reader-course-question h2 { margin:9px 0 7px; color:var(--reader-ink); font-size:20px; line-height:1.45; }
.reader-course-question p { margin:0; color:var(--reader-muted); font-size:13px; line-height:1.65; }
.reader-course-question ol { display:grid; gap:0; margin:14px 0 0; padding:0; list-style:none; }
.reader-course-question li { display:grid; grid-template-columns:28px 1fr; gap:8px; padding:8px 0; border-top:1px solid var(--reader-line); color:var(--reader-ink); font-size:13px; }
.reader-course-question b { color:var(--reader-accent); font:700 10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; }
.reader-button { display:inline-flex; align-items:center; justify-content:center; padding:9px 20px; border:1px solid var(--reader-accent); border-radius:var(--reader-radius); background:var(--reader-accent); color:#07130c!important; font-weight:600; text-decoration:none; cursor:pointer; font-size:14px; }
.reader-button.secondary { background:transparent; color:var(--reader-accent)!important; }
.reader-resume { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:22px 24px; margin:28px 0; border:1px solid var(--reader-line); border-radius:var(--reader-radius); background:var(--reader-soft); }
.reader-resume h2,.reader-resume p { margin:0 0 6px; }
.reader progress { display:block; width:min(320px,100%); height:7px; margin:12px 0; accent-color:var(--reader-accent); }
.reader-methods,.reader-featured { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.reader-methods article,.reader-featured > a { padding:22px; border:1px solid var(--reader-line); border-radius:var(--reader-radius); text-decoration:none; }
.reader-methods p,.reader-featured p { font-size:14px; color:var(--reader-muted); }
.reader-methods h3,.reader-featured h3 { margin:0 0 8px; }
.reader-map { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); padding:0; gap:16px; list-style:none; }
.reader-map li { border-top:2px solid var(--reader-line); padding-top:12px; }
.reader-map a { font-weight:650; text-decoration:none; }
.reader-map small { display:block; font-size:12px; color:var(--reader-muted); }
.reader-list { list-style:none; padding:0; }
.reader-list li { display:flex; justify-content:space-between; gap:20px; padding:13px 0; border-bottom:1px solid var(--reader-line); }
.reader-list a { text-decoration:none; }
.reader-list small { color:var(--reader-muted); white-space:nowrap; }
.reader-search { width:min(460px,100%); box-sizing:border-box; padding:10px 14px; border:1px solid var(--reader-line); border-radius:6px; background:var(--reader-soft); }
/* Reading shell: broad examples, measured prose, quiet page navigation. */
body.reader .pb-coursebar { display:block!important; height:64px; background:var(--reader-soft); border-bottom:1px solid var(--reader-line); }
.reader .pb-coursebar-inner { min-height:64px!important; max-width:1280px; margin:auto; }
.reader .pb-coursebar a,.reader .pb-coursebar button { color:var(--reader-ink)!important; }
.reader .pb-brand { font:700 24px Georgia,serif!important; }
.reader .pb-coursebar-actions { color:var(--reader-muted); }
.reader .pb-user,.reader .pb-course-rail,.reader .pb-studio-inspector,.reader .pb-studio-tabs,
.reader .reading-toc,.reader .workbook-side-nav,.reader .review-stage-nav { display:none!important; }
.reader.pb-rebuilt-intro .guide-banner,.reader.pb-rebuilt-intro .review-hero,.reader.pb-rebuilt-intro .lesson-hero { display:none!important; }
.reader .pb-reader-intro { margin:0 0 28px; padding:0 0 24px; border-bottom:1px solid var(--reader-line); }
.reader .pb-reader-intro .eyebrow { margin:0 0 10px; color:var(--reader-muted); letter-spacing:.08em; text-transform:uppercase; font-size:12px; }
.reader .pb-reader-intro h1 { margin:0 0 12px; color:var(--reader-ink); font-family:var(--reader-font); font-size:clamp(28px,3vw,34px); line-height:1.4; letter-spacing:-.035em; }
.reader .pb-reader-intro .lede { margin:0; max-width:790px; color:var(--reader-muted); font-size:17px; line-height:1.85; }
body.reader.pb-studio-shell.pb-has-course-rail.pb-has-studio-inspector .page,body.reader .page { box-sizing:border-box; width:auto!important; max-width:1260px!important; margin:0 auto!important; padding:36px 320px 100px 40px!important; background:var(--reader-soft); }
.reader .lesson-shell { margin-top:0!important; }
.reader .page p,.reader .page ul,.reader .page ol { max-width:790px; font-size:16px; line-height:1.9; }
.reader .page > h1 { font-size:34px!important; max-width:none; margin:14px 0!important; color:var(--reader-ink)!important; line-height:1.4!important; }
.reader .page .problem-purpose { background:none; border:0; padding:0; }
.reader .course-path li { border-radius:4px; border-color:var(--reader-line); font-size:12px; }
.reader .page > .course-path { gap:6px; margin:18px 0; }
.reader.pb-dedicated-interactive .page > .lede,.reader.pb-dedicated-interactive .page > .eyebrow { display:block; }
.reader .page section { max-width:none; scroll-margin-top:85px; }
.reader .page > section { margin:36px 0; }
.reader .page h2 { font-size:25px!important; margin:36px 0 16px!important; line-height:1.5!important; }
.reader .page h2[id]::before { display:none; }
.reader .page p,.reader .page li,.reader .page strong { color:var(--reader-ink); }
.reader .page > .lede { color:var(--reader-muted)!important; font-family:var(--reader-font); }
.reader .page > .eyebrow { color:var(--reader-muted)!important; letter-spacing:.02em!important; }
.reader .page h3 { font-size:18px; margin:22px 0 12px; }
.reader .page > nav:not(.pb-lesson-breadcrumb):not(.pb-pager) { font-size:13px; }
.reader .reader-aside { position:fixed; top:96px; left:calc(50% + 350px); width:235px; max-height:calc(100vh - 120px); overflow:auto; border-left:1px solid var(--reader-line); padding:0 4px 10px 22px; font-size:13px; scrollbar-width:thin; scrollbar-color:var(--reader-line) transparent; }
.reader-aside summary { font-weight:700; cursor:pointer; }
.reader-aside a { display:block; position:relative; margin:4px 0; padding:5px 8px 5px 12px; border-left:2px solid transparent; border-radius:0 4px 4px 0; line-height:1.55; text-decoration:none; color:var(--reader-muted); transition:color 140ms ease,background 140ms ease,border-color 140ms ease; }
.reader-aside a::before { content:attr(data-index); display:inline-block; width:1.8em; color:var(--reader-muted); font:600 10px/1 ui-monospace,SFMono-Regular,Consolas,monospace; vertical-align:baseline; }
.reader-aside a:hover { color:var(--reader-accent); background:var(--reader-soft); }
.reader-aside a.is-active { border-left-color:var(--reader-accent); background:var(--reader-accent-soft); color:var(--reader-accent-strong); font-weight:650; }
.reader-aside a.is-active::before { color:var(--reader-accent); }
.reader-aside .reader-note { font-size:13px!important; margin-top:22px; }
/* Semantic notes retain original content and source boundaries. */
.reader .reader-note,.reader .mental-model,.reader .misconception,.reader .wrong-turn,.reader .warning-note,.reader .invariant,.reader .historical-note { padding:14px 18px; margin:22px 0; border:0; border-left:3px solid #9bb8dc; border-radius:0 6px 6px 0; background:var(--reader-soft); box-shadow:none; }
.reader .reader-note h2,.reader .reader-note h3 { margin:0 0 8px!important; font-size:16px!important; }
.reader .reader-note p { margin:8px 0; }
.reader .reader-note[data-note="invariant"] { border-color:var(--reader-accent); background:rgba(99,230,140,.08); }
.reader .reader-note[data-note="misconception"],.reader .reader-note[data-note="failure"] { border-color:#e0a458; background:rgba(224,164,88,.1); }
.reader .source-note,.reader .evidence-note,.reader .reader-note[data-note="history"] { background:var(--reader-soft); border-color:var(--reader-line); color:var(--reader-muted); font-size:13px; padding:12px 16px; }
.reader .source-note { margin:20px 0; border-left:2px solid var(--reader-line); }
.reader .reader-source-disclosure { margin:14px 0 22px; }
.reader .reader-source-disclosure summary { color:var(--reader-muted); font-size:13px; }
.reader .source-note p { font-size:13px; color:var(--reader-muted); margin:4px 0; }
.reader .reader-aside details { padding:0; border:0; background:none; }
.reader .page pre { background:var(--pb-dark, #070907)!important; color:var(--reader-ink)!important; border:1px solid var(--reader-line); border-radius:6px; padding:48px 20px 20px!important; line-height:1.7; font-size:14px; overflow:auto; box-shadow:none; }
.reader .page pre code { text-shadow:none!important; background:transparent!important; }
.reader .page pre::before { top:0; left:0; right:0; padding:6px 18px; box-sizing:border-box; background:var(--reader-line); color:var(--reader-muted); border-bottom:1px solid var(--reader-line); height:34px; font-size:12px; }
.reader pre .token.comment { color:#6b7a6d; }
.reader pre .token.keyword,.reader pre .token.boolean { color:#ff8a75; }
.reader pre .token.operator,.reader pre .token.punctuation { color:var(--reader-muted); }
.reader pre .token.string { color:#9ef0bb; }
.reader pre .token.number,.reader pre .token.function { color:#7dd8c9; }
.reader .pb-copy-code { font-size:12px; color:var(--reader-accent); background:var(--reader-soft); border:1px solid var(--reader-line); top:6px; opacity:.78; }
.reader .code-label { font-size:12px; color:var(--reader-muted); margin:20px 0 4px; background:none; border:0; border-radius:0; padding:0; }
.reader .code-annotation { font-size:13px!important; border-left:2px solid var(--reader-line); padding-left:14px; color:var(--reader-muted); }
.reader .guided-problem { padding:0 0 32px; border:0; border-bottom:1px solid var(--reader-line); border-radius:0; background:none; box-shadow:none; }
.reader .problem-kicker,.reader .problem-purpose { color:var(--reader-muted); font-size:13px!important; }
.reader .work-it-out,.reader .variation,.reader .prediction { background:none; padding:0; border:0; margin:22px 0; }
.reader .reader-work-label { display:block; font-size:13px; color:var(--reader-muted); margin:18px 0 8px; }
.reader .work-it-out textarea { display:block; box-sizing:border-box; width:100%; resize:vertical; padding:12px 14px; border:1px solid var(--reader-line); border-radius:6px; color:var(--reader-ink); background:var(--reader-soft); font-size:15px; line-height:1.8; }
.reader details { border:1px solid var(--reader-line); border-radius:6px; padding:12px 16px; margin:10px 0; background:var(--reader-soft); }
.reader summary { color:var(--reader-accent); cursor:pointer; min-height:26px; }
.reader details.reveal[open] { background:var(--reader-line); }
.reader .quiz { background:var(--reader-soft); border:1px solid var(--reader-line); box-shadow:none; border-radius:6px; padding:18px; }
.reader .quiz-options { display:grid; gap:8px; }
.reader .quiz-options button { text-align:left; min-height:44px; border:1px solid var(--reader-line); background:var(--reader-soft); color:var(--reader-ink); border-radius:4px; padding:9px 12px; }
.reader .quiz-options button[aria-pressed="true"],.reader .quiz-options button.is-selected { border-color:var(--reader-accent)!important; background:var(--reader-accent-soft)!important; }
.reader .quiz-options button.is-correct { border-color:var(--reader-accent-strong)!important; background:rgba(99,230,140,.1)!important; }
.reader .quiz-options button.is-incorrect { border-color:#ff8a75!important; background:rgba(255,107,94,.1)!important; }
.reader .quiz-feedback { margin:14px 0 0; padding:10px 12px; border-left:3px solid var(--reader-accent); background:var(--reader-soft); color:var(--reader-ink); font-size:14px; line-height:1.7; }
.reader .quiz-feedback[data-state="correct"] { border-left-color:var(--reader-accent-strong); background:rgba(99,230,140,.1); color:#9ef0bb; }
.reader .quiz-feedback[data-state="incorrect"] { border-left-color:#ff8a75; background:rgba(255,107,94,.1); color:#ffb3a8; }
.reader .then-now { border-top:1px solid var(--reader-line); border-bottom:1px solid var(--reader-line); padding:14px 0; background:none; }
.reader .then-now h2 { font-size:16px!important; margin:0 0 10px!important; }
.reader table { font-size:14px; }
.reader .trace-table { display:table; width:100%; margin:0; }
.reader th { background:var(--reader-soft); color:var(--reader-ink); }
.reader .trace-scroll { max-width:100%; overflow:auto; }
.reader .attribution-map .trace-scroll .trace-table { width:100%!important; min-width:0!important; max-width:100%!important; table-layout:fixed; }
.reader .attribution-map .trace-scroll th:nth-child(1),.reader .attribution-map .trace-scroll td:nth-child(1) { width:30%; }
.reader .attribution-map .trace-scroll th:nth-child(2),.reader .attribution-map .trace-scroll td:nth-child(2) { width:18%; }
.reader .attribution-map .trace-scroll th:nth-child(3),.reader .attribution-map .trace-scroll td:nth-child(3) { width:52%; }
.reader .attribution-map .trace-scroll td { overflow-wrap:anywhere; word-break:break-word; }
.reader .trace-scroll { scrollbar-color:var(--reader-line) transparent; scrollbar-width:thin; }
.reader .page .cs-network-inspector { position:static!important; width:auto!important; display:block!important; max-height:none; border:1px solid var(--reader-line); background:var(--reader-soft); }
.reader .cs-network-grid { display:block!important; }
.reader .cs-network-main { padding:18px; }
.reader .cs-network-inspector-head { margin-bottom:8px; }
.reader .cs-network-inspector { padding:18px; }
.reader .cs-network-toolbar { flex-wrap:wrap; }
.reader .reader-completion { border-top:1px solid var(--reader-line); padding-top:24px; margin-top:42px; }
.reader .prerequisite-block:has(ul:empty) { display:none!important; }
@media(max-width:1180px) { .reader .reader-aside { position:static; width:auto; max-height:none; padding:12px 16px; border:1px solid var(--reader-line); margin:24px 0; } .reader-aside .reader-note { display:none; } body.reader.pb-studio-shell.pb-has-course-rail.pb-has-studio-inspector .page,body.reader .page { padding:28px max(24px,calc((100vw - 850px)/2)) 70px!important; } .reader-map { grid-template-columns:repeat(4,1fr); } }
@media(max-width:650px) { .reader-header { padding:12px 18px; flex-wrap:wrap; gap:8px; } .reader-header nav { gap:18px; } .reader-wrap { padding:26px 18px 60px; } .reader-featured,.reader-methods { grid-template-columns:1fr; } .reader-resume { align-items:flex-start; flex-direction:column; padding:18px; } .reader-map { grid-template-columns:repeat(2,1fr); } .reader .page > h1 { font-size:28px!important; } .reader .pb-crumb-course { display:block; max-width:104px; font-size:11px; } .reader .pb-coursebar { height:54px; } .reader .pb-coursebar-inner { min-height:54px!important; padding-inline:18px; } .reader .pb-coursebar-actions { gap:10px; font-size:12px; } .reader .pb-coursebar-actions a[href="#pb-page-end"] { display:none; } .reader .pb-brand { font-size:22px!important; } .reader .pb-copy-code { opacity:1; } .reader .page > .pb-reader-intro { margin-bottom:22px; } .reader .page > .reader-aside { margin-top:18px; } .reader-list li { display:block; } .reader-list small { display:block; } }
@media(hover:none) { .reader .pb-copy-code { opacity:1; } }
@media(prefers-reduced-motion:reduce) { .reader .reader-aside a,.reader .reader-button { transition:none!important; } }
@media(max-width:700px) { .reader-course-hero { grid-template-columns:1fr; gap:24px; margin-bottom:36px; } .reader-course-question { margin-top:0; } }

/* Course profiles may add richer blocks; keep their semantics while bringing
   them back to the shared Chinese textbook palette. */
.reader .recall,
.reader .eecs-review-bridge,
.reader .eecs-completion,
.reader .explain-it-yourself {
  border:1px solid var(--reader-line)!important;
  border-radius:6px!important;
  background:var(--reader-soft)!important;
  color:var(--reader-ink)!important;
  box-shadow:none!important;
}
.reader .recall { padding:20px 22px!important; }
.reader .recall-kicker,.reader .code-kicker,.reader .provenance-kicker { color:var(--reader-accent)!important; }
.reader .recall h2,.reader .eecs-review-bridge strong,.reader .eecs-review-bridge p,
.reader .eecs-completion p,.reader .explain-it-yourself h2,.reader .explain-it-yourself li,
.reader .explain-it-yourself p { color:var(--reader-ink)!important; }
.reader .eecs-review-bridge a { border-radius:4px; background:var(--reader-accent); color:#07130c; font-weight:600; }
.reader .eecs-completion button { border:1px solid var(--reader-accent); border-radius:4px; background:var(--reader-accent); color:#07130c; font-weight:600; }
.reader .eecs-completion button[aria-pressed="true"] { background:var(--reader-soft); color:var(--reader-accent); }
.reader .reader-note small,.reader .recall small { color:var(--reader-muted)!important; }