/* BlackDragon 3.0 — дизайн-токены: единая основа платформы, Мессенджера, Торгов, админ-панели, страницы «Приложение».
   Четыре темы: Светлая (light), Тёмная (dark), Стекло (glass), Тёмное стекло (night).
   Компоненты (кнопка, поле, карточка, плашка, переключатель, окно, меню, значок, тост) берут цвета, радиусы, тени и движение
   только отсюда. Фирменное золото — #C9A96A; на светлом фоне для текста — затемнённое #8C6D2E (контраст 4,6 : 1). */

/* ───────────── Шрифты (локально, без внешних CDN; SIL OFL 1.1) ───────────── */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(../fonts/inter-cyrillic-wght-normal.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(../fonts/inter-latin-wght-normal.woff2) format('woff2');
  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: 'Manrope'; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url(../fonts/manrope-cyrillic-wght-normal.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url(../fonts/manrope-latin-wght-normal.woff2) format('woff2');
  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: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url(../fonts/jetbrains-mono-cyrillic-400-normal.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url(../fonts/jetbrains-mono-latin-400-normal.woff2) format('woff2');
  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 {
  --bd-gold: #C9A96A;          /* фирменное золото */
  --bd-gold-ink: #8C6D2E;      /* золото для текста на светлом */
  --bd-black: #0B0C0F;
  --bd-graphite: #23262F;
  --bd-ivory: #F4F1EA;

  --bd-font-head: 'Manrope', 'Inter', system-ui, sans-serif;
  --bd-font-text: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --bd-font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --bd-font-emoji: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji';
  --bd-fs-xs: 12px; --bd-fs-s: 13px; --bd-fs-m: 14px; --bd-fs-l: 16px; --bd-fs-xl: 20px; --bd-fs-2xl: 28px; --bd-fs-3xl: 40px;

  --bd-space-1: 4px; --bd-space-2: 8px; --bd-space-3: 12px; --bd-space-4: 16px; --bd-space-5: 20px; --bd-space-6: 24px; --bd-space-8: 32px; --bd-space-12: 48px;
  --bd-radius-s: 8px; --bd-radius-m: 12px; --bd-radius-l: 16px; --bd-radius-xl: 22px; --bd-radius-pill: 999px;
  --bd-tap: 44px;              /* минимальная зона нажатия */

  --bd-ease: cubic-bezier(.25, 1, .5, 1);       /* выход экранов, раскрытие */
  --bd-ease-in: cubic-bezier(.4, 0, .2, 1);     /* закрытие (обратное открытию) */
  --bd-dur-fast: 140ms; --bd-dur: 220ms; --bd-dur-slow: 300ms;

  --bd-z-bar: 50; --bd-z-menu: 1700; --bd-z-dialog: 1800; --bd-z-toast: 1900; --bd-z-call: 2000;

  --bd-safe-t: var(--sa-t, env(safe-area-inset-top, 0px));
  --bd-safe-b: var(--sa-b, env(safe-area-inset-bottom, 0px));
  --bd-safe-l: var(--sa-l, env(safe-area-inset-left, 0px));
  --bd-safe-r: var(--sa-r, env(safe-area-inset-right, 0px));

  --bd-danger: #D14343; --bd-success: #1E8E5A; --bd-warning: #B7791F; --bd-info: #2F7BD8;
}

/* ───────────── Светлая ───────────── */
:root, :root[data-theme='light'] {
  --bd-bg: #F4F5F7; --bd-surface: #FFFFFF; --bd-surface-2: #F3F4F6; --bd-surface-3: #E9EBEF;
  --bd-border: #E4E7EC; --bd-border-2: #D0D5DD;
  --bd-text: #101318; --bd-text-2: #3A404B; --bd-muted: #5B6472; --bd-placeholder: #98A2B3;
  --bd-accent: var(--bd-gold-ink); --bd-on-accent: #FFFFFF;
  --bd-primary: #111418; --bd-on-primary: #FFFFFF;
  --bd-hover: rgba(16, 24, 40, .04); --bd-press: rgba(16, 24, 40, .08);
  --bd-focus: 0 0 0 3px rgba(140, 109, 46, .28);
  --bd-shadow-1: 0 1px 2px rgba(16, 24, 40, .06); --bd-shadow-2: 0 16px 40px -12px rgba(16, 24, 40, .22), 0 2px 6px rgba(16, 24, 40, .06);
  --bd-backdrop: rgba(16, 19, 24, .45);
  --bd-glass: none; --bd-panel: var(--bd-surface);
}

/* ───────────── Тёмная и Тёмное стекло (общая база) ───────────── */
:root:is([data-theme='dark'], [data-theme='night']) {
  --bd-bg: #0B0C0F; --bd-surface: #12141A; --bd-surface-2: #181B22; --bd-surface-3: #1D2029;
  --bd-border: #23262F; --bd-border-2: #2F3340;
  --bd-text: #E8EAEE; --bd-text-2: #C3C7D0; --bd-muted: #8B91A0; --bd-placeholder: #5F6573;
  --bd-accent: var(--bd-gold); --bd-on-accent: #0B0C0F;
  --bd-primary: var(--bd-gold); --bd-on-primary: #0B0C0F;
  --bd-hover: rgba(255, 255, 255, .04); --bd-press: rgba(255, 255, 255, .08);
  --bd-focus: 0 0 0 3px rgba(201, 169, 106, .35);
  --bd-shadow-1: none; --bd-shadow-2: 0 16px 40px -12px rgba(0, 0, 0, .6);
  --bd-backdrop: rgba(0, 0, 0, .62);
  --bd-danger: #E06B6B; --bd-success: #4FB384; --bd-warning: #D9B45A; --bd-info: #6AA8F0;
  --bd-panel: var(--bd-surface);
}

/* ───────────── Стекло: светлые матовые панели ───────────── */
:root[data-theme='glass'] {
  --bd-bg: #E9EBEF; --bd-surface: rgba(255, 255, 255, .62); --bd-surface-2: rgba(255, 255, 255, .46); --bd-surface-3: rgba(255, 255, 255, .34);
  --bd-border: rgba(255, 255, 255, .7); --bd-border-2: rgba(24, 32, 48, .12);
  --bd-text: #0F1419; --bd-text-2: #343A45; --bd-muted: #4F5866; --bd-placeholder: #7F8896;
  --bd-accent: var(--bd-gold-ink); --bd-on-accent: #FFFFFF;
  --bd-primary: #111418; --bd-on-primary: #FFFFFF;
  --bd-hover: rgba(255, 255, 255, .35); --bd-press: rgba(255, 255, 255, .5);
  --bd-focus: 0 0 0 3px rgba(140, 109, 46, .3);
  --bd-shadow-1: 0 1px 0 rgba(255, 255, 255, .6) inset, 0 1px 2px rgba(24, 32, 48, .08); --bd-shadow-2: 0 18px 44px -14px rgba(24, 32, 48, .3);
  --bd-backdrop: rgba(233, 235, 239, .5);
  --bd-glass: blur(22px) saturate(160%);
  --bd-panel: #F6F7F9;          /* непрозрачная подложка полноэкранных экранов */
}

/* ───────────── Тёмное стекло: тёмно-фиолетовые матовые панели над «космосом» ───────────── */
:root[data-theme='night'] {
  --bd-bg: #07060C; --bd-surface: rgba(28, 22, 48, .56); --bd-surface-2: rgba(36, 28, 62, .48); --bd-surface-3: rgba(46, 36, 78, .42);
  --bd-border: rgba(160, 130, 255, .16); --bd-border-2: rgba(160, 130, 255, .24);
  --bd-accent: #B9A0FF; --bd-on-accent: #0B0C0F;
  --bd-hover: rgba(160, 130, 255, .08); --bd-press: rgba(160, 130, 255, .14);
  --bd-focus: 0 0 0 3px rgba(185, 160, 255, .35);
  --bd-glass: blur(22px) saturate(140%);
  --bd-panel: #0E0B1A;          /* непрозрачная подложка полноэкранных экранов */
}

/* ───────────── Общие правила ───────────── */
/* Кольцо фокуса — для кнопок и ссылок. У полей ввода своя подсветка рамки (иначе внутри поля появлялась лишняя золотая рамка). */
:focus-visible:not(input, textarea, select, [contenteditable]) { outline: none; box-shadow: var(--bd-focus); border-radius: var(--bd-radius-s); }
@media (prefers-reduced-motion: reduce) {
  :root { --bd-dur-fast: 1ms; --bd-dur: 1ms; --bd-dur-slow: 1ms; }
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
}
.bd-mark { display: inline-block; background: currentColor; -webkit-mask: var(--bd-mark-src) center / contain no-repeat; mask: var(--bd-mark-src) center / contain no-repeat; }
.bd-mark-emblem { --bd-mark-src: url(../brand/ui/emblem.svg); aspect-ratio: 42 / 44; }
.bd-mark-small { --bd-mark-src: url(../brand/ui/emblem-small.svg); aspect-ratio: 42 / 44; }
.bd-mark-word { --bd-mark-src: url(../brand/ui/wordmark.svg); aspect-ratio: 921.7 / 63.6; }
.bd-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }