/* Backfile — brand tokens (D-36). One :root, consumed by every page.
   Feel: plain, signed, dated, exact. A record that shows its work.
   Built on one object: the cut card with its highlight and its provenance line.
   Rules: paper ground, near-black ink, hairlines not shadows, mono for chrome,
   serif for headlines, Georgia for card bodies. Highlighter yellow is a MARK
   (behind read text, selected states, "new"), never type, never a button fill.
   Pro green and Con red mean sides and nothing else. No gradients, no blur
   shadows, no pill buttons (pills are status chips only), no violet. */

@font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/IBMPlexSerif-400.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Serif';font-style:italic;font-weight:400;font-display:swap;src:url('/fonts/IBMPlexSerif-400-italic.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/IBMPlexSerif-600.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/IBMPlexMono-400.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/IBMPlexMono-500.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/IBMPlexMono-600.woff2') format('woff2')}
@font-face{font-family:'Silkscreen';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/Silkscreen-400.woff2') format('woff2')}

:root{
  /* surfaces */
  --paper:#FBFAF7; --paper-2:#F1EFE9; --surface:#FFFFFF;
  /* ink scale */
  --ink:#111110; --ink-2:#45443F; --ink-3:#7A7871; --ink-4:#AAA79E;
  /* hairlines */
  --line-1:rgba(17,17,16,.08); --line-2:rgba(17,17,16,.14); --line-3:rgba(17,17,16,.26);
  /* the mark: highlighter yellow, background only */
  --hl:#FFE84D; --hl-dim:rgba(255,232,77,.38); --hl-ink:#5C4A00;
  /* the two sides of every debate; semantic only */
  --pro:#1F9D55; --pro-dim:rgba(31,157,85,.12);
  --con:#E2461B; --con-dim:rgba(226,70,27,.12);
  /* signal */
  --good:#1F9D55; --bad:#B23A1C;
  /* geometry: tight radii; pills (100px) are for status chips only */
  --r-xs:2px; --r-sm:4px; --r-md:8px; --r-lg:12px; --r-xl:16px;
  /* type: mono for chrome, serif for headlines, Georgia for card bodies */
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --serif:'IBM Plex Serif',Georgia,'Times New Roman',serif;
  --display:'IBM Plex Serif',Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --wordmark:'Silkscreen',monospace;
  --card-font:Georgia,'IBM Plex Serif',serif;
  --hl-color:#FFF59D;          /* reader highlight default (D-07 keeps the choice) */
  /* legacy aliases so older rules resolve to the brand, never to violet */
  --accent:var(--ink); --accent-ink:var(--ink); --accent-soft:var(--hl-dim);
  --violet:var(--ink-3); --coral:var(--con); --teal:var(--pro); --amber:var(--hl-ink);
  --grad:var(--ink);
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* shared primitives */
.ml{font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.num{font-variant-numeric:tabular-nums}
.wordmark{font-family:var(--wordmark);font-size:15px;letter-spacing:.08em;color:var(--ink)}
.mark-hl{background:linear-gradient(transparent 55%,var(--hl) 55%,var(--hl) 92%,transparent 92%);padding:0 2px}
.side-pro{color:var(--pro)} .side-con{color:var(--con)}
::selection{background:var(--hl);color:var(--ink)}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

/* account slot in a page nav: the same .acct component, compact */
.navacct .acct{padding:5px 9px;border-radius:var(--r-sm);min-height:40px}
.navacct .acct .ml{display:none}
.navacct .acct.signin{border-style:solid}