@font-face{font-family:"Crimson Pro";src:url(/static/d/crimson-pro-regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:"Crimson Pro";src:url(/static/d/crimson-pro-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:"Crimson Pro";src:url(/static/d/crimson-pro-bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:"Fraunces";src:url(/static/d/fraunces-display.woff2) format("woff2");font-weight:300 600;font-style:normal;font-display:swap}@font-face{font-family:"Fraunces";src:url(/static/d/fraunces-display-italic.woff2) format("woff2");font-weight:300 600;font-style:italic;font-display:swap}@font-face{font-family:"Fraunces Fallback";src:local("Times New Roman"),local("TimesNewRomanPSMT"),local("Liberation Serif"),local("LiberationSerif"),local("Tinos"),local("Tinos-Regular"),local("Nimbus Roman"),local("NimbusRoman-Regular");size-adjust:106.33%;ascent-override:91.98%;descent-override:23.98%;line-gap-override:0%}
@font-face{font-family:"Instrument Sans";src:url(/static/d/instrument-sans-var.woff2) format("woff2");font-weight:400 700;font-stretch:75% 100%;font-display:swap}
:root{--paper:#F6F5F1;--sheet:#FFFFFF;--well:#EFEDE7;--ink:#10212F;--ink-2:#3B4955;--ink-3:#59656F;--rule:#DCD8CD;--rule-2:#BDB7A8;--grid:#E8E5DC;--signal:#C62F29;--signal-hover:#A02520;--on-signal:#FFFFFF;--link:#B12A24;--link-hover:#7E1D19;--contour:#A3653A;--contour-ink:#8A512A;--ga:#EB9079;--ga-ink:#96301F;--ga-deep:#6E1F14;--ga-tint:#FBE2D6;--on-ga:#10212F;--ga-1:#FDF3EE;--ga-2:#FBE2D6;--ga-3:#F8D2C3;--ga-4:#F3B7A2;--ga-5:#EE9C84;--tn:#2F5F8A;--tn-ink:#2C5880;--tn-deep:#16314F;--tn-tint:#D8E7F7;--on-tn:#FFFFFF;--tn-1:#F1F6FB;--tn-2:#D8E7F7;--tn-3:#C9DCEE;--tn-4:#A5C4E2;--tn-5:#7FA8D2;--sage:#3F8259;--sage-ink:#2B6A44;--sage-deep:#1C4A2F;--sage-1:#F2F7F3;--sage-2:#DAEEE1;--sage-3:#CBE2D2;--sage-4:#A9CEB5;--sage-5:#84B796;--gold:#A87908;--gold-ink:#7F5300;--gold-deep:#5C3C00;--gold-1:#FCF7EA;--gold-2:#FAEBCB;--gold-3:#F3DFB0;--gold-4:#E9C877;--gold-5:#DDB04A;--band-blue:#15365B;--foot-bg:#0E2238;--land:#E4E0D5;--land-line:#C9C3B4;--water:#F6F5F1;--c0:#FFFFFF;--c1:#FBDDD2;--c2:#F5B8A6;--c3:#EC8D76;--c4:#D2553F;--c5:#8E2A1C;--co-line:#B9B2A2;--ok:#2B6A44;--ok-tint:#E3F0E7;--warn:#7F5300;--warn-tint:#FAF0DA;--focus:#10212F;--control-edge:#857E70;--ghost:#8F897B;--t1:#C65A4F;--t1-ink:#822C25;--t1-tint:#FDEBE9;--t2:#B86A07;--t2-ink:#713F01;--t2-tint:#FFECDE;--t3:#967F0E;--t3-ink:#5B4C05;--t3-tint:#F5F1DC;--t4:#319751;--t4-ink:#005E28;--t4-tint:#E4F6E6;--t5:#0E9294;--t5-ink:#00595A;--t5-tint:#DCF6F6;--t6:#3284D0;--t6-ink:#054F89;--t6-tint:#E6F2FE;--t7:#8E6AC7;--t7-ink:#583A84;--t7-tint:#F2EDFE;--t8:#B95A93;--t8-ink:#782C5C;--t8-tint:#FFE9F4;--page:var(--paper);--font:"Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;--serif:"Crimson Pro", "Times New Roman", serif;--display:"Fraunces", "Fraunces Fallback", "Times New Roman", serif;--ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.65,0,.35,1);color-scheme:light;
  --fs-label:12px;--fs-fine:13px;--fs-small:15px;--fs-body:17px;--fs-lede:19px;--fs-block:21px;--bar:0px}
:root[data-theme=dark]{--paper:#0D1720;--sheet:#131F2A;--well:#0A131B;--ink:#E8ECEF;--ink-2:#B7C1CA;--ink-3:#97A4AF;--rule:#263544;--rule-2:#3A4B5B;--grid:#1A2733;--signal:#C62F29;--signal-hover:#A02520;--on-signal:#FFFFFF;--link:#FF9384;--link-hover:#FFC2B8;--contour:#C68A5E;--contour-ink:#E0A57A;--ga:#EE9A82;--ga-ink:#F6B8A6;--ga-deep:#FBD5C9;--ga-tint:#2A1B17;--on-ga:#10212F;--ga-1:#1F1613;--ga-2:#2A1B17;--ga-3:#3D241D;--ga-4:#5C3125;--ga-5:#7E4132;--tn:#78A6D2;--tn-ink:#A3C5E6;--tn-deep:#CFE1F3;--tn-tint:#16263A;--on-tn:#0D1720;--tn-1:#101C2A;--tn-2:#16263A;--tn-3:#1D3450;--tn-4:#274669;--tn-5:#335B87;--sage:#5FB07E;--sage-ink:#7CCB98;--sage-deep:#B4E3C4;--sage-1:#0F1D16;--sage-2:#13291D;--sage-3:#1B3A29;--sage-4:#255038;--sage-5:#31694A;--gold:#D9A441;--gold-ink:#E9B65C;--gold-deep:#F5D79A;--gold-1:#1F190D;--gold-2:#2A2112;--gold-3:#3D2F16;--gold-4:#58431C;--gold-5:#775A22;--band-blue:#122C4A;--foot-bg:#0A131C;--land:#1B2833;--land-line:#33444F;--water:#0D1720;--c0:#16222D;--c1:#A45845;--c2:#C06C57;--c3:#D8846D;--c4:#EF9F89;--c5:#FBD5C9;--co-line:#0D1720;--ok:#7CCB98;--ok-tint:#13291D;--warn:#E9B65C;--warn-tint:#2A2112;--focus:#E8ECEF;--control-edge:#6E8091;--ghost:#5E6B78;--t1:#E8796C;--t1-ink:#FEB6AB;--t1-tint:#36201D;--t2:#DB8833;--t2-ink:#F6BE8E;--t2-tint:#332214;--t3:#B99D14;--t3-ink:#DCCB86;--t3-tint:#2B2612;--t4:#54B66E;--t4-ink:#A0DCAC;--t4-tint:#1A2B1D;--t5:#17B4B6;--t5-ink:#7FDDDE;--t5-tint:#0E2C2C;--t6:#53A3F2;--t6-ink:#A2CFFF;--t6-tint:#192837;--t7:#AC89E8;--t7-ink:#D3BEFD;--t7-tint:#292335;--t8:#DB78B2;--t8-ink:#F6B3D8;--t8-tint:#331F2A;color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--paper:#0D1720;--sheet:#131F2A;--well:#0A131B;--ink:#E8ECEF;--ink-2:#B7C1CA;--ink-3:#97A4AF;--rule:#263544;--rule-2:#3A4B5B;--grid:#1A2733;--signal:#C62F29;--signal-hover:#A02520;--on-signal:#FFFFFF;--link:#FF9384;--link-hover:#FFC2B8;--contour:#C68A5E;--contour-ink:#E0A57A;--ga:#EE9A82;--ga-ink:#F6B8A6;--ga-deep:#FBD5C9;--ga-tint:#2A1B17;--on-ga:#10212F;--ga-1:#1F1613;--ga-2:#2A1B17;--ga-3:#3D241D;--ga-4:#5C3125;--ga-5:#7E4132;--tn:#78A6D2;--tn-ink:#A3C5E6;--tn-deep:#CFE1F3;--tn-tint:#16263A;--on-tn:#0D1720;--tn-1:#101C2A;--tn-2:#16263A;--tn-3:#1D3450;--tn-4:#274669;--tn-5:#335B87;--sage:#5FB07E;--sage-ink:#7CCB98;--sage-deep:#B4E3C4;--sage-1:#0F1D16;--sage-2:#13291D;--sage-3:#1B3A29;--sage-4:#255038;--sage-5:#31694A;--gold:#D9A441;--gold-ink:#E9B65C;--gold-deep:#F5D79A;--gold-1:#1F190D;--gold-2:#2A2112;--gold-3:#3D2F16;--gold-4:#58431C;--gold-5:#775A22;--band-blue:#122C4A;--foot-bg:#0A131C;--land:#1B2833;--land-line:#33444F;--water:#0D1720;--c0:#16222D;--c1:#A45845;--c2:#C06C57;--c3:#D8846D;--c4:#EF9F89;--c5:#FBD5C9;--co-line:#0D1720;--ok:#7CCB98;--ok-tint:#13291D;--warn:#E9B65C;--warn-tint:#2A2112;--focus:#E8ECEF;--control-edge:#6E8091;--ghost:#5E6B78;--t1:#E8796C;--t1-ink:#FEB6AB;--t1-tint:#36201D;--t2:#DB8833;--t2-ink:#F6BE8E;--t2-tint:#332214;--t3:#B99D14;--t3-ink:#DCCB86;--t3-tint:#2B2612;--t4:#54B66E;--t4-ink:#A0DCAC;--t4-tint:#1A2B1D;--t5:#17B4B6;--t5-ink:#7FDDDE;--t5-tint:#0E2C2C;--t6:#53A3F2;--t6-ink:#A2CFFF;--t6-tint:#192837;--t7:#AC89E8;--t7-ink:#D3BEFD;--t7-tint:#292335;--t8:#DB78B2;--t8-ink:#F6B3D8;--t8-tint:#331F2A;color-scheme:dark}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:84px;scroll-padding-bottom:calc(var(--bar) + 20px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:var(--fs-body);line-height:1.55;
  font-feature-settings:"kern","liga";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-wrap:break-word}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4,p,dl,dd,ol,ul,figure,table{margin:0}
ol,ul{padding:0;list-style:none}
a{color:var(--link);font-weight:600;text-decoration:none;transition:color .12s linear}
@media (hover: hover) and (pointer: fine){a:hover{color:var(--link-hover);text-decoration:none}}
a:focus,a:focus-visible,button:focus-visible,summary:focus-visible{text-decoration:none}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:3px}
:focus:not(:focus-visible){outline:none}
.more{display:inline-flex;align-items:center;gap:6px;min-height:44px}
.more .arr{flex:none;transition:transform .18s var(--ease)}
@media (hover: hover) and (pointer: fine){.more:hover .arr{transform:translateX(3px)}}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:12px;top:-80px;background:var(--ink);color:var(--paper);padding:10px 14px;border-radius:4px;z-index:60}
.skip:focus{top:12px;color:var(--paper)}
.num,.tnum{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum","lnum","kern"}
.nw{white-space:nowrap}

/* ---------- type: one scale ---------- */
.label{font-size:var(--fs-label);line-height:16px;font-weight:600;font-stretch:88%;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);font-feature-settings:"case","tnum"}
.h-display{font-size:clamp(36px,5.2vw,64px);line-height:1.04;font-weight:600;letter-spacing:-.022em;word-spacing:.06em;text-wrap:balance}
.h-section{font-size:clamp(28px,3.2vw,40px);line-height:1.1;font-weight:600;letter-spacing:-.018em;word-spacing:.05em;text-wrap:balance}
.h-block{font-size:var(--fs-block);line-height:1.25;font-weight:600;letter-spacing:-.005em;text-wrap:balance}
.f-display{font-family:var(--display);font-weight:430;font-synthesis:none;letter-spacing:-.012em;word-spacing:0;font-feature-settings:"kern","liga"}
.lede{font-size:var(--fs-lede);line-height:1.5;color:var(--ink-2);max-width:44ch;text-wrap:pretty}
.body{color:var(--ink-2);max-width:62ch;text-wrap:pretty}
.small{font-size:var(--fs-small);line-height:1.5;color:var(--ink-2)}
.fine{font-size:var(--fs-fine);line-height:1.45;color:var(--ink-3)}
p+p{margin-top:.8em}
p,li,dd,td,figcaption{text-wrap:pretty}

/* ---------- layout ---------- */
.wrap{width:min(1280px,100% - 40px);margin-inline:auto}
@media (max-width:359px){.wrap{width:calc(100% - 32px)}}
@media (min-width:768px){.wrap{width:min(1280px,100% - 96px)}}
.section{padding-block:72px;border-top:1px solid var(--rule)}
@media (min-width:1024px){.section{padding-block:104px}}
.section-head{display:grid;gap:14px;margin-bottom:40px;max-width:760px;align-content:start}
.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px}

/* ---------- dateline: when the page's facts were read ---------- */
.dateline{border-bottom:1px solid var(--rule);font-size:var(--fs-fine);line-height:18px;color:var(--ink-2)}
.dateline .wrap{display:flex;flex-wrap:nowrap;gap:0 10px;padding-block:9px;white-space:nowrap}
.dateline b{color:var(--ink);font-weight:600}
.dateline span+span::before{content:"·";margin-right:10px;color:var(--ink-3)}
@media (max-width:719px){.dateline .dl-state,.dateline .dl-rest{display:none}.dateline .wrap{justify-content:space-between}.dateline span+span::before{display:none}}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:40;background:var(--paper);border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;align-items:center;gap:8px;height:64px;position:relative}
.mark{display:inline-flex;align-items:center;gap:0;color:var(--ink);font-size:21px;font-weight:650;letter-spacing:-.025em;min-height:44px;flex:none}
@media (hover: hover) and (pointer: fine){.mark:hover{color:var(--ink)}}
.mark .dot{width:7px;height:7px;border-radius:50%;background:var(--signal);margin-left:2px;align-self:flex-end;margin-bottom:13px}
.mark .gr-lockup{display:block;height:34px;width:auto;flex:none;margin-top:-2px}.mark .gr-dome{fill:var(--signal)}.mark .gr-word{fill:currentColor}
:root[data-theme=dark] .mark .gr-dome{fill:var(--ink)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .mark .gr-dome{fill:var(--ink)}}
.gr-seal{margin-top:20px;display:flex;align-items:center;gap:14px}.gr-seal img{display:block;flex:none;width:104px;height:104px}.gr-seal .gr-seal-note{margin:0;max-width:24ch;font-size:var(--fs-fine);line-height:1.4;color:var(--ink-2)}.gr-seal .s-d{display:none}
:root[data-theme=dark] .gr-seal .s-l{display:none}:root[data-theme=dark] .gr-seal .s-d{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .gr-seal .s-l{display:none}:root:not([data-theme=light]) .gr-seal .s-d{display:block}}
@media print{.gr-seal .s-l{display:block}.gr-seal .s-d{display:none}}
@media (max-width:639px){.foot .cols>div:first-child{display:grid;grid-template-columns:minmax(0,1fr) 96px;column-gap:16px;align-items:start}.foot .cols>div:first-child>*{grid-column:1}.foot .cols>div:first-child>.gr-seal{grid-column:2;grid-row:1/span 3;margin-top:0;flex-direction:column;align-items:flex-start;gap:6px}.gr-seal img{width:96px;height:96px}.gr-seal .gr-seal-note{max-width:none;font-size:12px;line-height:1.35;text-wrap:balance}}
.statetab{display:inline-flex;align-items:center;gap:8px;padding:0 12px;min-height:44px;margin-left:8px;border:1px solid var(--rule-2);border-radius:999px;color:var(--ink);font-size:var(--fs-small);font-weight:600;white-space:nowrap}
@media (hover: hover) and (pointer: fine){.statetab:hover{color:var(--ink);border-color:var(--control-edge)}}
.statetab .sw{width:10px;height:10px;border-radius:2px;flex:none}
.statetab .sw-ga{background:var(--ga);box-shadow:inset 0 0 0 1px var(--ga-ink)}
.statetab .sw-tn{background:var(--tn)}
.statetab .chg{color:var(--ink-2);font-weight:500}
.statetab .st-s{display:none}
@media (max-width:374px){.statetab .st-l{display:none}.statetab .st-s{display:inline}}
.nav{display:none;align-items:center;gap:4px;margin-left:auto}
.nav a{color:var(--ink-2);font-weight:550;font-size:var(--fs-small);padding:0 12px;min-height:44px;display:inline-flex;align-items:center;border-radius:6px}
@media (hover: hover) and (pointer: fine){.nav a:hover{color:var(--ink)}}
.nav a[aria-current=page]{color:var(--ink);font-weight:650}
.nav .signin{color:var(--ink);font-weight:600}
.moon{width:44px;height:44px;display:inline-grid;place-items:center;border:0;background:none;color:var(--ink-2);border-radius:50%;cursor:pointer;padding:0;font:inherit}
@media (hover: hover) and (pointer: fine){.moon:hover{color:var(--ink)}}
.moon svg{width:20px;height:20px}
:root[data-theme=dark] :is(.moon,.moon-row) svg path{fill:currentColor}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) :is(.moon,.moon-row) svg path{fill:currentColor}}
/* phone menu: a labelled control and a panel (pattern from direction A) */
.menu{margin-left:auto}
.menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border:1px solid var(--control-edge);border-radius:6px;font-size:var(--fs-small);font-weight:600;color:var(--ink);user-select:none;-webkit-user-select:none}
.menu summary::-webkit-details-marker{display:none}
.menu summary::marker{content:""}
.menu .bars{width:16px;height:12px;flex:none;background:linear-gradient(var(--ink),var(--ink)) 0 0/100% 1.5px no-repeat,linear-gradient(var(--ink),var(--ink)) 0 50%/100% 1.5px no-repeat,linear-gradient(var(--ink),var(--ink)) 0 100%/100% 1.5px no-repeat}
.menu .l-close{display:none}
.menu[open] .l-open{display:none} .menu[open] .l-close{display:inline}
.menu[open] .bars{background:linear-gradient(var(--ink),var(--ink)) 50% 50%/100% 1.5px no-repeat;transform:rotate(45deg);position:relative}
.menu[open] .bars::after{content:"";position:absolute;inset:0;background:linear-gradient(var(--ink),var(--ink)) 50% 50%/100% 1.5px no-repeat;transform:rotate(90deg)}
.menu .panel{position:absolute;left:-20px;right:-20px;top:64px;background:var(--paper);border-bottom:1.5px solid var(--ink);padding:4px 20px 16px;box-shadow:0 18px 30px -18px rgba(16,33,47,.35);height:calc(100vh - 64px);height:calc(100dvh - 64px);overflow:auto;overscroll-behavior:contain}
/* UI-FIXES U4 (C1 4, Astra 6): the open sheet runs to the bottom of the screen (no page under it) and spans exactly the viewport: its
   offsets are the .wrap's own gutter at each width (16 under 360, 20, 48 from 768), so at 320 it no longer runs x=-4..324 */
@media (max-width:359px){.menu .panel{left:-16px;right:-16px;padding-inline:16px}}
@media (min-width:768px){.menu .panel{left:-48px;right:-48px;padding-inline:48px}}
.menu .panel a,.menu .panel .moon-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:56px;border:0;border-bottom:1px solid var(--rule);background:none;color:var(--ink);font:inherit;font-size:var(--fs-lede);font-weight:600;letter-spacing:-.005em;text-align:left;padding:0;cursor:pointer;border-radius:0}
@media (hover: hover) and (pointer: fine){.menu .panel a:hover{color:var(--link-hover)}}
.menu .panel a[aria-current=page]::after{content:"You are here";font-size:var(--fs-fine);font-weight:500;color:var(--ink-2);letter-spacing:0}
.menu .panel .moon-row{border-bottom:0;color:var(--ink-2);font-weight:550}
.menu .panel .moon-row svg{width:20px;height:20px}
.menu .panel :focus-visible{outline-offset:-3px}
@media (min-width:960px){.nav{display:flex}.menu{display:none}.statetab{margin-left:16px}}
@media (max-width:639px){.statetab .chg{display:none}.statetab{padding:0 10px}.mark{font-size:20px}.mark .gr-lockup{height:27px}}
@media (max-width:359px){.top .wrap{gap:5px}.mark{font-size:19px}.mark .gr-lockup{height:24px}.statetab{margin-left:0;padding:0 8px;gap:6px}.menu summary{padding:0 9px;gap:6px}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:6px;font:inherit;font-size:var(--fs-body);font-weight:600;cursor:pointer;border:0;text-align:center;transition:background-color .14s linear,color .14s linear,box-shadow .14s linear}
.btn-primary{background:var(--signal);color:var(--on-signal)}
@media (hover: hover) and (pointer: fine){.btn-primary:hover{background:var(--signal-hover);color:var(--on-signal)}}
.btn-primary:active{transform:translateY(1px)}
.btn-secondary{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--control-edge)}
@media (hover: hover) and (pointer: fine){.btn-secondary:hover{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}}
.btn-quiet{min-height:44px;padding:0 14px;font-size:var(--fs-small);background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--control-edge);white-space:nowrap}
@media (hover: hover) and (pointer: fine){.btn-quiet:hover{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}}
.btn .arr{flex:none;transition:transform .18s var(--ease)}
@media (hover: hover) and (pointer: fine){.btn:hover .arr{transform:translateX(3px)}}
/* a button that waits (disabled / aria-disabled): not the red, not a pointer, no hover; the page prints its reason next to it (UI-FIXES U1) */
.btn:is(:disabled,[aria-disabled=true]){background:var(--well);color:var(--ink-3);box-shadow:inset 0 0 0 1px var(--rule-2);cursor:not-allowed;transform:none}@media (hover: hover) and (pointer: fine){.btn:is(:disabled,[aria-disabled=true]):hover{background:var(--well);color:var(--ink-3);box-shadow:inset 0 0 0 1px var(--rule-2);cursor:not-allowed;transform:none}}
.btn:is(:disabled,[aria-disabled=true]) .arr{transform:none}

/* ---------- disclosure: the ONE row (taste #13, Astra's cohesion contract: "one disclosure style", the bid page's evidence row
   .tb-more). Every disclosure in a page's main column has the same type, colour and mark: small semibold ink and a chevron that turns
   when it opens. Layout stays the page's own (inline after a sentence, or a full row); a page's own plus icon gives way to the chevron. ---------- */
main details:not(.menu)>summary{cursor:pointer;list-style:none;font-family:var(--font);font-size:var(--fs-small);font-weight:600;line-height:1.35;color:var(--ink)}
main details:not(.menu)>summary::-webkit-details-marker{display:none}
main details:not(.menu)>summary::marker{content:""}
main details:not(.menu)>summary::after{content:"";display:inline-block;flex:none;width:7px;height:7px;border:0;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg)}
main details:not(.menu)[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
main details:not(.menu)>summary .plus{display:none}
/* ---------- sheet: the map-sheet card with registration ticks ---------- */
.sheet{position:relative;background:var(--sheet);border:1px solid var(--rule);border-radius:8px}
.ticks{--t:12px;--c:var(--ink-3);background:
  linear-gradient(var(--c),var(--c)) top left/var(--t) 1px no-repeat,linear-gradient(var(--c),var(--c)) top left/1px var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) top right/var(--t) 1px no-repeat,linear-gradient(var(--c),var(--c)) top right/1px var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) bottom left/var(--t) 1px no-repeat,linear-gradient(var(--c),var(--c)) bottom left/1px var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) bottom right/var(--t) 1px no-repeat,linear-gradient(var(--c),var(--c)) bottom right/1px var(--t) no-repeat,var(--sheet)}

/* ---------- datum: where a fact came from ---------- */
.datum{display:flex;gap:8px;align-items:flex-start;font-size:var(--fs-fine);line-height:18px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.datum svg{flex:none;width:14px;height:14px;margin-top:2px;color:var(--contour)}

/* ---------- readouts ---------- */
.readout{display:grid;gap:4px}
.readout .v{font-size:40px;line-height:1;font-weight:560;letter-spacing:-.03em}
.readout .u{font-size:var(--fs-small);color:var(--ink-2)}

/* ---------- state doors ---------- */
.doors{display:grid;gap:12px}
.door{display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:16px;padding:18px 18px 18px 16px;min-height:96px;background:var(--sheet);border:1px solid var(--rule);border-radius:8px;color:var(--ink);position:relative;transition:border-color .16s linear,background-color .16s linear}
@media (hover: hover) and (pointer: fine){.door:hover{color:var(--ink);border-color:var(--control-edge)}}
.door .glyph{width:56px;height:56px}
.door .glyph path{stroke-width:1.5;vector-effect:non-scaling-stroke}
.door-ga .glyph path{fill:var(--ga);stroke:var(--ga-ink)}
.door-tn .glyph path{fill:var(--tn);stroke:var(--tn)}
:root[data-theme=dark] .door-ga .glyph path{stroke:var(--ga)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .door-ga .glyph path{stroke:var(--ga)}}
.door .name{display:block;font-size:24px;line-height:1.15;font-weight:600;letter-spacing:-.015em}
.door .meta{display:block;font-size:var(--fs-small);color:var(--ink-2);margin-top:4px}
.door .go{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--control-edge);transition:transform .18s var(--ease),background-color .16s linear,color .16s linear}
@media (hover: hover) and (pointer: fine){.door:hover .go{transform:translateX(3px);background:var(--ink);color:var(--paper);box-shadow:none}}
@media (hover: hover) and (pointer: fine){.door-ga:hover{background:var(--ga-tint)}}
@media (hover: hover) and (pointer: fine){.door-tn:hover{background:var(--tn-tint)}}
@media (max-width:359px){.door{grid-template-columns:44px minmax(0,1fr) auto;gap:12px;padding:16px 14px}.door .glyph{width:44px;height:44px}}

/* ---------- maps: the sea is the page, land one step darker, lines a tint of ink ---------- */
.mapsheet{padding:0;overflow:hidden;background:var(--water)}
.mapsheet.ticks{background:
  linear-gradient(var(--c),var(--c)) top left/var(--t) 1px no-repeat,linear-gradient(var(--c),var(--c)) top left/1px var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) top right/var(--t) 1px no-repeat,linear-gradient(var(--c),var(--c)) top right/1px var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) bottom left/var(--t) 1px no-repeat,linear-gradient(var(--c),var(--c)) bottom left/1px var(--t) no-repeat,
  linear-gradient(var(--c),var(--c)) bottom right/var(--t) 1px no-repeat,linear-gradient(var(--c),var(--c)) bottom right/1px var(--t) no-repeat,var(--water)}
.mapsheet svg{width:100%;height:auto}
.map-land{fill:var(--land);stroke:var(--land-line);stroke-width:1;stroke-linejoin:round}
.map-st{stroke-linejoin:round;transition:fill .16s linear,stroke .16s linear}
.map-ga{fill:var(--ga);stroke:var(--ga-ink);stroke-width:1.4}
.map-tn{fill:var(--tn);stroke:var(--tn);stroke-width:1.4}
.map-co{fill:none;stroke-width:.6;stroke-linejoin:round;pointer-events:none}
.map-co-ga{stroke:var(--ga-ink);stroke-opacity:.32}
.map-co-tn{stroke:var(--on-tn);stroke-opacity:.3}
.map-lettering{font-family:var(--font);font-weight:600;font-stretch:84%;letter-spacing:.1em;text-transform:uppercase;fill:var(--ink-2)}
.map-name{font-family:var(--font);font-weight:650;letter-spacing:.02em;font-stretch:92%}
.map-count{font-family:var(--font);font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.map-unit{font-family:var(--font);font-weight:500}
.on-ga{fill:var(--on-ga)} .on-tn{fill:var(--on-tn)}
.map-note{font-family:var(--font);font-weight:500;fill:var(--ink-2);font-variant-numeric:tabular-nums}
.map-city circle{fill:var(--sheet);stroke:var(--ink);stroke-width:1.3}
.map-city .c{fill:var(--ink)}
.map-city text{font-family:var(--font);font-weight:600;fill:var(--ink);paint-order:stroke;stroke-linejoin:round}
.map-link{cursor:pointer}
.map-link:focus{outline:none}
.map-link:focus-visible .map-st{stroke:var(--focus);stroke-width:4}
@media (hover: hover) and (pointer: fine){.map-link:hover .map-ga{fill:color-mix(in oklab,var(--ga) 82%,var(--ga-ink))}}
@media (hover: hover) and (pointer: fine){.map-link:hover .map-tn{fill:color-mix(in oklab,var(--tn) 82%,#000)}}
body:has(.door-ga:focus-visible) .map-ga{fill:color-mix(in oklab,var(--ga) 82%,var(--ga-ink))}@media (hover: hover) and (pointer: fine){body:has(.door-ga:hover) .map-ga{fill:color-mix(in oklab,var(--ga) 82%,var(--ga-ink))}}
body:has(.door-tn:focus-visible) .map-tn{fill:color-mix(in oklab,var(--tn) 82%,#000)}@media (hover: hover) and (pointer: fine){body:has(.door-tn:hover) .map-tn{fill:color-mix(in oklab,var(--tn) 82%,#000)}}
@media (hover: hover) and (pointer: fine){body:has(.map-link-ga:hover) .door-ga{border-color:var(--control-edge);background:var(--ga-tint)}}
@media (hover: hover) and (pointer: fine){body:has(.map-link-tn:hover) .door-tn{border-color:var(--control-edge);background:var(--tn-tint)}}
.scalebar rect{fill:var(--ink)}
.scalebar rect.o{fill:var(--water);stroke:var(--ink);stroke-width:1}
.caption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 24px;margin-top:12px}

/* ---------- bid cards (listing rule: the same facts in the same spot) ---------- */
.cards{display:grid;gap:12px}
.card{display:grid;grid-template-columns:86px minmax(0,1fr);gap:18px;padding:18px 20px 18px 18px;background:var(--sheet);border:1px solid var(--rule);border-radius:8px;color:var(--ink);font-weight:400;transition:border-color .16s linear}
@media (hover: hover) and (pointer: fine){.card:hover{color:var(--ink);border-color:var(--control-edge)}}
.card .due{display:grid;align-content:start;gap:2px;padding-right:14px;border-right:1px solid var(--rule)}
.card .due .m{font-size:var(--fs-label);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-stretch:88%;color:var(--ink-2)}
.card .due .d{font-size:36px;line-height:1;font-weight:560;letter-spacing:-.03em}
.card .due .t{font-size:var(--fs-fine);color:var(--ink-2);margin-top:4px;line-height:1.35}
.card .what{display:block;font-size:var(--fs-lede);line-height:1.3;font-weight:600;text-wrap:pretty}
.card .who{display:block;font-size:var(--fs-small);color:var(--ink-2);margin-top:4px}
.card .row{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center;margin-top:10px}
.status{display:inline-flex;align-items:center;gap:7px;font-size:var(--fs-fine);font-weight:600}
.status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.s-soon{color:var(--warn)} .s-new{color:var(--ink-2)} .s-add{color:var(--ink-2)}
@media (max-width:359px){.card{grid-template-columns:80px minmax(0,1fr);gap:12px;padding:16px 14px}.card .due{padding-right:8px}.card .due .d{font-size:32px}}

/* ---------- ledger: plain tables with a title-block rule ---------- */
.ledger{width:100%;border-collapse:collapse;font-size:var(--fs-body)}
.ledger caption{text-align:left;padding-bottom:12px}
.ledger th,.ledger td{text-align:left;vertical-align:top;padding:16px 20px 16px 0;border-bottom:1px solid var(--rule);font-weight:400}
.ledger thead th{font-size:var(--fs-fine);font-weight:600;color:var(--ink-2);border-bottom:1.5px solid var(--ink);padding-top:0;padding-bottom:10px}
.ledger tbody th{color:var(--ink);font-weight:600;white-space:nowrap}
.ledger td{color:var(--ink-2)}
.ledger tr.this th,.ledger tr.this td{background:var(--well);color:var(--ink)}
.ledger tr.this th{box-shadow:inset 3px 0 0 var(--ink);padding-left:16px}
.ledger .tag{display:inline-block;margin-left:10px;padding:2px 8px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:var(--fs-label);font-weight:600;letter-spacing:.04em;vertical-align:2px;white-space:nowrap}
@media (max-width:639px){
  .ledger thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .ledger tbody tr{display:grid;padding:14px 0;border-bottom:1px solid var(--rule)}
  .ledger tbody th,.ledger tbody td{display:block;border:0;padding:0}
  .ledger tbody td{margin-top:4px}
  .ledger tr.this{background:var(--well);box-shadow:inset 3px 0 0 var(--ink);padding-left:16px;padding-right:12px}
  .ledger tr.this th{box-shadow:none;padding-left:0}
  .ledger tbody tr:first-child{border-top:1.5px solid var(--ink)}
}

/* ---------- footer (direction A's: who we are, one tidy grid of links, a colophon) ---------- */
.foot{border-top:1px solid var(--rule);padding:48px 0 calc(40px + var(--bar));background:var(--paper)}
.foot .cols{display:grid;gap:20px 48px}
@media (min-width:900px){.foot .cols{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}}
.foot .about{max-width:40ch;color:var(--ink-2);font-size:var(--fs-small);margin-top:10px}
.foot .reach{font-size:var(--fs-small);color:var(--ink-2);margin-top:4px}
.foot .reach a{display:inline-flex;align-items:center;min-height:44px}
.foot .fl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;align-content:start}
@media (min-width:560px){.foot .fl{grid-template-columns:repeat(4,minmax(0,1fr))}}
.foot .fl a{display:flex;align-items:center;min-height:44px;color:var(--ink);font-weight:550;font-size:var(--fs-small)}
@media (hover: hover) and (pointer: fine){.foot .fl a:hover{color:var(--link-hover)}}
.foot .colophon{margin-top:36px;padding-top:16px;border-top:1px solid var(--rule);font-size:var(--fs-fine);color:var(--ink-3);display:flex;flex-wrap:wrap;gap:4px 28px;justify-content:space-between}

/* ---------- motion ---------- */
@keyframes draw{from{stroke-dashoffset:var(--len)}to{stroke-dashoffset:0}}
@keyframes rise{from{opacity:0;transform:translateY(.32em)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes growy{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.m-draw{stroke-dasharray:var(--len);animation:draw 1.1s var(--ease-io) both}
.m-fill{animation:fade .5s linear .55s both}
.m-label{animation:fade .35s linear .85s both}
.digits>span{display:inline-block;animation:rise .42s var(--ease) both}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .m-draw{stroke-dasharray:none}
}

/* ================= D system ================= */
/* ---------- night: a block that wears the dark theme in both themes (the home stage; ceremony plates) ---------- */
.night{--paper:#0D1720;--sheet:#131F2A;--well:#0A131B;--ink:#E8ECEF;--ink-2:#B7C1CA;--ink-3:#97A4AF;--rule:#263544;--rule-2:#3A4B5B;--grid:#1A2733;--signal:#C62F29;--signal-hover:#A02520;--on-signal:#FFFFFF;--link:#FF9384;--link-hover:#FFC2B8;--contour:#C68A5E;--contour-ink:#E0A57A;--ga:#EE9A82;--ga-ink:#F6B8A6;--ga-deep:#FBD5C9;--ga-tint:#2A1B17;--on-ga:#10212F;--ga-1:#1F1613;--ga-2:#2A1B17;--ga-3:#3D241D;--ga-4:#5C3125;--ga-5:#7E4132;--tn:#78A6D2;--tn-ink:#A3C5E6;--tn-deep:#CFE1F3;--tn-tint:#16263A;--on-tn:#0D1720;--tn-1:#101C2A;--tn-2:#16263A;--tn-3:#1D3450;--tn-4:#274669;--tn-5:#335B87;--sage:#5FB07E;--sage-ink:#7CCB98;--sage-deep:#B4E3C4;--sage-1:#0F1D16;--sage-2:#13291D;--sage-3:#1B3A29;--sage-4:#255038;--sage-5:#31694A;--gold:#D9A441;--gold-ink:#E9B65C;--gold-deep:#F5D79A;--gold-1:#1F190D;--gold-2:#2A2112;--gold-3:#3D2F16;--gold-4:#58431C;--gold-5:#775A22;--land:#1B2833;--land-line:#33444F;--water:#0D1720;--c0:#16222D;--c1:#A45845;--c2:#C06C57;--c3:#D8846D;--c4:#EF9F89;--c5:#FBD5C9;--co-line:#0D1720;--ok:#7CCB98;--ok-tint:#13291D;--warn:#E9B65C;--warn-tint:#2A2112;--focus:#E8ECEF;--control-edge:#6E8091;--ghost:#5E6B78;--t1:#E8796C;--t1-ink:#FEB6AB;--t1-tint:#36201D;--t2:#DB8833;--t2-ink:#F6BE8E;--t2-tint:#332214;--t3:#B99D14;--t3-ink:#DCCB86;--t3-tint:#2B2612;--t4:#54B66E;--t4-ink:#A0DCAC;--t4-tint:#1A2B1D;--t5:#17B4B6;--t5-ink:#7FDDDE;--t5-tint:#0E2C2C;--t6:#53A3F2;--t6-ink:#A2CFFF;--t6-tint:#192837;--t7:#AC89E8;--t7-ink:#D3BEFD;--t7-tint:#292335;--t8:#DB78B2;--t8-ink:#F6B3D8;--t8-tint:#331F2A;--stage-bg:#0A131C;--stage-accent:#FFE3CC;--dawn-1:#9A4A30;--dawn-2:#7A3A45;--dawn-3:#3A2A52;--hot:#FFE8CE;color-scheme:dark;color:var(--ink)}

/* ---------- Fraunces steps (rule 15: 300 only when large; small serif headings and phones get more weight) ---------- */
.h-hero,.h-statement,.h-title{font-family:var(--display);font-synthesis:none;font-feature-settings:"kern","liga";text-wrap:balance}
.h-hero{font-weight:360;font-size:clamp(34px,9.6vw,46px);line-height:1.02;letter-spacing:-.028em;font-variation-settings:"opsz" 72}
.h-statement{font-weight:360;font-size:clamp(34px,6vw,84px);line-height:1;letter-spacing:-.03em;max-width:16em}
.h-title{font-weight:520;font-size:clamp(23px,2.3vw,28px);line-height:1.14;letter-spacing:-.012em}
.h-hero em{font-style:italic;font-weight:340;letter-spacing:-.006em}
/* the roman keeps its opsz axis, 18..72 (display_font.py): font-optical-sizing:auto gives text under ~40 px the sturdier strokes;
   the hero is pinned to 72 at every width (the same drawing as its italic accent; the phone's first screen is measured with it, check B) */
@media (min-width:768px){.h-hero{font-size:clamp(48px,5vw,76px);line-height:1}.h-hero,.h-statement{font-weight:300;letter-spacing:-.034em}.h-statement{line-height:.98}}

/* ---------- editorial section head: the label in the margin, the statement beside it ---------- */
.s-head{display:grid;gap:16px;margin-bottom:44px}
.s-head .body{font-size:var(--fs-lede);max-width:52ch}
@media (min-width:1024px){.s-head{grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:24px;align-items:start;margin-bottom:56px}.s-head .label{padding-top:18px}.s-head .body{grid-column:2}
  .ed-body{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:24px}.ed-body>*{grid-column:2;min-width:0}}

/* ---------- ghost numerals: a numbered run (how it works). The figure is Instrument Sans (rule 2), pale, huge ---------- */
.steps{display:grid;gap:0}
.step{position:relative;display:grid;grid-template-columns:60px minmax(0,1fr);gap:4px 14px;padding:22px 0;border-top:1px solid var(--rule-2)}
.step .i{grid-row:1/span 2;font-size:72px;line-height:.86;font-weight:300;font-stretch:76%;letter-spacing:-.04em;color:var(--ghost);font-variant-numeric:lining-nums}
.step p{color:var(--ink-2);max-width:46ch}
@media (min-width:1024px){
  .steps{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:auto auto auto;column-gap:40px}
  .steps.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .step{grid-template-columns:1fr;grid-row:1/span 3;grid-template-rows:subgrid;gap:16px 0;padding:26px 0 0}
  .step .i{grid-row:auto;font-size:150px;margin-left:-6px}
}

/* ---------- carte: a price list with dotted leaders. Names in Fraunces, figures in Instrument Sans (rules 2, 15) ---------- */
.carte{display:grid;gap:0;max-width:980px;border-top:1.5px solid var(--ink)}
.carte .r{display:grid;grid-template-columns:auto minmax(24px,1fr) auto;align-items:baseline;gap:4px 14px;padding:22px 0;border-bottom:1px solid var(--rule)}
.carte .n{font-family:var(--display);font-synthesis:none;font-weight:520;font-size:clamp(24px,2.8vw,34px);letter-spacing:-.016em;line-height:1.1}
.carte .dots{align-self:end;height:1px;margin-bottom:.5em;background:repeating-linear-gradient(90deg,var(--rule-2) 0 2px,transparent 2px 7px)}
.carte .p{font-size:clamp(34px,4.4vw,54px);font-weight:560;font-stretch:88%;letter-spacing:-.03em;line-height:1;white-space:nowrap;font-variant-numeric:tabular-nums lining-nums}
.carte .p small{font-size:var(--fs-small);font-weight:500;font-stretch:100%;color:var(--ink-2);letter-spacing:0;margin-left:8px}
.carte .d{grid-column:1/-1;color:var(--ink-2);max-width:56ch}
@media (max-width:767px){.carte .n{font-weight:600}}   /* rule 15: a small serif name beside a bold figure needs the weight (H5 ask 5, from C1) */
.carte .r.lead{padding:26px 0 28px}
.carte .r.lead .n{font-size:clamp(28px,3.4vw,44px)}
.carte .r.lead .p{font-size:clamp(44px,6vw,76px)}
.carte .sub{padding:22px 0 0;border:0}

/* ---------- offer: the one-time package said in one line (rule 10). Never animated. ---------- */
.offer{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;font-size:var(--fs-body);line-height:1.4;color:var(--ink)}
.offer .p{font-size:26px;font-weight:620;letter-spacing:-.02em;font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}
.offer .p small{font-size:var(--fs-small);font-weight:550;letter-spacing:0;color:var(--ink-2);margin-left:5px}
.offer .t{flex:1 1 14em;color:var(--ink-2)}

/* ---------- plate: a readout that sits BESIDE a drawing, never on it (rule 9) ---------- */
.plates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.plate{display:grid;gap:2px;align-content:start;padding:10px 0 0;border-top:2px solid var(--c,var(--ink))}
.plate b{font-size:var(--fs-label);line-height:16px;font-weight:650;font-stretch:84%;letter-spacing:.14em;text-transform:uppercase;color:var(--c-ink,var(--ink))}
.plate .n{font-size:clamp(34px,8vw,52px);font-weight:520;font-stretch:80%;letter-spacing:-.03em;line-height:1;color:var(--c-ink,var(--ink));font-variant-numeric:tabular-nums lining-nums}
.plate .u{font-size:var(--fs-fine);line-height:1.35;color:var(--ink-2)}
.plate-ga{--c:var(--ga);--c-ink:var(--ga-ink)} .plate-tn{--c:var(--tn);--c-ink:var(--tn-ink)}

/* ================= rule 17 / 17a: colour with meaning ================= */
/* ---------- bands (SYSTEM-SWEEP 2): a section is the page surface; colour means state, success or the action, never a section. The
   peach/sky/sage/gold band classes stay on templates but paint nothing, and the section rule returns below them.
   .band-blue is the deep blue band (it wears the dark tokens: put class "night" beside it). ---------- */
.band{border-top:0}
.section+.band-blue,.band-blue+.section,.stage+.band-blue{border-top:0}
.band-peach,.band-sky,.band-sage,.band-gold{background:transparent}
.band .chip{background:var(--c-3)}
.band-blue{background:var(--band-blue);--ghost:#8FA3B8;--rule:rgba(255,255,255,.16);--rule-2:rgba(255,255,255,.28)}
/* ---------- state colour on every state element ---------- */
.is-ga{--c:var(--ga);--c-ink:var(--ga-ink);--c-deep:var(--ga-deep);--c-1:var(--ga-1);--c-2:var(--ga-2);--c-3:var(--ga-3)}
.is-tn{--c:var(--tn);--c-ink:var(--tn-ink);--c-deep:var(--tn-deep);--c-1:var(--tn-1);--c-2:var(--tn-2);--c-3:var(--tn-3)}
.edge{box-shadow:inset 3px 0 0 var(--c)}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:2px 10px;border-radius:999px;background:var(--c-2);color:var(--c-deep);font-size:var(--fs-fine);font-weight:600;white-space:nowrap}
.chip::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--c);box-shadow:inset 0 0 0 1px var(--c-ink)}
/* ---------- trade tags: 8 hues, ALWAYS with the trade's name (never colour alone) ---------- */
.tag{display:inline-flex;align-items:center;gap:6px;padding:2px 9px 2px 8px;border-radius:4px;background:var(--t-tint);color:var(--t-ink);font-size:var(--fs-fine);line-height:18px;font-weight:600;white-space:nowrap}
.tag::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--t);flex:none}
/* trade tags (SYSTEM-SWEEP 3): every trade wears the same neutral tag; the name says the trade */
.t1,.t2,.t3,.t4,.t5,.t6,.t7,.t8{--t:var(--ink-3);--t-ink:var(--ink-2);--t-tint:var(--well)}
/* ---------- status (SYSTEM-SWEEP 4): done / open / new / in progress are ink-2 on the well; gold = waiting on you / due soon; ink-3 = closed ---------- */
.s-done,.s-open,.s-new{color:var(--ink-2)} .s-wait,.s-soon{color:var(--gold-ink)} .s-prog{color:var(--ink-2)} .s-closed{color:var(--ink-3)}
.pill{display:inline-flex;align-items:center;gap:7px;padding:3px 10px;border-radius:999px;font-size:var(--fs-fine);font-weight:600;white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.pill.s-done,.pill.s-open{background:var(--well);color:var(--ink-2)} .pill.s-wait,.pill.s-soon{background:var(--gold-2);color:var(--gold-deep)}
.pill.s-prog{background:var(--well);color:var(--ink-2)} .pill.s-closed{background:var(--well);color:var(--ink-2)}
/* ---------- a price is ink, never gold (POLISH 1005: the price list too) ---------- */
.price-gold{color:var(--ink)}
.carte{border-top-color:var(--ink)}
.carte .p{color:var(--ink)}
/* ---------- FOOTER23 (A-S5): the footer is the page surface on a light page (the base .foot above: paper, a hairline rule); in the dark theme it is the navy ---------- */
:root[data-theme=dark] .foot{background:var(--foot-bg);border-top:0}
:root[data-theme=dark] .foot .colophon{border-top-color:var(--rule-2)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .foot{background:var(--foot-bg);border-top:0}:root:not([data-theme=light]) .foot .colophon{border-top-color:var(--rule-2)}}

/* ---------- the ONE bid card (PLAN-FINAL L152-153, L441): one bid per card, real space between cards, five facts always in the
   same spots: the due date (the biggest thing), what the job is, the agency and county, the trade (a labelled tag), one status line.
   Markup comes from parts.bid_card() / _d_bid_card.html only: no family draws its own. ---------- */
.cards{gap:16px}
.card.edge{box-shadow:inset 3px 0 0 var(--c)}
.card .due .wd{font-size:var(--fs-fine);color:var(--ink-2);line-height:1.35;font-stretch:88%}
/* the due time holds two lines at most (H1 18:22): the clock and what follows it each stay whole; the column is wide enough for
   "Wed, 12:30 PM" at this size (82 px at the widest, measured from the font's own advances with tabular figures) */
.card{grid-template-columns:100px minmax(0,1fr)}
.card .due .wd .nb{white-space:nowrap}
@media (max-width:359px){.card{grid-template-columns:92px minmax(0,1fr)}.card .due{padding-right:6px}}
.card .who{overflow-wrap:anywhere}
.card .row .tag{white-space:normal}
.card .status{white-space:nowrap}
/* A-42 #8: the list card's one fit marker (prequalification / license Required): icon + words, ink on the card, never colour alone, not a red action */
.fit-mark{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;font-size:var(--fs-fine);font-weight:600;line-height:1.35;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink-3);white-space:nowrap}
.fit-mark svg{width:13px;height:13px;flex:none}
/* ---------- the menu dot (backlog A2): the phone Menu button carries the brand's red point; open, it is the X ---------- */
.menu .mdot{width:9px;height:9px;border-radius:50%;background:var(--signal);flex:none;position:relative}
.menu[open] .mdot{width:14px;height:14px;border-radius:0;background:linear-gradient(var(--ink),var(--ink)) 50% 50%/100% 1.5px no-repeat;transform:rotate(45deg)}
.menu[open] .mdot::after{content:"";position:absolute;inset:0;background:linear-gradient(var(--ink),var(--ink)) 50% 50%/100% 1.5px no-repeat;transform:rotate(90deg)}

/* ---------- statement paragraph: one large sentence in the display face ---------- */
/* a TASK page's h1 (a bid, an order, checkout, sign-up, the account): the same display face as every other page (rule 1), small and
   sturdy (rule 15), never the light statement weight (C1 CRITIQUE-5 fix 3) */
.h-task{font-family:var(--display);font-synthesis:none;font-weight:520;font-size:clamp(28px,3.2vw,40px);line-height:1.12;letter-spacing:-.014em;text-wrap:balance}
.statement{font-family:var(--display);font-synthesis:none;font-weight:360;font-size:clamp(25px,3.6vw,48px);line-height:1.14;letter-spacing:-.024em;max-width:22em;text-wrap:balance}
@media (min-width:768px){.statement{font-weight:300}}
