/* Палитра сверена с apps/board/src/board/style.css 26.09.2026. */
:root,
:root[data-theme="light"] {
  color-scheme: light;
  --brand-surface: #fff;
  --brand-canvas: #fafbfc;
  --brand-ink: #28313a;
  --brand-muted: #66717c;
  --brand-line: #e7eaed;
  --brand-hover: #f1f5fb;
  --brand-active: #eaf1fe;
  --brand-accent: #356dcc;
  --brand-grid: #77838e12;
  --brand-shadow: 0 2px 5px #192b3604, 0 7px 22px #192b3609;
  --brand-tint: linear-gradient(120deg, #fff, #f8fbff);
}

:root[data-theme="sun"] {
  color-scheme: light;
  --brand-surface: #fffdf6;
  --brand-canvas: #fffaf0;
  --brand-ink: #453b29;
  --brand-muted: #75664f;
  --brand-line: #eee4ca;
  --brand-hover: #fff2ce;
  --brand-active: #ffeab0;
  --brand-accent: #866117;
  --brand-grid: #8d795319;
  --brand-shadow: 0 2px 5px #192b3604, 0 7px 22px #192b3609;
  --brand-tint: linear-gradient(120deg, #fffdf6, #fff5d8);
}

:root[data-theme="sky"] {
  color-scheme: light;
  --brand-surface: #f8fdff;
  --brand-canvas: #f1faff;
  --brand-ink: #213f53;
  --brand-muted: #536f82;
  --brand-line: #d8e8f2;
  --brand-hover: #e4f4fd;
  --brand-active: #d3ecfb;
  --brand-accent: #1c6f9b;
  --brand-grid: #517e9717;
  --brand-shadow: 0 2px 5px #192b3604, 0 7px 22px #192b3609;
  --brand-tint: linear-gradient(120deg, #f9fdff, #e5f5ff);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --brand-surface: #202e46;
  --brand-canvas: #141e30;
  --brand-ink: #e8f0ff;
  --brand-muted: #a0b4cf;
  --brand-line: #354760;
  --brand-hover: #2b3e5c;
  --brand-active: #324d78;
  --brand-accent: #a9caff;
  --brand-grid: #9ebae914;
  --brand-shadow: 0 5px 24px #0003;
  --brand-tint: linear-gradient(120deg, #24334e, #1e2b43);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --brand-surface: #202e46;
    --brand-canvas: #141e30;
    --brand-ink: #e8f0ff;
    --brand-muted: #a0b4cf;
    --brand-line: #354760;
    --brand-hover: #2b3e5c;
    --brand-active: #324d78;
    --brand-accent: #a9caff;
    --brand-grid: #9ebae914;
    --brand-shadow: 0 5px 24px #0003;
    --brand-tint: linear-gradient(120deg, #24334e, #1e2b43);
  }
}