/* Токены — единственный источник цветов, отступов, радиусов и типографики.
   Тёмная тема по умолчанию, светлая — [data-theme="light"].
   Характер: жёсткие границы, острые углы, один акцент, статусы — текстом. */

:root {
  color-scheme: dark;

  /* Акцент */
  --color-primary: #d99a3c;
  --color-primary-hover: #e6a94c;
  --color-primary-active: #bf8530;
  --color-on-primary: #131007;
  --color-accent: #e6b566;

  /* Поверхности */
  --color-bg: #0a0b0d;
  --color-surface: #101215;
  --color-surface-raised: #15181c;
  --color-surface-sunken: #07080a;

  /* Текст */
  --color-text: #e9ebee;
  --color-text-muted: #8f96a0;

  /* Границы */
  --color-border: #23262b;
  --color-border-strong: #343941;

  /* Состояния */
  --color-danger: #e5484d;
  --color-danger-hover: #f2555a;
  --color-on-danger: #ffffff;
  --color-success: #46a758;
  --color-warning: #f5a524;
  --color-info: #5b9dd9;

  --color-focus: #d99a3c;

  /* Фракции */
  --color-faction-blue: #6ea8dd;
  --color-faction-red: #e5676d;
  --color-faction-green: #5fb872;
  --color-faction-civilian: #a98bd6;

  /* Роли */
  --color-role-commander: #e5676d;
  --color-role-officer: #f5a524;
  --color-role-member: #8f96a0;

  /* Доска: стикеры и подписи */
  --color-note-yellow: #f0d16a;
  --color-note-green: #b7d97a;
  --color-note-blue: #8fc7e8;
  --color-note-ink: #191919;
  --color-board-ink: #0b0d10;

  /* Должности tsgames */
  --color-position-commander: #c94f57;
  --color-position-deputy: #e0b341;
  --color-position-staff: #e06a6a;
  --color-position-cadet: #5cc98a;
  --color-position-inactive: #9aa1ab;

  /* Отступы */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 28px;
  --space-7: 36px;
  --space-8: 44px;

  /* Радиусы: острые у меток, мягкие у полей и кнопок */
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-pill: 999px;

  /* Тени почти не используем: глубину дают границы */
  --shadow-sm: none;
  --shadow-md: 0 10px 30px rgb(0 0 0 / 0.45);

  /* Типографика */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Cascadia Code", consolas, monospace;

  --text-xs: 11px;
  --text-sm: 13px;
  --text-md: 15px;
  --text-lg: 17px;
  --text-xl: 20px;
  --text-2xl: 26px;

  --leading-tight: 1.2;
  --leading-normal: 1.5;

  --duration: 120ms;
  --easing: cubic-bezier(0.2, 0, 0, 1);
}

[data-theme="light"] {
  color-scheme: light;

  --color-primary: #9c5f16;
  --color-primary-hover: #b06d1d;
  --color-primary-active: #7f4c11;
  --color-on-primary: #ffffff;
  --color-accent: #8a5514;

  --color-bg: #f5f5f3;
  --color-surface: #fbfbfa;
  --color-surface-raised: #ffffff;
  --color-surface-sunken: #ecebe8;

  --color-text: #16181b;
  --color-text-muted: #61666d;

  --color-border: #dcdcd7;
  --color-border-strong: #c3c3bc;

  --color-danger: #b3261e;
  --color-danger-hover: #98211a;
  --color-on-danger: #ffffff;
  --color-success: #1f7a34;
  --color-warning: #8a5a00;
  --color-info: #1f5f96;

  --color-focus: #9c5f16;

  --color-faction-blue: #1f5f96;
  --color-faction-red: #a8282d;
  --color-faction-green: #1f7a34;
  --color-faction-civilian: #5b3f96;

  --color-role-commander: #a8282d;
  --color-role-officer: #8a5a00;
  --color-role-member: #61666d;

  --color-position-commander: #9f1d24;
  --color-position-deputy: #b7791f;
  --color-position-staff: #d14343;
  --color-position-cadet: #2f8f4e;
  --color-position-inactive: #7b818a;

  --shadow-sm: none;
  --shadow-md: 0 10px 30px rgb(20 22 26 / 0.12);
}

/* ---------- Дополнительные палитры акцента ---------- */

[data-palette="green"] {
  --color-primary: #4f9e6d;
  --color-primary-hover: #5cb07a;
  --color-primary-active: #41825a;
  --color-on-primary: #07130c;
  --color-accent: #7fbf96;
  --color-focus: #4f9e6d;
}

[data-palette="cyan"] {
  --color-primary: #3a9fbf;
  --color-primary-hover: #48b0d1;
  --color-primary-active: #2f86a1;
  --color-on-primary: #04161b;
  --color-accent: #6fc6dd;
  --color-focus: #3a9fbf;
}

[data-palette="lime"] {
  --color-primary: #93b843;
  --color-primary-hover: #a3c951;
  --color-primary-active: #7c9c36;
  --color-on-primary: #10160a;
  --color-accent: #bfd97a;
  --color-focus: #93b843;
}