/* Direction: night-shift taxi — warm paper, cab yellow, ink black, grotesk display */
/* Completed by the platform from the short form: both modes, every
   palette token, each text-on-ground pair at its floor. To restyle, write the
   short form again (the decisions in one :root) and it is completed again. */

:root {
  --canvas: #fbf8ee;
  --surface: #fdfcf7;
  --surface-2: #f0ede3;
  --border: #dbd8cf;
  --border-strong: #b6b4ab;
  --ink: #16140e;
  --muted: #696660;
  --accent: #f5b700;
  --accent-hover: #d09c00;
  --accent-ink: #16140e;
  --accent-text: #7a5800;
  --accent-strong: #886600;
  --accent-soft: #faefcd;
  --accent-border: #f8db83;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #dfead9;
  --success-strong: #137638;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #f2e4d3;
  --warning-strong: #a64c08;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #f3ded5;
  --danger-strong: #b91c1c;
  --chart-1: #b68812;
  --chart-2: #57a056;
  --chart-3: #168891;
  --chart-4: #628adb;
  --chart-5: #9a58a1;
  --chart-6: #d66f6b;

  --font-display: "Space Grotesk", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --radius-card: 18px;
  --radius-btn: 12px;
  --radius-input: 10px;
  --display-tracking: -0.02em;
  --x-band: #16140e;
  --x-on-band: #fbf8ee;
  --x-on-photo: #fbf8ee;
  --font-mono: "JetBrains Mono Variable", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --font-sans: "Inter", system-ui, sans-serif;
  --display-weight: 700;
  --eyebrow-tracking: 0.08em;
}

html[data-theme="dark"] {
  --canvas: #16140e;
  --surface: #2d2c26;
  --surface-2: #22201a;
  --border: #373530;
  --border-strong: #5c5b56;
  --ink: #fbf8ee;
  --muted: #9f9d94;
  --accent: #f5b700;
  --accent-hover: #f7c226;
  --accent-ink: #16140e;
  --accent-text: #f5b700;
  --accent-strong: #f5b700;
  --accent-soft: #47380b;
  --accent-border: #7a5d08;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #162c18;
  --success-strong: #58a474;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #39220d;
  --warning-strong: #ca854f;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #3a1611;
  --danger-strong: #d16969;
  --chart-1: #f5b700;
  --chart-2: #74d974;
  --chart-3: #22bfcb;
  --chart-4: #9fbefb;
  --chart-5: #d87ee1;
  --chart-6: #fda19b;
}

.hero-road {
  background-image: repeating-linear-gradient(90deg, var(--accent) 0 28px, transparent 28px 56px);
  background-size: 100% 6px;
  background-repeat: no-repeat;
  background-position: 0 100%;
}
.book-card { box-shadow: 0 24px 60px -30px rgba(0, 0, 0, 0.35); }
.band-dark { background: var(--x-band); color: var(--x-on-band); }
.band-dark .step-n {
  display: grid; place-items: center; flex: none;
  width: 2.5rem; height: 2.5rem; border-radius: 9999px;
  background: var(--accent); color: var(--x-band);
  font-family: var(--font-display); font-weight: 700;
}
.band-accent { background: var(--accent); color: var(--x-band); }
.band-accent .btn-secondary { background: var(--x-band); color: var(--x-on-band); border-color: var(--x-band); }
.est .icon { vertical-align: -0.15em; }
@media (prefers-reduced-motion: no-preference) {
  .est { animation: est-in 0.3s ease-out; }
  @keyframes est-in { from { transform: translateY(6px); } to { transform: none; } }
}
html.reduced-motion .est { animation: none; }