/* 决赛专题讲义 —— 网页版样式 */
:root {
  --paper: #fbfaf7;
  --ink: #1d1d1f;
  --muted: #5d5d66;
  --rule: #dcd8cf;
  --accent: #2c4f7c;
  --link: #24508f;
  --toc-w: 17rem;
  --content-w: 47rem;
  --serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", serif;
  --sans: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  color-scheme: light;
}
* { box-sizing: border-box; }
html { scroll-padding-top: 4rem; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--serif); font-size: 17px; line-height: 1.85; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }

.topbar { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 1rem;
  padding: .55rem 1.25rem; background: rgba(251,250,247,.94); backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--rule); font-family: var(--sans); font-size: .9rem; }
.topbar .home { color: var(--ink); font-weight: 600; letter-spacing: .02em; }
.topbar .spacer { flex: 1; }
.topbar .pdf { border: 1px solid var(--accent); color: var(--accent); padding: .15rem .7rem; border-radius: 3px; }

.layout { display: grid; grid-template-columns: var(--toc-w) minmax(0, 1fr); gap: 2.5rem; max-width: calc(var(--toc-w) + var(--content-w) + 6rem); margin: 0 auto; padding: 0 1.25rem; }
.toc { position: sticky; top: 3.4rem; align-self: start; max-height: calc(100vh - 4rem); overflow-y: auto;
  padding: 1.5rem .5rem 2rem 0; font-family: var(--sans); font-size: .82rem; line-height: 1.5; }
.toc-title { font-weight: 700; color: var(--muted); letter-spacing: .1em; margin: 0 0 .5rem; }
.toc ul { list-style: none; padding-left: .9rem; margin: 0; }
.toc > ul { padding-left: 0; }
.toc li { margin: .28rem 0; }
.toc a { color: var(--muted); }
.toc a:hover, .toc a.active { color: var(--accent); }
.content { min-width: 0; max-width: var(--content-w); padding: 2rem 0 6rem; }

.doc-head { border-bottom: 2px solid var(--ink); padding-bottom: 1.2rem; margin-bottom: 2rem; }
.eyebrow { font-family: var(--sans); font-size: .8rem; letter-spacing: .14em; color: var(--accent); margin: 0; text-transform: uppercase; }
.doc-title { font-size: 2.05rem; line-height: 1.3; margin: .35rem 0 .5rem; }
.doc-author, .doc-date { margin: 0; color: var(--muted); font-family: var(--sans); font-size: .9rem; }
.abstract { font-size: .95rem; color: #333; border-left: 3px solid var(--rule); padding-left: 1rem; margin-bottom: 2rem; }

h1, h2, h3, h4 { font-family: var(--sans); line-height: 1.4; }
.content h1 { font-size: 1.5rem; margin: 3rem 0 1rem; padding-top: .6rem; border-top: 1px solid var(--rule); }
.content h2 { font-size: 1.2rem; margin: 2.2rem 0 .8rem; }
.content h3 { font-size: 1.05rem; margin: 1.6rem 0 .6rem; }
.secnum { color: var(--accent); margin-right: .35em; }
p { margin: .7em 0; text-align: justify; }
.lec-box p, .lec-box li { text-align: left; }
.content em { font-style: normal; font-weight: 600; color: #2a2a35; }
.content p:has(mjx-container:not([display])) { text-align: left; }

/* 公式 */
.math.display { display: block; overflow-x: auto; overflow-y: hidden; margin: .9em 0; padding: .1em 0; }
mjx-container[display="true"] { margin: .4em 0 !important; }
mjx-container { max-width: 100%; }
.eq-anchor { position: relative; top: -4rem; }

/* 图表 */
figure { margin: 1.6rem 0; text-align: center; }
figure img { max-width: 100%; height: auto; background: #fff; }
figcaption { font-family: var(--sans); font-size: .86rem; line-height: 1.6; color: #333; text-align: left; margin-top: .5rem; }
.figsource { color: var(--muted); font-size: .8rem; }
table { display: block; width: fit-content; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: 1rem auto; font-size: .92rem; font-family: var(--sans); }
th, td { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: .35rem .7rem; }
thead th { border-top: 2px solid var(--ink); border-bottom: 1px solid var(--ink); }
tbody tr:last-child td { border-bottom: 2px solid var(--ink); }
caption { caption-side: top; font-size: .86rem; margin-bottom: .4rem; }
div[id^="tab:"] { overflow-x: auto; }

/* 讲义环境 */
.lec-box { border: 1px solid; border-left-width: 4px; border-radius: 3px; padding: .2rem 1rem .4rem; margin: 1.2rem 0; background: #fff; }
.lec-title { font-family: var(--sans); font-weight: 700; font-size: .88rem; margin: .45rem 0 .15rem; }
.lec-defn { border-color: #3b5a8c; background: #f6f8fc; } .lec-defn .lec-title { color: #2b4777; }
.lec-assume { border-color: #b8742a; background: #fdf8f1; } .lec-assume .lec-title { color: #8f5718; }
.lec-keypoint { border-color: #a63d3d; background: #fcf5f5; } .lec-keypoint .lec-title { color: #8a2c2c; }
.lec-background { border-color: #4a7a4a; background: #f5f9f4; } .lec-background .lec-title { color: #375f37; }
.lec-prereq { border-color: #6b4f93; background: #f8f5fc; } .lec-prereq .lec-title { color: #573c7d; }
.lec-derivation { border-color: #8a8a8a; background: #fafafa; } .lec-derivation .lec-title { color: #555; }
.lec-verify { border-color: #2f7f7a; background: #f3faf9; } .lec-verify .lec-title { color: #22625e; }
.lec-remark { border-color: #c9c4ba; } .lec-remark .lec-title { color: var(--muted); }
.lec-example { border-color: #9a8a22; background: #fdfcf2; } .lec-example .lec-title { color: #6f6312; }
.lec-solution { border-color: #c9bd62; } .lec-solution .lec-title { color: #6f6312; }
.lec-exercise { border-color: #2d7f96; background: #f3f9fb; } .lec-exercise .lec-title { color: #1f6275; }

/* 交互演示 */
.demo { margin: 1.8rem 0; border: 1px solid #b9cfd8; border-radius: 4px; background: #fff; overflow: hidden; }
.demo-mount { padding: .8rem 1rem .4rem; font-family: var(--sans); font-size: .85rem; }
.demo-caption { font-family: var(--sans); font-size: .85rem; padding: .45rem 1rem .6rem; background: #f1f7f9; border-top: 1px solid #d5e4ea; }
.demo-caption p { margin: 0; }
.demo-loading { color: var(--muted); }
.dk-canvas { width: 100%; display: block; background: #fff; touch-action: none; }
.dk-controls { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; margin: .6rem 0 .2rem; align-items: center; }
.dk-slider { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; min-width: 15rem; flex: 1 1 16rem; }
.dk-slider label { color: #333; flex: 0 1 auto; max-width: 60%; line-height: 1.35; }
.dk-slider input[type=range] { flex: 1 1 7rem; min-width: 7rem; accent-color: var(--accent); }
.dk-slider output { font-variant-numeric: tabular-nums; flex: 0 0 auto; min-width: 4.5em; text-align: right; color: var(--accent); white-space: nowrap; }
.dk-btn { font: inherit; border: 1px solid var(--accent); background: #fff; color: var(--accent); border-radius: 3px; padding: .15rem .8rem; cursor: pointer; }
.dk-btn:hover { background: #eef3f9; }
.dk-readout { font-variant-numeric: tabular-nums; color: #333; background: #f6f6f3; border-radius: 3px; padding: .3rem .6rem; margin: .4rem 0; line-height: 1.6; }
.dk-row { display: flex; flex-wrap: wrap; gap: 1rem; }
.dk-row > * { flex: 1 1 18rem; min-width: 0; }

/* 参考文献 */
#refs { font-size: .88rem; line-height: 1.6; }
.csl-entry { margin: .35rem 0; overflow-wrap: anywhere; }
.csl-entry a { word-break: break-all; }

/* 首页 */
.index-wrap { max-width: 60rem; margin: 0 auto; padding: 2.5rem 1.25rem 5rem; }
.index-wrap h1 { font-size: 2.1rem; margin: .3rem 0 .4rem; }
.lead { color: #333; max-width: 44rem; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1.1rem; margin-top: 2rem; }
.card { display: block; background: #fff; border: 1px solid var(--rule); border-radius: 4px; padding: 1rem 1.15rem 1.1rem; color: var(--ink); }
.card:hover { border-color: var(--accent); text-decoration: none; }
.card .tag { font-family: var(--sans); font-size: .75rem; letter-spacing: .08em; color: var(--accent); }
.card h2 { font-size: 1.08rem; margin: .3rem 0 .4rem; }
.card p { font-size: .88rem; color: #444; margin: 0; text-align: left; line-height: 1.65; }

@media (max-width: 900px) {
  .content p, .csl-entry { overflow-x: auto; overflow-y: hidden; }
  .content li { overflow-wrap: anywhere; }
  .content a, .csl-entry { overflow-wrap: anywhere; word-break: break-word; }
  .layout { grid-template-columns: minmax(0, 1fr); gap: 0; }
  /* 手机：目录只列一级标题并限高，保证打开页面第一屏就能看到讲义标题 */
  .toc { position: static; max-height: 40vh; overflow-y: auto; border-bottom: 1px solid var(--rule); padding: .6rem 0; }
  .toc ul ul { display: none; }
  body { font-size: 16px; }
}
@media print {
  .topbar, .toc, .demo { display: none; }
  .layout { display: block; }
}
.module-title { font-family: var(--sans); font-size: 1.25rem; margin: 2.4rem 0 0; padding-top: .8rem; border-top: 1px solid var(--rule); }
.module-title + .cards { margin-top: 1rem; }
