*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--ink:#000;--paper:#faf8f5;--warm:#7a5210;--gold:#7a5210;--link:#b86d38;--dim:#8a7f6e;--accent:#2d4a3e;--line:#e0d8c8;--nav-gray:#8e8e93}
html{font-size:19.55px;scroll-padding-top:5rem}
body{background:var(--paper);color:var(--ink);font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;min-height:100vh;line-height:1.36}
a{color:inherit;text-decoration:none}
.page-body a,.prose a{color:var(--warm);text-decoration:none}
.page-body a:hover,.prose a:hover{color:var(--warm)}
:focus-visible{outline:1px solid var(--warm);outline-offset:2px}
body::before{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");pointer-events:none;z-index:0;opacity:.6}
nav{display:flex;flex-direction:column;align-items:stretch;border-bottom:1px solid rgba(0,0,0,.15);position:sticky;top:0;background:#c4c4c4;z-index:100}
.nav-row{display:flex;align-items:center;padding:.35rem 3rem;gap:1rem;max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box}
.nav-brand{flex-shrink:1;min-width:0;display:flex;align-items:center}
/* Project title brand: kept fully visible — the search box yields its width
   first (see `.nav-search` flex-shrink). On a long title the search loses its
   centering and collapses; only once it is gone does the title ellipsize, so the
   hamburger is always reachable. The clamp also trims the font on narrow bars. */
.nav-brand-title{font-family:Optima,'Optima Nova','Segoe UI',Candara,Calibri,'Helvetica Neue',sans-serif;font-weight:600;font-size:clamp(0.95rem,2.8vw,1.4rem);letter-spacing:.02em;color:#000;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.nav-brand-title:hover{color:#000;opacity:.72}
.nav-end{flex-shrink:0;display:flex;align-items:center;gap:2rem;margin-left:auto}
.nav-logo{font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--dim);display:inline-flex;align-items:center;gap:.5rem;margin-left:0;padding-left:0}
.nav-logo:hover{color:var(--warm)}
.nav-logo-text{display:flex;flex-direction:column;line-height:1.15;gap:.2rem;white-space:normal;text-align:left}
.nav-logo-text .nav-logo-word2::before{content:none}
.nav-logo-text .nav-logo-word1,.nav-logo-text .nav-logo-word2{color:var(--warm)}
.nav-logo-icon{height:2.5rem;width:auto;vertical-align:middle;display:block;margin-top:-.25rem;margin-bottom:-.25rem}
.nav-links{display:flex;gap:2rem;list-style:none;align-items:center;margin:0;padding:0}
.nav-links-center{justify-content:center;gap:clamp(0.35rem,4vw,2rem)}
.nav-links-end{justify-content:flex-end}
.nav-links > li{display:flex;align-items:center}
.nav-links a{font-family:'DM Mono',monospace;font-size:.80rem;letter-spacing:.12em;text-transform:uppercase;color:#000;transition:color .2s;line-height:1.2;border:1px solid #000;border-radius:4px;background:#c3e3d2;padding:.2rem .5rem}
.nav-links a:hover{color:var(--gold)}
.nav-item-dropdown{position:relative}
.nav-item-dropdown summary{font-family:'DM Mono',monospace;font-size:.80rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);cursor:pointer;list-style:none}
.nav-item-dropdown summary::-webkit-details-marker{display:none}
.nav-item-dropdown summary:hover{color:var(--warm)}
.nav-lists-dropdown{display:flex;align-items:center;gap:.15rem;line-height:1.2}
.nav-lists-dropdown > a{font-family:'DM Mono',monospace;font-size:.80rem;letter-spacing:.12em;text-transform:uppercase;color:#000;transition:color .2s;border:1px solid #000;border-radius:4px;background:#c3e3d2;padding:.2rem .5rem}
.nav-lists-dropdown > a:hover{color:var(--gold)}
.nav-dropdown-trigger{background:none;border:none;font-size:.75rem;color:var(--dim);cursor:pointer;padding:0 .2rem;line-height:1.2;font-family:inherit;vertical-align:middle}
.nav-dropdown-trigger:hover{color:var(--warm)}
.nav-lists-dropdown .nav-dropdown{display:none;position:absolute;top:100%;right:0;left:auto;margin-top:0;padding:.5rem 0;min-width:10rem;background:var(--paper);border:1px solid var(--line);box-shadow:0 .25rem 1rem rgba(0,0,0,.08);list-style:none}
.nav-lists-dropdown:hover .nav-dropdown,.nav-lists-dropdown.nav-dropdown-open .nav-dropdown{display:block}
.nav-dropdown{position:absolute;top:100%;left:0;margin:0;padding:.5rem 0;min-width:10rem;background:var(--paper);border:1px solid var(--line);box-shadow:0 .25rem 1rem rgba(0,0,0,.08);list-style:none}
.nav-dropdown a{display:block;padding:.4rem 1rem;white-space:nowrap;border:none;border-radius:0;background:none;color:var(--warm)}
.nav-dropdown a:hover{color:var(--warm);background:var(--line)}
/* Permanent search box on the bar (every width); results drop down beneath it. */
/* `flex-shrink:10` (vs the brand's 1) makes the search box surrender width
   first, so the project title stays fully visible; `flex-basis:auto` weights the
   shrink by real content width so a short title leaves the search centered while
   a long one pushes it off-center and, ultimately, to zero. */
.nav-search{flex:1 10 auto;display:flex;justify-content:center;position:relative;min-width:0;padding:0 1rem}
.nav-search-input{width:100%;max-width:24rem;font-family:'DM Mono',monospace;font-size:.85rem;padding:.3rem .7rem;border:1px solid rgba(0,0,0,.25);border-radius:5px;background:var(--paper);color:var(--ink)}
.nav-search-input::placeholder{color:var(--dim)}
.nav-search-input:focus{outline:none;border-color:#000;box-shadow:0 0 0 2px rgba(0,0,0,.12)}
.nav-search-results{position:absolute;top:calc(100% + .3rem);left:50%;transform:translateX(-50%);width:min(30rem,92vw);max-height:min(70vh,28rem);overflow-y:auto;background:var(--paper);border:1px solid var(--line);box-shadow:0 .5rem 1.5rem rgba(0,0,0,.22);z-index:130;padding:.4rem 0;text-align:left}
.nav-search-results[hidden]{display:none}
/* ---- Unified nav bar: `🏠 🔎   Project Title   ◀ ▶` on every page ----------------
   Leading: the project title, which ellipsizes when too wide. Right group: home
   (→ Contents), search, Prev/Next reading arrows — the four icon buttons are the same
   on every page; only the leading title differs. `.site-nav` (class) overrides the
   generic `nav` element rule (which is flex-column and grey). */
.site-nav{display:flex;flex-direction:row;align-items:center;gap:.75rem;padding:.35rem clamp(.75rem,3vw,2rem);position:sticky;top:0;z-index:100;background:var(--paper);border-bottom:1px solid rgba(0,0,0,.12)}
.site-nav .nav-right{display:flex;align-items:center;gap:1.15rem;flex:0 0 auto}
.site-nav .nav-home,.site-nav .nav-search-btn{display:flex;align-items:center;background:none;border:none;cursor:pointer;line-height:0;padding:.1rem .15rem;text-decoration:none;color:var(--nav-gray)}
.site-nav .nav-home:hover,.site-nav .nav-search-btn:hover{opacity:.6}
.site-nav .nav-ico{display:block;width:1.296rem;height:1.296rem}
.site-nav .nav-title{flex:1 1 auto;min-width:0;text-align:left;font-family:'Inter',system-ui,sans-serif;font-weight:400;font-size:.984rem;letter-spacing:.09em;text-transform:uppercase;color:var(--nav-gray);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site-nav .header-nav-prev,.site-nav .header-nav-next{display:flex;align-items:center;line-height:0;color:var(--nav-gray);padding:.1rem .15rem;text-decoration:none;cursor:pointer}
.site-nav a.header-nav-prev:hover,.site-nav a.header-nav-next:hover{opacity:.6}
.site-nav .header-nav-disabled{color:color-mix(in srgb, var(--nav-gray) 35%, transparent);pointer-events:none;cursor:default}
/* Search dialog opened by 🔎: anchored at the top of the page, horizontally centred, below a
   small margin, with a "Search" title above the box. Reuses the `.nav-search*` result styles;
   the results list is placed in-flow (not the bar's absolute dropdown) so the dialog grows. */
.nav-search-dialog{position:fixed;top:3rem;left:50%;transform:translateX(-50%);margin:0;border:none;border-radius:12px;padding:1rem 1.25rem 1.25rem;max-width:34rem;width:92vw;background:var(--paper);box-shadow:0 1rem 3rem rgba(0,0,0,.3)}
.nav-search-dialog::backdrop{background:rgba(0,0,0,.35)}
.nav-search-title{font-family:'DM Mono',monospace;font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--warm);font-weight:400;margin:0 0 .6rem;text-align:center}
.nav-search-dialog .nav-search{display:block;position:relative;padding:0;min-width:0}
.nav-search-dialog .nav-search-input{width:100%;max-width:none}
.nav-search-dialog .nav-search-results{position:static;transform:none;left:auto;width:100%;max-height:60vh;margin-top:.6rem;border:none;box-shadow:none;padding:.2rem 0}
.search-results-count{font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);padding:.2rem 1rem .4rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.search-dialog{position:fixed;inset:0;z-index:2000;display:flex;align-items:flex-start;justify-content:center;padding:3rem 1.5rem}
.search-dialog[hidden]{display:none}
.search-dialog-overlay{position:fixed;inset:0;background:rgba(0,0,0,.3);cursor:pointer;z-index:1}
.search-dialog-inner{position:relative;z-index:2;background:var(--paper);border:1px solid var(--dim);box-shadow:0 1rem 3rem rgba(0,0,0,.18),0 0 0 1px rgba(0,0,0,.06);max-width:32rem;width:100%;max-height:calc(100vh - 6rem);display:flex;flex-direction:column}
.search-dialog-header{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;border-bottom:1px solid var(--line)}
.search-dialog-count{font-family:'DM Mono',monospace;font-size:.7rem;color:var(--dim);padding:.25rem 1rem .5rem}
.search-dialog-input{flex:1;font-family:'DM Mono',monospace;font-size:.85rem;padding:.4rem .5rem;border:1px solid var(--line);background:var(--paper)}
.search-dialog-input:focus{outline:1px solid var(--warm);outline-offset:1px}
.search-dialog-close{font-size:1.5rem;line-height:1;background:none;border:none;color:var(--dim);cursor:pointer;padding:0 .25rem}
.search-dialog-close:hover{color:var(--ink)}
.search-dialog-results{overflow-y:auto;padding:.5rem 0;min-height:6rem}
.search-section{margin-bottom:1rem}
.search-section:last-child{margin-bottom:0}
.search-section-title{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--warm);padding:.35rem 1rem;border-bottom:1px solid var(--line);margin-bottom:.25rem}
.search-result-list{list-style:none;padding:0;margin:0}
.search-result-list li{margin:0}
.search-result-list a{display:block;padding:.5rem 1rem;color:var(--ink);font-size:.95rem}
.search-result-list a:hover{background:var(--line);color:var(--accent)}
.search-result-snippet{font-size:.85rem;color:var(--dim);line-height:1.4;margin-top:.25rem}
.search-no-results{padding:1rem;color:var(--dim);font-size:.9rem}
.wrap{max-width:1200px;margin:0 auto;padding:0 3rem}
.wrap--list{max-width:none;margin-left:2rem;margin-right:2rem}
.wrap--full{max-width:none;margin-left:auto;margin-right:auto}
h1{font-size:clamp(2rem,5vw,3.5rem);font-weight:300;line-height:1.1;margin-bottom:1.25rem}
h1 em,h2 em{font-style:italic;color:var(--accent)}
h2{font-size:1.6rem;font-weight:300;margin-bottom:1rem}
.mono{font-family:'DM Mono',monospace}
.small{font-size:.65rem;letter-spacing:.15em;text-transform:uppercase}
.warm{color:var(--warm)}
.dim{color:var(--dim)}
.prose{font-size:1.1rem;line-height:1.7}
.prose p+p{margin-top:1.3rem}
.prose hr,.page-body hr{border:none;border-top:1px solid var(--line);margin:1.2rem 0;padding:0;display:block;overflow:hidden;clear:both}
.prose hr+*,.page-body hr+*{margin-top:0!important}
.prose ul{margin-left:1.5rem;margin-bottom:1.2rem;list-style:disc}
.prose ul li{margin-bottom:.4rem}
.prose em{font-style:italic}
.page-body code,.prose code{font-family:'DM Mono',monospace;font-size:.88em}
.page-body pre,.prose pre{font-family:'DM Mono',monospace;font-size:.85rem;line-height:1.5}
.directive-image{width:50%;margin:1.25rem 1.25rem 1rem 0}
.directive-image--left{float:left;clear:left}
.directive-image img{width:100%;height:auto;display:block;vertical-align:top}
.directive-image figcaption{font-size:.9rem;line-height:1.4;margin-top:.5rem;color:var(--dim);text-align:center}
.directive-image figcaption cite{font-style:normal;font-family:'DM Mono',monospace;font-size:.8em}
.tag{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line);padding:.18rem .45rem;border-radius:2px;display:inline-block}
.tag:hover{color:var(--accent);border-color:var(--accent)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.fade{animation:fadeUp .5s ease}
@media(max-width:640px){
  html{font-size:15px}
  body{font-family:'Inter',system-ui,sans-serif;line-height:1.6}
  h1{font-size:clamp(1.6rem,8vw,2.4rem)}
  h2{font-size:1.35rem}
  .nav-row,.wrap{padding-left:.75rem;padding-right:1.5rem}
  .wrap--list{margin-left:1.5rem;margin-right:1.5rem}
  .section-tabs-inner{padding:.25rem 1.5rem}
  .nav-logo{font-size:.62rem;line-height:1.15;margin-left:0;padding-left:0}
  .nav-links .nav-link-item{display:none}
  .nav-search{padding:0 .5rem}
  .nav-search-input{font-size:16px;max-width:none}
  .nav-row{position:relative}
  nav{position:relative}
  .search-dialog-input{font-size:16px}
}
/* Repo table */
.repo-sort-wrap{margin-top:0;margin-bottom:.5rem}
.repo-sort{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.08em;background:var(--paper);border:1px solid var(--line);padding:.25rem .5rem}
/* Sort toggle: two explicit buttons (replaces the flaky native <select> picker). */
.sort-toggle{display:flex;align-items:center;gap:.4rem;margin:0 0 .6rem;flex-wrap:wrap}
.sort-label{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.sort-btn{font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.06em;background:var(--paper);border:1px solid var(--line);color:var(--ink);padding:.25rem .6rem;cursor:pointer;border-radius:3px}
.sort-btn:hover{border-color:var(--warm);color:var(--warm)}
.sort-btn-active{background:var(--warm);border-color:var(--warm);color:var(--paper)}
.sort-btn-active:hover{color:var(--paper)}
table{width:100%;border-collapse:collapse;font-size:.95rem;margin-top:1.5rem}
th{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--warm);padding:.8rem 1rem .8rem 0;border-bottom:1px solid var(--line);text-align:left}
td{padding:.9rem 1rem .9rem 0;border-bottom:1px solid var(--line);vertical-align:top}
td a:hover{color:var(--accent)}
.status-draft1{color:var(--accent);font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.08em}
.status-prelim{color:var(--warm);font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.08em}
.status-partial{color:var(--warm);font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.08em}
.status-empty{color:var(--line);font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.08em}
/* Bibliography */
.bib-entry{margin-bottom:1rem;font-size:.95rem}
.bib-text{font-style:italic}
.bib-entry .bib-tag{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.08em;margin-right:.35rem}
.bib-entry .bib-tag:hover{color:var(--link)}
/* By-author bibliography mirrors the glossary: indented secondary blocks. Only the authors
   are bold (via .bib-authors); the title stays normal weight on the same line. */
.bib-row-author{margin-bottom:1.25rem;font-size:.95rem;line-height:1.5}
.bib-row-author .bib-cite{font-size:1rem}
.bib-authors{font-weight:700}
.bib-title{font-weight:400}
.bib-backref{font-family:'DM Mono',monospace;font-size:.78rem;color:var(--warm);white-space:nowrap;margin-left:.35em}
.bib-backref:hover{color:var(--accent)}
a.bib-ref{font-family:'DM Mono',monospace;font-size:.8rem;color:var(--warm);text-decoration:none;white-space:nowrap}
a.bib-ref:hover{color:var(--accent)}
.bib-check{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.08em;color:var(--dim);margin-left:.35rem}
/* Notes page (@notes) — grouped by chapter, styled like the glossary: bold chapter head,
   indented secondary entries trailed by a mono back-link chip. */
.note-entries-root{margin-top:.5rem;font-size:.95rem}
.note-group-head{font-size:1rem;font-weight:600;margin:1.25rem 0 .3rem 0;color:var(--ink)}
.note-group-head a{color:var(--ink)}
.note-group-head a:hover{color:var(--warm)}
/* Each note: a head line of "section-number  Chapter Title" (the number is the backlink),
   then the note text indented on the next line. */
.note-row{margin:.3rem 0 .9rem 0;line-height:1.55}
.note-row[id]{scroll-margin-top:5rem}
.note-head{display:flex;gap:.75rem;align-items:baseline}
.note-num{flex-shrink:0;min-width:5ch;font-family:'DM Mono',monospace;font-size:.78rem;color:var(--warm);white-space:nowrap}
.note-num:hover{color:var(--accent)}
.note-pod-title{font-weight:600;color:var(--ink)}
.note-pod-title:hover{color:var(--warm)}
.note-text{margin:.15rem 0 0 1.5rem}
.note-text a{color:var(--link)}
.note-text a:hover{color:var(--warm)}
/* "By chapter" bibliography view: a section-number divider (mirroring the glossary's),
   then that chapter's references sorted by author. No number/tag gutter — the author name
   itself is the backlink. */
.bib-chapter-head{font-family:'DM Mono',monospace;font-size:.78rem;color:var(--warm);white-space:nowrap;margin:1.25rem 0 .35rem 0;padding-bottom:.2rem;border-bottom:1px solid var(--line)}
.bib-chapter-head:first-child{margin-top:0}
.bib-chapter-head a{color:var(--warm)}
.bib-chapter-head a:hover{color:var(--accent)}
.bib-row-chapter{margin:.3rem 0 .9rem 0;line-height:1.55;font-size:.95rem}
.bib-row-chapter[id]{scroll-margin-top:5rem}
.bib-author-link{color:var(--ink)}
.bib-author-link:hover .bib-authors{color:var(--warm)}
/* Bibliography annotations (migrated footnote prose), indented like glossary defs */
.bib-comments{margin:.3rem 0 0 1.5rem}
.bib-comment-block{margin-bottom:.55rem;line-height:1.55}
.bib-comment-block:first-child{margin-top:.1rem}
.bib-comment-block:last-child{margin-bottom:0}
.bib-comment-block a{color:var(--link)}
.bib-comment-block a:hover{color:var(--warm)}
.bib-comment-block a.bib-backref{color:var(--warm)}
.bib-comment-block a.bib-backref:hover{color:var(--accent)}
/* Images page — tight 4-column thumbnail grid (contact sheet); drops to 2 columns when narrow. */
.img-entries-root{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;margin-top:.5rem}
@media (max-width:640px){.img-entries-root{grid-template-columns:repeat(2,1fr)}}
.img-entry{display:flex;flex-direction:column;gap:.3rem;font-size:.8rem}
/* Fixed-height slot with the image pinned to the bottom, so captions line up across a row. */
.img-thumb{display:flex;align-items:flex-end;justify-content:center;height:120px}
.img-thumb img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border:1px solid var(--line);border-radius:3px;display:block}
.img-caption{line-height:1.35}
.img-credit{color:var(--dim);font-size:.74rem}
.img-credit cite{font-style:italic;margin-right:.5em}
.img-backref{font-family:'DM Mono',monospace;font-size:.75rem;color:var(--warm);white-space:nowrap;margin-right:.35em}
.img-backref:hover{color:var(--accent)}
/* Table of contents (@toc) — nested numbered list */
.toc-root{font-size:.98rem}
.toc-list{list-style:none;margin:0;padding:0}
/* Depth indent rides on each row's own left padding (set inline, by depth), NOT on a
   margin of the nested list — that keeps every row's hue background flush to the left
   margin so the colour fills the row full-width with only the text pushed in. */
/* `-webkit-touch-callout` off so a long press on a leaf `<a>` opens the chapter (our gesture)
   rather than raising iOS/WKWebView's link-preview menu; `user-select` off so the press doesn't
   start a text selection. */
.toc-chapter,.toc-section-head,.toc-section-line{display:flex;align-items:baseline;gap:.1rem;padding:.22rem 0;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.toc-section{line-height:1.5}
.toc-num{display:inline-block;min-width:3ch;font-family:'DM Mono',monospace;font-size:.8rem;color:var(--warm)}
.toc-filenum{font-family:'DM Mono',monospace;font-size:.62rem;color:var(--dim)}
.toc-section-name{font-weight:600;color:var(--ink)}
.toc-chapter-title{color:var(--link)}
/* The clickable body fills the row so the whole row (everything but the toggle arrow)
   is the hit target; it opens the page (chapter / section Overview) or, for a nested
   section with no Overview page, toggles like the arrow. */
.toc-row-body{flex:1 1 auto;display:flex;align-items:baseline;gap:.4rem;min-width:0;background:none;border:none;font:inherit;color:inherit;text-align:left;cursor:pointer;padding:0}
.toc-row-static{cursor:default}
.toc-row-body:hover .toc-section-name,.toc-row-body:hover .toc-chapter-title{color:var(--warm)}
.toc-row-static:hover .toc-chapter-title{color:var(--link)}
/* Treeview: any section with children collapses/expands; the caret rotates, children hide. */
.toc-controls{display:flex;gap:.5rem;margin-bottom:.7rem}
.toc-ctl-btn{font-family:'DM Mono',monospace;font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);background:none;border:1px solid var(--line);border-radius:3px;padding:.2rem .5rem;cursor:pointer}
.toc-ctl-btn:hover{color:var(--warm);border-color:var(--warm)}
.toc-toggle{display:inline-flex;align-items:baseline;gap:.1rem;flex-shrink:0;background:none;border:none;color:inherit;font:inherit;cursor:pointer;padding:0;text-align:left}
/* The caret itself: a fixed-width, larger glyph so the arrow reads clearly and
   every row's number aligns to the same column (leaf rows use a same-width spacer). */
.toc-arrow{display:inline-block;flex-shrink:0;width:1.6rem;text-align:center;color:var(--dim);font-size:1.4rem;line-height:1;transition:transform .15s}
.toc-toggle-spacer{display:inline-block;flex-shrink:0;width:1.6rem}
.toc-toggle:hover .toc-arrow,.toc-row-toggle:hover .toc-arrow{color:var(--warm)}
.toc-collapsed > .toc-section-head .toc-arrow{transform:rotate(-90deg)}
.toc-collapsed > .toc-list{display:none}
/* By-pod table view: sortable header columns (click to sort, arrow shows direction). */
.toc-table{margin-top:.4rem}
.toc-table .toc-th{padding:0;cursor:pointer}
.toc-table .toc-th-btn{display:inline-flex;align-items:center;gap:.3ch;font:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit;background:none;border:none;padding:.8rem 1rem .8rem 0;cursor:pointer}
.toc-table .toc-th:hover .toc-th-btn{color:var(--accent)}
.toc-table .toc-th-active .toc-th-btn{color:var(--ink)}
.toc-sort-ind::after{content:"";color:var(--dim)}
.toc-th-active .toc-sort-ind::after{content:"\2191"}
.toc-th-active.toc-th-desc .toc-sort-ind::after{content:"\2193"}
.toc-table .toc-tbl-pod,.toc-table .toc-tbl-chap{font-family:'DM Mono',monospace;font-size:.8rem;color:var(--warm);white-space:nowrap}
.toc-table a.toc-tbl-title{color:var(--link)}
.toc-table a.toc-tbl-title:hover{color:var(--warm)}
/* Section Overview pages: thumbnail list of the section's chapters. */
.ov-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.ov-row{display:flex;gap:1rem;align-items:flex-start;padding:.7rem 0;border-bottom:1px solid var(--line);color:inherit;cursor:pointer}
.ov-row:hover{background:rgba(0,0,0,.025)}
.ov-row-body{min-width:0}
/* Title link: the row itself is a <div> (the argument can hold glossary <a>s, so the row can't be one). The title carries the link; keep it visually plain like the old full-row anchor. */
.ov-row-link{color:inherit;text-decoration:none}
.ov-title{font-size:1.15rem;line-height:1.3}
.ov-num{font-family:'DM Mono',monospace;font-size:.8rem;color:var(--warm);margin-right:.15rem}
.ov-argument{font-size:.9rem;line-height:1.45;color:var(--ink);margin-top:.2rem;font-style:italic}
.toc-unresolved{color:var(--dim)}
/* Anchor scroll offset for ref targets linked from glossary/bibliography */
.ref-entry[id]{scroll-margin-top:5rem}
/* Note markers (superscript number at the @note call site, links to the notes page) */
.note-mark a{font-family:'DM Mono',monospace;font-size:.65rem;color:var(--warm);text-decoration:none;padding:0 .1rem;scroll-margin-top:5rem}
.note-mark a:hover{color:var(--accent)}
/* Glossary */
.gloss-sort-section{margin-top:0}
.gloss-entry{margin-bottom:1.25rem;font-size:.95rem}
.gloss-entry-flat{margin-bottom:.75rem}
.gloss-term-line{margin-bottom:.3rem}
.gloss-term{font-weight:600;font-size:1rem}
.gloss-defs{margin-left:1.5rem}
.gloss-def-block{margin-bottom:.55rem;line-height:1.55}
.gloss-def-block:last-child{margin-bottom:0}
.gloss-backref{font-family:'DM Mono',monospace;font-size:.78rem;color:var(--warm);white-space:nowrap;margin-left:.35em}
.gloss-backref:hover{color:var(--accent)}
.gloss-ref{color:var(--link)}
.gloss-ref:hover{color:var(--warm)}
.gloss-in{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.08em;margin-right:.35rem}
.gloss-def-block a{color:var(--link)}
.gloss-def-block a:hover{color:var(--warm)}
.gloss-def-block a.gloss-backref{color:var(--warm)}
.gloss-def-block a.gloss-backref:hover{color:var(--accent)}
/* "By chapter" glossary view: a section-number divider, then terms listed
   "Term -- definition" sorted alphabetically within the chapter. */
.gloss-chapter-head{font-family:'DM Mono',monospace;font-size:.78rem;color:var(--warm);white-space:nowrap;margin:1.25rem 0 .35rem 0;padding-bottom:.2rem;border-bottom:1px solid var(--line)}
.gloss-chapter-head:first-child{margin-top:0}
.gloss-chapter-head a{color:var(--warm)}
.gloss-chapter-head a:hover{color:var(--accent)}
/* Entries under a chapter divider reuse the by-term layout (.gloss-entry/.gloss-defs/
   .gloss-def-block): bold black term, definitions indented beneath, generous spacing. */
/* @explainer links appended after a term's definitions in the glossary. */
.gloss-explainer{margin-left:1.5rem;margin-top:.4rem;line-height:1.5;font-size:.95rem}
.gloss-explainer-link{font-family:'DM Mono',monospace;font-size:.76rem;letter-spacing:.04em;color:var(--link);border:1px solid var(--line);border-radius:3px;padding:.05rem .45rem}
.gloss-explainer-link:hover{color:var(--warm);border-color:var(--warm)}
.gloss-explainer-note{color:var(--dim);font-style:italic}
/* Further reading (chapter page) */
.ref-heading{margin-top:1.5rem}
.ref-list{margin-top:1rem}
.ref-entry{margin-bottom:.6rem;font-size:.95rem}
/* Chapter page */
.subject-header{padding:1.5rem 0}
.premise{font-size:1.15rem;font-style:italic;margin-top:1.2rem;line-height:1.5}
.subject-tags{margin-top:1.5rem}
.subject-nav-row{display:flex;align-items:baseline;justify-content:flex-start;margin:0 0 .6rem;gap:.5rem}
.header-nav-prev,.header-nav-next{font-size:.8rem;line-height:1;font-weight:600;color:var(--dim);padding:.2rem .25rem;flex-shrink:0}
.header-nav-prev:hover,.header-nav-next:hover{color:var(--warm)}
.header-nav-disabled{color:color-mix(in srgb, var(--dim) 35%, transparent);pointer-events:none}
.header-nav-num{font-family:'DM Mono',monospace;font-size:.78rem;letter-spacing:.08em;color:var(--warm);text-transform:uppercase;flex:0 0 auto;text-align:center}
a.header-nav-num{cursor:pointer}
a.header-nav-num:hover{color:var(--ink)}
/* Chapter content sections */
.subject-section{scroll-margin-top:5rem;padding:1.2rem 0;border-top:1px solid var(--line);clear:both}
.subject-section:first-of-type{border-top:none;padding-top:.75rem}
.section-heading{font-size:1.1rem;font-weight:400;font-family:'DM Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--warm);margin-bottom:1.5rem}
.map-matrix{display:inline-block;border-collapse:collapse;margin:2rem 0;font-size:.7rem;line-height:1}
.map-matrix th,.map-matrix td{border:1px solid var(--line);width:1.4rem;text-align:center;vertical-align:middle;padding:0;line-height:1}
.map-matrix th{font-family:'DM Mono',monospace;font-weight:400}
.map-matrix .map-cell-linked{background:var(--accent);color:var(--paper)}
.map-matrix .map-cell-empty{background:var(--paper)}
.map-matrix .map-row-label,.map-matrix .map-col-label{font-family:'DM Mono',monospace}
.map-graph-filters{position:sticky;z-index:90;top:60px;background:var(--paper);padding:.4rem 0 .5rem;border-bottom:1px solid var(--line);margin-bottom:0}
.map-controls-top{display:flex;align-items:center;gap:.75rem;margin-bottom:.45rem;font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.map-controls-divider{display:inline-block;border-left:1px solid var(--line);height:.9rem;margin:0 .5rem}
.map-selection-info{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.05em;color:var(--dim);margin-left:.25rem}
.map-filter-row{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem 1rem;font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase}
.map-filter-row--status{margin-top:.6rem}
.map-cb-label{display:inline-flex;align-items:center;gap:.3rem;cursor:pointer;color:var(--dim)}
.map-cb-label--cat{background:var(--cb-cat-bg,transparent);padding:.15rem .45rem;border-radius:3px}
.map-cb-label input{margin:0;cursor:pointer}
.map-row-btns{display:inline-flex;align-items:center;gap:.5rem;margin-left:1.5rem;flex-shrink:0}
.map-row-btn{font-family:'DM Mono',monospace;font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);background:none;border:none;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:2px;opacity:.55}
.map-row-btn:hover{color:var(--warm);opacity:1}
.map-zoom-btn{font-family:'DM Mono',monospace;font-size:.85rem;line-height:1;padding:.05rem .35rem;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer}
.map-zoom-btn:hover{background:var(--accent);color:var(--paper)}
.map-zoom-label{color:var(--dim)}
.map-zoom-level{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.05em;color:var(--ink);min-width:3rem}
.map-graph-wrap{display:block;margin:0;overflow:auto;touch-action:pan-x pan-y}
.map-graph-inner{display:inline-block;line-height:0}
.map-graph-svg{display:block}
.map-graph-edge{stroke:var(--line);stroke-width:2.25;fill:none}
.map-graph-bullet{stroke-width:1.5}
.map-graph-bullet-exit{fill:var(--line)}
.map-graph-bullet-enter{fill:var(--link)}
.map-graph-key-item{display:inline-flex;align-items:center;gap:.35rem}
.map-graph-key-dot{width:.6rem;height:.6rem;border-radius:50%;flex-shrink:0}
.map-graph-key-from{background:var(--line)}
.map-graph-key-to{background:var(--link)}
.map-graph-node-wrap{cursor:grab}
.map-graph-node-wrap:active{cursor:grabbing}
.map-graph-node{fill:var(--paper);stroke:var(--accent);stroke-width:1.5}
.map-graph-label{font-family:'DM Mono',monospace;font-size:.5rem;fill:var(--ink)}
.map-graph-node-link{color:inherit}
.map-graph-node-link:hover .map-graph-node{stroke:var(--warm);stroke-width:2}
.cta{background:var(--accent);color:var(--paper);padding:1.4rem 1.8rem;margin-top:2rem;font-size:1rem;line-height:1.7;font-style:italic}
.related-section{margin-top:3rem;padding-top:2rem;border-top:1px solid var(--line);clear:both}
.subject-section .related-section{margin-top:1.5rem;padding-top:0;border-top:none}
.related-label{margin-bottom:.5rem}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1rem;margin-top:1rem}
.related-card{border:1px solid var(--line);padding:.6rem .75rem;color:inherit;transition:border-color .2s}
.related-card.cat-colored{background:var(--cat-bg);border-color:transparent}
.related-card:hover{border-color:var(--accent)}
.related-card-prelim{border-color:var(--line)}
.related-card-prelim:hover{border-color:var(--warm)}
.related-title{font-size:.95rem;font-weight:300}
.inbound-refs{margin-top:1.25rem;display:flex;align-items:baseline;gap:.75rem;flex-wrap:wrap}
.inbound-label{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);flex-shrink:0}
.inbound-links{display:flex;gap:.5rem;flex-wrap:wrap}
.inbound-link{font-family:'DM Mono',monospace;font-size:.75rem;color:var(--warm);padding:.1rem .3rem;border-radius:2px}
.inbound-link:hover{color:var(--accent)}
.inbound-link.cat-colored{background:var(--cat-bg);color:var(--ink)}
.inbound-link.cat-colored:hover{color:var(--accent)}
.placeholder{font-style:italic}
.proto-notice{margin-bottom:1.5rem;padding-left:1rem;border-left:3px solid var(--line);font-size:.95rem}
.proto-notice .dim{font-style:italic}
.rough-notice{margin-bottom:1.5rem;padding-left:1rem;border-left:3px solid var(--line);font-size:.95rem}
.rough-notice .dim{font-style:italic}
.warn-notice{margin-bottom:1.5rem;padding-left:1rem;border-left:3px solid var(--line);font-size:.95rem;font-style:italic}
.script-direction{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;margin-top:1.5rem}
.script-punch{font-size:1.3rem;font-style:italic;color:var(--accent);margin-top:1.5rem}
.script-line{margin-bottom:.6rem}
/* Group page */
.group-block{margin-bottom:3rem}
.group-label{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);padding:2rem 0 .8rem;border-top:1px solid var(--line)}
.seed-row{display:flex;gap:1rem;align-items:flex-start;padding:1.2rem 0;border-bottom:1px solid var(--line);color:inherit}
.seed-row.stub{opacity:.4}
.seed-row-thumb{flex-shrink:0}
.seed-row-thumb--empty{width:4rem;height:4rem}
.seed-thumb{width:4rem;height:4rem;object-fit:cover;display:block;border-radius:2px}
.seed-row-body{min-width:0}
.seed-title{font-size:1.2rem;font-weight:300;margin-bottom:.2rem}
.seed-title a{color:inherit;text-decoration:none}
.seed-title a:hover{color:var(--link)}
.seed-sub{font-size:.85rem;line-height:1.4}
.seed-status{font-family:'DM Mono',monospace;font-size:.7em;letter-spacing:.1em;text-transform:uppercase;color:var(--warm);opacity:.9}
.seed-byline-unit{white-space:nowrap}
/* About pages */
.page-body{padding:1.5rem 0}
.page-body p{font-size:1.1rem;line-height:1.8;margin-bottom:1.2rem}
.page-body h2{font-size:1.4rem;font-weight:400;color:var(--accent);margin:2.5rem 0 .8rem}
.page-body h3,.prose h3,.subject-section h3{font-family:'DM Mono',monospace;font-size:1.1rem;letter-spacing:.06em;text-transform:none;color:var(--ink);font-weight:400;margin:3rem 0 .8rem}
.page-body ul{margin-left:1.5rem;margin-bottom:1.2rem}
.page-body li{font-size:1.05rem;line-height:1.7;margin-bottom:.4rem}
/* Trails page: compact lists */
.trails-list ol,.trails-list ul{margin-left:2.5rem;margin-bottom:1rem;list-style:none;padding-left:0}
.page-body .trails-list li{font-size:.95rem;line-height:1.3;margin-bottom:0;padding:0}
.page-body .trails-list li p{margin:0;padding:0;line-height:1.3}
/* Index (home page from home.md: h4=notice, h1=title, h2=tagline, p=purpose, h3=about heading) */
.page-body.home-page{padding:2rem 0 2rem}
.page-body.home-page > h3:first-child{margin-top:0}
.page-body.home-page h4{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);font-weight:400;margin-bottom:1.5rem}
.page-body.home-page h1{font-size:clamp(2rem,5vw,3.5rem);font-weight:300;line-height:1.1}
.page-body.home-page h2{font-size:1.2rem;font-weight:400;margin-top:1rem;max-width:520px;line-height:1.6}
.page-body.home-page h2:not(:first-of-type){margin-top:2.5rem}
.page-body.home-page p{font-size:1rem;margin-top:1.25rem;max-width:580px;line-height:1.65}
.page-body.home-page h3{font-family:'DM Mono',monospace;font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:var(--warm);font-weight:400;margin:1rem 0 1.2rem}
.hero{padding:5rem 0 2rem}
.hero-notice{display:block;margin-bottom:1.5rem}
.hero-tagline{font-size:1.2rem;margin-top:1rem;max-width:520px;line-height:1.6}
.hero-purpose{font-size:1rem;margin-top:1.25rem;max-width:580px;line-height:1.65}
.hero-stats{display:flex;gap:3rem;margin-top:3rem;padding-top:2rem;border-top:1px solid var(--line)}
.hero-stat-label{font-size:.85rem;margin-top:.2rem}
.seed-list-section{padding:0 0 4rem}
.section-head{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:.8rem;margin-bottom:.5rem}
.link-mono-small{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase}
.link-mono-small:hover{color:var(--accent)}
.seed-list-more-wrap{padding:1.5rem 0}
.link-mono-accent{font-family:'DM Mono',monospace;font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:var(--accent)}
.link-mono-accent:hover{color:var(--ink)}
.about-block{padding:2.5rem 0;border-top:1px solid var(--line)}
.about-block-label{margin-bottom:1.2rem}
.about-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.8rem}
.about-card{padding:.8rem;border:1px solid var(--line);font-size:.95rem;display:block}
.about-card:hover{color:var(--accent);border-color:var(--accent)}
/* Repository */
.repo-intro{margin-top:.8rem;font-size:.95rem}
.repo-cell-mono{font-size:.8rem}
.repo-subtitle{font-size:.82rem}
.repo-date{font-size:.75rem}
.repo-tags{font-size:.8rem}
.repo-list-title{font-size:1.05rem;font-weight:400;margin-bottom:.25rem}
.repo-list-title a:hover{color:var(--accent)}
.repo-list-meta{font-size:.85rem;line-height:1.5}
.repo-list-meta .repo-subtitle{font-size:inherit}
.repo-list-meta .tag{margin-right:.25rem}
/* Tags page (index) */
.index-section-head{font-family:'DM Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--warm);padding:2rem 0 .8rem;border-top:1px solid var(--line);margin-top:2rem}
.index-by-tag{margin-top:1rem}
.index-tag-rule{border:none;border-top:1px solid var(--dim);margin:0;padding:0}
.index-entry-rule{display:none}
.index-tag-name{font-weight:700;font-size:1rem;font-family:'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--warm);scroll-margin-top:5rem;padding:.5rem 0}
.index-entry{padding:.15rem 0;padding-left:1.25rem}
.index-entry:has(.index-entry-body){display:flex;gap:1rem;align-items:flex-start}
.index-entry-body{min-width:0;line-height:1.35}
.index-entry-body .repo-subtitle{display:block;margin-top:0}
.index-entry a:hover{color:var(--accent)}
.seed-categories .index-entry{padding-left:1.25rem}
.seed-categories{padding-top:.5rem;margin-top:0}
.category-entry{display:flex;gap:1rem;align-items:flex-start;padding:.5rem 0 .5rem 1.25rem}
.category-entry-body{flex:1;min-width:0;line-height:1.35}
.category-entry-title{font-size:1rem;font-weight:400}
.category-entry-title a:hover{color:var(--accent)}
.category-entry-argument{font-size:.85rem;line-height:1.45;color:var(--ink);margin-top:.2rem;font-style:italic}
.categories-toggle-btns{margin-left:0;margin-bottom:.75rem}
/* Match the dark-brown weight of generated ### headings (e.g. home's "work in progress"). */
.categories-count{text-decoration:none;cursor:default;opacity:1;color:var(--warm)}
.categories-toggle-btns .map-row-btn{color:var(--warm);opacity:1}
details.category-group{margin-top:1rem}
details.category-group:first-of-type{margin-top:0}
details.category-group summary.index-tag-name{cursor:pointer;list-style:none;margin-bottom:.2rem}
details.category-group summary.index-tag-name::-webkit-details-marker{display:none}
.cat-toggle-icon::before{content:'▸\00a0'}
details.category-group[open] .cat-toggle-icon::before{content:'▾\00a0'}
/* Page end logo */
.page-end{margin-top:7rem;margin-bottom:2rem;text-align:center}
.page-end-logo{display:inline-block;opacity:.5;transition:opacity .2s;background:none;border:none;padding:0;cursor:pointer}
.page-end-logo:hover{opacity:.85}
.page-end-logo img{display:block}
.page-end-version{display:block;margin-top:.35rem;font-size:.75rem;opacity:0;visibility:hidden;transition:opacity .15s,visibility .15s}
.page-end.page-end-version-visible .page-end-version,.page-end-version.page-end-version-visible{opacity:.7;visibility:visible}
/* Mobile simulation (?mobile query param) */
.mobile-sim{font-size:15px}
.mobile-sim body{font-family:'Inter',system-ui,sans-serif;line-height:1.6}
.mobile-sim h1{font-size:clamp(1.6rem,8vw,2.4rem)}
.mobile-sim h2{font-size:1.35rem}
.mobile-sim .nav-row,.mobile-sim .wrap{padding-left:.75rem;padding-right:1.5rem}
.mobile-sim .wrap--list{margin-left:1.5rem;margin-right:1.5rem}
.mobile-sim .section-tabs-inner{padding:.25rem 1.5rem .25rem .75rem}
.mobile-sim .nav-logo{font-size:.62rem;line-height:1.15;margin-left:0;padding-left:0}
.mobile-sim .nav-links .nav-link-item{display:none}
.mobile-sim .nav-row{position:relative}
.mobile-sim nav{position:relative}
.mobile-sim .section-tab{font-size:.70rem;letter-spacing:.05em;padding:.25rem .25rem}
.mobile-sim .section-tabs-prev,.mobile-sim .section-tabs-next{font-size:.85rem;padding:.25rem .1rem}
.mobile-sim .search-dialog-input{font-size:16px}

/* Pending edit blocks: rendered when a file has an @edit-proposal(...) markup
   that hasn't been accepted or rejected yet. Word-level diff: removed text gets
   strikethrough red, added text gets green highlight. Container has a subtle
   warm tint and a left border so it reads as "pending state" without
   dominating the page. */
.pending-edit{
  border-left:3px solid #d0a000;
  background:#fffefa;
  padding:.4rem .6rem;
  margin:.5rem 0;
  border-radius:4px;
}
.pending-edit-removed{
  color:#a00;
  text-decoration:line-through;
  text-decoration-color:rgba(170,0,0,.55);
}
.pending-edit-added{
  color:#0a6;
  background:#eaffea;
  border-radius:2px;
  padding:0 .15em;
}
.pending-edit p:last-child,
.pending-edit ul:last-child,
.pending-edit ol:last-child{margin-bottom:0}

/* Browse @comment markers: the selected text, wrapped in place by the builder
   (<span class="comment" data-comment-*>). Visible + styleable with no app JS, so it
   degrades gracefully on export / old clients; the phase-2 client enhances these. */
.comment{
  background:rgba(255,224,138,.40);
  border-bottom:1px dotted #b9912f;
  cursor:help;
}
.comment[data-comment-status="accepted"],
.comment[data-comment-status="rejected"]{
  background:transparent;
  border-bottom:none;
}
.comment:hover{
  background:rgba(255,224,138,.70);
}
/* Pure-CSS note preview on hover (no JS); the rich UI comes later. */
.comment[data-comment-note]:hover::after{
  content:attr(data-comment-author) " \00b7 " attr(data-comment-note);
  position:absolute;
  margin-top:1.5em;
  margin-left:-0.5em;
  z-index:50;
  max-width:28em;
  white-space:normal;
  background:#2b2b2b;
  color:#fff;
  font-size:.8rem;
  line-height:1.35;
  padding:.4em .6em;
  border-radius:6px;
  box-shadow:0 2px 10px rgba(0,0,0,.3);
}

/* --- project overrides --- */
/* ---------------------------------------------------------------------------
 *  config/site.css — codex CSS overrides
 *
 *  This file is appended on top of the server's baseline `site.css` when this
 *  codex is rendered. Anything you put here applies to THIS codex only and
 *  takes precedence over the baseline (later rules win, same specificity).
 *
 *  Examples you might add:
 *    body              { background: #fafafa; }   /* warmer paper      */
 *    .premise          { color: #2a2a2a; }        /* darker subtitle   */
 *    .subject-header   { padding-top: 2rem; }     /* roomier header    */
 *
 *  Leave this file empty (or delete it) to use the baseline CSS unchanged.
 *  Future baseline edits land automatically; nothing here is overwritten.
 * --------------------------------------------------------------------------- */

body{overflow-x:clip}.subject-header.cat-colored{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);background:var(--cat-bg)}.toc-chapter.toc-hue,.toc-section-head.toc-hue,.toc-section-line.toc-hue{background:var(--toc-hue);border-radius:5px;padding-left:.45rem;padding-right:.45rem}