/* Shared page canvas and surface treatment, matched to the homepage background. */
:root {
  --bg: #1e1e24;
  --panel: #26262e;
  --raised: #2d2d36;
  --panel-raised: #2d2d36;
  --site-surface: #26262e;
  --site-surface-border: #3f3f4a;
  --site-surface-accent: #d8b25a;
}

html,
body {
  background: #1e1e24;
}

:is(
  article, table, [role="table"], form,
  .plan, .plan-next, .journey-stage, .stair-tier,
  .term, .mechanic, .loop-stage, .finding, .trust-card, .bridge-card,
  .proof-placeholder, .map-placeholder, .screenshot-frame,
  .reg-panel, .role-line, .wolf-panel, .wolf-workspace
) {
  background: var(--site-surface);
  border: 1px solid var(--site-surface-border);
  box-shadow: inset 0 2px 0 var(--site-surface-accent);
}

.loop-stage:nth-child(1) { --site-surface-accent: #d8b25a; }
.loop-stage:nth-child(2) { --site-surface-accent: #b9d4e8; }
.loop-stage:nth-child(3) { --site-surface-accent: #7fa8c9; }
.loop-stage:nth-child(4) { --site-surface-accent: #a7b47a; }
.finding { --site-surface-accent: #7fa8c9; }
.mechanic:nth-child(even) { --site-surface-accent: #7fa8c9; }