@font-face {
  font-family: "Guide Math";
  src: url("fonts/latinmodern-math.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root {
  --math-ink: var(--ink);
  --math-rule: var(--line);
  --math-face: "Guide Math", "Latin Modern Math", "Cambria Math", "STIX Two Math", serif;
}
:root[data-theme="dark"] {
  --math-ink: var(--ink);
  --math-rule: var(--line);
}
.site-identity { display:flex; align-items:center; gap:.75rem; }
.site-header--identity .site-title { font-size:1.7rem; letter-spacing:-.015em; }
.reading-layout { max-width:72rem; margin:0 auto; display:grid; grid-template-columns:13rem minmax(0,42rem); gap:3rem; padding:2rem var(--gutter) 4rem; }
.contents { position:sticky; top:1.5rem; align-self:start; font-size:.9rem; line-height:1.55; max-height:calc(100vh - 3rem); overflow:auto; }
.contents-title { font-weight:bold; margin:0 0 .65rem; }
.contents ol { padding-left:1.3rem; margin:0; }
.contents li { margin:.4rem 0; }
.contents a { text-decoration-color:var(--line-strong); }
main { min-width:0; max-width:68ch; font-size:1.1rem; line-height:1.82; }
main p { margin:1rem 0; }
section { scroll-margin-top:1.5rem; padding:2rem 0; border-top:1px solid var(--line); }
section:first-child { border-top:0; padding-top:0; }
h2 { font-size:1.45rem; line-height:1.3; letter-spacing:-.012em; margin:0 0 1.25rem; }
.chapter-number { display:inline-block; min-width:1.75em; color:var(--muted); font-weight:400; font-variant-numeric:lining-nums tabular-nums; }
h3 { font-size:1.08rem; line-height:1.4; }
dfn { font-style:normal; font-weight:bold; }
var { font-family:var(--math-face); color:var(--math-ink); font-size:1.06em; }
var { font-style:italic; }
math { font-family:var(--math-face); font-size:1.06em; color:var(--math-ink); }
p math, li math, figcaption math, summary math, span math { margin-inline:0; }
/* Temml multi-line layouts: column alignment and row spacing. */
.tml-right { text-align:right; text-align:-webkit-right; }
.tml-left { text-align:left; text-align:-webkit-left; }
mtable.tml-jot mtd { padding-block:.45ex; }
.equation { margin:1.6rem 0; padding:1rem 1.1rem; border:0; background:var(--surface); color:var(--ink); overflow-x:auto; overflow-y:hidden; overscroll-behavior-inline:contain; }
.equation math { display:block; width:max-content; min-width:100%; margin:.6rem 0; font-size:1.16rem; line-height:1.6; math-style:normal; }
.equation:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
.conclusion { margin-top:1.8rem; padding-block:1rem; }
details { padding:.85rem 0; margin:1.4rem 0; border-block:1px solid var(--line); }
summary { cursor:pointer; font-weight:bold; font-size:1rem; line-height:1.5; padding:.25rem 0; }
details p { font-size:1.03rem; }
.experiment { margin:1.75rem 0 2rem; padding:1.2rem 0 0; border-top:1px solid var(--line-strong); }
.experiment h3 { margin:0 0 .55rem; }
.experiment>p, .demo-note { font-size:.94rem; line-height:1.65; }
.demo-controls { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; margin:.8rem 0; }
.demo-controls label { display:inline-flex; gap:.45rem; align-items:center; flex-wrap:wrap; }
.demo-controls button, .demo-controls input, .demo-controls select, .demo-button { font-size:.94rem; min-height:44px; }
.demo-controls button,.demo-button{min-width:44px;border:1px solid var(--line-strong);background:var(--paper);padding:.45rem .75rem;border-radius:0}
.demo-controls button[aria-pressed=true],.demo-button[aria-pressed=true],.demo-controls button[aria-pressed=true]:hover:not(:disabled),.demo-button[aria-pressed=true]:hover:not(:disabled){background:var(--ink);color:var(--paper)}
.demo-button:disabled { color:var(--muted); border-color:var(--line); cursor:default; }
.demo-controls input[type=number] { width:11rem; max-width:100%; padding:.4rem; }
.demo-controls input[type=range] { max-width:100%; accent-color:var(--ink); }
.demo-output { font-size:.98rem; line-height:1.65; min-height:3rem; padding:.5rem 0; font-variant-numeric:tabular-nums; }
.demo-button-row, .demo-length-strip { display:flex; gap:.45rem; flex-wrap:wrap; width:100%; }
.demo-control { display:flex; flex-wrap:wrap; gap:.45rem; align-items:center; max-width:100%; }
.demo-control label { font-size:.94rem; }
.demo-control select { max-width:100%; padding:.45rem; }
.demo-check { min-height:44px; display:inline-flex; gap:.5rem; align-items:center; margin-right:.75rem; }
.demo-check input { width:1.05rem; height:1.05rem; accent-color:var(--ink); }
.demo-diagram { width:100%; overflow:hidden; }
.demo-diagram-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
.demo-svg { display:block; width:100%; height:auto; max-width:100%; max-height:340px; color:var(--ink); margin:1rem auto; }
.graph-edge { stroke:var(--line-strong); stroke-width:2; fill:none; }
.graph-edge-active { stroke:var(--ink); stroke-width:4; fill:none; }
.graph-edge-witness { stroke:var(--muted-strong); stroke-width:7; stroke-dasharray:6 5; fill:none; }
.graph-node { fill:var(--paper); stroke:var(--ink); stroke-width:2; }
.graph-node-muted { stroke:var(--line-strong); }
.graph-label { fill:var(--ink); font-family:var(--sans); font-size:16px; }
.graph-edge-outside { stroke-width:4; }
.graph-region, .graph-node-repeated { stroke:var(--ink); stroke-width:2; fill:none; }
.walk-current { stroke:var(--ink); stroke-width:2.5; fill:none; }
.walk-arrow, .plot-point { fill:var(--ink); }
.plot-axis { stroke:var(--line-strong); stroke-width:1.5; fill:none; }
.plot-line { stroke:var(--ink); stroke-width:2; fill:none; }
.plot-grid { stroke:var(--line); stroke-width:1; fill:none; stroke-dasharray:3 4; }
.proof-flow { display:grid; text-align:center; gap:.3rem; font-size:1rem; padding:1rem 0; }
.proof-flow span:nth-child(2n) { color:var(--muted); }
.theorem { border-left:2px solid var(--math-rule); padding:.15rem 0 .15rem 1.15rem; margin:1.5rem 0; }
.theorem .equation { margin-block:1rem; }
.steps { padding-left:1.5rem; }
.steps li { padding-left:.3rem; margin:1rem 0; }
.static-diagram { margin:1.5rem 0; }
.static-diagram svg { width:100%; height:auto; }
.static-diagram figcaption { font-size:.88rem; color:var(--muted-strong); line-height:1.6; }
code { overflow-wrap:anywhere; }
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible,summary:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
fieldset { min-width:0; border:0; padding:0; }
legend { font-size:.94rem; }
noscript { font-size:.95rem; }
@media(max-width:1000px) {
  .reading-layout { grid-template-columns:10.5rem minmax(0,1fr); gap:2rem; }
}
@media(max-width:720px) {
  .reading-layout { display:block; padding-top:1.3rem; }
  .contents { position:static; max-height:none; margin-bottom:2rem; padding-bottom:1.1rem; border-bottom:1px solid var(--line); }
  .contents ol { columns:2; column-gap:1.5rem; }
  .contents li { break-inside:avoid; margin:.25rem 0; }
  main { font-size:1.04rem; line-height:1.8; }
  h2 { font-size:1.35rem; }
  section { padding:1.8rem 0; }
  .equation { padding-inline:.65rem; margin-block:1.3rem; }
  .equation math { font-size:1.08rem; }
  .experiment { margin:1.4rem 0; }
  .demo-svg { max-height:290px; }
  .demo-controls { gap:.45rem; }
  .site-header--identity .site-title { font-size:1.45rem; }
}
@media(max-width:580px) {
  .demo-diagram-pair { grid-template-columns:1fr; }
  .demo-diagram-pair .demo-svg { max-height:330px; }
}
@media(max-width:380px) { .contents ol { columns:1; } .demo-controls label { width:100%; } }
@media print {
  .contents,.demo-controls,.demo-button-row,.site-header nav { display:none; }
  .reading-layout { display:block; max-width:45rem; padding:0; }
  .experiment,details { break-inside:avoid; }
  .demo-svg { max-height:230px; }
  section { padding:1rem 0; }
  main { font-size:10pt; }
  math,var { color:#222; }
  .equation { overflow:visible; }
  .equation math { font-size:11pt; }
}