/* TGI — токены (сгенерировано из дизайн-системы TGI VPN, tokens.json). Светлая тема по умолчанию,
   тёмная — по системной настройке или data-theme="dark". */
@font-face { font-family: "Unbounded"; src: url("../fonts/Unbounded.woff2") format("woff2"); font-weight: 200 900; font-display: swap; }
@font-face { font-family: "Onest"; src: url("../fonts/Onest.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/JetBrainsMono.woff2") format("woff2"); font-weight: 100 800; font-display: swap; }

:root {
  color-scheme: light;
  --surface: #f5f4f0;
  --surface-raised: #fcfbf8;
  --surface-sunken: #eceae4;
  --line: #dcdad4;
  --line-strong: #8c8b93;
  --ink: #11121a;
  --ink-muted: #5e5f6a;
  --violet: #7665ff;
  --violet-hover: #8779ff;
  --on-violet: #11121a;
  --violet-text: #5646e6;
  --violet-soft: #e7e4ff;
  --block-ink: #11121a;
  --on-block-ink: #f5f4f0;
  --paper: #f5f4f0;
  --success: #1e7a4c;
  --success-soft: #e0f2e8;
  --danger: #b8321f;
  --danger-soft: #fbe5e1;
  --focus-ring: var(--violet);
  --shadow-raised: 0 1px 2px rgba(17,18,26,0.06), 0 16px 40px -20px rgba(17,18,26,0.28);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --radius-s: 8px;
  --radius-m: 14px;
  --radius-l: 24px;
  --radius-xl: 40px;
  --radius-pill: 999px;
  --font-display: "Unbounded", "Verdana", system-ui, sans-serif;
  --font-sans: "Onest", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
  --surface: #11121a;
  --surface-raised: #1a1b25;
  --surface-sunken: #0b0c12;
  --line: #2a2b38;
  --line-strong: #6a6b7c;
  --ink: #f5f4f0;
  --ink-muted: #a2a3b3;
  --violet: #7665ff;
  --violet-hover: #8779ff;
  --on-violet: #11121a;
  --violet-text: #9a8fff;
  --violet-soft: #242150;
  --block-ink: #232433;
  --on-block-ink: #f5f4f0;
  --paper: #f5f4f0;
  --success: #5fd39b;
  --success-soft: #12291e;
  --danger: #ff8c75;
  --danger-soft: #331612;
  --focus-ring: var(--violet);
  --shadow-raised: 0 1px 2px rgba(0,0,0,0.5), 0 20px 48px -24px rgba(0,0,0,0.7);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --surface: #11121a;
  --surface-raised: #1a1b25;
  --surface-sunken: #0b0c12;
  --line: #2a2b38;
  --line-strong: #6a6b7c;
  --ink: #f5f4f0;
  --ink-muted: #a2a3b3;
  --violet: #7665ff;
  --violet-hover: #8779ff;
  --on-violet: #11121a;
  --violet-text: #9a8fff;
  --violet-soft: #242150;
  --block-ink: #232433;
  --on-block-ink: #f5f4f0;
  --paper: #f5f4f0;
  --success: #5fd39b;
  --success-soft: #12291e;
  --danger: #ff8c75;
  --danger-soft: #331612;
  --focus-ring: var(--violet);
  --shadow-raised: 0 1px 2px rgba(0,0,0,0.5), 0 20px 48px -24px rgba(0,0,0,0.7);
}