:root {
  --ink: #201E1E;
  --line: #DDDBB3;
  --soft: #FFFBFB;
  --blue: #6298B6;
  --navy: #4E1D15;
  --muted: #765f59;
  --brand: #4E1D15;
  --red: #941517;
  --sand: #DDDBB3;
  --olive: #C4BA7E;
  --paper: #FFFBFB;
}

body { background: #d8d8d8; color: var(--ink); }
.page-shell, .round-arrows button { background: var(--paper); }
.page-shell { position: relative; }
.topbar { top: 0; left: 0; }
.black { background: var(--brand); }
.hero-overlay { background: linear-gradient(90deg, rgba(78,29,21,.76), rgba(78,29,21,.08) 72%), linear-gradient(0deg, rgba(32,30,30,.32), transparent 46%); }
.rail-card::after, .portrait::after { background: linear-gradient(transparent, rgba(78,29,21,.9)); }
.person { background: #eee5e0; }
.catalog-grid article:nth-child(3n+1), .outcome-grid article:nth-child(2) { background: #f4eee8; }
.catalog-grid article:nth-child(3n+2) { background: #eef4f7; }
.catalog-grid article:nth-child(3n) { background: #f2efd9; }
.catalog-grid article > span { color: var(--red); }
.chip-grid span:nth-child(4n+1) { border-color: #c6dae5; }
.chip-grid span:nth-child(4n+2) { border-color: var(--sand); }
.chip-grid span:nth-child(4n+3) { border-color: #d6aaa6; }
.media-word { background: var(--sand); color: var(--brand); }
.closing-shade { background: linear-gradient(90deg, rgba(78,29,21,.78), rgba(78,29,21,.08) 72%); }
footer { background: var(--brand); }
dialog::backdrop { background: rgba(78,29,21,.66); }
.success b { background: var(--sand); color: var(--brand); }
