/* Дизайн-токены. Тёмная тема — по умолчанию, светлая — data-theme="light".
   Контраст текстовых пар проверен на WCAG AA (см. docs/design-system.md). */

@font-face {
  font-family: "Onest";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("../fonts/onest-cyrillic-wght-normal.fe2bd26ae82a.woff2") format("woff2-variations");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Onest";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("../fonts/onest-latin-wght-normal.3db826ed1c5d.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Literata";
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url("../fonts/literata-cyrillic-wght-normal.5a3de6449d8f.woff2") format("woff2-variations");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Literata";
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url("../fonts/literata-latin-wght-normal.3dfc6740cd53.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: light;

  /* Поверхности: тёплая бумага */
  --bg: #f6f6fa;
  --surface-1: #ffffff;
  --surface-2: #ececf4;
  --surface-3: #e0e0ec;
  --overlay: rgb(10 8 24 / 0.45);

  --border: #dcdce8;
  --border-strong: #bfbfd3;

  --text: #12101f;
  --text-muted: #474560;
  --text-subtle: #5f5d7a;

  /* Акцент — фиолетовый из логотипа */
  --accent: #6a4ce6;
  --accent-hover: #5638cf;
  --accent-text: #5638cf;
  --accent-soft: rgb(106 76 230 / 0.1);
  --on-accent: #ffffff;
  --focus-ring: 0 0 0 3px rgb(106 76 230 / 0.35);

  --success: #1f7a4d;
  --success-soft: rgb(31 122 77 / 0.11);
  --warning: #8a5a00;
  --warning-soft: rgb(217 145 0 / 0.15);
  --danger: #b4282e;
  --danger-soft: rgb(180 40 46 / 0.1);
  --danger-solid: #b4282e;
  --info: #2b5f9e;
  --info-soft: rgb(37 89 143 / 0.1);

  /* Тени: плоские, без свечения */
  --shadow-sm: 0 1px 0 rgb(18 16 31 / 0.04);
  --shadow-md: 0 6px 20px rgb(18 16 31 / 0.08);
  --shadow-lg: 0 20px 50px rgb(18 16 31 / 0.14);
  --glow-accent: none;

  /* Типографика */
  --font-sans: "Onest", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Literata", Georgia, "Times New Roman", serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.5rem;
  --text-2xl: 2rem;
  --text-3xl: 2.5rem;
  --leading-tight: 1.2;
  --leading-normal: 1.6;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 999px;

  --sidebar-w: 248px;
  --topbar-h: 60px;
  --control-h: 40px;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur: 160ms;
}

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

  --bg: #07060d;
  --surface-1: #100f1a;
  --surface-2: #181726;
  --surface-3: #221f35;
  --overlay: rgb(3 2 8 / 0.72);

  --border: #262439;
  --border-strong: #3a3756;

  --text: #f2f1fa;
  --text-muted: #b9b7d2;
  --text-subtle: #8f8cad;

  --accent: #7456f0;
  --accent-hover: #8366f5;
  --accent-text: #b3a0ff;
  --accent-soft: rgb(131 101 247 / 0.18);
  --on-accent: #ffffff;
  --focus-ring: 0 0 0 3px rgb(179 160 255 / 0.5);

  --success: #4cc38a;
  --success-soft: rgb(76 195 138 / 0.14);
  --warning: #e8b84a;
  --warning-soft: rgb(232 184 74 / 0.14);
  --danger: #f27b7f;
  --danger-soft: rgb(242 123 127 / 0.14);
  --danger-solid: #c2353b;
  --info: #7fb2e5;
  --info-soft: rgb(127 178 229 / 0.14);

  --shadow-sm: 0 1px 0 rgb(0 0 0 / 0.3);
  --shadow-md: 0 8px 24px rgb(0 0 0 / 0.4);
  --shadow-lg: 0 24px 60px rgb(0 0 0 / 0.55);
}
