/* Self-hosted webfonts. Generated by /root/tools/fetch-fonts.py — do not
   hand-edit; re-run the script instead. No third-party font requests. */

@font-face {
  font-family: 'Libre Caslon Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/libre-caslon-text-400-italic.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Libre Caslon Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/libre-caslon-text-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Libre Caslon Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/libre-caslon-text-700-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Self-hosted webfonts. Generated by /root/tools/fetch-fonts.py — do not
   hand-edit; re-run the script instead. No third-party font requests. */

@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/public-sans-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/public-sans-600-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Self-hosted webfonts. Generated by /root/tools/fetch-fonts.py — do not
   hand-edit; re-run the script instead. No third-party font requests. */

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/ibm-plex-mono-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/ibm-plex-mono-600-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Self-hosted webfonts. Generated by /root/tools/fetch-fonts.py — do not
   hand-edit; re-run the script instead. No third-party font requests. */

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/ibm-plex-mono-700-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* ===== THE BOARD SKIN — shared shell for board.tpl.html, cat.tpl.html and
   page.tpl.html (the /m/ market pages and the /tools/ SEO pages).
   build_site.py injects _fonts.css + THIS FILE at their BOARDCSS marker, so the three
   editorial templates can never drift apart the way their three hand-copied cream
   blocks did.  Do not write a literal marker in this file — fill() would see it in the
   output and abort the build.

   2026-07-25 redesign: re-tokened to the banker's-lamp system. The :root block below is
   copied BYTE-IDENTICALLY from docket.tpl.html / index.tpl.html; if it ever needs to
   change, change it there first and copy it here verbatim.

   COLOR LAW: --loss colours dollars/points lost in a data cell and nothing else — never
   buttons, nav, headlines or chrome. --gain colours money kept + the guarantee rule.
   --accent/--brass carry links, actions, rules and seals — never money. Call status is
   NEVER colour-coded: a MISS reads with exactly the weight of a HIT. ===== */

/* ===== TOKENS — the banker's-lamp system (2026-07-25 redesign).
   The board is dark ledger cloth; the ink is warm paper-white; brass carries every
   action; paper appears only as exhibit slips pinned to the board.
   DUPLICATED in index.tpl.html — keep the two blocks byte-identical. ===== */
:root{
--bg:#10150f;--board2:#1a2017;--panel:#1a211a;--panel2:#131813;
--ink:#f1eee2;--sealink:#dab654;--muted:#a9b1a1;--faint:#79826f;
--inkmuted:#5d5b4a;--paperdim:#4a4a3f;--losslight:#9c3128;--gaindim:#5d9a75;
--rule:#2b332a;--rule2:#3d473c;
--paper:#efe9d6;--paper2:#151b15;--paperink:#191c14;
--accent:#cfab55;--brass:#c9a54e;--gain:#7ec893;--loss:#e8896e;--oxblood:#7a1f1c;
--serif-display:'Libre Caslon Text',Georgia,'Times New Roman',serif;
--serif-body:'Public Sans',-apple-system,'Segoe UI','Helvetica Neue',sans-serif;
--mono:'IBM Plex Mono',ui-monospace,'SF Mono',SFMono-Regular,Menlo,Consolas,monospace;
}
/* Extra tokens this shell adds on top of the canonical block (same pattern as
   _docket.css's --gain-dk). --btnink is the colour that reads ON a brass button. */
:root{--gain-dk:#5d9a75;--btnink:#17190f}

/* --ad-* : the OPT-IN theme hooks for the two inline-styled blocks that are injected
   into pages built by OTHER eras of this site — the X-Ray band (build_site.py XRAY_AD,
   written to xray_ad.html) and the archived-edition notice (ops/archive_orphans.py).
   Those blocks carry the old cream literals as var() FALLBACKS, so the ~3,000 frozen
   cream archive pages under /m — which define none of these names — render exactly as
   they did before the redesign. A page only goes dark by declaring this block. Copied
   verbatim into site.css and public/whales.html for the same reason. */
:root{--ad-rule:var(--brass);--ad-flag:var(--brass);--ad-bg:var(--panel);--ad-ink:var(--ink);
--ad-muted:var(--muted);--ad-field:var(--panel2);--ad-fieldrule:var(--rule2);
--ad-btn:var(--brass);--ad-btnink:var(--btnink);--ad-link:var(--accent);
--ad-serif:var(--serif-body);--ad-mono:var(--mono)}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);background:radial-gradient(110% 70% at 50% -8%,var(--board2) 0%,var(--bg) 62%);
color:var(--ink);font-family:var(--serif-body);font-size:16px;line-height:1.66;
text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.mono,.num,.v,.n,.dmg,td,th{font-variant-numeric:tabular-nums lining-nums}
.mono,.num{font-family:var(--mono)}
a{color:var(--accent);text-decoration:none}
img,svg{max-width:100%}
.pos,.up{color:var(--gain)}
.neg,.dn{color:var(--loss)}
.flat{color:var(--muted)}
::selection{background:var(--brass);color:var(--btnink)}

/* ===== DESK STRIP (editorial flag — one line, never stacks) ===== */
.desk{display:block;background:var(--panel);color:var(--brass);border-bottom:1px solid var(--rule2);
font-family:var(--mono);font-size:11px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;
font-weight:700;padding:8px 12px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.desk:hover{color:var(--sealink);background:var(--panel2)}

/* ===== THE COLUMN ===== */
.sheet{position:relative;max-width:960px;margin:0 auto;padding:clamp(20px,5vw,56px);padding-top:0}
.crops{position:absolute;inset:10px;pointer-events:none}
.crops i,.crops svg{position:absolute;width:14px;height:14px}
.crops i:nth-child(1){top:0;left:0;border-top:1px solid var(--rule2);border-left:1px solid var(--rule2)}
.crops i:nth-child(2){top:0;right:0;border-top:1px solid var(--rule2);border-right:1px solid var(--rule2)}
.crops i:nth-child(3){bottom:0;left:0;border-bottom:1px solid var(--rule2);border-left:1px solid var(--rule2)}
.crops i:nth-child(4){bottom:0;right:0;border-bottom:1px solid var(--rule2);border-right:1px solid var(--rule2)}
.crops svg:nth-of-type(1){top:0;left:0}.crops svg:nth-of-type(2){top:0;right:0}
.crops svg:nth-of-type(3){bottom:0;left:0}.crops svg:nth-of-type(4){bottom:0;right:0}
.crops path{fill:none;stroke:var(--rule2);stroke-width:1}

/* ===== MASTHEAD — the docket treatment, verbatim ===== */
.mast{border-bottom:1px solid var(--rule2)}
.wm{display:flex;justify-content:space-between;align-items:baseline;gap:6px 16px;flex-wrap:wrap;padding:22px 0 13px}
.wm .name{font-family:var(--serif-display);font-size:23px;font-weight:700;letter-spacing:.01em;
color:var(--ink);text-decoration:none;line-height:1.1}
.wm .name em{font-style:italic;font-weight:400;color:var(--brass)}
.wm .sub{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.motto{font-family:var(--serif-display);font-style:italic;font-size:15px;line-height:1.45;
color:var(--muted);max-width:60ch;margin:0 0 13px}
.secnav{display:flex;align-items:center;flex-wrap:wrap;padding:9px 0;border-top:1px solid var(--rule);
font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase}
.secnav a{position:relative;padding:5px 13px;color:var(--muted);text-decoration:none;white-space:nowrap}
.secnav a:first-child{padding-left:0}
.secnav a+a::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
width:1px;height:11px;background:var(--rule)}
.secnav a:hover,.secnav a.here{color:var(--ink)}
.secnav .chip{margin-left:auto;background:var(--brass);color:var(--btnink);font-weight:700;
padding:6px 11px;border-radius:2px;letter-spacing:.1em}
.secnav .chip::before{display:none}
.secnav .chip:hover{background:var(--sealink);color:var(--btnink)}

/* ===== SECTION RHYTHM — brass rules on the board ===== */
section{margin-top:clamp(34px,5.5vw,52px)}
h2.sec,.plate{position:relative;font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.22em;
text-transform:uppercase;color:var(--brass);border-bottom:1px solid var(--brass);padding-bottom:9px;margin:0 0 22px}
.plate{margin:44px 0 20px}
h2.sec::after,.plate::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--rule)}
h2.sec em,.plate em{font-style:normal;color:var(--muted);font-weight:400;letter-spacing:.14em}
.figcap{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
color:var(--muted);line-height:1.7;margin:0 0 12px}

/* ===== DOCUMENT HEAD ===== */
.crumb{margin:26px 0 16px;font-family:var(--mono);font-size:11px;line-height:1.5;letter-spacing:.12em;
text-transform:uppercase;color:var(--muted)}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--ink)}
.kicker{margin-bottom:10px;font-family:var(--mono);font-size:11px;font-weight:700;line-height:1.3;
letter-spacing:.22em;text-transform:uppercase;color:var(--brass)}
h1{margin-bottom:14px;font-family:var(--serif-display);font-weight:700;
font-size:clamp(30px,5.4vw,46px);line-height:1.06;letter-spacing:-.005em;overflow-wrap:anywhere}
h2{font-weight:400}
.lede{max-width:66ch;font-size:clamp(16px,2.2vw,18px);line-height:1.62;color:var(--muted)}
.lede b{color:var(--ink)}
.prose{max-width:66ch}
.prose p{max-width:66ch;margin:0 0 14px}
.body{font-size:16px;line-height:1.66;max-width:66ch}
.psub{font-size:16px;color:var(--muted);margin:0 0 18px;max-width:66ch;line-height:1.55}

/* ===== LEAD STORY (the board) ===== */
.lead{display:grid;grid-template-columns:1fr 240px;gap:30px;align-items:start;
padding-bottom:26px;border-bottom:1px solid var(--rule2)}
.leadh{font-family:var(--serif-display);font-weight:700;font-size:clamp(28px,5vw,42px);line-height:1.06;
letter-spacing:-.005em;margin:0 0 12px}
.leadh a{color:var(--ink);text-decoration:none}
.leadh a:hover{color:var(--brass)}
.deck{font-family:var(--serif-display);font-style:italic;font-size:clamp(17px,2.6vw,20px);font-weight:400;
line-height:1.4;color:var(--muted);max-width:60ch}
.byline{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
color:var(--muted);margin-top:16px;line-height:1.8}
.quote{border-top:1px solid var(--brass);border-bottom:1px solid var(--rule2);padding:14px 0;text-align:center}
.quote .big{display:block;font-family:var(--mono);font-weight:700;font-size:clamp(44px,10vw,60px);line-height:1}
.quote .big sup{font-size:.38em;top:-.9em}
.quote .chg{display:block;font-family:var(--mono);font-size:13px;margin-top:9px}
.quote .sub{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
text-transform:uppercase;color:var(--muted);margin-top:9px;line-height:1.6}

/* ===== "WHAT MOVED" BRIEFS ===== */
.briefs{columns:2;column-gap:34px}
.brief{break-inside:avoid;padding:14px 0;border-bottom:1px solid var(--rule)}
.brief:first-child,.brief:nth-child(2){padding-top:0}
.brief h3{font-family:var(--serif-display);font-weight:400;font-size:18px;line-height:1.25;
margin-bottom:5px;display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.brief h3 a{color:var(--ink);text-decoration:none;overflow-wrap:anywhere}
.brief h3 a:hover{color:var(--brass)}
.brief .bn{font-family:var(--mono);font-size:14px;font-weight:700;white-space:nowrap;color:var(--ink)}
.brief .bn .c{font-size:12px;margin-left:5px}
.brief p{font-size:14.5px;color:var(--muted);line-height:1.5}

/* ===== SECTION INDEX ===== */
.catindex{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
background:var(--rule2);border:1px solid var(--rule2)}
.catindex a{background:var(--panel);padding:16px 12px;text-align:center;text-decoration:none;color:var(--ink)}
.catindex a:hover{background:var(--rule)}
.catindex b{display:block;font-family:var(--serif-display);font-weight:400;font-size:19px;line-height:1.2}
.catindex span{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* ===== LEDGER TABLE — scroll, don't crush ===== */
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;margin:0 0 10px}
/* The cream shell hinted at the horizontal scroll with paper-coloured fade panels. Those
   cannot be ported: the sheet is transparent over the board's radial gradient now, so an
   opaque cover would show as a patch. A brass inner vignette does the same job and needs
   no background match. Phone only — the table fits on the desktop column. Without SOME
   affordance the Prob / 24h columns are simply invisible at 390px. */
@media(max-width:680px){
.scroll{box-shadow:inset 15px 0 12px -15px rgba(201,165,78,.55),inset -15px 0 12px -15px rgba(201,165,78,.55)}
}
.ledger{min-width:520px;width:100%;border-collapse:collapse;font-family:var(--mono);font-size:13px;line-height:1.5}
.ledger th{text-align:left;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
color:var(--muted);border-bottom:1px solid var(--brass);padding:7px 8px}
.ledger th.num{text-align:right}
.ledger td{border-bottom:1px solid var(--rule);padding:9px 8px;vertical-align:top}
.ledger tr:hover td{background:var(--panel)}
.ledger .mq{overflow-wrap:anywhere;padding-left:0;padding-right:14px}
.ledger .mq a{display:block;padding:1px 0;color:var(--ink);font-family:var(--serif-body);
font-size:15px;line-height:1.35;overflow-wrap:anywhere;
text-decoration:underline;text-decoration-color:var(--rule2);text-underline-offset:2px}
.ledger .mq a:hover{color:var(--brass);text-decoration-color:var(--brass)}
.ledger .mq .ck{display:inline-block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;
text-transform:uppercase;color:var(--muted);margin-right:8px}
.ledger td.num{text-align:right;white-space:nowrap}
.ledger .pr{font-weight:700;width:64px}
.ledger .cg{width:74px}
.ledger .vl{width:80px;color:var(--muted)}
.tnote{font-family:var(--mono);font-size:11.5px;line-height:1.8;color:var(--muted);overflow-wrap:anywhere}
/* .ledger is sized for the 4-column live board, which genuinely has to scroll on a
   phone. A two-column stat table (the Field Report) does not: min-width:520px pushed
   its VALUE column — the only thing on the page — off screen at 390px. Opt out. */
.ledger.narrow{min-width:0}
.ledger.narrow td{vertical-align:baseline}
/* At 390px even two columns crush: a 170px figure column leaves ~150px for a mono label,
   which wraps to six lines. Stack each row into label-then-figure instead, the same
   treatment _docket.css gives .dtable. The !important is deliberate — the figure cell
   carries an inline width from the page-builder, and a stylesheet !important is the only
   thing that outranks a non-important inline style. */
@media(max-width:600px){
.ledger.narrow,.ledger.narrow tbody,.ledger.narrow tr,.ledger.narrow td{display:block;width:100%}
.ledger.narrow tr{border-bottom:1px solid var(--rule);padding:13px 0}
.ledger.narrow tr:last-child{border-bottom:0}
.ledger.narrow td{border:0;padding:1px 0;width:auto!important;text-align:left!important}
.ledger.narrow td.mq{font-size:15px;line-height:1.4;color:var(--ink)}
.ledger.narrow td.pr{margin-top:6px;font-weight:700}
}

/* ===== EMPTY SECTION ===== */
.empty{margin-top:2px;padding:22px;border:1px solid var(--rule2);background:var(--panel);
color:var(--muted);font-size:16px;line-height:1.6;max-width:66ch}
.empty b{display:block;margin-bottom:8px;font-family:var(--mono);font-weight:700;font-size:12px;
line-height:1.4;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.empty a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}

/* ===== THE ONE FORM BLOCK (scan CTA + newsletter) ===== */
.submit,.cap{border:1px solid var(--rule2);background:var(--panel);
padding:clamp(16px,3vw,22px);border-radius:2px}
.submit{margin-top:20px}
.cap{margin-top:44px}
.submit .sk,.submit .k,.cap .capn,.cap .k{margin-bottom:11px;font-family:var(--mono);font-size:11px;
font-weight:600;line-height:1.3;letter-spacing:.24em;text-transform:uppercase;color:var(--brass)}
.submit h2{margin-bottom:10px;font-family:var(--serif-display);font-weight:700;
font-size:clamp(23px,3.6vw,30px);line-height:1.12;letter-spacing:-.005em}
.submit p,.cap p{max-width:66ch;font-size:16px;line-height:1.6}
.submit .sl{font-size:16px;line-height:1.55;max-width:66ch;margin-bottom:14px}
.cap .capsub{font-size:15.5px;line-height:1.55;max-width:66ch;margin-bottom:14px;color:var(--muted)}
.row,.capr{display:flex;flex-wrap:wrap;gap:10px}
.row{margin-top:16px}
.capr{margin-top:14px;max-width:520px}
.row input,.capr input,.submit input,.cap input{flex:1 1 100%;min-width:0;font-family:var(--mono);
font-size:16px;min-height:48px;padding:12px 13px;background:var(--panel2);border:1px solid var(--rule2);
border-radius:2px;color:var(--ink)}
input::placeholder{color:var(--muted)}
input:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px rgba(201,165,78,.22)}
.btn{flex:1 1 100%;width:100%;display:block;background:var(--brass);color:var(--btnink);
border:1px solid var(--brass);border-radius:2px;cursor:pointer;text-align:center;text-decoration:none;
font-family:var(--mono);font-weight:700;font-size:13.5px;letter-spacing:.1em;text-transform:uppercase;
padding:15px 22px;min-height:52px;line-height:1.35;margin-top:10px}
.btn:hover{background:var(--sealink);border-color:var(--sealink);color:var(--btnink)}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.btn-ghost{background:transparent;color:var(--brass);border-color:var(--brass)}
.btn-ghost:hover{background:var(--brass);color:var(--btnink)}
.capr .btn{margin-top:0}
@media(min-width:560px){.row input,.capr input{flex:1 1 220px}}
@media(min-width:721px){.btn{flex:0 0 auto;width:auto;display:inline-block}}
.reassure{margin-top:12px;font-family:var(--mono);font-size:12px;line-height:1.7;
color:var(--muted);overflow-wrap:anywhere}
.micro,.capm,.mailwhy{margin-top:8px;font-family:var(--mono);font-size:12px;line-height:1.8;
color:var(--muted);overflow-wrap:anywhere}
.micro b{color:var(--ink)}
.micro a,.reassure a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.comply{margin-top:14px}

/* ===== GUARANTEE — the one place --gain colours something that is not a number ===== */
.guar{margin-top:16px;padding:16px 18px;border:1px solid var(--gain);background:var(--panel);
font-size:15px;line-height:1.55}
.guar b{color:var(--gain)}

/* ===== MARKET-PAGE TILES + SEE-ALSO ===== */
.mtiles{display:flex;flex-wrap:wrap;gap:1px;background:var(--rule2);border:1px solid var(--rule2);margin:20px 0}
.mtile{flex:1 1 130px;background:var(--panel);padding:11px 14px}
.mtile .v{font-family:var(--mono);font-size:clamp(17px,2.4vw,22px);font-weight:700;white-space:nowrap}
.mtile .l{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
color:var(--muted);margin-top:3px}
.seealso{list-style:none;padding:0;margin:0;column-gap:30px}
.seealso li{break-inside:avoid;border-bottom:1px solid var(--rule);padding:9px 0;font-size:15px;
display:flex;justify-content:space-between;gap:10px}
.seealso a{color:var(--ink);overflow-wrap:anywhere;text-decoration:underline;
text-decoration-color:var(--rule2);text-underline-offset:2px}
.seealso a:hover{color:var(--brass);text-decoration-color:var(--brass)}
.seealso li .n,.seealso .n{font-family:var(--mono);font-size:13px;color:var(--muted);white-space:nowrap}
.faqh{font-family:var(--serif-display);font-size:19px;font-weight:400;margin:16px 0 4px}

/* ===== QUOTEBOX (market pages) ===== */
.quotebox{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 22px;
border-top:1px solid var(--brass);border-bottom:1px solid var(--rule2);padding:16px 0;margin:22px 0}
.quotebox .big{font-family:var(--mono);font-weight:700;font-size:clamp(40px,9vw,58px);line-height:1}
.quotebox .big sup{font-size:.38em;top:-.9em}
.quotebox .qmeta{font-family:var(--mono);font-size:12.5px;line-height:1.7;color:var(--muted)}
.quotebox .qmeta b{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
color:var(--muted);font-weight:700}

/* ===== FOOTER ===== */
.foot{border-top:1px solid var(--rule2);margin-top:clamp(38px,6vw,56px);padding:18px 0 8px;
font-family:var(--mono);font-size:11.5px;line-height:1.85;color:var(--muted);overflow-wrap:anywhere}
.foot b{color:var(--ink);font-family:var(--mono);font-weight:700;font-size:11.5px;letter-spacing:.02em}
.foot a{color:var(--muted);text-decoration:underline;text-decoration-color:var(--rule2);text-underline-offset:2px}
.foot a:hover{color:var(--ink)}
.foot .tl,.foot .t{display:block;margin-top:8px;color:var(--muted)}

/* ===== MOBILE LAWS — zero horizontal overflow at 390px ===== */
@media(max-width:860px){
.lead{grid-template-columns:1fr;gap:20px}
.quote{display:flex;align-items:center;justify-content:flex-start;gap:20px;text-align:left;flex-wrap:wrap}
.quote .chg,.quote .sub{margin-top:0}
}
@media(max-width:720px){.btn{display:block;width:100%}}
@media(max-width:680px){
.secnav{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
.secnav .chip{margin-left:8px;position:sticky;right:0;flex:0 0 auto;
box-shadow:-14px 0 14px -6px rgba(16,21,15,.92)}
.briefs,.seealso{columns:1}
.catindex{grid-template-columns:1fr 1fr}
.ledger .vl,.ledger th.vh{display:none}
}
@media(max-width:559px){.row input,.capr input{flex:1 1 100%}}
@media(max-width:480px){.crops{display:none}.motto{font-size:14.5px}}
@media print{
body{background:#fff;color:#111}
.desk,.secnav,.btn,.submit,.cap{display:none}
.sheet{max-width:none;border:0;box-shadow:none}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.rg{border-top:1px solid var(--rule);margin-top:14px;padding-top:12px;font-family:var(--mono);font-size:11.5px;line-height:1.85;color:var(--muted)}
.rg b{color:var(--ink)}

/* ===== MOBILE 2026 PASS (coordinator, 2026-07-25 — from ox-research/mobile-2026-playbook.md) ===== */
html{color-scheme:dark}
@view-transition{navigation:auto}
.sheet{padding-left:max(clamp(20px,5vw,56px),env(safe-area-inset-left));
padding-right:max(clamp(20px,5vw,56px),env(safe-area-inset-right))}
@media(max-width:680px){
.secnav::after{content:"";flex:0 0 76px}  /* lets the last link scroll clear of the sticky JOIN chip */
}
.herobuy{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin:2px 0 26px}
.herobuy .btn{flex:0 1 auto;width:auto;display:inline-block;text-decoration:none}
.herobuy .hp{font-family:var(--mono);font-size:13px;line-height:1.7;color:var(--muted)}
.herobuy .hp b{color:var(--ink);font-size:15px}
@media(max-width:560px){.herobuy .btn{flex:1 1 100%;width:100%}}

/* ===== SC 1.4.11 — the field boundary (2026-07-25, mobile-2026 playbook item 8) =====
   --rule2 is 1.70–1.91:1 against the surfaces it sits on. On a decorative hairline that
   is fine: 1.4.11 governs boundaries REQUIRED to identify a component. A text field's
   border is the only thing that says where the field is, so it is in scope and it fails.
   --fieldline is 3.35:1 at worst (on --panel) and 3.76:1 on --bg. Only inputs, selects
   and textareas move; card, table and rule hairlines keep --rule2 deliberately.
   The focus ring is restated after, or this rule would outrank it at equal specificity
   and the brass focus border would silently stop appearing. */
:root{--fieldline:#697462}
.row input,.capr input,.submit input,.cap input,.fld input,.fld select,
input:not([type=hidden]),select,textarea{border-color:var(--fieldline)}
.row input:focus,.capr input:focus,.submit input:focus,.cap input:focus,
.fld input:focus,.fld select:focus,input:focus,select:focus,textarea:focus{border-color:var(--brass)}