:root {
  /* ---- Base palette (from Velocity Brand Guide) ---- */
  --bedrock: #0b0b0b;       /* #AUTHORITY #BOLDNESS #PREMIUM — bold text, shapes, logos, backgrounds */
  --signal: #f1f0ef;        /* #SIMPLICITY #CLARITY #AIR #PEACE — high-contrast backgrounds, breathing room */
  --voltage: #cbff1e;       /* #GEN-Z #ENERGY #ACTION #INOVATION — highlight only, never large fields */
  --chrome-1: #e8e9eb;      /* Chrome metallic — light end of the brushed-steel gradient */
  --chrome-2: #9a9ea3;      /* Chrome metallic — mid gray */
  --chrome-3: #4a4d52;      /* Chrome metallic — dark end */
  --chrome-gradient: linear-gradient(135deg, #f5f6f7 0%, #c7c9cc 28%, #6c6f73 52%, #d8dadd 74%, #55585c 100%); /* @kind other */

  /* ---- Semantic aliases ---- */
  --surface-page: var(--signal);
  --surface-inverse: var(--bedrock);
  --surface-card: #ffffff;
  --surface-card-dark: #161616;

  --text-primary: var(--bedrock);
  --text-inverse: var(--signal);
  --text-muted: #6b6b68;
  --text-muted-inverse: #a8a8a4;

  --accent: var(--voltage);
  --accent-text-on: var(--bedrock); /* text placed ON voltage fields must be bedrock for contrast */

  --border-subtle: #d8d7d4;
  --border-subtle-inverse: #2a2a2a;
  --border-strong: var(--bedrock);

  --focus-ring: var(--voltage);
}
