/* ===========================================================================
   siriusly.ai - Color tokens (orange + black, dark theme)
   Imported from the "siriusly.ai Design System" Claude Design project.
   Signal Orange is the primary; the canvas is a warm near-black "Coal" ramp.
   =========================================================================== */
:root {
  /* ---- Brand: Signal Orange (primary) ---- */
  --orange-50: #FEF6F0;
  --orange-100: #FBE8DA;
  --orange-200: #F6D2B7;
  --orange-300: #EEB88F;
  --orange-400: #E29D6B;
  --orange-500: #D07E45;
  --orange-600: #B4652F;
  --orange-700: #925026;
  --orange-800: #6C3C20;
  --orange-900: #452811;
  --orange-950: #281608;

  /* ---- Brand: Gold (bright accent / highlight) ---- */
  --gold-50: #FFF8E6;
  --gold-100: #FDECBF;
  --gold-200: #FADB8A;
  --gold-300: #F7C955;
  --gold-400: #F4B72E;
  --gold-500: #F0A81C;
  --gold-600: #CE8A12;
  --gold-700: #A66C10;
  --gold-800: #6E480F;
  --gold-900: #43290B;

  /* ---- Neutrals: warm Coal ---- */
  --ink: #0A0908;
  --coal-950: #14120F;
  --coal-900: #1C1A17;
  --coal-800: #262320;
  --coal-700: #34302B;
  --coal-600: #4A453E;
  --coal-500: #5F5950;
  --coal-400: #8A8379;
  --coal-300: #B4ADA2;
  --coal-200: #D8D3C9;
  --coal-100: #ECE9E2;
  --coal-50: #F6F4EF;
  --white: #FFFFFF;

  /* ---- Semantic hues ---- */
  --green-500: #57C46B;
  --green-900: #123016;
  --red-500: #FF5A4D;
  --red-900: #3A1512;

  /* ---- Semantic aliases (use these in UI) ---- */
  --color-primary: var(--orange-500);
  --color-primary-hover: var(--orange-400);
  --color-primary-active: var(--orange-600);
  --color-primary-soft: var(--orange-900);
  --color-accent: var(--gold-400);
  --color-accent-hover: var(--gold-300);
  --color-accent-soft: var(--gold-900);

  --text-strong: var(--white);
  --text-body: var(--coal-200);
  --text-muted: var(--coal-400);
  --text-subtle: var(--coal-500);
  --text-on-brand: var(--coal-950);
  --text-link: var(--orange-400);

  /* "Ember corner" (design system background study): the canvas lifts off
     coal-950 to a warmer #1E1A16, which is where coal-900 used to sit. So every
     surface and border above it steps up one stop on the ramp too - the
     relationships are unchanged, the whole app is one stop lighter. The page
     itself is a flat colour; its bloom and Iris Star live in tokens/base.css. */
  --surface-page: #1E1A16;
  --surface-card: var(--coal-800);
  --surface-sunken: var(--coal-950);
  --surface-inverse: var(--coal-50);
  --surface-hover: var(--coal-700);

  --border-subtle: var(--coal-700);
  --border-default: var(--coal-600);
  --border-strong: var(--coal-500);
  --border-focus: var(--orange-500);

  --status-success: var(--green-500);
  --status-success-soft: var(--green-900);
  --status-warning: var(--gold-400);
  --status-warning-soft: var(--gold-900);
  --status-danger: var(--red-500);
  --status-danger-soft: var(--red-900);

  /* Signature gradient - hero moments / brand marks (orange -> gold) */
  --gradient-signature: linear-gradient(120deg, var(--orange-600) 0%, var(--gold-400) 100%);
  --gradient-night: linear-gradient(180deg, var(--coal-900) 0%, var(--ink) 100%);
}