/* ── Landing layout — ported from the original index.html inline <style> (lines 16–57).
   NOT present in colors_and_type.css. .grain/.eyebrow/.btn ARE in that file, so omitted here. ── */
.sigil{ width:104px; height:104px; display:block; margin:0 auto var(--sp-5); }
.eyebrow-c{ display:block; margin-bottom:var(--sp-4); }
.wordmark{ font-family:var(--font-display); font-variation-settings:"opsz" 144,"SOFT" 50,"wght" 400;
  font-size:clamp(40px,9vw,72px); line-height:1.02; letter-spacing:-0.015em; color:var(--paper); margin:0 0 var(--sp-4); }
.wordmark i{ font-style:italic; }
.lede{ margin:0 auto var(--sp-6); max-width:52ch; color:var(--paper-dim); font-size:var(--fs-body); }
.rule{ width:44px; height:1px; background:var(--brass-dim); border:0; margin:var(--sp-6) auto; }
.principle{ font-family:var(--font-display); font-variation-settings:"opsz" 72,"SOFT" 80,"wght" 400;
  font-style:italic; font-size:clamp(19px,2.4vw,24px); line-height:1.32; color:var(--paper); max-width:42ch; margin:0 auto var(--sp-7); }
.cats{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4); text-align:left; margin:var(--sp-7) auto; max-width:720px; }
.catcard{ display:block; text-decoration:none; color:inherit; background:var(--bg-deep);
  border:1px solid var(--paper-ghost); border-top-width:2px; padding:var(--sp-5); border-radius:0; transition:border-color .15s, background .15s; }
.catcard:hover{ background:var(--bg); border-color:var(--brass-dim); }
.catcard .hd{ display:flex; align-items:center; gap:var(--sp-2); margin-bottom:var(--sp-3); }
.catcard .dot{ width:8px; height:8px; border-radius:9999px; flex:0 0 8px; }
.catcard .nm{ font-family:var(--font-display); font-variation-settings:"opsz" 36,"SOFT" 60,"wght" 500; font-size:var(--fs-h3); color:var(--paper); }
.catcard .q{ font-family:var(--font-display); font-variation-settings:"opsz" 36,"SOFT" 70,"wght" 400; font-style:italic; font-size:var(--fs-body); line-height:1.3; color:var(--brass); margin:0 0 var(--sp-3); }
.catcard p{ margin:0; max-width:none; font-size:var(--fs-body-sm); line-height:1.55; color:var(--paper-dim); }
.catcard .count{ font-family:var(--font-mono); font-size:var(--fs-micro); text-transform:uppercase;
  letter-spacing:var(--tr-mono-caps); color:var(--brass); margin-top:var(--sp-3); }
.actions{ display:flex; flex-wrap:wrap; gap:var(--sp-3); justify-content:center; margin:var(--sp-6) 0 var(--sp-7); }
.foot{ font-family:var(--font-mono); font-size:var(--fs-micro); letter-spacing:var(--tr-mono-caps);
  text-transform:uppercase; color:var(--paper-dim); line-height:2.1; }
@media(max-width:600px){ .cats{ grid-template-columns:1fr; } }

/* ── Banner + list + detail (authored) ── */
.fidelity-banner{
  font-family:var(--font-mono); font-size:var(--fs-micro); line-height:1.6;
  color:var(--paper); background:rgba(196,64,48,0.14);
  border-bottom:1px solid var(--red); padding:10px 16px; text-align:center;
}
.fidelity-banner a{ color:var(--brass); }
.wrap{ width:100%; max-width:860px; margin:0 auto; padding:var(--sp-7) var(--sp-5); }
.crumb{ font-family:var(--font-mono); font-size:var(--fs-micro); text-transform:uppercase;
  letter-spacing:var(--tr-mono-caps); color:var(--paper-dim); margin-bottom:var(--sp-4); }
.crumb a{ color:var(--paper-dim); text-decoration:none; }
.crumb a:hover{ color:var(--brass); }
.page-h{ font-family:var(--font-display); font-variation-settings:"opsz" 72,"SOFT" 60,"wght" 400;
  font-size:var(--fs-h1); color:var(--paper); margin:0 0 var(--sp-3); }
.decade-h{ font-family:var(--font-mono); font-size:var(--fs-micro); text-transform:uppercase;
  letter-spacing:var(--tr-mono-caps); color:var(--brass); margin:var(--sp-6) 0 var(--sp-2);
  border-bottom:1px solid var(--paper-ghost); padding-bottom:4px; }
/* Paper row — author-first, stacked (design_system_v2 component-paper-row).
   Title and meta are BLOCK divs on their own lines (the old inline spans collided). */
.paper-row{ display:block; text-decoration:none; border-top:1px solid var(--paper-faint);
  padding:var(--sp-4) 2px; color:var(--paper); }
.paper-row:hover{ background:var(--bg-deep); }
.paper-row .t{ font-family:var(--font-display); font-variation-settings:"opsz" 32,"wght" 420;
  font-size:16px; line-height:1.32; letter-spacing:-0.005em; }
.paper-row .au{ color:var(--paper); }
.paper-row .au em{ font-style:italic; color:var(--paper-dim); font-weight:400; }
.paper-row .sep{ color:var(--paper-ghost); margin:0 7px; }
.paper-row .ti{ color:var(--paper-dim); }
.paper-row .meta{ display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin-top:var(--sp-2);
  font-family:var(--font-mono); font-size:10.5px; color:var(--paper-ghost); letter-spacing:0.04em; }
.paper-row .meta .venue{ font-family:var(--font-display); font-style:italic; font-size:11.5px;
  color:var(--paper-dim); font-variation-settings:"opsz" 14,"wght" 380; }
.paper-row .meta .dot{ color:var(--paper-ghost); }
.paper-row .meta .yr{ color:var(--brass); font-size:13px; }
.paper-row .wd-flag{ color:var(--red); border:1px solid var(--red); border-radius:2px;
  padding:1px 6px; text-transform:uppercase; letter-spacing:0.1em; }

/* ── Badge families (ported from design_system_v2 component-badges) ── */
.spine{ display:flex; flex-wrap:wrap; gap:var(--sp-2); align-items:center; margin:var(--sp-4) 0; }
.ev{ display:inline-flex; align-items:center; gap:7px; font-family:var(--font-mono); font-size:10px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--paper-dim); padding:3px 8px;
  border:1px solid var(--paper-faint); border-radius:2px; background:var(--bg-deep); }
.ev .bars{ display:inline-flex; gap:2px; }
.ev .bars i{ width:3px; height:7px; background:var(--paper-ghost); display:inline-block; border-radius:.5px; }
.ev .bars i.on{ background:var(--brass); }
.ev.top{ color:var(--paper); border-color:var(--brass-dim); }
.chip{ display:inline-flex; align-items:center; gap:6px; font-family:var(--font-mono); font-size:10px;
  letter-spacing:.14em; text-transform:uppercase; padding:4px 9px 4px 7px; border-radius:2px;
  border:1px solid var(--paper-ghost); line-height:1; }
.chip .sq{ width:6px; height:6px; border-radius:1px; }
.chip.neutral{ color:var(--paper-dim); border-color:var(--paper-ghost); }
.chip.neutral.landmark{ color:var(--brass); border-color:var(--brass-dim); }
.warn{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:10.5px;
  letter-spacing:.14em; text-transform:uppercase; background:var(--red); color:var(--bg);
  padding:6px 11px; border-radius:2px; font-weight:500; }
.hedge{ font-family:var(--font-mono); font-size:var(--fs-micro); color:var(--brass);
  text-transform:uppercase; letter-spacing:var(--tr-mono-caps); margin:var(--sp-5) 0 var(--sp-2); }
/* Source links render as buttons (.btn supplies colour/border/hover); this just adds layout spacing. */
.src-link{ display:inline-flex; align-items:center; gap:5px; margin-top:var(--sp-4); margin-right:var(--sp-3); }
.withdrawn-note{ border:1px solid var(--red); padding:var(--sp-5); color:var(--paper); }
@media(max-width:600px){ .wrap{ padding:var(--sp-6) var(--sp-4); } }