:root{
  --paper:#F8F4EC; --tint:rgba(70,55,30,.05); --ink:#2C2823; --muted:#6E685E; --rule:#DDD6C9; --accent:#2A4A73; --accentSoft:rgba(42,74,115,.09); --warm:rgba(160,120,55,.13);
  --hl:rgba(255,210,0,.45);
  --serif:"Newsreader","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 70px);scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
*,*::before,*::after{box-sizing:inherit}
html,body,.corner,.toc{background:var(--paper)}
body{margin:0;color:var(--ink);font-family:var(--serif);font-size:1.125rem;line-height:1.66;font-optical-sizing:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media (min-width:760px){body{font-size:1.1875rem}}
a{color:var(--accent);text-underline-offset:3px;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
button{font:inherit;color:inherit}
::selection{background:rgba(39,70,111,.22)}

.corner{position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
.corner .in{max-width:1080px;margin:0 auto;padding:14px 24px 10px;display:flex;align-items:center;gap:14px}
.contents-btn{display:inline-flex;align-items:center;gap:8px;background:none;border:0;padding:4px 0;cursor:pointer;font-size:.95rem}
.contents-btn svg{width:18px;height:18px;color:var(--muted)}
.where{font-size:.86rem;line-height:1.3;color:var(--muted);font-style:italic;border-left:1px solid var(--rule);padding-left:14px}
.where b{font-weight:500;font-style:normal;color:var(--ink)}

.page{max-width:1080px;margin:0 auto;padding:0 24px 120px;display:grid;grid-template-columns:minmax(0,1fr)}
/* Margin layout needs 64 + 640 + 56 + 300 (note) + 24 = 1084px, plus room for a scrollbar. Keep the three 1100px queries in step. */
@media (min-width:1100px){.page{grid-template-columns:minmax(0,640px) 1fr;column-gap:56px;padding-left:64px}}
header.title{padding:48px 0 4px}
.chap{font-size:.95rem;color:var(--muted);margin:0 0 16px;font-style:italic}
h1{font-weight:500;font-size:clamp(2.3rem,7vw,3.25rem);line-height:1.08;letter-spacing:-.015em;margin:0 0 12px}
.dek{font-size:1.2rem;line-height:1.45;font-style:italic;color:var(--muted);margin:0 0 52px}
p{margin:0 0 1em}


section.part{margin:0 0 64px}
h2{font-weight:500;font-size:1.6rem;line-height:1.2;margin:0 0 18px;letter-spacing:-.01em;position:relative}
h2 .num{color:var(--accent);margin-right:.5em}
@media (min-width:1100px){h2 .num{position:absolute;left:-2.4em;width:2em;text-align:right;margin:0}}
h3{font-weight:500;font-size:1.18rem;margin:30px 0 10px}

.box{margin:26px 0 28px;padding:4px 0 4px 22px;border-left:2px solid var(--accent)}
.box .label{display:block;font-size:.9rem;font-style:italic;color:var(--accent);margin-bottom:6px}
.box .stmt{font-size:1.3rem;line-height:1.42;font-weight:500;margin:0}
.box .stmt + .stmt{margin-top:10px}
.box.principle{background:var(--tint);border-left-width:3px;padding:18px 20px 18px 22px;border-radius:0 4px 4px 0}

dl.unpack{margin:12px 0 22px;display:grid;grid-template-columns:auto 1fr;gap:6px 18px}
dl.unpack dt{font-style:italic;color:var(--accent)}
dl.unpack dd{margin:0}
@media (max-width:560px){dl.unpack{grid-template-columns:1fr;gap:0}dl.unpack dd{margin-bottom:10px}}

.sn{font-size:.9rem;line-height:1.55;color:var(--muted);margin:6px 0 22px;padding-left:14px;border-left:1px solid var(--rule)}
.sn .snl{display:block;font-style:italic;color:var(--accent);margin-bottom:2px}
@media (min-width:1100px){.sn{float:right;clear:right;width:300px;margin:4px -356px 18px 0;padding-left:0;border-left:0}}

figure{margin:30px 0 34px}
figure svg{width:100%;max-width:500px;height:auto;display:block}
figcaption{font-size:.9rem;line-height:1.5;color:var(--muted);margin-top:10px}
figcaption b{font-weight:500;color:var(--ink);margin-right:.4em}
.fig-ink{stroke:var(--accent);fill:none}
svg text{font-family:var(--serif);fill:var(--ink)}
svg .soft{fill:var(--muted)} svg .acc{fill:var(--accent)}

table{width:100%;border-collapse:collapse;margin:18px 0 8px;font-size:.98rem;line-height:1.45}
thead th{font-weight:500;font-style:italic;color:var(--muted);text-align:left;padding:0 10px 8px 0;border-bottom:1px solid var(--ink)}
tbody td{padding:9px 10px 9px 0;border-bottom:1px solid var(--rule);vertical-align:top}
tbody td:first-child{font-style:italic;color:var(--muted);width:30%}
.tcap{font-size:.9rem;color:var(--muted);margin:0 0 26px}
.tcap b{font-weight:500;color:var(--ink);margin-right:.4em}

.summary ol{margin:0;padding-left:1.4em}
.summary li{margin:0 0 10px;padding-left:4px}
.summary li::marker{color:var(--accent)}
dl.terms{display:grid;grid-template-columns:minmax(9em,auto) 1fr;gap:8px 22px;margin:6px 0 0}
dl.terms dt{font-style:italic}
dl.terms dd{margin:0}
@media (max-width:560px){dl.terms{grid-template-columns:1fr;gap:0}dl.terms dd{margin-bottom:10px}}
ol.qs{padding-left:1.4em;margin:0}
ol.qs > li{margin:0 0 22px;padding-left:4px}
ol.qs > li::marker{color:var(--accent)}
details{margin-top:6px}
summary{cursor:pointer;color:var(--accent);font-style:italic;font-size:.95rem;list-style:none}
summary::-webkit-details-marker{display:none}
summary::before{content:"+ "} details[open] summary::before{content:"− "}
.ans{margin-top:6px;padding-left:14px;border-left:1px solid var(--rule);font-size:1rem}
.reading{list-style:none;padding:0;margin:0}
.reading li{margin:0 0 12px}
.reading .why{display:block;color:var(--muted);font-size:.95rem}
.endnav{margin-top:64px;padding-top:20px;border-top:1px solid var(--rule);display:flex;justify-content:space-between;gap:20px;font-size:.98rem;color:var(--muted);font-style:italic}

/* highlights */
mark.hl{background:var(--hl);color:inherit;border-radius:2px;padding:0 1px;box-decoration-break:clone;-webkit-box-decoration-break:clone;cursor:pointer}
mark.hl.flash{outline:2px solid var(--accent);outline-offset:2px}
.hlpop{position:fixed;z-index:60;display:none;transform:translateX(-50%);background:var(--ink);color:var(--paper);border:0;border-radius:999px;padding:8px 16px;font-style:italic;font-size:.95rem;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.18)}
.hlpop.show{display:block}

.toc{position:fixed;inset:0;z-index:50;overflow:auto;padding:calc(env(safe-area-inset-top,0px) + 18px) 24px calc(env(safe-area-inset-bottom,0px) + 40px);display:none}
.toc.open{display:block}
.toc .in{max-width:640px;margin:0 auto}
.toc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
.toc-head h2{margin:0;font-size:1.5rem}
.close,.clear{background:none;border:0;cursor:pointer;color:var(--muted);font-style:italic;font-size:1rem;padding:6px 0}
.toc .ch{margin:0 0 24px}
.toc .ch h3{margin:0 0 8px;font-size:1.15rem}
.toc .ch h3 span{color:var(--accent);margin-right:.6em}
.toc ul{list-style:none;margin:0;padding:0 0 0 1.9em}
.toc li{padding:5px 0;font-size:1rem;color:var(--muted);display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--rule)}
.toc li em{font-size:.85rem}
.toc li.here a{color:var(--ink);text-decoration:none;font-weight:500}
.toc li.here em{color:var(--accent)}
.toc .later{color:var(--muted);font-style:italic;font-size:.95rem;padding-left:1.9em;margin:0}
.myhl{margin:0 0 34px}
.myhl h3{margin:0 0 8px;font-size:1.15rem;display:flex;justify-content:space-between;align-items:baseline}
.myhl .none{color:var(--muted);font-style:italic;font-size:.95rem;margin:0}
.myhl button.item{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--rule);padding:9px 0;cursor:pointer;font-size:1rem;line-height:1.45}
.myhl button.item mark{background:var(--hl);color:inherit;padding:0 1px}
.myhl button.item small{display:block;color:var(--muted);font-style:italic;font-size:.82rem}

blockquote.src{margin:26px 0 28px;padding:0 0 0 22px;border-left:1px solid var(--ink)}
blockquote.src p{font-style:italic;font-size:1.12rem;line-height:1.55;margin:0 0 8px}
blockquote.src cite{display:block;font-style:normal;font-size:.88rem;color:var(--muted)}

@media (max-width:520px){.where .wl{display:none}}
/* v4: interactive figures, highlights panel, look-it-up */
.corner .in{justify-content:flex-start}
.navgroup{display:flex;gap:16px;align-items:center}
.hl-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:4px 0;cursor:pointer;font-size:.95rem}
.hl-btn i{font-style:normal;display:inline-block;min-width:1.4em;padding:0 .35em;border-radius:9px;background:var(--hl);font-size:.8rem;text-align:center}
.where{margin-left:auto;text-align:right;border-left:0;padding-left:0}
@media (min-width:700px){.where{margin-left:0;text-align:left;border-left:1px solid var(--rule);padding-left:14px}}
.sim{margin:30px 0 34px}
.sim .ctrl{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0 0 12px;font-size:.95rem}
.sim .ctrl span{color:var(--muted);font-style:italic}
.sim .opt{background:none;border:0;padding:2px 0;cursor:pointer;color:var(--muted);border-bottom:1px solid transparent;font-size:.95rem}
.sim .opt[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.sim svg{width:100%;max-width:500px;height:auto;display:block}
.sim .read{font-size:1.02rem;margin:12px 0 0;min-height:3.2em}
.sim .read b{font-weight:500}
.sim .neg{color:#9A3324} .sim .pos{color:#2E6B47}
.sl{margin:14px 0 0;max-width:500px}
.sl label{display:flex;justify-content:space-between;font-size:.95rem;color:var(--muted);font-style:italic}
.sl label span{font-style:normal;color:var(--ink)}
.sl input[type=range]{width:100%;accent-color:var(--accent);margin:4px 0 0}
.lookup{list-style:none;margin:0;padding:0}
.lookup li{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid var(--rule);font-size:1rem}
.lookup li a{margin-left:12px;font-size:.92rem;font-style:italic}
.worth{list-style:none;margin:0;padding:0}
.worth li{margin:0 0 14px}
.worth .why{display:block;color:var(--muted);font-size:.95rem}

.myhl h3{font-size:1rem;font-style:italic;color:var(--muted);margin:22px 0 6px;font-weight:400}
.myhl h3:first-child{margin-top:0}

.find{display:inline-flex;align-items:center;vertical-align:-3px;margin-left:8px;padding:2px;color:var(--accent);opacity:.7;text-decoration:none}
.find:hover,.find:focus-visible{opacity:1}
.find svg{width:16px;height:16px}
.box .srcline{font-size:.86rem;font-style:italic;color:var(--muted);margin:12px 0 0}

/* ask about this section */
.ask{margin:30px 0 0;padding-top:14px;border-top:1px dashed var(--rule)}
.ask[hidden]{display:none}
.ask-open{background:none;border:0;padding:4px 0;cursor:pointer;color:var(--accent);font-style:italic;font-size:1rem}
.ask-form{display:flex;gap:10px;align-items:flex-end;margin-top:10px}
.ask-form[hidden]{display:none}
.ask textarea{flex:1;font:inherit;font-size:1rem;line-height:1.5;padding:10px 12px;border:1px solid var(--rule);border-radius:6px;background:rgba(255,255,255,.6);color:var(--ink);resize:none;min-height:48px;max-height:160px}
.ask textarea:focus{outline:none;border-color:var(--accent)}
.ask .go{flex:none;font:inherit;font-size:.95rem;padding:10px 16px;border-radius:6px;border:0;background:var(--ink);color:var(--paper);cursor:pointer}
.ask .go:disabled{opacity:.4;cursor:default}
.qa{margin-top:6px}
.qa .q{font-style:italic;color:var(--muted);margin:16px 0 6px;font-size:.98rem}
.qa .a{border-left:2px solid var(--accent);padding:2px 0 2px 14px;font-size:1.02rem}
.qa .a p{margin:0 0 .7em}
.qa .a p:last-child{margin-bottom:0}
.qa .a .thinking{color:var(--muted);font-style:italic}
.qa .a .srch{font-size:.92rem;font-style:italic}
.qa .a .srch a{display:inline-flex;gap:6px;align-items:center;text-decoration:none}
.qa .a .srch svg{width:14px;height:14px}
.qa .note{font-size:.88rem;color:var(--muted);font-style:italic;margin:6px 0 0}
.ask .clearqa{background:none;border:0;padding:0;margin-top:10px;cursor:pointer;color:var(--muted);font-style:italic;font-size:.86rem}

/* ---------- app shell additions ---------- */
.corner .in{justify-content:flex-start}
.crumb{background:none;border:0;padding:4px 0;cursor:pointer;font-size:.95rem;color:var(--muted);text-decoration:none}
.page.wide{display:block;max-width:760px;padding-left:24px}
.loading{color:var(--muted);font-style:italic;padding:60px 0}
.lib .kicker{font-size:.95rem;font-style:italic;color:var(--muted);margin:56px 0 14px}
.lib .dek{margin-bottom:40px}
.cont{margin:0 0 44px;padding:2px 0 2px 20px;border-left:2px solid var(--accent)}
.cont .lbl{font-size:.9rem;font-style:italic;color:var(--accent);margin:0 0 4px}
.cont a{font-size:1.35rem;font-weight:500;line-height:1.3;color:var(--ink);text-decoration:none}
.cont a:hover{color:var(--accent)}
.cont .m{font-size:.9rem;font-style:italic;color:var(--muted);margin:4px 0 0}
.course-entry{padding:24px 0;border-top:1px solid var(--rule)}
.course-entry:last-of-type{border-bottom:1px solid var(--rule)}
.course-entry .t{font-size:1.6rem;font-weight:500;line-height:1.2;color:var(--ink);text-decoration:none}
.course-entry .t:hover{color:var(--accent)}
.course-entry .s{color:var(--muted);font-style:italic;margin-top:4px}
.prog{height:3px;max-width:420px;margin:18px 0 8px;background:var(--rule);border-radius:2px;overflow:hidden}
.prog i{display:block;height:100%;min-width:3px;background:var(--accent)}
.course-entry .m{font-size:.9rem;color:var(--muted)}
.course-entry .next{margin:10px 0 0;font-size:1rem;color:var(--muted);font-style:italic}
.course-entry .next a{font-style:normal}
.lib .foot{margin:36px 0 0;font-size:.88rem;font-style:italic;color:var(--muted)}
.ctoc .ch{margin:0 0 30px}
.ctoc .ch h2{font-size:1.3rem;margin:0 0 8px}
.ctoc .ch h2 .num{position:static;margin-right:.6em;width:auto}
.ctoc ul{list-style:none;margin:0;padding:0 0 0 1.9em}
.ctoc li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--rule);color:var(--muted)}
.ctoc li a{color:var(--ink);text-decoration:none}
.ctoc li a:hover{color:var(--accent)}
.ctoc li em{font-size:.85rem}
.endnav a{color:var(--accent);text-decoration:none;font-style:normal}
.endnav small{display:block;font-size:.82rem;color:var(--muted);font-style:italic}
.err{color:#9A3324}