/* ЛК подписчика — дизайн-токены.
   Единая шкала вместо разнобоя: до внедрения в ЛК насчитывалось ~30 размеров
   шрифта, 25 радиусов, две конфликтующие серые шкалы (тёплая stone + холодная
   slate) и десяток случайных теней. Всё новое оформление берёт значения только
   отсюда. Файл подключается ПЕРВЫМ, до остальных lk_*.css. */

:root {
    /* ---------- Чернила: одна тёплая шкала (stone), холодная slate выведена ---------- */
    --ink-900: #1c1917; /* основной текст */
    --ink-800: #292524;
    --ink-700: #44403c; /* заголовки второго уровня, текст на светлом чипе */
    --ink-600: #57534e; /* приглушённый текст */
    --ink-500: #78716c; /* подписи, метаданные */
    --ink-400: #a8a29e; /* плейсхолдеры, иконки-подсказки */
    --ink-300: #d6d3d1; /* границы контролов */
    --ink-200: #e7e5e4; /* разделители, границы карточек */
    --ink-100: #efebe3; /* фон вложенных блоков */
    --ink-50: #faf8f3; /* самый светлый фон */

    /* ---------- Зелёный: фирменный, от хвои до светлой мяты ---------- */
    --green-900: #0b3d36; /* сайдбар */
    --green-800: #12503f;
    --green-700: #166534; /* текст на светло-зелёном фоне */
    --green-600: #15803d; /* акцент, основные кнопки */
    --green-500: #1c9e4c; /* hover-подсветка */
    --green-200: #a7f3d0;
    --green-100: #dcfce7;
    --green-50: #f0fdf4;

    /* ---------- Семантика статусов ---------- */
    --ok-fg: #166534;
    --ok-bg: #ecfdf5;
    --ok-br: #a7f3d0;

    --warn-fg: #92400e;
    --warn-bg: #fffbeb;
    --warn-br: #fde68a;

    --danger-fg: #b91c1c;
    --danger-bg: #fef2f2;
    --danger-br: #fecaca;

    /* «В пути» — синий читается как транспорт, но приглушён под тёплый фон */
    --transit-fg: #1d6fa5;
    --transit-bg: #eff6ff;
    --transit-br: #bfdbfe;

    /* ---------- Поверхности ---------- */
    --paper: #f3efe4; /* фон страницы */
    --surface: #fffbf4; /* карточка */
    --surface-sunk: #faf6ed; /* вложенный блок внутри карточки */

    /* ---------- Типографика: 9 ступеней вместо 30 ---------- */
    --fs-2xs: 0.6875rem; /* 11px — микро-метки капсом */
    --fs-xs: 0.75rem; /* 12px — бейджи, сноски */
    --fs-sm: 0.8125rem; /* 13px — метаданные */
    --fs-base: 0.875rem; /* 14px — основной интерфейсный текст */
    --fs-md: 0.9375rem; /* 15px — абзацы, поля ввода */
    --fs-lg: 1.0625rem; /* 17px — заголовок карточки */
    --fs-xl: 1.25rem; /* 20px — заголовок блока */
    --fs-2xl: 1.5rem; /* 24px — заголовок страницы */
    --fs-3xl: 1.875rem; /* 30px — цифры-показатели */
    --fs-display: clamp(3rem, 2.2rem + 5vw, 5.5rem); /* 48–88px — крупная цифра акции */

    --lh-tight: 1.25;
    --lh-snug: 1.4;
    --lh-base: 1.55;

    /* Оптический трекинг: крупное сжимаем, капслок разрежаем */
    --tr-tight: -0.02em;
    --tr-snug: -0.01em;
    --tr-caps: 0.06em;

    /* ---------- Отступы: шаг 4px ---------- */
    --sp-1: 0.25rem;
    --sp-2: 0.5rem;
    --sp-3: 0.75rem;
    --sp-4: 1rem;
    --sp-5: 1.25rem;
    --sp-6: 1.5rem;
    --sp-8: 2rem;
    --sp-10: 2.5rem;

    /* ---------- Радиусы: 6 ступеней вместо 25 ---------- */
    --r-xs: 6px;
    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 16px;
    --r-xl: 20px;
    --r-pill: 999px;

    /* ---------- Тени: тёплые, а не чёрные.
       На кремовом фоне чистый чёрный даёт грязный серый ореол — тень тонирована
       в коричневый, поэтому выглядит как настоящая тень на бумаге. ---------- */
    --sh-xs: 0 1px 2px rgba(60, 45, 30, 0.06);
    --sh-sm: 0 1px 3px rgba(60, 45, 30, 0.07), 0 1px 2px rgba(60, 45, 30, 0.04);
    --sh-md: 0 4px 12px rgba(60, 45, 30, 0.07), 0 1px 3px rgba(60, 45, 30, 0.05);
    --sh-lg: 0 12px 32px rgba(60, 45, 30, 0.1), 0 2px 8px rgba(60, 45, 30, 0.05);
    --sh-focus: 0 0 0 3px rgba(21, 128, 61, 0.2);

    --dur-fast: 0.15s;
    --dur-base: 0.22s;
    --ease: cubic-bezier(0.4, 0, 0.2, 1);

    /* ---------- Загрузчик читалки (стим-киберпанк): единственное место в ЛК,
       где живут неон и латунь. Никуда больше эти цвета не тянуть. ---------- */
    --rl-ground: #050810;
    --rl-panel: #0b1020;
    --rl-glass: #0a1424;
    --rl-brass: #a97a2e;
    --rl-brass-hi: #d9ac57;
    --rl-brass-lo: #5a3f12;
    --rl-cyan: #22d3ee;
    --rl-cyan-dim: #0e7490;
    --rl-magenta: #f472b6;
    --rl-amber: #f59e0b;
    --rl-text: #d8e3f0;
    --rl-muted: #7f8ea6;
    --rl-mono: ui-monospace, "Cascadia Mono", Menlo, Consolas, monospace;
    --rl-ease: cubic-bezier(0.2, 0.9, 0.2, 1);
}

/* Цифры в таблицах, суммах и датах не должны «плясать» по ширине. */
.lk-tnum,
.sub-price,
.journal-badge,
.lk-stat-value {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ---------- Общие компоненты ЛК ---------- */

/* Flash-сообщения. Категория раньше игнорировалась: ошибки выводились
   зелёной плашкой «успеха». */
.lk-flash-stack {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
}

.lk-flash {
    padding: var(--sp-3) var(--sp-4);
    border-radius: var(--r-sm);
    border: 1px solid;
    font-size: var(--fs-base);
    line-height: var(--lh-snug);
}

.lk-flash--success {
    background: var(--ok-bg);
    border-color: var(--ok-br);
    color: var(--ok-fg);
}

.lk-flash--warning {
    background: var(--warn-bg);
    border-color: var(--warn-br);
    color: var(--warn-fg);
}

.lk-flash--error {
    background: var(--danger-bg);
    border-color: var(--danger-br);
    color: var(--danger-fg);
}

/* Пустые состояния: были то голой строкой, то оформленным блоком. */
.lk-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-8) var(--sp-4);
    text-align: center;
    color: var(--ink-600);
}

.lk-empty__title {
    font-size: var(--fs-lg);
    font-weight: 600;
    color: var(--ink-900);
    letter-spacing: var(--tr-snug);
}

.lk-empty__text {
    font-size: var(--fs-base);
    max-width: 42ch;
    line-height: var(--lh-base);
}

/* Информационная плашка. Раньше такие блоки собирали инлайном с чужими
   голубыми хексами — единственный синий элемент во всём кабинете. */
.lk-note {
    display: flex;
    gap: var(--sp-3);
    align-items: flex-start;
    background: var(--green-50);
    border-color: var(--green-100);
}

.lk-note--warning {
    background: var(--warn-bg);
    border-color: var(--warn-br);
}

.lk-note__icon {
    font-size: var(--fs-xl);
    line-height: 1;
    flex: none;
}

.lk-note__title {
    font-weight: 600;
    color: var(--green-700);
    margin-bottom: var(--sp-1);
    letter-spacing: var(--tr-snug);
}

.lk-note--warning .lk-note__title {
    color: var(--warn-fg);
}

.lk-note__text {
    font-size: var(--fs-base);
    color: var(--ink-700);
    line-height: var(--lh-base);
    margin: 0;
}

/* hidden должен прятать всегда: .lk-empty { display:flex } перебивал атрибут,
   и под существующим обращением было «Обращений пока нет» */
[hidden] {
  display: none !important;
}
