/* YPD COPY, DO NOT EDIT HERE. YPD stamp b570, copied 2026-10-24.
   Master: C:\_Shared-Library\_Shared-Pieces\Style\style-driver.css (UI Engine owns it, STYLE-CANONICAL-V1A.md names
   every token). A change to a shared value is made in the master by UI Engine, then copied here in the same pass,
   byte for byte below this comment. app.html loads tokens.css, then style-driver.css, then app.css. */
/* Your Personal Driver's layer over tokens.css. UI Engine, 2026-10-24. Loaded right after tokens.css, before app.css.
   The families, Forge Orange as the ONLY brand colour, the passenger blue as a named token, and the label look he
   picked in b510: an orange chip with white text. Nothing else. The app still overrides --accent on documentElement
   at runtime for a rider's chosen colour or a white-label driver; inline beats a stylesheet, so that keeps winning. */
:root {
  --display: 'Archivo Black', 'Space Grotesk', system-ui, sans-serif;
  --body: 'Space Grotesk', system-ui, -apple-system, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --accent: #FF3B00;             /* Forge Orange, the one brand colour */
  --on-accent: #FFFFFF;
  --pax: #1650C7;                /* the passenger's blue (b367), 12 raw uses in app.css become this name */
  --pax-tint: color-mix(in srgb, var(--pax) 14%, var(--card));

  /* YPD's own line and good-ink (b565): the audit's raw values, now the layer's, light and under the dark pin alike */
  --line: #DDDBD4;
  --good-ink: #0F5C2A;

  /* the label chip: orange, white text, his b510 pick, unchanged */
  --label-bg: var(--accent); --label-fg: #FFFFFF;

  /* the names ypd-tokens.css already gave the same values, so nothing has to be renamed on day one */
  --ypd-orange: var(--accent); --ypd-ink: var(--ink); --ypd-white: var(--card); --ypd-mist: var(--paper);
  --ypd-line: var(--line); --ypd-steel: var(--muted); --ypd-success: var(--good); --ypd-danger: var(--bad);
  --ypd-warn: var(--warn); --ypd-info: var(--info); --ypd-font-ui: var(--body); --ypd-font-data: var(--mono);
  --ypd-touch-min: var(--tap); --ypd-ctl-h: var(--ctl-lg); --ypd-ctl-h-min: var(--ctl);
  --fs-label: var(--t-num);      /* the chip size the audit found at 9.6px, now the 12px floor */
}

/* The driver app has no dark look (b564): tokens.css's dark neutrals must not reach it, so the layer pins light under
   both dark selectors and keeps the colour scheme light. When YPD gets a dark look, delete this block, nothing else. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --ink: #0A0A0A; --paper: #F4F4F2; --card: #FFFFFF; --line: #DDDBD4; --muted: #5A5A57;
    --good-ink: #0F5C2A; --warn-ink: color-mix(in srgb, var(--warn) 70%, #000);
    --bad-ink: color-mix(in srgb, var(--bad) 85%, #000); --info-ink: color-mix(in srgb, var(--info) 80%, #000);
    --accent-ink: color-mix(in srgb, var(--accent) 80%, #000); color-scheme: light; }
}
:root[data-theme="dark"] { --ink: #0A0A0A; --paper: #F4F4F2; --card: #FFFFFF; --line: #DDDBD4; --muted: #5A5A57;
  --good-ink: #0F5C2A; --warn-ink: color-mix(in srgb, var(--warn) 70%, #000);
  --bad-ink: color-mix(in srgb, var(--bad) 85%, #000); --info-ink: color-mix(in srgb, var(--info) 80%, #000);
  --accent-ink: color-mix(in srgb, var(--accent) 80%, #000); color-scheme: light; }

/* The shared chat and travel pieces read five names that YPD rendered differently in b563 (its last build before this
   file). Set here, scoped, so they look exactly as they did and app.css carries no 'initial' pins. The --body shorthand
   on .trk-sel, .trk-sheet button and .trk-toast has no single value that reproduces b563 (the shorthand had dropped and
   the body font inherited); that one is a change to the travel master, on UI Engine's list, not a pin. */
.ypdchat { --accent-ink: var(--ink); --ls-label: normal; }
.trk-sheet, .trk-toast { --r-ctl: 12px; }
.trk-sheet p { --f-small: 400 16px/normal 'Space Grotesk', -apple-system, 'Segoe UI', Roboto, sans-serif; }

/* The driver's one button system, YPD b569 (Ahmed's pick, 2026-10-24): primary orange, one per sheet; secondary white
   with an ink edge; quiet text; danger a red outline (a fill only on the final confirm); radius 14; 56 / 48 / 44 tall;
   ALL CAPS 700 .08em; selected is an ink fill with white text; green only for states. Moved here from app.css so the
   shared pieces inside the driver app read the same names. */
:root {
  --btn-h-lg: var(--ctl-primary); --btn-h: var(--ctl); --btn-h-sm: var(--tap);
  --btn-r: var(--r-ctl); --btn-case: uppercase; --btn-ls: .08em; --btn-fw: 700;
  --btn-fs: var(--t-small); --btn-fs-lg: var(--t-body); --btn-fs-sm: var(--t-label);
  --btn-edge: var(--rule); --btn-choice-edge: #BDBAB2;
  --btn-sel-bg: var(--ink); --btn-sel-fg: #FFFFFF;
}