/* Самохостинг шрифту e-Ukraine (Diia). Файли — локально в static/fonts/ (офлайн, same-origin,
   без CDN/@import — узгоджено з CSP). Нема файлів → стек --font-serif падає на засічкові фолбеки.
   font-display:swap — текст одразу показується фолбеком, без «невидимого» періоду (FOIT). */
@font-face { font-family: "e-Ukraine Head"; font-weight: 400; font-style: normal; font-display: swap;
  src: url("/static/fonts/e-ukraine-head-regular.woff2") format("woff2"); }
@font-face { font-family: "e-Ukraine Head"; font-weight: 700; font-style: normal; font-display: swap;
  src: url("/static/fonts/e-ukraine-head-bold.woff2") format("woff2"); }
@font-face { font-family: "e-Ukraine"; font-weight: 400; font-style: normal; font-display: swap;
  src: url("/static/fonts/e-ukraine-regular.woff2") format("woff2"); }
@font-face { font-family: "e-Ukraine"; font-weight: 700; font-style: normal; font-display: swap;
  src: url("/static/fonts/e-ukraine-bold.woff2") format("woff2"); }

/* Дизайн-токени (WP6 §6.4, D50). Компоненти посилаються ЛИШЕ на семантичні токени,
   ніколи на сирі значення. MVP прив'язує все до монохромної нейтральної шкали.
   Майбутній редизайн (Q20) перевизначає прив'язку без зміни розмітки/поведінки. */
:root {
  /* 6.4.1 Нейтральна шкала (єдина база MVP) */
  --color-neutral-0:   #ffffff;
  --color-neutral-50:  #f6f6f6;
  --color-neutral-100: #ececec;
  --color-neutral-200: #d9d9d9;
  --color-neutral-300: #bdbdbd;
  --color-neutral-500: #757575;
  --color-neutral-700: #3f3f3f;
  --color-neutral-800: #262626;
  --color-neutral-900: #141414;

  /* 6.4.2 Поверхні й текст */
  --surface-page:    var(--color-neutral-50);
  --surface-raised:  var(--color-neutral-0);
  --surface-sunken:  var(--color-neutral-0);
  --text-primary:    var(--color-neutral-900);  /* 900 на 0 ⇒ контраст > 4.5:1 (WCAG AA) */
  --text-secondary:  var(--color-neutral-700);
  --text-muted:      var(--color-neutral-500);
  --border-default:  var(--color-neutral-200);
  --border-strong:   var(--color-neutral-500);
  --focus-ring:      var(--color-neutral-900);

  /* 6.4.3 Токени станів — семантика, НЕ колір. MVP: нейтраль + обов'язковий гліф/мітка.
     reserved-* — зарезервовані слоти під колір редизайну (Q20), наразі нейтралізовані. */
  --state-danger:    var(--color-neutral-900); /* reserved-danger */
  --state-warning:   var(--color-neutral-800); /* reserved-warning */
  --state-attention: var(--color-neutral-700); /* reserved-attention */
  --state-ok:        var(--color-neutral-500); /* reserved-ok */
  --state-neutral:   var(--color-neutral-300); /* reserved-neutral */
  --state-info:      var(--color-neutral-700); /* reserved-info */

  /* 6.4.4 Токени пріоритету — гліф/мітка/порядок + колір.
     Кольорові слоти активовано за рішенням власника (Q20); гліф і мітка лишаються (не лише колір, D51). */
  --priority-crit: #c0392b; /* reserved-danger */
  --priority-high: #d35400; /* reserved-warning */
  --priority-med:  #b8860b; /* reserved-attention */
  --priority-low:  #3f7d3f; /* reserved-ok */
  --priority-none: #6b7280; /* reserved-neutral */

  /* 6.4.5 Простір / типографіка / форма */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-6: 24px; --space-8: 32px;
  --container-max: 1200px;
  --font-family-base: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-size-sm: 13px; --font-size-md: 15px; --font-size-lg: 20px; --font-size-xl: 28px;
  --font-weight-regular: 400; --font-weight-medium: 600; --font-weight-bold: 700;
  --radius-sm: 2px;                 /* MVP — мінімальний радіус */
  --border-width-hairline: 1px;
  --elevation-none: none;           /* MVP — без тіней */
}