/* Skynet Digital — Color tokens (from official CI brand book, 26_04) */
:root {
  /* Nightsky Blue — primary dark brand color */
  --nb-100: #103068;
  --nb-300: #0c2b5d;
  --nb-500: #092552;

  /* Sky Blue — secondary / interactive */
  --sb-100: #72caef;
  --sb-300: #3fa3d7;
  --sb-500: #0b89c6;

  /* Antrazit — dark backgrounds / text */
  --a-100: #2e3438;
  --a-300: #1b1f23;
  --a-500: #010104;

  /* Coral Star — accent. Small UI components only, on dark backgrounds. */
  --c-100: #f19da7;
  --c-300: #ee858d;
  --c-500: #eb6d75;

  /* Surface Light */
  --sl-100: #ffffff;
  --sl-300: #eceded;
  --sl-500: #d9dadb;

  /* Gradients */
  --gradient-coral-star: linear-gradient(135deg, #f19da7 0%, #72caef 100%); /* @kind color */

  /* Semantic aliases */
  --surface-page-dark: var(--a-300);
  --surface-page-darker: var(--a-500);
  --surface-brand: var(--nb-300);
  --surface-card-dark: var(--a-100);
  --surface-page-light: var(--sl-100);
  --surface-card-light: var(--sl-300);

  --text-on-dark: var(--sl-100);
  --text-on-dark-muted: var(--sl-500);
  --text-on-light: var(--a-300);
  --text-on-light-muted: var(--a-100);
  --text-interactive: var(--sb-100);
  --text-accent: var(--c-300);

  --border-on-dark: rgba(255, 255, 255, 0.10);
  --border-on-light: rgba(27, 31, 35, 0.12);

  --action-primary: var(--nb-300);
  --action-primary-hover: var(--nb-100);
  --action-interactive: var(--sb-100);
  --action-interactive-hover: var(--sb-300);
  --focus-ring: var(--sb-300);
}