/* Type tuning per system. The faces themselves are role aliases declared in
   fonts/type-<a|b|c>.css ('Skid Display' / 'Skid Sans' / 'Skid Mono' /
   'Skid Sign' / 'Skid Plate'), built by dev/build-fonts.py with size-adjust
   normalising cap heights, so ui.css sizes hold for every system, and
   ascent/descent overrides that centre caps in the line box. This file only
   carries what differs per voice: tracking, case, weight and scale per role.
   <html data-type> is set in index.html from ?type= (default a).

   A  Tabloid  Anton / Saira Condensed / Saira tabular / D-DIN (plate: Saira Cond)
   B  Steel    Big Shoulders Display / Big Shoulders Text / Tektur tabular / D-DIN
   C  Livery   Russo One / Chakra Petch / Oxanium / D-DIN (plate: D-DIN Condensed) */

/* ---------------- Shared ---------------- */
/* Changing numbers never jitter: tabular figures everywhere. ui.css sets type
   with the `font` shorthand, which resets font-variant-numeric per element,
   so this has to win outright. (The mono cuts also have tnum baked into the
   default digits, so canvas digits are tabular too.) */
*, *::before, *::after { font-variant-numeric: tabular-nums !important; }

/* Optical centring. Caps now sit centred in the line box (font metrics), so
   the old nudge for low-riding caps goes; primary buttons have a 3 px bottom
   bevel, so their label centres on the face above it. */
.btn > span { padding-top: 0; }
.btn-primary { padding-bottom: 3px; }
kbd { padding-top: 0.06em; }

/* Road signage speaks the sign face (DIN 1451 lineage), never the UI face. */
.next-exit span, .next-exit b, .fk-head b, .fk-t b, .fk-exit, .card-rules, .a-sign-numt { font-family: var(--sign); }
.next-exit span, .fk-t b { letter-spacing: 0.01em; }
.next-exit b, .fk-head b, .fk-exit { letter-spacing: 0.06em; }
.card-rules { font-weight: 700; letter-spacing: 0.005em; }

/* ---------------- A: Tabloid ---------------- */
/* Anton is a condensed poster grotesque: set it in caps with a hair of
   tracking and tight leading, and give it more size than a wide face gets.
   Saira (wide, squared, Eurostile lineage) carries every number. */
:root[data-type='a'] :is(.card-title, .dead-word, .result-word, .pause-word, .pz-word, .plates-title, .toast.big, .zone-strip, .wrong-way, .countdown, .settings-head h2, .ht-head h2, .card h3, .car-card h2) { text-transform: uppercase; letter-spacing: 0.012em; }
:root[data-type='a'] .card-title { font-size: clamp(42px, 7.4vw, 108px); line-height: 0.9; }
:root[data-type='a'] :is(.dead-word, .result-word, .pause-word) { font-size: clamp(60px, 10.4vw, 144px); line-height: 0.86; }
:root[data-type='a'] .headline { font-size: clamp(24px, 3.6vw, 42px); line-height: 0.96; letter-spacing: 0.008em; padding-top: 14px; padding-bottom: 12px; }
:root[data-type='a'] .car-card h2 { font-size: 32px; }
:root[data-type='a'] .store-title { letter-spacing: 0.02em; }
:root[data-type='a'] .store-title small, :root[data-type='b'] .store-title small { letter-spacing: 0.01em; }
:root[data-type='a'] .score { letter-spacing: -0.01em; }
:root[data-type='a'] .cash { letter-spacing: 0; }
:root[data-type='a'] .btn { letter-spacing: 0.09em; }
:root[data-type='a'] .offer-name { letter-spacing: 0.01em; }

/* ---------------- B: Steel ---------------- */
/* Big Shoulders is Chicago's signage family: Display for the shouts, Text
   (its small optical size) for labels. Both are narrow, so caps get open
   tracking and body copy a touch of air; Tektur's chunky squared digits are
   the dashboard. */
:root[data-type='b'] body { letter-spacing: 0.012em; }
:root[data-type='b'] :is(.card-title, .dead-word, .result-word, .pause-word, .pz-word, .plates-title, .toast.big, .zone-strip, .wrong-way, .countdown, .settings-head h2, .ht-head h2, .card h3, .car-card h2) { text-transform: uppercase; letter-spacing: 0.02em; }
:root[data-type='b'] .card-title { font-size: clamp(44px, 7.8vw, 112px); line-height: 0.88; }
:root[data-type='b'] :is(.dead-word, .result-word, .pause-word) { font-size: clamp(62px, 10.6vw, 148px); line-height: 0.85; }
:root[data-type='b'] .headline { font-size: clamp(25px, 3.7vw, 44px); line-height: 0.94; letter-spacing: 0.02em; }
:root[data-type='b'] .car-card h2 { font-size: 34px; }
:root[data-type='b'] .btn { letter-spacing: 0.1em; }
:root[data-type='b'] .offer-name { letter-spacing: 0.02em; }
:root[data-type='b'] .score { letter-spacing: -0.02em; }

/* ---------------- C: Livery ---------------- */
/* Russo One is a heavy, wide motorsport block; Chakra Petch is chamfered
   and wide, so it wants less tracking than a condensed face; Oxanium digits
   are the dash readout. */
:root[data-type='c'] :is(.card-title, .dead-word, .result-word, .pause-word, .pz-word) { text-transform: uppercase; letter-spacing: -0.005em; }
:root[data-type='c'] .headline { line-height: 1.04; letter-spacing: 0.005em; }
:root[data-type='c'] .btn { letter-spacing: 0.05em; }
:root[data-type='c'] .offer-name { font-size: 19px; letter-spacing: 0; }
:root[data-type='c'] .score { letter-spacing: -0.02em; }