:root {
    /* ═══════════════════════════════════════════════════════════
       «Диспетчерская выдачи» — единые токены дизайн-системы.
       Пульт оператора автоматической выдачи цифровых ключей.
       Бренд = индиго-синий. Зелёный = «выдано». База = нейтральный slate.
       ЕДИНСТВЕННЫЙ источник токенов: подключается и в base.html,
       и в login.html. Значения палитры здесь не дублировать нигде.
       ═══════════════════════════════════════════════════════════ */

    /* Типографика */
    --font-display: 'Unbounded', 'Onest', -apple-system, 'Segoe UI', sans-serif;
    --font-body: 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', 'Cascadia Code', 'Consolas', monospace;

    /* Бренд — индиго-синий акцент (RGB-канал для rgba-подсветок) */
    --primary: #4C6FFF;            /* Индиго-синий - основной акцент */
    --primary-dark: #3B5AE0;       /* Тёмный индиго */
    --primary-light: #7D97FF;      /* Светлый индиго */
    --primary-rgb: 76, 111, 255;
    --primary-gradient: linear-gradient(135deg, #4C6FFF 0%, #3B5AE0 100%);
    --primary-hover: #3B5AE0;

    /* Акцент — глубокий индиго */
    --accent: #3B5AE0;             /* Глубокий индиго */
    --accent-light: #7D97FF;

    /* Семантические цвета */
    --success: #3FB950;            /* Зелёный - «выдано»/успех */
    --success-light: #56D364;
    --success-dark: #2EA043;

    --warning: #FB8C3B;            /* Оранжевый - предупреждение */
    --warning-light: #FDBA74;
    --warning-dark: #EA7317;

    --danger: #F26D6D;             /* Красный - ошибка */
    --danger-light: #F59595;
    --danger-dark: #D64545;

    --info: #56C2E6;               /* Тил-голубой - информация */
    --info-light: #8AD6F0;
    --info-dark: #2A9CC4;

    /* Тёмные фоны - нейтральный slate */
    --bg-primary: #0F1116;         /* Основной фон - slate */
    --bg-secondary: #171A21;       /* Вторичный фон */
    --bg-tertiary: #262B36;        /* Третичный фон */
    --bg-elevated: #1B1F27;        /* Поднятые элементы */
    --bg-card: #171A21;            /* Карточки */

    /* Sidebar - глубже основного */
    --sidebar-bg: #0B0D12;
    --sidebar-border: rgba(255, 255, 255, 0.06);
    --sidebar-active-bg: rgba(76, 111, 255, 0.14);
    --sidebar-hover-bg: rgba(76, 111, 255, 0.07);

    /* Текст - тёплый графит */
    --text-primary: #E6E8EC;       /* Основной текст */
    --text-secondary: #AEB4BF;     /* Вторичный текст */
    --text-tertiary: #838B98;      /* Третичный текст */
    --text-muted: #5A626E;         /* Приглушенный текст */
    --text-inverse: #0F1116;       /* Инвертированный текст (на тиле) */

    /* Границы - светлые на тёмном */
    --border-light: rgba(255, 255, 255, 0.06);
    --border: rgba(255, 255, 255, 0.10);
    --border-medium: rgba(255, 255, 255, 0.16);
    --border-dark: rgba(255, 255, 255, 0.24);

    /* Тени - многоуровневая система */
    --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --shadow-md: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
    --shadow-2xl: 0 30px 60px -12px rgb(0 0 0 / 0.3);
    --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);

    /* Скругления */
    --radius-sm: 6px;
    --radius: 8px;
    --radius-md: 10px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-2xl: 20px;
    --radius-full: 9999px;

    /* Анимации - плавные и естественные */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slower: 500ms cubic-bezier(0.4, 0, 0.2, 1);

    /* Spacing */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;

    /* Legacy compatibility */
    --bg: var(--bg-secondary);
    --card-bg: var(--bg-elevated);
    --text: var(--text-primary);
    --text-light: var(--text-muted);
}