/* ================================================================
 * Oymyakon Design System — Color Tokens (semantic.css)
 * AUTO-GENERATED by build-dtcg.js — DO NOT EDIT MANUALLY
 * Source: tokens/src/color/semantic.json
 * ================================================================ */


/* Light theme */
:root {

  /* ── background ── */
  --background-primary: var(--p-white);
  --background-base-grey: var(--p-grey-100);
  --background-inverse-primary: var(--p-grey-875);
  --background-base-white: var(--p-white);
  --background-brand: var(--p-drive-green-250);
  --background-secondary: var(--p-grey-200);
  --background-always-light: var(--p-white);
  --background-pop-up: var(--p-transparent-black-75);
  --background-always-graphite: var(--p-graphite-850);
  --background-always-dark: var(--p-grey-875);

  /* ── textAndIcon ── */
  --text-and-icon-primary: var(--p-grey-900);
  --text-and-icon-secondary: var(--p-grey-700);
  --text-and-icon-accent: var(--p-blue-700);
  --text-and-icon-brand: var(--p-drive-green-250);
  --text-and-icon-success: var(--p-green-700);
  --text-and-icon-warning: var(--p-orange-700);
  --text-and-icon-error: var(--p-red-700);
  --text-and-icon-disabled: var(--p-grey-400);
  --text-and-icon-inverse-primary: var(--p-white);
  --text-and-icon-always-dark: var(--p-grey-900);
  --text-and-icon-always-light: var(--p-white);
  --text-and-icon-graphite: var(--p-graphite-850);
  --text-and-icon-yellow: var(--p-yellow-250);
  --text-and-icon-transparent: var(--p-transparent-black-75);

  /* ── surface ── */
  --surface-on-white: var(--p-grey-100);
  --surface-on-grey: var(--p-white);
  --surface-overlay: var(--p-transparent-grey-800-8);
  --surface-white-overlay: var(--p-transparent-white-16);
  --surface-pressed-overlay: var(--p-black);
  --surface-contrast-overlay: var(--p-transparent-black-20);
  --surface-dark-overlay: var(--p-transparent-black-20);
  --surface-floating: var(--p-white);
  --surface-inverse-overlay: var(--p-transparent-white-8);

  /* ── border ── */
  --border-default: var(--p-grey-150);
  --border-active: var(--p-grey-900);
  --border-inform: var(--p-blue-700);
  --border-success: var(--p-green-600);
  --border-warning: var(--p-orange-700);
  --border-error: var(--p-red-700);
  --border-transparent: var(--p-transparent-black-5);

  /* ── pastel ── */
  --pastel-blue1: var(--p-blue-100);
  --pastel-blue2: var(--p-blue-200);
  --pastel-orange1: var(--p-orange-100);
  --pastel-orange2: var(--p-orange-200);
  --pastel-red1: var(--p-red-100);
  --pastel-red2: var(--p-red-200);
  --pastel-green1: var(--p-green-100);
  --pastel-green2: var(--p-green-200);
  --pastel-drive-green1: var(--p-drive-green-100);
  --pastel-drive-green2: var(--p-drive-green-150);
  --pastel-yellow1: var(--p-yellow-100);
  --pastel-yellow2: var(--p-yellow-200);

  /* ── accent ── */
  --accent-blue1: var(--p-blue-500);
  --accent-orange1: var(--p-orange-500);
  --accent-red1: var(--p-red-500);
  --accent-green1: var(--p-green-500);
  --accent-drive-green1: var(--p-drive-green-500);
  --accent-blue2: var(--p-blue-700);
  --accent-orange2: var(--p-orange-700);
  --accent-red2: var(--p-red-700);
  --accent-green2: var(--p-green-700);
  --accent-drive-green2: var(--p-drive-green-600);
  --accent-yellow1: var(--p-yellow-250);
  --accent-yellow2: var(--p-yellow-400);

  /* ── doubleColor ── */
  --double-color-outline: var(--p-grey-900);
  --double-color-bg-inverse: var(--p-transparent-drive-green-250-0);
  --double-color-bg: var(--p-drive-green-150);
  --double-color-outline-inverse: var(--p-drive-green-250);

  /* ── skeleton ── */
  --skeleton-on-white: var(--p-grey-100);
  --skeleton-white-overlay: var(--p-transparent-white-24);
  --skeleton-wave: var(--p-transparent-white-56);

  /* ── constant ── */
  --constant-blue1: var(--p-blue-200);
  --constant-blue2: var(--p-blue-300);
  --constant-blue3: var(--p-blue-600);
  --constant-orange1: var(--p-orange-200);
  --constant-orange2: var(--p-orange-300);
  --constant-orange3: var(--p-orange-600);
  --constant-red1: var(--p-red-200);
  --constant-red2: var(--p-red-300);
  --constant-red3: var(--p-red-600);
  --constant-green1: var(--p-green-200);
  --constant-green2: var(--p-green-300);
  --constant-green3: var(--p-green-600);
  --constant-drive-green1: var(--p-drive-green-200);
  --constant-drive-green2: var(--p-drive-green-300);
  --constant-drive-green3: var(--p-drive-green-600);
  --constant-yellow1: var(--p-yellow-200);
  --constant-yellow2: var(--p-yellow-300);
  --constant-yellow3: var(--p-yellow-600);

  /* ── safety ── */
  --safety-safety1: var(--p-blue-100);
  --safety-safety2: var(--p-blue-700);

  /* ── shadow ── */
  --shadow-primary: var(--p-transparent-black-5);
}

/* Dark theme */
[data-theme="dark"], .theme-dark {

  /* ── background ── */
  --background-primary: var(--p-grey-875);
  --background-base-grey: var(--p-black);
  --background-inverse-primary: var(--p-white);
  --background-base-white: var(--p-black);
  --background-brand: var(--p-drive-green-250);
  --background-secondary: var(--p-transparent-grey-800-32);
  --background-always-light: var(--p-white);
  --background-pop-up: var(--p-transparent-black-75);
  --background-always-graphite: var(--p-graphite-850);
  --background-always-dark: var(--p-grey-875);

  /* ── textAndIcon ── */
  --text-and-icon-primary: var(--p-white);
  --text-and-icon-secondary: var(--p-grey-400);
  --text-and-icon-accent: var(--p-blue-600);
  --text-and-icon-brand: var(--p-drive-green-250);
  --text-and-icon-success: var(--p-green-500);
  --text-and-icon-warning: var(--p-orange-600);
  --text-and-icon-error: var(--p-red-600);
  --text-and-icon-disabled: var(--p-grey-300);
  --text-and-icon-inverse-primary: var(--p-grey-900);
  --text-and-icon-always-dark: var(--p-grey-900);
  --text-and-icon-always-light: var(--p-white);
  --text-and-icon-graphite: var(--p-grey-600);
  --text-and-icon-yellow: var(--p-yellow-250);
  --text-and-icon-transparent: var(--p-transparent-white-68);

  /* ── surface ── */
  --surface-on-white: var(--p-grey-850);
  --surface-on-grey: var(--p-grey-800);
  --surface-overlay: var(--p-transparent-white-16);
  --surface-white-overlay: var(--p-transparent-white-16);
  --surface-pressed-overlay: var(--p-black);
  --surface-contrast-overlay: var(--p-transparent-white-24);
  --surface-dark-overlay: var(--p-transparent-black-20);
  --surface-floating: var(--p-grey-870);
  --surface-inverse-overlay: var(--p-transparent-black-5);

  /* ── border ── */
  --border-default: var(--p-grey-800);
  --border-active: var(--p-white);
  --border-inform: var(--p-blue-600);
  --border-success: var(--p-green-500);
  --border-warning: var(--p-orange-600);
  --border-error: var(--p-red-600);
  --border-transparent: var(--p-transparent-grey-850-90);

  /* ── pastel ── */
  --pastel-blue1: var(--p-transparent-blue-700-28);
  --pastel-blue2: var(--p-transparent-blue-700-41);
  --pastel-orange1: var(--p-transparent-orange-700-20);
  --pastel-orange2: var(--p-transparent-orange-700-36);
  --pastel-red1: var(--p-transparent-red-700-23);
  --pastel-red2: var(--p-transparent-red-700-32);
  --pastel-green1: var(--p-transparent-green-700-22);
  --pastel-green2: var(--p-transparent-green-700-30);
  --pastel-drive-green1: var(--p-transparent-drive-green-250-11);
  --pastel-drive-green2: var(--p-transparent-drive-green-250-15);
  --pastel-yellow1: var(--p-transparent-yellow-250-25);
  --pastel-yellow2: var(--p-transparent-yellow-250-47);

  /* ── accent ── */
  --accent-blue1: var(--p-blue-400);
  --accent-orange1: var(--p-orange-400);
  --accent-red1: var(--p-red-400);
  --accent-green1: var(--p-green-400);
  --accent-drive-green1: var(--p-drive-green-400);
  --accent-blue2: var(--p-blue-600);
  --accent-orange2: var(--p-orange-600);
  --accent-red2: var(--p-red-600);
  --accent-green2: var(--p-green-600);
  --accent-drive-green2: var(--p-drive-green-500);
  --accent-yellow1: var(--p-yellow-200);
  --accent-yellow2: var(--p-yellow-300);

  /* ── doubleColor ── */
  --double-color-outline: var(--p-drive-green-250);
  --double-color-bg-inverse: var(--p-drive-green-150);
  --double-color-bg: var(--p-transparent-drive-green-250-0);
  --double-color-outline-inverse: var(--p-grey-900);

  /* ── skeleton ── */
  --skeleton-on-white: var(--p-grey-850);
  --skeleton-white-overlay: var(--p-transparent-white-24);
  --skeleton-wave: var(--p-transparent-white-16);

  /* ── constant ── */
  --constant-blue1: var(--p-blue-200);
  --constant-blue2: var(--p-blue-300);
  --constant-blue3: var(--p-blue-600);
  --constant-orange1: var(--p-orange-200);
  --constant-orange2: var(--p-orange-300);
  --constant-orange3: var(--p-orange-600);
  --constant-red1: var(--p-red-200);
  --constant-red2: var(--p-red-300);
  --constant-red3: var(--p-red-600);
  --constant-green1: var(--p-green-200);
  --constant-green2: var(--p-green-300);
  --constant-green3: var(--p-green-600);
  --constant-drive-green1: var(--p-drive-green-200);
  --constant-drive-green2: var(--p-drive-green-300);
  --constant-drive-green3: var(--p-drive-green-600);
  --constant-yellow1: var(--p-yellow-200);
  --constant-yellow2: var(--p-yellow-300);
  --constant-yellow3: var(--p-yellow-600);

  /* ── safety ── */
  --safety-safety1: var(--p-transparent-blue-700-28);
  --safety-safety2: var(--p-blue-700);

  /* ── shadow ── */
  --shadow-primary: var(--p-transparent-black-0);
}