@view-transition { navigation: auto; }
:root {
  --ink:#20242a; --muted:#5c6670; --line:#e3e6ea; --accent:#0b5cad;
  --bg:#fffdf9; --side:#f7f6f2; --serif:"STIX Two Text","Noto Serif JP Variable","Noto Serif JP",serif;
  --sans:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
}
* { box-sizing:border-box; }
html { font-size:clamp(16px, 15px + 0.3vw, 19px); }
body {
  margin:0; color:var(--ink); background:var(--bg);
  font-family:var(--serif); font-weight:430; line-height:1.9;
  text-spacing-trim:trim-start; text-autospace:normal; line-break:strict;
  hanging-punctuation:allow-end; font-kerning:normal;
  font-feature-settings:"onum" 0;
}
.site-header { display:flex; gap:1rem; align-items:baseline; padding:.6rem 1.2rem;
  border-bottom:1px solid var(--line); position:sticky; top:0; background:var(--bg); z-index:5;
  font-family:var(--sans); }
.brand { font-weight:700; color:var(--accent); text-decoration:none; }
.crumbs { color:var(--muted); font-size:.82rem; }
.crumbs a { color:var(--muted); }
.layout { display:flex; max-width:76rem; margin:0 auto; }
.sidebar { width:16rem; flex:none; background:var(--side); border-right:1px solid var(--line);
  padding:1rem; font-size:.8rem; line-height:1.7; font-family:var(--sans);
  word-break:auto-phrase; min-height:calc(100vh - 3rem); }
.sidebar h3 { margin:.9rem 0 .3rem; font-size:.8rem; }
.nav-book { margin:.4rem 0; }
.nav-book summary { font-weight:700; cursor:pointer; padding:.15rem 0; user-select:none; }
.nav-book.other a { font-weight:700; color:var(--muted); }
.sidebar ul { margin:0 0 .6rem; padding-left:1.1rem; list-style:none; }
.sidebar a { color:var(--ink); text-decoration:none; }
.sidebar a:hover { color:var(--accent); }
.sidebar .current { color:var(--accent); font-weight:700; }
.content { flex:1; min-width:0; padding:2lh 2.5rem 4lh; max-inline-size:46rem; margin:0 auto; }
.content > p, .content > ul, .content > ol { max-inline-size:38rem; }
.content h1, .content h2, .content h3 {
  font-family:var(--sans); font-feature-settings:"palt"; letter-spacing:.02em;
  word-break:auto-phrase; text-box-trim:trim-both; text-box-edge:cap alphabetic; }
.content h1 { font-size:1.45rem; font-weight:700; margin:0 0 1.5lh;
  padding-bottom:.4lh; border-bottom:1px solid var(--ink); }
.content h2 { font-size:1.15rem; font-weight:700; margin:2lh 0 .75lh; }
.content h2::before { content:"§ "; color:var(--accent); font-weight:400; }
.content h3 { font-size:1rem; font-weight:700; margin:1.5lh 0 .5lh; color:#3a4048; }
.content p { margin:.75lh 0; }
.content img { max-width:100%; height:auto; display:block; margin:1lh auto; }
.content blockquote { margin:.75lh 0; padding:.1lh 1rem; border-left:2px solid #c4b590;
  color:#4a5058; font-size:.88em; line-height:1.8; }
.content blockquote p { margin:.4lh 0; }
.content table { border-collapse:collapse; margin:1lh 0; font-variant-numeric:lining-nums tabular-nums; }
.content th, .content td { border:1px solid var(--line); padding:.25lh .7rem; }
.content strong { font-weight:640; }
mjx-container { font-size:1.06em; }
mjx-container[display="true"] { display:block; overflow-x:auto; overflow-y:hidden;
  margin:.75lh 0; padding:.1lh 0; }
.pager { display:flex; justify-content:space-between; margin-top:3lh;
  border-top:1px solid var(--line); padding-top:.75lh; font-size:.88rem; font-family:var(--sans); }
.pager a { color:var(--accent); text-decoration:none; }
.source-note { color:var(--muted); font-size:.78rem; margin-top:2lh; font-family:var(--sans); }
.updated { color:var(--muted); font-size:.78rem; margin:.3lh 0 0; font-family:var(--sans); }
.site-footer { text-align:center; color:var(--muted); font-size:.78rem; padding:2lh 1rem;
  border-top:1px solid var(--line); font-family:var(--sans); }
.toc-book { margin-bottom:2lh; }
.ask { margin-top:3lh; border:1px solid var(--line); border-radius:8px; padding:1rem 1.2rem;
  background:var(--side); font-family:var(--sans); }
.ask h2 { margin-top:0; font-size:1rem; }
.ask h2::before { content:""; }
.ask-note { color:var(--muted); font-size:.8rem; margin:.2rem 0 .6rem; }
.ask-q { width:100%; font:inherit; padding:.5rem; border:1px solid var(--line); border-radius:6px; }
.ask-send { font:inherit; padding:.35rem 1.2rem; margin-top:.5rem; background:var(--accent);
  color:#fff; border:none; border-radius:6px; cursor:pointer; }
.ask-send:disabled { opacity:.5; }
.ask-status { font-size:.85rem; color:var(--muted); margin-left:.6rem; }
.ask-answer { background:#fff; border:1px solid var(--line); border-radius:6px;
  padding:.8rem 1rem; margin-top:.8rem; font-size:.92rem; font-family:var(--serif); }
.ask-vote { margin-top:.5rem; font-size:.85rem; color:var(--muted); }
.ask-vote button { font:inherit; cursor:pointer; border:1px solid var(--line); background:#fff;
  border-radius:6px; padding:.1rem .5rem; margin:0 .15rem; }
@media (max-width:800px) { .layout { flex-direction:column; }
  .sidebar { width:100%; min-height:0; border-right:none; border-bottom:1px solid var(--line); } }

/* 広い画面では傍注（注・吹き出し）を右余白のサイドノートにする */
@media (min-width:1280px) {
  .layout { max-width:88rem; }
  .content { max-inline-size:40rem; margin:0 auto; padding-right:0; margin-right:21rem; }
  .content blockquote {
    float:right; clear:right; width:16rem; margin:.1lh -19.5rem .6lh 1.5rem;
    border-left:none; border-top:1px solid #c4b590; padding:.35lh 0 0;
    font-size:.78rem; line-height:1.75; color:var(--muted); font-family:var(--sans);
  }
  .content blockquote strong { color:var(--ink); }
}

/* 問題カードと解答折りたたみ */
.exercise { border:1px solid var(--line); border-radius:8px; padding:.6lh 1.2rem .5lh;
  margin:1lh 0; background:color-mix(in srgb, var(--side) 60%, var(--bg)); }
.exercise-label { font-family:var(--sans); font-weight:700; color:var(--accent);
  font-size:.82rem; letter-spacing:.05em; margin-bottom:.3lh; }
.exercise-title { color:var(--ink); margin-left:.7rem; font-weight:600; font-size:.95rem; letter-spacing:0; }
.exercise blockquote { float:none; width:auto; margin:.5lh 0; border-top:none;
  border-left:2px solid #c4b590; padding:.1lh 1rem; font-size:.85em; }
details.answer { margin-top:.5lh; border-top:1px dashed var(--line); padding-top:.35lh; }
details.answer summary { cursor:pointer; font-family:var(--sans); color:var(--accent);
  font-size:.85rem; user-select:none; }
details.answer[open] summary { color:var(--muted); margin-bottom:.3lh; }

/* 定理・定義・証明の枠 */
.statement { margin:1lh 0; border:1px solid var(--line); border-left:4px solid var(--accent);
  border-radius:0 8px 8px 0; padding:.5lh 1.2rem .4lh; }
.statement.definition { border-left-color:#3f8f5f; }
.statement-label { font-family:var(--sans); font-weight:700; font-size:.82rem;
  letter-spacing:.05em; color:var(--accent); margin-bottom:.25lh; }
.statement.definition .statement-label { color:#3f8f5f; }
.statement-title { color:var(--ink); margin-left:.7rem; font-weight:600; font-size:.95rem; letter-spacing:0; }
.statement-anchor { float:right; color:var(--muted); text-decoration:none; opacity:0; transition:opacity .15s; }
.statement:hover .statement-anchor { opacity:.7; }
.statement-body > :first-child { margin-top:0; }
.statement-body > :last-child { margin-bottom:0; }
.statement blockquote { float:none; width:auto; margin:.5lh 0; border-top:none;
  border-left:2px solid #c4b590; padding:.1lh 1rem; font-size:.85em; }
.exercise.anki { border-style:dashed; }
.exercise.anki .exercise-label { color:#8a6d1a; }
.proof { margin:.75lh 0 1lh; padding-left:1.2rem; border-left:2px solid var(--line); }
.proof-label { font-family:var(--sans); font-weight:700; font-size:.82rem; color:var(--muted); }
.proof-body { font-size:.95em; }
.qed { text-align:right; color:var(--muted); }

/* ダークモード（数式 SVG は currentColor なのでそのまま反転する） */
@media (prefers-color-scheme: dark) {
  :root { --ink:#d6dae0; --muted:#96a0aa; --line:#343a42; --accent:#7cb8ef;
    --bg:#16191d; --side:#1c2025; }
  .content img { filter:invert(.92) hue-rotate(180deg); background:transparent; }
  .content blockquote { border-color:#8a795a; }
  .ask-answer, .ask-vote button { background:#22262c; color:var(--ink); border-color:var(--line); }
  .ask-q { background:#22262c; color:var(--ink); }
}