/* Samokat — token contract.
   Names in the first block are exactly those required by the engineering plan.
   The second block lists tokens added beyond that set — the play surface is Moscow
   paving slabs, not asphalt, so --asphalt-* describes the road sliver only. */

:root {
  /* Field ------------------------------------------------------------------ */
  --backdrop: #17141F;                       /* letterbox / boot ground */
  --asphalt-base: #3C3F47;                   /* road sliver, right gutter + col 9 */
  --asphalt-speckle-light: #474A53;
  --asphalt-speckle-dark: #33363D;
  --kerb-stone: #C4C0B4;
  --kerb-inner: #98948A;
  --kerb-line: #DCD8C8;                      /* dashed road marking */

  /* Scooter ---------------------------------------------------------------- */
  --scooter-body-1: #F5D02A;                 /* column, deck, fenders */
  --scooter-body-2: #B08A12;                 /* shaded underside */
  --scooter-deck: #F7D94E;                   /* deck top highlight */
  --scooter-grip: #1A1A1A;
  --scooter-frame: #2B2B2B;                  /* crossbar, clamp */
  --scooter-wheel: #141414;
  --scooter-hub: #4A4A4A;
  --scooter-indicator: #FF8A1F;              /* swerve blink — NOT the body yellow */

  /* Pedestrian ------------------------------------------------------------- */
  --ped-jacket: #1E2050;                     /* oversize sweater */
  --ped-hood: #2E3272;                       /* no hood in this design: sweater trim */
  --ped-skin: #F2D3BC;
  --ped-legs: #E8479B;                       /* pink trousers */
  --ped-shoes: #F5D02A;                      /* oversized yellow sneakers */
  --contact-shadow: rgba(0, 0, 0, 0.20);

  /* UI --------------------------------------------------------------------- */
  --hud-text: #F2F2F2;
  --hud-bg: rgba(0, 0, 0, 0.40);
  --panel-bg: rgba(16, 14, 24, 0.94);
  --panel-text: #EFECF8;
  --accent: #F5D02A;
  --new-record: #7CFFA0;
  --btn-idle: rgba(0, 0, 0, 0.40);
  --btn-pressed: rgba(245, 208, 42, 0.22);
  --btn-disabled: rgba(255, 255, 255, 0.08);

  /* Shape and space -------------------------------------------------------- */
  --radius-sm: 5px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;

  /* Motion — every value is a beat fraction at 140 BPM ---------------------- */
  --motion-fast: 107ms;                      /* 1/16 — button press, chevron step */
  --motion-med: 214ms;                       /* 1/8  — panel in/out, HUD change */
  --motion-shake: 250ms;                     /* crash shake, not beat-locked */

  /* ======================================================================== */
  /* ADDED BEYOND THE REQUIRED SET                                            */
  /* ======================================================================== */

  /* Pavement — the actual play surface, columns 1..8 */
  --pavement-slab-1: #95979E;
  --pavement-slab-2: #8D8F96;
  --pavement-slab-3: #8A8C93;
  --pavement-slab-4: #9A9CA3;
  --pavement-slab-5: #84868F;
  --pavement-joint: #6C6F78;
  --pavement-edge: #A4A6AD;                  /* 1px top highlight per slab */
  --pavement-speckle-light: #A8AAB0;
  --pavement-speckle-dark: #7C7F87;

  /* Pavement edges — column 0 and column 9 */
  --granite: #7B7566;                        /* building-side border, col 0 */
  --granite-hi: #8E8878;
  --granite-lo: #605B50;
  --tactile: #C29A26;                        /* yellow tactile strip, road side */
  --tactile-dot: #E8C348;
  --plinth: #2A2736;                          /* building base, left gutter */
  --plinth-edge: #3A3648;

  /* Character detail */
  --hair: #402C1E;
  --hair-rim: #57402C;
  --skin-shade: #E3B79D;
  --brow-ink: #2A1D14;
  --eye-white: #F7F2EA;
  --mouth: #7A2A32;
  --lip: #B4595F;
  --sole: #F09A2A;
  --sole-pink: #F07FB0;
  --stripe: #16151A;                          /* sneaker stripes */

  /* Riders */
  --rider-jacket-a: #2E6B52;                  /* driver — contrasts with slab grey */
  --rider-jacket-b: #C4452A;                  /* passenger */
  --rider-jeans: #3A4A6E;
  --rider-hair: #241E28;
  --rider-skin: #E8B48F;

  /* Panorama — static band, baked once, never scrolls */
  --sky-1: #39415E;
  --sky-2: #474866;
  --sky-3: #5B4A68;
  --sky-4: #7C4E62;
  --sky-5: #A85548;
  --sky-6: #D0762F;
  --sky-7: #EA9A2C;
  --sky-8: #F6BE58;
  --sky-haze: #F8CE7A;
  --city-far: #5A4A5E;
  --city-mid: #403A5A;
  --city-near: #2D2A3C;
  --city-window: #F2C86A;
  --stone-white: #DAD6CC;                     /* bell tower */
  --stone-gold: #C9A73E;                      /* domes, clock */
  --mfa-body: #C6B39A;                        /* Stalinist high-rise */
  --mfa-light: #D8C6AC;
  --mfa-dark: #9C8A76;
  --kremlin-brick: #A8503C;
  --kremlin-tent: #4E7A5E;
  --kremlin-star: #E2402E;

  /* Lyric ticker */
  --ticker-bg: #17141F;
  --ticker-text: #F5D02A;
  --ticker-rule: rgba(245, 208, 42, 0.45);

  /* Crossing sign — decorative, no hitbox, columns 0 / 9 only */
  --sign-frame: #FFDD00;
  --sign-field: #1B4A9C;
  --sign-glyph: #FFFFFF;
  --sign-pole: #7E7E88;

  /* Crash */
  --crash-flash: rgba(255, 255, 255, 0.34);
  --crash-debris: #F2EDE4;
  --danger: #FF6B6B;
}

/* Debug overlay only (?debug=1) — never visible in the shipped game. Kept here so game.js
   contains no colour literals at all. */
:root {
  --debug-hitbox: #00FF88;
  --debug-safe-tint: rgba(0, 255, 136, 0.18);
  --debug-swerve-marker: #FF8A1F;
  --debug-text: #E6FFE6;
  --debug-bg: rgba(0, 0, 0, 0.62);
}