/* Statute to Runtime: shared styles. Generated by build/build.py from build/kb-core.*. Edit the sources, not this file. */
:root{
  /* surface */
  --paper:#ECEEEA; --paper-2:#F6F7F4; --sunk:#E1E5DF; --veil:rgba(236,238,234,.86);
  /* ink */
  --ink:#1D2329; --ink-2:#4C5660; --ink-3:#737D86;
  /* rules */
  --rule:#C6CCC5; --rule-2:#D8DCD5;
  /* issuers (data encoding: who published the document) */
  --pdpc:#0E6E6A; --mas:#8A2D3B; --imda:#3F4BA8;
  --on-issuer:#F6F7F4;
  /* time signal: effective dates, today */
  --signal:#A8740A;
  /* type */
  --f-ui:"Archivo KB","Archivo","Helvetica Neue",Arial,system-ui,sans-serif;
  --f-read:"Literata KB","Literata",Georgia,"Times New Roman",serif;
  --t-2xs:.6875rem; --t-xs:.75rem; --t-sm:.875rem; --t-base:1rem; --t-read:1.0625rem;
  --t-md:1.25rem; --t-lg:1.5625rem; --t-xl:1.953rem; --t-2xl:2.441rem;
  --lh-read:1.68; --lh-ui:1.45;
  /* space (4px base) */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px; --s9:96px;
  /* shape: radius follows hierarchy (chip < control < panel) */
  --r-chip:3px; --r-ctl:5px; --r-panel:8px;
  --shadow-pop:0 1px 2px rgba(29,35,41,.08),0 12px 32px -8px rgba(29,35,41,.22);
  --gutter:clamp(16px,4vw,48px);
  --maxw:1280px;
  --head-h:60px;
  --ease:cubic-bezier(.2,.7,.1,1);
}
/* Bright by default; dark only when the reader picks it (theme button, remembered per browser) */
:root{color-scheme:light}
:root[data-theme="dark"]{
  color-scheme:dark;
  --paper:#151A20; --paper-2:#1C232A; --sunk:#11161B; --veil:rgba(21,26,32,.86);
  --ink:#E4E7E2; --ink-2:#B0B8BE; --ink-3:#88929A;
  --rule:#313B44; --rule-2:#262F37;
  --pdpc:#4FB3AC; --mas:#DE7A88; --imda:#919BEA; --on-issuer:#11161B;
  --signal:#E2B04A;
  --shadow-pop:0 1px 2px rgba(0,0,0,.4),0 16px 40px -8px rgba(0,0,0,.6);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--head-h) + 16px)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--t-base)/var(--lh-ui) var(--f-ui);
  font-kerning:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:2px}
::selection{background:color-mix(in oklab,var(--imda) 28%,transparent)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:var(--s4);top:-60px;z-index:100;background:var(--ink);color:var(--paper);padding:var(--s2) var(--s3);border-radius:var(--r-ctl)}
.skip:focus{top:var(--s3)}
.num{font-variant-numeric:tabular-nums lining-nums}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
/* The marginal-note grid: headings sit in the margin, like a statute's marginal notes */
.sect{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:clamp(24px,4vw,64px);
  padding-block:clamp(56px,8vw,112px);position:relative}
.sect::before,.foot .grid::before{content:"";position:absolute;top:0;left:var(--gutter);right:var(--gutter);height:1px;background:var(--rule)}
.sect > .margin{align-self:start;position:sticky;top:calc(var(--head-h) + 24px)}
.sect > .body{min-width:0}
@media (max-width:900px){
  .sect{grid-template-columns:1fr;row-gap:var(--s5)}
  .sect > .margin{position:static}
}
.margin h2{font:640 var(--t-lg)/1.15 var(--f-ui);font-stretch:96%;letter-spacing:-.01em;margin:0 0 var(--s3)}
.margin .note{font:400 .95rem/1.6 var(--f-read);color:var(--ink-2);margin:0 0 var(--s3);max-width:34ch}
.margin .aside{font:400 var(--t-xs)/1.5 var(--f-ui);color:var(--ink-3);margin:0;max-width:34ch}
@media (max-width:900px){.margin .note,.margin .aside{max-width:62ch}}

/* ---------- masthead ---------- */
.masthead{position:sticky;top:0;z-index:40;height:var(--head-h);background:var(--veil);
  -webkit-backdrop-filter:saturate(1.2) blur(10px);backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--rule)}
.masthead .wrap{height:100%;display:flex;align-items:center;gap:var(--s5)}
.brand{display:flex;align-items:center;gap:var(--s3);text-decoration:none;flex:none}
.brand svg{width:26px;height:26px}
.brand b{font:650 .975rem/1 var(--f-ui);font-stretch:112%;letter-spacing:-.005em}
.brand span{display:block;font:400 var(--t-2xs)/1.2 var(--f-ui);color:var(--ink-3);margin-top:3px;letter-spacing:.01em}
.topnav{display:flex;gap:var(--s1);margin-left:auto}
.topnav a{white-space:nowrap;font:500 var(--t-sm)/1 var(--f-ui);text-decoration:none;color:var(--ink-2);padding:9px 10px;border-radius:var(--r-ctl)}
.topnav a:hover{color:var(--ink);background:color-mix(in oklab,var(--ink) 6%,transparent)}
.tools{display:flex;gap:var(--s2);align-items:center}
.searchbtn{display:flex;align-items:center;gap:var(--s2);height:36px;padding:0 6px 0 10px;min-width:220px;
  border:1px solid var(--rule);background:var(--paper-2);border-radius:var(--r-ctl);color:var(--ink-3);cursor:pointer;font-size:var(--t-sm)}
.searchbtn:hover{border-color:var(--ink-3);color:var(--ink-2)}
.searchbtn svg{width:15px;height:15px;flex:none}
.searchbtn kbd,.kbd{margin-left:auto;font:500 var(--t-2xs)/1 var(--f-ui);border:1px solid var(--rule);border-bottom-width:2px;
  border-radius:4px;padding:4px 5px;color:var(--ink-3);background:var(--paper)}
.iconbtn{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--rule);background:var(--paper-2);border-radius:var(--r-ctl);cursor:pointer;color:var(--ink-2)}
.iconbtn:hover{color:var(--ink);border-color:var(--ink-3)}
.iconbtn svg{width:17px;height:17px}
@media (max-width:1240px){.searchbtn{min-width:0;width:36px;padding:0;justify-content:center}.searchbtn .lbl,.searchbtn kbd{display:none}.topnav a{padding:9px 7px}}
@media (max-width:1020px){.topnav{display:none}.tools{margin-left:auto}}
/* site menu: shown when the top navigation is hidden, and always on document pages */
.sitemenu{position:relative;display:none}
.sitemenu[data-always]{display:block}
@media (max-width:1020px){.sitemenu{display:block}}
.menubtn{display:flex;align-items:center;gap:7px;height:36px;padding:0 11px;border:1px solid var(--rule);background:var(--paper-2);border-radius:var(--r-ctl);cursor:pointer;color:var(--ink-2);font:560 var(--t-sm)/1 var(--f-ui)}
.menubtn:hover,.menubtn[aria-expanded="true"]{color:var(--ink);border-color:var(--ink-3)}
.menubtn svg{width:16px;height:16px}
.sitemenu nav{position:absolute;right:0;top:calc(100% + 8px);min-width:200px;padding:6px;background:var(--paper-2);border:1px solid var(--rule);border-radius:var(--r-panel,10px);box-shadow:var(--shadow-pop);display:grid;z-index:60}
.sitemenu nav[hidden]{display:none}
.sitemenu nav a{font:500 var(--t-sm)/1 var(--f-ui);text-decoration:none;color:var(--ink-2);padding:10px 12px;border-radius:var(--r-ctl);white-space:nowrap}
.sitemenu nav a:hover,.sitemenu nav a:focus-visible{color:var(--ink);background:color-mix(in oklab,var(--ink) 6%,transparent)}
.sitemenu nav a[aria-current="page"]{color:var(--ink);font-weight:650}
@media (max-width:420px){.menubtn span{display:none}.menubtn{width:36px;padding:0;justify-content:center}}
@media (max-width:620px){.brand span{display:none}.searchbtn{min-width:0;width:36px;padding:0;justify-content:center}.searchbtn .lbl,.searchbtn kbd{display:none}}

/* ---------- shared atoms ---------- */
.swatch{display:inline-block;width:10px;height:10px;border-radius:2px;background:var(--c,var(--ink-3));flex:none}
.docref{display:inline-flex;align-items:center;gap:6px;font:500 var(--t-sm)/1.3 var(--f-ui);color:var(--ink-2)}
.docref b{font-weight:620;color:var(--ink)}
.chip{display:inline-flex;align-items:center;gap:6px;font:500 var(--t-xs)/1 var(--f-ui);padding:6px 8px;border-radius:var(--r-chip);
  background:color-mix(in oklab,var(--c,var(--ink)) 9%,var(--paper-2));color:var(--ink);border:1px solid color-mix(in oklab,var(--c,var(--ink)) 22%,transparent)}
.status{display:inline-flex;align-items:center;gap:6px;font:500 var(--t-xs)/1 var(--f-ui);color:var(--ink-2)}
.status::before{content:"";width:8px;height:8px;border-radius:50%;border:1.5px solid var(--ink-3)}
.status[data-s="draft"]::before{border-color:var(--signal);background:linear-gradient(90deg,var(--signal) 50%,transparent 50%)}
.status[data-s="live"]::before{border-color:var(--pdpc);background:var(--pdpc)}
.btn{display:inline-flex;align-items:center;gap:var(--s2);height:38px;padding:0 14px;border-radius:var(--r-ctl);border:1px solid var(--ink);
  background:var(--ink);color:var(--paper);font:560 var(--t-sm)/1 var(--f-ui);text-decoration:none;cursor:pointer}
.btn:hover{background:color-mix(in oklab,var(--ink) 86%,var(--paper))}
.btn[aria-disabled="true"]{background:transparent;color:var(--ink-3);border-color:var(--rule);cursor:default}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--rule)}
.btn.ghost:hover{border-color:var(--ink-3)}
.tip{position:fixed;z-index:60;pointer-events:none;max-width:280px;background:var(--ink);color:var(--paper);
  font:400 var(--t-xs)/1.45 var(--f-ui);padding:8px 10px;border-radius:var(--r-ctl);box-shadow:var(--shadow-pop);opacity:0;transform:translateY(4px);transition:opacity .12s,transform .12s}
.tip.on{opacity:1;transform:none}
.tip b{font-weight:640}

/* ---------- command palette ---------- */
dialog.palette{padding:0;border:1px solid var(--rule);border-radius:var(--r-panel);background:var(--paper-2);color:var(--ink);
  width:min(680px,calc(100vw - 32px));margin-top:12vh;box-shadow:var(--shadow-pop)}
dialog.palette::backdrop{background:color-mix(in oklab,var(--sunk) 55%,transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.palette .field{display:flex;align-items:center;gap:var(--s3);padding:0 var(--s4);border-bottom:1px solid var(--rule)}
.palette .field svg{width:18px;height:18px;color:var(--ink-3);flex:none}
.palette input{flex:1;height:58px;border:0;background:transparent;color:var(--ink);font:400 1.125rem/1 var(--f-ui);outline:none}
.palette input::placeholder{color:var(--ink-3)}
.palette ul{list-style:none;margin:0;padding:var(--s2);max-height:min(52vh,460px);overflow:auto}
.palette li{display:grid;grid-template-columns:86px 1fr auto;gap:var(--s3);align-items:baseline;padding:10px 10px;border-radius:var(--r-ctl);cursor:pointer}
.palette li[aria-selected="true"]{background:color-mix(in oklab,var(--ink) 8%,transparent)}
.palette .kind{font:500 var(--t-2xs)/1.3 var(--f-ui);color:var(--ink-3)}
.palette .ttl{font:520 var(--t-sm)/1.35 var(--f-ui)}
.palette .ttl mark{background:none;color:inherit;text-decoration:underline;text-decoration-color:var(--signal);text-decoration-thickness:2px;text-underline-offset:3px}
.palette .sub{display:block;font:400 var(--t-xs)/1.4 var(--f-ui);color:var(--ink-3);margin-top:2px}
.palette .pg{font:500 var(--t-xs)/1 var(--f-ui);color:var(--ink-3)}
.palette .empty{padding:var(--s5) var(--s4);color:var(--ink-2);font:400 var(--t-sm)/1.5 var(--f-read)}
.palette .foot{display:flex;gap:var(--s4);padding:10px var(--s4);border-top:1px solid var(--rule);font:400 var(--t-2xs)/1 var(--f-ui);color:var(--ink-3)}
@media (max-width:620px){.palette li{grid-template-columns:1fr auto}.palette .kind{grid-column:1/-1}}

/* ---------- data-check banner (assert loud) ---------- */
.kb-alarm{position:fixed;left:16px;right:16px;bottom:16px;z-index:90;background:var(--mas);color:var(--on-issuer);padding:12px 14px;border-radius:var(--r-ctl);font:500 var(--t-sm)/1.45 var(--f-ui);box-shadow:var(--shadow-pop)}
.kb-alarm code{font:inherit;font-weight:650}

/* ---------- footer ---------- */
.foot{padding-bottom:var(--s7);color:var(--ink-2)}
.foot .grid{position:relative;padding-top:var(--s8);display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:clamp(24px,4vw,64px);row-gap:var(--s5)}
@media (max-width:900px){.foot .grid{grid-template-columns:1fr}}
.foot h2{font:620 var(--t-md)/1.2 var(--f-ui);margin:0 0 var(--s2);color:var(--ink)}
.foot p{font:400 var(--t-sm)/1.6 var(--f-read);margin:0 0 var(--s3);max-width:62ch}
.registry{width:100%;border-collapse:collapse;font:400 var(--t-sm)/1.4 var(--f-ui)}
.registry th,.registry td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--rule-2);vertical-align:baseline}
.registry th{font-weight:560;color:var(--ink-3);font-size:var(--t-xs)}
.registry td.file{color:var(--ink-3);font-size:var(--t-xs);word-break:break-all}
@media (max-width:620px){.registry .file,.registry .hide-s{display:none}}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}
@media print{.masthead,.tools,dialog,.kb-alarm{display:none!important}body{background:#fff;color:#000}}
.palette .foot .scope{flex-basis:100%;color:var(--ink-3);line-height:1.4}
.palette .foot{flex-wrap:wrap}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* =====================================================================
   DOC PAGES (shared by every docs/*.html) — added in Phase 1
   ===================================================================== */
@keyframes kbflash{0%,30%{background:color-mix(in oklab,var(--signal) 22%,transparent)}100%{background:transparent}}
.is-target{animation:kbflash 1.8s var(--ease)}

/* hero */
.dochero{padding-top:clamp(28px,5vw,64px);padding-bottom:var(--s6)}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;font:500 var(--t-xs)/1.4 var(--f-ui);color:var(--ink-3);margin:0 0 var(--s6)}
.crumbs a{color:var(--ink-2)}
.crumbs span[aria-hidden]{color:var(--rule)}
.issuerline{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font:560 var(--t-sm)/1.2 var(--f-ui);color:var(--ink-2);margin:0 0 var(--s4)}
.issuerline .swatch{width:14px;height:14px}
.dochero h1{font-family:var(--f-ui);font-weight:270;font-stretch:118%;font-size:clamp(2.3rem,6.6vw,5.6rem);line-height:.95;letter-spacing:-.032em;margin:0 0 var(--s4)}
.fulltitle{font:400 var(--t-md)/1.45 var(--f-read);color:var(--ink-2);margin:0 0 var(--s6);max-width:58ch}
.docmeta{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s4) var(--s5);margin:0 0 var(--s6);padding:var(--s4) 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.docmeta div{min-width:0}
.docmeta dt{font:500 var(--t-2xs)/1.3 var(--f-ui);color:var(--ink-3);margin-bottom:4px}
.docmeta dd{margin:0;font:540 var(--t-sm)/1.4 var(--f-ui)}
.docmeta dd small{display:block;font-weight:400;color:var(--ink-3);font-size:var(--t-xs)}
.answers{font:400 italic clamp(1.12rem,1.7vw,1.4rem)/1.5 var(--f-read);max-width:56ch;margin:0}
.answers::before{content:"Answers: ";font:560 var(--t-xs)/1 var(--f-ui);font-style:normal;color:var(--ink-3);vertical-align:3px}

/* band: full-width interactive zone with its own margin note */
.band{position:relative;padding-block:clamp(48px,7vw,96px)}
.band::before{content:"";position:absolute;top:0;left:var(--gutter);right:var(--gutter);height:1px;background:var(--rule)}

/* the reading grid: contents rail | content (main + marginalia rows) */
.docgrid{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(0,9.6fr);column-gap:clamp(24px,3.4vw,56px);padding-block:clamp(48px,7vw,96px);position:relative}
.docgrid::before{content:"";position:absolute;top:0;left:var(--gutter);right:var(--gutter);height:1px;background:var(--rule)}
.railbox{position:sticky;top:calc(var(--head-h) + 20px);align-self:start;max-height:calc(100vh - var(--head-h) - 40px);overflow:auto;overscroll-behavior:contain;padding-right:4px}
.railbox > summary{list-style:none;cursor:pointer;font:620 var(--t-sm)/1 var(--f-ui);padding:12px 0}
.railbox > summary::-webkit-details-marker{display:none}
.rail{list-style:none;margin:0;padding:0;font:400 var(--t-sm)/1.3 var(--f-ui)}
.rail a{display:grid;grid-template-columns:1fr auto;gap:8px;padding:6px 0 6px 10px;border-left:2px solid var(--rule-2);color:var(--ink-2);text-decoration:none}
.rail a:hover{color:var(--ink);border-left-color:var(--ink-3)}
.rail a[aria-current="true"]{color:var(--ink);font-weight:620;border-left-color:var(--ink)}
.rail a .p{font-size:var(--t-2xs);color:var(--ink-3);font-variant-numeric:tabular-nums;padding-top:2px}
.rail li.sub a{padding-left:22px;font-size:var(--t-xs)}
.rail li.grp{font:600 var(--t-2xs)/1.3 var(--f-ui);color:var(--ink-3);padding:14px 0 4px 10px}
.doccontent{min-width:0}
.doccontent > section{padding-bottom:var(--s7)}
.doccontent > section + section{padding-top:var(--s6);border-top:1px solid var(--rule-2)}
.blk{display:grid;grid-template-columns:minmax(0,6.6fr) minmax(0,3fr);column-gap:clamp(20px,3vw,44px);align-items:start}
.blk > .main{min-width:0;max-width:70ch}
.blk > aside{min-width:0;padding-top:6px}
@media (max-width:1100px){
  .docgrid{grid-template-columns:1fr}
  .railbox{position:static;max-height:none;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);margin-bottom:var(--s6)}
}
@media (max-width:860px){
  .blk{grid-template-columns:1fr}
  .blk > aside{padding-top:0;margin:0 0 var(--s4)}
}

/* reading type */
.doccontent h2{font:640 var(--t-xl)/1.12 var(--f-ui);font-stretch:94%;letter-spacing:-.015em;margin:0 0 var(--s3)}
.doccontent h2 .sn{font-weight:300;color:var(--ink-3);margin-right:.35em;font-variant-numeric:tabular-nums}
.doccontent h3{font:620 var(--t-md)/1.3 var(--f-ui);margin:var(--s6) 0 var(--s2)}
.doccontent h3 .pg{font:500 var(--t-xs)/1 var(--f-ui);color:var(--ink-3);margin-left:8px}
.doccontent p,.doccontent li{font:400 var(--t-read)/var(--lh-read) var(--f-read)}
.doccontent p{margin:0 0 var(--s4)}
.inbrief{font-size:1.16rem!important;line-height:1.6!important;color:var(--ink)}
.doccontent ul.plain{margin:0 0 var(--s4);padding-left:1.1em}
.doccontent ul.plain li{margin-bottom:6px}

/* clauses: source numbering kept, paraphrase in our words */
.clauses{list-style:none;margin:0 0 var(--s4);padding:0}
.clause{display:grid;grid-template-columns:3.4rem minmax(0,1fr);gap:var(--s3);padding:12px 0;border-top:1px solid var(--rule-2)}
.clause:last-child{border-bottom:1px solid var(--rule-2)}
.cl-n{font:600 var(--t-xs)/1.95 var(--f-ui);font-variant-numeric:tabular-nums;color:var(--ink-3);text-decoration:none}
a.cl-n:hover{color:var(--ink);text-decoration:underline}
.clause p{margin:0}
.clause .areas{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.clause .areas li{font-size:var(--t-base);line-height:1.55;padding-left:14px;position:relative}
.clause .areas li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:1px;background:var(--ink-3)}
.clause .areas b,.clause b.lbl{font:620 var(--t-sm)/1 var(--f-ui)}
.mod{font:620 var(--t-2xs)/1 var(--f-ui);padding:3px 5px;border-radius:var(--r-chip);border:1px solid var(--rule);color:var(--ink-2);vertical-align:2px;margin-right:6px;white-space:nowrap}
.mod[data-m="should"]{border-color:color-mix(in oklab,var(--c,var(--ink)) 45%,transparent);color:var(--ink)}
.mod[data-m="may"]{border-style:dashed}
.srctag{font:500 var(--t-2xs)/1 var(--f-ui);color:var(--ink-3);white-space:nowrap;margin-left:4px}

/* quotes, terms, cross-refs */
blockquote.src{margin:var(--s4) 0 var(--s5);padding:2px 0 2px var(--s4);border-left:2px solid var(--c,var(--ink))}
blockquote.src p{font:400 italic var(--t-read)/1.65 var(--f-read);margin:0 0 6px}
blockquote.src footer{font:500 var(--t-xs)/1.4 var(--f-ui);color:var(--ink-3)}
dfn[data-term]{font-style:normal;text-decoration:underline dotted 1.5px;text-decoration-color:var(--ink-3);text-underline-offset:3px;cursor:help;border-radius:2px}
dfn[data-term]:focus-visible{outline-offset:2px}
a.xref{display:inline-flex;align-items:center;gap:5px;font:560 var(--t-xs)/1 var(--f-ui);text-decoration:none;padding:4px 7px;border-radius:var(--r-chip);border:1px solid var(--rule);background:var(--paper-2);color:var(--ink);vertical-align:1px;white-space:nowrap}
a.xref:hover{border-color:var(--ink-3)}
a.xref .swatch{width:8px;height:8px}

/* callouts: kind encoded by label and border style, never by colour alone */
.co{margin:var(--s4) 0;padding:var(--s3) var(--s4);border-left:3px solid var(--ink);background:var(--paper-2);border-radius:0 var(--r-ctl) var(--r-ctl) 0}
.co > .k{display:block;font:620 var(--t-xs)/1.2 var(--f-ui);color:var(--ink-2);margin-bottom:6px}
.co p,.co li{font-size:var(--t-base)!important;line-height:1.6!important}
.co p:last-child{margin-bottom:0}
.co[data-k="must"]{border-left-color:var(--ink)}
.co[data-k="expected"]{border-left-color:var(--c,var(--mas))}
.co[data-k="practice"]{border-left:3px double var(--ink-3)}
.co[data-k="example"]{border-left:3px dotted var(--ink-3)}
.co[data-k="note"]{background:transparent;border:1px dashed var(--ink-3);border-left:3px dashed var(--ink-3)}
.co[data-k="note"] > .k::after{content:" (commentary, not from the source)";font-weight:400;color:var(--ink-3)}

/* marginalia */
.mnote{font:400 var(--t-sm)/1.55 var(--f-read);color:var(--ink-2);border-top:1px solid var(--rule);padding-top:var(--s2);margin:0 0 var(--s4)}
.mnote > b{display:block;font:620 var(--t-xs)/1.3 var(--f-ui);color:var(--ink);margin-bottom:4px}
.mnote p{font:inherit!important;margin:0 0 6px!important}
.mnote .xref{margin-top:4px}

/* figures */
.fig{margin:var(--s5) 0 var(--s6)}
.fig figcaption{font:400 var(--t-xs)/1.5 var(--f-ui);color:var(--ink-3);margin-top:var(--s3);max-width:70ch}
.fig figcaption .src{color:var(--ink-2);font-weight:560}

/* checklists (persistence handled by kb-core.js) */
.check{list-style:none;margin:0;padding:0}
.check li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:start;padding:10px 0;border-top:1px solid var(--rule-2)}
.check input{width:18px;height:18px;margin:3px 0 0;accent-color:var(--ink)}
.check label{font:400 var(--t-base)/1.55 var(--f-read);cursor:pointer}
.check li.done label{color:var(--ink-3);text-decoration:line-through;text-decoration-color:var(--rule)}
.check .ref{font:500 var(--t-2xs)/1.6 var(--f-ui);color:var(--ink-3);white-space:nowrap;text-align:right}
.meter{height:6px;border-radius:3px;background:var(--rule-2);overflow:hidden}
.meter i{display:block;height:100%;background:var(--ink);width:0;transition:width .3s var(--ease)}

/* comparison tables and timelines */
.cmp{width:100%;border-collapse:collapse;font:400 var(--t-sm)/1.45 var(--f-ui);margin:var(--s4) 0}
.cmp th,.cmp td{text-align:left;vertical-align:top;padding:10px 12px 10px 0;border-bottom:1px solid var(--rule-2)}
.cmp thead th{font-weight:600;color:var(--ink-3);font-size:var(--t-xs);border-bottom-color:var(--ink)}
.tline{list-style:none;margin:0;padding:0}
.tline li{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:var(--s4);padding:10px 0;border-top:1px solid var(--rule-2)}
.tline time{font:620 var(--t-sm)/1.5 var(--f-ui);font-variant-numeric:tabular-nums}
.tline li.future time{color:var(--signal)}

/* related strip at the end of a doc page */
.related{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--s5) var(--s6)}
.related h3{font:620 var(--t-sm)/1.3 var(--f-ui);margin:0 0 var(--s3)}
.related ul{list-style:none;margin:0;padding:0}
.related li{padding:8px 0;border-top:1px solid var(--rule-2);font:400 var(--t-sm)/1.45 var(--f-ui)}
.related li small{display:block;color:var(--ink-3);font-size:var(--t-xs)}

@media print{
  .railbox,.band .no-print{display:none!important}
  .docgrid{grid-template-columns:1fr}
  .blk{grid-template-columns:1fr}
  a.xref{border:0;padding:0}
}
@media (max-width:1100px){
  .railbox > summary{display:flex;justify-content:space-between;align-items:center}
  .railbox > summary::after{content:"Show";font:500 var(--t-xs)/1 var(--f-ui);color:var(--ink-2);text-decoration:underline;text-underline-offset:3px}
  .railbox[open] > summary::after{content:"Hide"}
}
@media (max-width:620px){
  .clause{grid-template-columns:2.4rem minmax(0,1fr);gap:var(--s2)}
}
.mod[data-m="must"]{border-color:var(--ink);color:var(--ink);font-weight:720}
.srctag a{color:inherit;text-decoration:none;border-bottom:1px dotted currentColor}
.srctag a:hover{color:var(--ink);border-bottom-style:solid}
.pnote{position:fixed;left:50%;bottom:18px;transform:translate(-50%,140%);display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;max-width:min(92vw,620px);padding:10px 14px;border-radius:var(--r-panel);background:var(--ink);color:var(--paper);font:500 var(--t-xs)/1.4 var(--f-ui);box-shadow:var(--shadow-pop);z-index:60;transition:transform .25s var(--ease);opacity:.97}
.pnote.on{transform:translate(-50%,0)}
.pnote a{color:var(--paper);font-weight:640}
.pnote button{all:unset;cursor:pointer;margin-left:auto;font-size:16px;line-height:1;padding:0 4px}
.pnote button:focus-visible{outline:2px solid var(--paper)}
@media print{.pnote{display:none}}
.stale{margin:calc(-1 * var(--s3)) 0 var(--s6);padding:10px 14px;border-left:3px solid var(--ink);background:var(--paper-2);font:400 var(--t-sm)/1.5 var(--f-ui);color:var(--ink-2);max-width:80ch}
.stale b{color:var(--ink);font-weight:680;margin-right:4px}
.srctag .pt{font-weight:700}
/* Official source line (under the document metadata) */
.offsrc{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:calc(-1 * var(--s4)) 0 var(--s6);font:400 var(--t-xs)/1.5 var(--f-ui);color:var(--ink-3);max-width:90ch}
.offsrc b{font-weight:600;color:var(--ink-2)}
.offsrc a{color:var(--ink);font-weight:560;text-decoration:none;border-bottom:1px solid var(--rule)}
.offsrc a:hover{border-bottom-color:currentColor}
.offsrc .sep{color:var(--ink-3)}
.offsrc .ed{flex-basis:100%}
/* Cite: shown with its passage on hover or focus; always faintly visible on touch screens */
.cite{all:unset;box-sizing:border-box;display:inline-block;margin-left:6px;padding:0 6px;border:1px solid var(--rule);border-radius:3px;font:540 var(--t-2xs)/1.6 var(--f-ui);color:var(--ink-3);cursor:pointer;opacity:0;transition:opacity .15s;vertical-align:1px}
:hover>.cite,.cite:focus-visible,.is-target .cite{opacity:1}
.cite:hover{color:var(--ink);border-color:var(--ink-3)}
.cite:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
@media (hover:none){.cite{opacity:.55}}
@media print{.cite,.offsrc .ed{display:none}}
@media (max-width:1100px){a.xref{white-space:normal;line-height:1.3;max-width:100%}}