/* ============================================================
   COLORS
   Near-black cinematic canvas + a single brand voltage:
   Rosso Corsa racing red. White-canvas bands appear only inside
   editorial contexts (preowned listings, pricing). Used scarcely.
   ============================================================ */

:root {
  /* ---- Brand / Accent ---- */
  --color-primary: #da291c;          /* Rosso Corsa — racing red */
  --color-primary-active: #b01e0a;   /* press */
  --color-primary-hover: #9d2211;    /* documented; no-hover policy */

  /* Scoped sub-brand accents — sailing program + focus ring only */
  --color-accent-yellow-hypersail: #fff200;
  --color-accent-yellow: #f6e500;

  /* ---- Surface ---- */
  --color-canvas: #181818;           /* near-black page floor (warm, never pure black) */
  --color-canvas-elevated: #303030;  /* cards + panels on dark */
  --color-canvas-light: #ffffff;     /* white editorial bands */
  --color-surface-card: #303030;     /* driver cards, livery plates */
  --color-surface-soft-light: #f7f7f7;
  --color-surface-strong-light: #ebebeb;

  /* ---- Hairlines ---- */
  --color-hairline: #303030;            /* 1px divider on dark */
  --color-hairline-on-light: #d2d2d2;   /* 1px divider on light */
  --color-hairline-soft: #ebebeb;

  /* ---- Text ---- */
  --color-ink: #ffffff;              /* display + emphasis on dark */
  --color-body: #969696;             /* running text on dark */
  --color-body-strong: #ffffff;
  --color-body-on-light: #181818;    /* text on light bands */
  --color-muted: #666666;            /* subtitles / captions on dark */
  --color-muted-soft: #8f8f8f;       /* disabled link text */
  --color-on-primary: #ffffff;       /* text on Rosso Corsa */
  --color-on-dark: #ffffff;
  --color-on-light: #181818;

  /* ---- Semantic ---- */
  --color-info: #4c98b9;
  --color-success: #03904a;
  --color-warning: #f13a2c;

  /* ---- Decorative gradients ---- */
  --gradient-rosso: linear-gradient(180deg, #a00c01, #da291c 64%); /* @kind color */
  --gradient-atmosphere: linear-gradient(180deg, #3c3c3c, #030303 64%); /* @kind color */

  /* ---- Single shadow tier ---- */
  --shadow-small: 0 4px 8px rgba(0, 0, 0, 0.10);

  /* ---- Semantic aliases ---- */
  --bg-page: var(--color-canvas);
  --bg-card: var(--color-canvas-elevated);
  --bg-band-light: var(--color-canvas-light);
  --text-default: var(--color-body);
  --text-strong: var(--color-ink);
  --border-default: var(--color-hairline);
  --focus-ring: var(--color-accent-yellow);
}