/* 微積分講義共用樣式 */
:root {
  --bg: #fdfcf9;
  --fg: #1f2328;
  --muted: #5b6370;
  --rule: #e3e0d8;
  --accent: #2557c7;
  --def-bg: #eef3fd;
  --thm-bg: #f1f7ef;
  --thm-bar: #2f8a4a;
  --remark-bg: #f6f5f1;
  --err-bg: #fdf3e2;
  --err-bar: #c47a0c;
  --sol-bar: #b9c3d3;
  --code-bg: #f1efe9;
  --shade: rgba(0,0,0,.18);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #17191d;
    --fg: #e4e6ea;
    --muted: #9aa2ae;
    --rule: #30343b;
    --accent: #7aa5ff;
    --def-bg: #1c2433;
    --thm-bg: #1b2a20;
    --thm-bar: #5cc27b;
    --remark-bg: #212328;
    --err-bg: #2e2617;
    --err-bar: #e0a43e;
    --sol-bar: #4a5262;
    --code-bg: #24272d;
    --shade: rgba(0,0,0,.65);
  }
}
:root[data-theme="dark"] {
  --bg: #17191d;
  --fg: #e4e6ea;
  --muted: #9aa2ae;
  --rule: #30343b;
  --accent: #7aa5ff;
  --def-bg: #1c2433;
  --thm-bg: #1b2a20;
  --thm-bar: #5cc27b;
  --remark-bg: #212328;
  --err-bg: #2e2617;
  --err-bar: #e0a43e;
  --sol-bar: #4a5262;
  --code-bg: #24272d;
  --shade: rgba(0,0,0,.65);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: system-ui, -apple-system, "Segoe UI", "Microsoft JhengHei", "PingFang TC", "Noto Sans TC", sans-serif;
  font-size: 17px;
  line-height: 1.8;
}
main {
  max-width: 60rem;
  margin: 0 auto;
  padding: 1.5rem 16px 4rem;
}
a { color: var(--accent); }

.back { font-size: .9rem; color: var(--muted); }
.back a { color: var(--muted); }

h1 { font-size: 1.9rem; line-height: 1.3; margin: .6rem 0 .2rem; }
.subtitle { color: var(--muted); margin: 0 0 2rem; }
h2 {
  font-size: 1.4rem;
  margin: 3rem 0 1rem;
  padding-bottom: .3rem;
  border-bottom: 2px solid var(--rule);
}
h3 { font-size: 1.15rem; margin: 2rem 0 .6rem; }
p { margin: .7rem 0; }
ul, ol { padding-left: 1.5rem; }
li { margin: .25rem 0; }
hr { border: 0; border-top: 1px solid var(--rule); margin: 2.5rem 0; }

/* 定義、定理、補充、筆誤、套路 */
.def, .thm, .remark, .erratum, .tip {
  margin: 1.2rem 0;
  padding: .8rem 1.1rem;
  border-left: 4px solid var(--accent);
  border-radius: 0 6px 6px 0;
  background: var(--def-bg);
}
.thm { border-color: var(--thm-bar); background: var(--thm-bg); }
.remark { border-color: var(--rule); background: var(--remark-bg); }
.erratum { border-color: var(--err-bar); background: var(--err-bg); }
.tip { border-color: var(--thm-bar); background: transparent; border-left-style: dotted; }
.def > :first-child, .thm > :first-child, .remark > :first-child,
.erratum > :first-child, .tip > :first-child { margin-top: 0; }
.def > :last-child, .thm > :last-child, .remark > :last-child,
.erratum > :last-child, .tip > :last-child { margin-bottom: 0; }
.tag { font-weight: 700; margin-right: .4em; }

/* 題目與詳解 */
.q { margin: 2rem 0; }
.problem { font-weight: 500; }
.problem .tag { color: var(--accent); }
.solution {
  margin: .6rem 0 0;
  padding: .2rem 0 .2rem 1.1rem;
  border-left: 3px solid var(--sol-bar);
}
.solution > .tag { display: block; color: var(--muted); font-size: .9rem; margin: .3rem 0; }
.ans { font-weight: 700; }
/* 考古題：每題對應的主題段號與小節 */
.topic { font-size: .9rem; color: var(--muted); margin: .2rem 0 .5rem; }
.topic a { margin-right: .5em; white-space: nowrap; }

/* 公式 */
.katex { font-size: 1.08em; }
/* position: relative 讓 KaTeX 隱藏的 MathML 層留在捲動框內，不會把整頁撐寬 */
.katex-display { position: relative; overflow-x: auto; overflow-y: hidden; padding: .2rem 0; }
/* 可以橫向捲動時，右側（或左側）出現淡陰影提示 */
.katex-display, .table-wrap {
  background:
    linear-gradient(to right, var(--bg) 30%, transparent) left / 2rem 100% no-repeat local,
    linear-gradient(to left, var(--bg) 30%, transparent) right / 2rem 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, var(--shade), transparent) left / .6rem 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, var(--shade), transparent) right / .6rem 100% no-repeat scroll;
}
.def .katex-display, .def .table-wrap { --bg: var(--def-bg); }
.thm .katex-display, .thm .table-wrap { --bg: var(--thm-bg); }
.remark .katex-display, .remark .table-wrap { --bg: var(--remark-bg); }
.erratum .katex-display, .erratum .table-wrap { --bg: var(--err-bg); }

/* 圖 */
figure { margin: 1.5rem 0; text-align: center; }
figure img { max-width: 100%; height: auto; }
figure.pair { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }
figure.pair img { width: calc(50% - .5rem); min-width: 240px; }
figcaption { width: 100%; font-size: .9rem; color: var(--muted); margin-top: .4rem; }

/* 表格 */
.table-wrap { overflow-x: auto; position: relative; }
table { border-collapse: collapse; margin: 1rem auto; }
th, td { border: 1px solid var(--rule); padding: .4rem .9rem; text-align: center; }
th { background: var(--remark-bg); }

/* 目錄頁 */
.toc { list-style: none; padding: 0; }
.toc li { padding: .6rem 0; border-bottom: 1px solid var(--rule); }
.toc .wk { display: inline-block; min-width: 5.5rem; color: var(--muted); }
.route { padding-left: 2rem; }
.route > li { padding: .6rem 0; border-bottom: 1px solid var(--rule); }
.route > li::marker { color: var(--muted); }
.route p { margin: .1rem 0; }
.route .rt { font-weight: 700; }
.route .src a { margin-right: .7em; white-space: nowrap; }
.route .pre { color: var(--muted); font-size: .9rem; white-space: nowrap; }
.route .use { color: var(--muted); font-size: .95rem; }
/* 主題路線每段的「練習」：一份考卷一列，題號做成小標籤 */
.route .ex {
  margin: .5rem 0 .2rem;
  padding: .45rem .75rem .5rem;
  background: var(--remark-bg);
  border-radius: 6px;
  font-size: .88rem;
  line-height: 1.5;
}
.route .ex-h { display: block; color: var(--muted); font-size: .8rem; margin-bottom: .25rem; }
.route .ex ul {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(19rem, 100%), 1fr)); gap: .3rem 1.5rem;
}
.route .ex li { display: flex; align-items: baseline; gap: .6rem; margin: 0; }
.route .ex .exam {
  flex: 0 0 3.2rem;
  color: var(--muted);
  font-weight: 600;
  text-decoration: none;
  font-variant-numeric: tabular-nums;
}
.route .ex .exam:hover { color: var(--accent); }
.route .ex .qs { display: flex; flex-wrap: wrap; gap: .3rem; }
.route .ex .qs a {
  padding: 0 .45em;
  border: 1px solid var(--rule);
  border-radius: 4px;
  background: var(--bg);
  text-decoration: none;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.route .ex .qs a:hover { border-color: var(--accent); }
.lv {
  display: inline-block;
  margin: 0 .3em;
  padding: 0 .4em;
  font-size: .75rem;
  font-weight: 400;
  line-height: 1.6;
  color: var(--err-bar);
  border: 1px solid var(--err-bar);
  border-radius: 4px;
  vertical-align: .1em;
}

@media (max-width: 600px) {
  body { font-size: 16px; }
  h1 { font-size: 1.6rem; }
  h2 { font-size: 1.25rem; margin-top: 2.2rem; }
  .def, .thm, .remark, .erratum, .tip { padding: .7rem .8rem; }
  .solution { padding-left: .8rem; }
  .katex { font-size: 1em; }
  th, td { padding: .35rem .5rem; }
}

@media print {
  body { background: #fff; color: #000; font-size: 12pt; }
  .back { display: none; }
  .q, .def, .thm, figure { break-inside: avoid; }
  h2 { break-after: avoid; }
}