/* Palette comparison only. Layout, illustration timing and motion are shared. */
:root {
  --paper: #f5f4ed;
  --ink: #171d19;
  --orange: #87662b;
  --accent: #c5a364;
  --forest: #173b2d;
  --brass: #c5a364;
  --line: #d8d9cd;
}

::selection { background: #e5d6ad; color: #171d19; }
a:focus-visible, button:focus-visible { outline-color: #87662b; }
.header {
  background: #121e18;
  color: #f5f4ed;
  border-bottom-color: #3c4d3d;
}
.header .brand svg, .header .talk span { color: var(--brass); }
.header-note, .header .compare { color: #c4cbbd; }
.header a:focus-visible, .stage-shell button:focus-visible { outline-color: #dfc38a; }
.eyebrow > i { background: #967338; }
.reel-word > span, .approach-heading h2 > span, .closing em { color: #87662b; }
.primary { background: #173b2d; color: #f5f4ed; }
.primary span { color: #dec48d; }
.primary:hover { background: #224d3b; }

.stage-shell {
  background: var(--forest);
  border-color: #315542;
  box-shadow: 0 35px 70px -50px #142c2166;
}
.stage-top, .stage-footer { color: #e2e5d5; border-color: #41604a; }
.stage-top i { background: var(--brass); }
.pause { border-color: #849679; color: #ead5aa; }
.stage-grid {
  background-image: radial-gradient(#b5c5a333 .8px, transparent .8px);
}
.orbit { border-color: #9eb58a30; }
.corner { color: #adba97; }
.routes { stroke: #b4c49b45; }
.route-flow { stroke: #d3b57a; }
.collector {
  background: #c5a364;
  color: #192c21;
  box-shadow: 0 8px 0 #8c703c, 0 20px 35px #081d1680;
}
.note, .chip { box-shadow: 5px 7px 0 #0a271d66; }
.result { box-shadow: 0 18px 38px #071f1a55; }
.result-tag { color: #c6cfb3; }
.calendar-strip .selected-day { background: #e7d5ae; color: #382d17; }
.report-bars > i:nth-child(4) { background: #b18e4b; }
.sequence button[aria-pressed=true] { background: #e8ecdf; color: #173b2d; }
.sequence button[aria-pressed=true] .seq-number { color: #87662b; }
.sequence i { background: #98763b; }

.conversation-link { background: #19372a; color: #f5f4ed; }
.conversation-link .eyebrow { color: #dfc38a; }
.conversation-link p:last-child { color: #c7d1bc; }
.conversation-link > a { border-color: #8d9c80; }
.conversation-link > a > span { color: #dfc38a; }
.conversation-link a:focus-visible { outline-color: #dfc38a; }
