/* Доп. стили приложения Love Chess — поверх theme.css.
   Только то, чего нет в теме: тосты, FAB, мелочи раскладки. */

/* --- Тосты --- */
.lc-toast-box {
    position: fixed;
    top: 1rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1090;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: min(92vw, 420px);
    pointer-events: none;
}

.lc-toast {
    pointer-events: auto;
    border-radius: var(--lc-radius, 10px);
    padding: 0.85rem 1.1rem;
    color: #fff;
    font-weight: 600;
    box-shadow: var(--lc-shadow-lg, 0 10px 30px rgba(0, 0, 0, 0.25));
    opacity: 0;
    transform: translateY(-12px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.lc-toast--show {
    opacity: 1;
    transform: translateY(0);
}

.lc-toast--success {
    background: var(--lc-success, #10b981);
}

.lc-toast--error {
    background: var(--lc-danger, #ef4444);
}

/* --- Плавающая кнопка «+» (FAB) --- */
.lc-fab {
    position: fixed;
    right: 1.1rem;
    bottom: 1.1rem;
    z-index: 1100;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: none;
    background: var(--lc-wine, #8f0912);
    color: var(--lc-cream, #f4ecdb);
    font-size: 2rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--lc-shadow-lg, 0 10px 30px rgba(0, 0, 0, 0.3));
    transition: background 0.15s ease, transform 0.15s ease;
    text-decoration: none;
}

.lc-fab:hover,
.lc-fab:focus {
    background: var(--lc-wine-700, #6e060d);
    color: var(--lc-cream, #f4ecdb);
}
/* Подъём — только при настоящем ховере (мышь), не «залипает» на тапе. */
@media (hover: hover) {
    .lc-fab:hover { transform: translateY(-2px); }
}

/* На мобиле поднимаем FAB над нижней таб-навигацией (≈56–64px). */
@media (max-width: 991.98px) {
    .lc-fab {
        bottom: calc(64px + env(safe-area-inset-bottom, 0px) + 0.9rem);
    }
}

/* --- График рейтинга --- */
.lc-chart-wrap {
    position: relative;
    width: 100%;
    height: 260px;
}

/* Пустые состояния (.lc-checker как контейнер) — в схеме A это золотая плашка.
   Делаем её тёмно-зелёной панелью с кремовым текстом для читаемости. */
.lc-checker.p-4,
.lc-checker.rounded {
    background: var(--lc-green, #16291f) !important;
    border: 1px solid var(--lc-line, rgba(242, 233, 216, 0.12));
    border-radius: var(--lc-radius, 4px);
}
.lc-checker.p-4 .h-lc,
.lc-checker.rounded .h-lc {
    color: var(--lc-cream, #f2e9d8);
}

/* Подпись плитки статистики внутри кремовой карточки (баланс) — тёмная. */
.card .lc-stat-label { color: var(--lc-ink-soft, #43544a); }
.card .lc-stat-value,
.card .lc-stat-best { color: var(--lc-ink, #1f3b2e); }

/* --- Тач-зоны ≥44px для мелких контролов (style-guide §6) ---
   Bootstrap .btn-sm / .form-*-sm ниже 44px — на телефоне в них трудно попасть.
   Поднимаем высоту, сохраняя компактную ширину/шрифт. */
.btn-sm,
.form-select-sm,
.form-control-sm {
    min-height: 44px;
}
.btn-sm {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* --- Поле ввода результата партии (компактные кнопки 1 / ½ / 0) --- */
.lc-result-group .btn {
    min-width: 44px;
    min-height: 44px;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

/* Колонка действий в таблицах не сжимается слишком сильно. */
.lc-col-actions {
    white-space: nowrap;
}

/* Карточка-страница (формы входа/регистрации по центру). */
.lc-auth-wrap {
    max-width: 440px;
    margin: 2rem auto;
}

/* Согласие с политикой при регистрации: квадратный чекбокс слева, подпись справа
   с переносом, выравнивание по верху; тач-зона ≥44px без съезжающего текста. */
#reg-consent-wrap {
    padding-block: 4px;
    /* Запас слева под чекбокс берёт стандартный Bootstrap .form-check (padding-left). */
}
#reg-consent-wrap .form-check-input {
    width: 1.25em;
    height: 1.25em;
    margin-top: 0.15em;          /* выравниваем квадрат по первой строке подписи */
    flex-shrink: 0;
}
#reg-consent-wrap .form-check-label {
    cursor: pointer;
    padding-block: 0.4rem;       /* увеличиваем тач-зону подписи до ≥44px */
    line-height: 1.4;
}

/* Футер «копирайт + политика»: шрифт на 2px крупнее базовых .62rem (≈.74rem). */
.lc-privacy-corner__copy,
.lc-privacy-corner__link {
    font-size: 0.74rem;
}

/* Обёртка широкой формы (создание/настройки турнира): шире авторизации,
   но не на всю ширину — поля читаются и на узком, и на широком экране. */
.lc-form-wrap {
    max-width: 640px;
    margin: 0 auto 2rem;
}
/* Кнопки действий формы — с запасом над тач-минимумом (≥48px, как карточные CTA H). */
.lc-form-actions .btn { min-height: 48px; }

/* Якорь под навбар, чтобы контент не прилипал.
   На мобиле снизу фиксированная таб-навигация (56px + safe-area) — добавляем отступ. */
.lc-page {
    padding-bottom: 5rem;
}
@media (max-width: 991.98px) {
    .lc-page {
        padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }
}

/* ============================================================
   Схема A — Карточка турнира (кремовая): eyebrow + мета-строки
   ============================================================ */
.lc-card-eyebrow {
    display: block;
    color: var(--lc-wine, #7a2230);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.25rem;
}
/* TASK-11: дата/время в карточке-анонсе — того же кегля, что и название
   (.card-title — Bootstrap .h5, 1.25rem). Капс/трекинг убираем, чтобы дата
   читалась как обычная строка того же размера, что заголовок. */
.card-lc-feature .lc-card-eyebrow {
    font-size: 1.25rem;
    text-transform: none;
    letter-spacing: 0;
    line-height: 1.2;
}
.lc-meta {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.lc-meta-row {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
}
.lc-meta-label {
    flex: 0 0 4.5rem;
    color: var(--lc-ink-soft, #43544a);
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.lc-meta-value {
    color: var(--lc-ink, #1f3b2e);
    font-size: 0.9rem;
    font-weight: 600;
}

/* Компактные строки карточки (место/формат) — вместо мета-таблицы. */
.lc-card-line {
    color: var(--lc-ink-soft, #43544a);
    font-size: 0.9rem;
    line-height: 1.35;
}

/* На кремовой карточке «Записаться» — того же цвета, что кнопка «Список»
   (btn-primary = терракота/wine). Перекрашиваем только CTA внутри [data-cta-host]. */
.card-lc-feature [data-cta-host] .btn-primary {
    --bs-btn-color: var(--lc-cream);
    --bs-btn-bg: var(--lc-wine);
    --bs-btn-border-color: var(--lc-wine);
    --bs-btn-hover-color: var(--lc-cream);
    --bs-btn-hover-bg: var(--lc-wine-700);
    --bs-btn-hover-border-color: var(--lc-wine-700);
    --bs-btn-active-bg: var(--lc-wine-700);
    --bs-btn-active-border-color: var(--lc-wine-700);
}
/* CTA «Записаться» на всю ширину карточки, r8, h44, 15/700 (макет «I desktop»). */
.card-lc-feature [data-cta-host] .btn {
    width: 100%;
    min-height: 44px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
}
/* Текст-вместимость в карточке — бордо даже внутри кремовой карточки. */
.card .text-lc-wine { color: var(--lc-wine, #7a2230) !important; }

/* ============================================================
   Схема A — Hero (лендинг / афиша)
   ============================================================ */
.lc-hero {
    /* Макет «I desktop»: верхний отступ 34, заголовок + подзаголовок,
       до тулбара зазор 26 (через нижний отступ hero). */
    padding: 1.75rem 0 0;
    margin-bottom: 26px;
}
.lc-hero__title {
    font-family: var(--lc-font-hero);   /* Playfair, как в макете */
    font-weight: 700;
    font-size: 2rem;                    /* макет: 2rem/32px */
    line-height: 1.1;
    letter-spacing: normal;             /* макет: без трекинга */
    color: var(--lc-cream, #f2e9d8);
    margin: 0 0 6px;
}
.lc-hero__subtitle {
    color: var(--lc-cream-200, #e7dcc4);
    font-size: 18px;
    line-height: 1.4;
    margin: 0;
    max-width: none;
}
.lc-hero__cta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}
.lc-hero__cta .btn {
    min-height: 52px;
    padding-left: 1.4rem;
    padding-right: 1.4rem;
    font-size: 1rem;
}
@media (max-width: 575.98px) {
    .lc-hero__cta .btn-primary {
        width: 100%;
    }
}
@media (min-width: 768px) {
    .lc-hero { padding: 2.1rem 0 0; }
    .lc-hero__title { font-size: 2rem; }   /* как в макете — без десктопного укрупнения */
}

/* ============================================================
   Схема A — Нижняя таб-навигация (mobile, fixed bottom)
   Видна только на мобиле; на desktop ссылки в шапке.
   ============================================================ */
.lc-tabbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1035;
    display: flex;
    align-items: stretch;
    background: var(--lc-green-deep, #11211a);
    border-top: 1px solid rgba(216, 177, 94, 0.20);
    padding-bottom: env(safe-area-inset-bottom, 0px);
}
.lc-tabbar__item {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    min-height: 64px;
    padding: 8px 4px;
    color: var(--lc-muted-dark, #9fb0a4);
    text-decoration: none;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    -webkit-tap-highlight-color: transparent;
}
.lc-tabbar__item:hover,
.lc-tabbar__item:focus {
    color: var(--lc-cream, #f2e9d8);
    text-decoration: none;
}
.lc-tabbar__item.is-active {
    color: var(--lc-gold, #d8b15e);
}
.lc-tabbar__icon {
    font-size: 1.3rem;
    line-height: 1;
}
/* На desktop нижняя навигация прячется — её роль играют ссылки в шапке. */
@media (min-width: 992px) {
    .lc-tabbar { display: none; }
}

/* ============================================================
   M2 — Статистика игрока (плитки + баланс цветов)
   ============================================================ */
.lc-stat-tile {
    background: var(--lc-green, #00382b);
    border: 1px solid var(--lc-line, rgba(244, 236, 219, 0.14));
    border-radius: var(--lc-radius, 10px);
    padding: 0.85rem 0.75rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}
.lc-stat-value {
    font-family: var(--lc-font-display, Georgia, serif);
    font-size: clamp(1.4rem, 5vw, 1.9rem);
    font-weight: 700;
    line-height: 1.1;
    color: var(--lc-cream, #f4ecdb);
}
.lc-stat-label {
    font-size: 0.78rem;
    color: var(--lc-cream-soft, rgba(244, 236, 219, 0.72));
    margin-top: 0.2rem;
    letter-spacing: 0.02em;
}
.lc-stat-accent .lc-stat-value {
    color: var(--lc-gold, #c49a45);
}
.lc-stat-wide {
    text-align: left;
}
.lc-stat-best {
    font-family: var(--lc-font-display, Georgia, serif);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--lc-cream, #f4ecdb);
    margin-top: 0.15rem;
}

/* Баланс по цвету: горизонтальный W/D/L бар. */
.lc-balance-row + .lc-balance-row {
    margin-top: 0.9rem;
}
.lc-balance-bar {
    display: flex;
    height: 12px;
    border-radius: 999px;
    overflow: hidden;
    background: var(--lc-green-deep, #00221a);
    border: 1px solid var(--lc-line, rgba(244, 236, 219, 0.14));
}
.lc-balance-bar > span {
    display: block;
    height: 100%;
}
.lc-bal-w { background: var(--lc-success, #2bb98a); }
.lc-bal-d { background: var(--lc-gold, #c49a45); }
.lc-bal-l { background: var(--lc-wine, #a21420); }
.lc-balance-empty {
    background: var(--lc-green-deep, #00221a);
}

/* ============================================================
   M2 — Лидерборд (подсветка игрока, закреплённая строка «Вы»)
   ============================================================ */
.lc-place {
    font-family: var(--lc-font-display, Georgia, serif);
    font-weight: 700;
    color: var(--lc-gold, #c49a45);
}
.table > tbody > tr.lc-row-me > td {
    background: rgba(196, 154, 69, 0.16);
}
.lc-link {
    color: var(--lc-cream, #f4ecdb);
    text-decoration: none;
    font-weight: 600;
    font-size: 1.0625rem;       /* 17px (Figma 16px +1) */
}
.lc-link:hover { color: var(--lc-gold, #c49a45); }

/* ============================================================
   Таблица рейтинга (.lc-board) — 1:1 с экспортом Figma-плагина
   (figma-to-html). Точные значения: цвета шапки/строк, кегли,
   паддинги. Класс изолирует правила от прочих таблиц (live/standings),
   у которых своя — золотая — шапка из темы.
   ============================================================ */

/* Колонка «игрок» тянется, остальные жмутся по содержимому и встают
   вплотную справа — без «дыры» на месте убранного Δ. */
/* «Игрок» — ведущая колонка, но не во всю ширину: оставляем долю под В·Н·П
   и рейтинг, чтобы они стояли ближе к центру, а не жались к правому краю. */
.lc-board th.lc-col-player,
.lc-board td.lc-col-player { width: 40%; }
.lc-board th:not(.lc-col-player),
.lc-board td:not(.lc-col-player) { white-space: nowrap; }
/* Колонка ранга — фикс. ширина 56px (Figma: #-колонка width 56). */
.lc-board th:first-child,
.lc-board td.lc-place { width: 56px; }

/* Шапка: светлая зелёная плашка (#1f3a2d ≈ --lc-green-2), кремовый
   текст 12px (НЕ золото, в отличие от темы). */
.lc-board > thead,
.lc-board > thead th {
    background-color: var(--lc-green-2, #1f3b2e);
    color: var(--lc-cream-200, #e7dcc4);
}
.lc-board > thead th {
    font-weight: 700;           /* жирные заголовки колонок */
    font-size: .8125rem;        /* 13px (+1 к Figma 12px) */
    letter-spacing: var(--lc-track, .08em);
    padding: .875rem 1.5rem;    /* 14px 24px */
    height: 44px;               /* Figma .v58_571: высота шапки */
    border-bottom: 0;
}

/* Строки: паддинг 16px 24px, зебра (нечёт #16291f / чёт #1b2d21 — светлее). */
.lc-board > tbody > tr > td {
    padding: 1rem 1.5rem;       /* 16px 24px */
    height: 56px;               /* Figma .v58_577: высота строки */
    border: 0;
    background-color: var(--lc-green, #16291f);
}
.lc-board > tbody > tr:nth-child(even) > td {
    background-color: #1b2d21;
}
/* Подсветка строки «Вы» — поверх зебры. */
.lc-board > tbody > tr.lc-row-me > td {
    background-color: rgba(216, 177, 94, .16);
}

/* Ранг — золото 16px Bold (из темы .lc-place). Ник — кремовый 16px SemiBold (.lc-link). */
/* В·Н·П — 15px Regular, приглушённый кремовый. */
.lc-wld {
    color: var(--lc-cream-200, #e7dcc4);
    font-size: .9375rem;        /* 15px */
    font-weight: 400;
    white-space: nowrap;
}
/* Рейтинг — 17px Bold, кремовый. По умолчанию (мобила) цифры прижаты влево —
   под начало слова «РЕЙТИНГ». На десктопе колонку выравниваем вправо. */
.lc-rating-val {
    font-weight: 700;
    font-size: 1.0625rem;       /* 17px */
    color: var(--lc-cream, #f4ecdb);
}
@media (min-width: 576px) {
    .lc-board th:last-child,
    .lc-board td.lc-rating-val { text-align: right; }
}

/* ---- Мобила (<576px): помещаем все 4 колонки на 360px ----
   Ужимаем горизонтальные отступы ячеек до пары px, ник занимает остаток
   и обрезается с затуханием справа — В·Н·П и рейтинг видны целиком. */
@media (max-width: 575.98px) {
    .lc-board > thead th,
    .lc-board > tbody > tr > td {
        padding-left: 6px;
        padding-right: 6px;
    }
    /* Ранг — по содержимому, фикс. 56px тут лишние. */
    .lc-board th:first-child,
    .lc-board td.lc-place { width: auto; }
    /* Ник: ячейка тянется на остаток ширины и клипует (max-width:0 + width:100% —
       приём усечения ячейки таблицы). Затухание вешаем на сам текст (.lc-link),
       а НЕ на ячейку — иначе вместе с текстом затухает фон-зебра и в строке
       появляется полупрозрачная «дыра» до колонки В·Н·П. */
    .lc-board th.lc-col-player,
    .lc-board td.lc-col-player {
        width: 100%;
        max-width: 0;
        overflow: hidden;
        white-space: nowrap;
    }
    .lc-board td.lc-col-player .lc-link {
        display: block;
        width: 100%;
        overflow: hidden;
        white-space: nowrap;
        /* Затухание попадает на пустой хвост ссылки — короткие ники целы,
           длинные плавно гаснут у правого края колонки. */
        -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 22px), transparent);
        mask-image: linear-gradient(to right, #000 calc(100% - 22px), transparent);
    }
    /* Бейдж «Вы» на мобиле убираем: строка и так подсвечена, а блочная
       ссылка вытолкнула бы его на новую строку под клип. */
    .lc-board td.lc-col-player .badge { display: none; }
}

.lc-me-pinned {
    position: sticky;
    bottom: 0.75rem;
    margin-top: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    min-height: 44px;
    background: var(--lc-green-2, #0a4a39);
    border: 1px solid var(--lc-gold, #c49a45);
    border-radius: var(--lc-radius, 10px);
    color: var(--lc-cream, #f4ecdb);
    box-shadow: var(--lc-shadow, 0 4px 14px rgba(0, 0, 0, 0.35));
}
/* hidden-атрибут должен побеждать display:flex (иначе пустая строка «Вы» видна). */
.lc-me-pinned[hidden] { display: none; }

/* ============================================================
   M2 — Live-режим турнира (карточка «Твоя партия», индикатор, пульс)
   ============================================================ */

/* Крупная карточка «Твоя партия» — над сгибом, акцентная. */
.lc-live-card {
    border-radius: var(--lc-radius-lg, 16px);
}
.lc-live-eyebrow {
    font-family: var(--lc-font-display, Georgia, serif);
    text-transform: uppercase;
    letter-spacing: 0.22em;
    font-size: 0.82rem;
    color: var(--lc-gold, #c49a45);
}

/* Номер стола — самый крупный элемент экрана (его ищут глазами в зале). */
.lc-live-table {
    line-height: 1;
}
.lc-live-table-cap {
    font-family: var(--lc-font-display, Georgia, serif);
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-size: 0.8rem;
    color: var(--lc-ink-soft, #4a463e);
}
.lc-live-table-num {
    display: block;
    font-family: var(--lc-font-display, Georgia, serif);
    font-weight: 800;
    font-size: clamp(3.4rem, 18vw, 5rem);
    color: var(--lc-wine, #8f0912);
}
.lc-live-table-num::before { content: "№"; font-size: 0.5em; vertical-align: 0.35em; }
.lc-live-table-unknown {
    display: block;
    font-family: var(--lc-font-display, Georgia, serif);
    font-size: 1.4rem;
    color: var(--lc-ink-soft, #4a463e);
}

.lc-live-field-label {
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.74rem;
    color: var(--lc-ink-soft, #4a463e);
}
.lc-live-field-value {
    font-family: var(--lc-font-display, Georgia, serif);
    font-size: 1.25rem;
    font-weight: 700;
}
.lc-live-emoji {
    font-size: 2.6rem;
    line-height: 1;
    margin-bottom: 0.4rem;
}
.lc-live-bye-points {
    font-weight: 700;
    color: var(--lc-gold, #c49a45);
}

/* Результат партии — тон по итогу (поражение подаём сдержанно). */
.lc-live-result {
    font-weight: 700;
    font-size: 1.1rem;
}
.lc-live-result--win { color: var(--lc-success, #10b981); }
.lc-live-result--draw { color: var(--lc-ink, #1a1a1a); }
.lc-live-result--loss { color: var(--lc-wine-300, #c2474e); }
.lc-live-result--playing { color: var(--lc-ink-soft, #4a463e); font-weight: 600; }

/* Плашка зрителя. */
.lc-live-spectator {
    padding: 0.85rem 1rem;
    min-height: 44px;
    border-radius: var(--lc-radius, 10px);
    background: var(--lc-green-2, #0a4a39);
    border: 1px solid var(--lc-gold, #c49a45);
    color: var(--lc-cream, #f4ecdb);
}

/* Live-индикатор «обновлено N сек назад». */
.lc-live-indicator {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: var(--lc-cream-soft, rgba(244, 236, 219, 0.72));
}
.lc-live-indicator--warn {
    color: var(--lc-warning, #c97a0e);
    font-weight: 600;
}

/* Метка «ВЫ» в таблице. */
.lc-you-mark {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--lc-gold, #c49a45);
    margin-right: 0.25rem;
}

/* Сетка пар тура (свёрнутый блок). */
.lc-live-pairs {
    border: 1px solid var(--lc-line, rgba(244, 236, 219, 0.14));
    border-radius: var(--lc-radius, 10px);
    overflow: hidden;
}
.lc-live-pairs-summary {
    cursor: pointer;
    list-style: none;
    padding: 0.85rem 1rem;
    min-height: 44px;
    display: flex;
    align-items: center;
    font-size: 0.95rem;
}
.lc-live-pairs-summary::-webkit-details-marker { display: none; }
.lc-live-pairs-summary::before { content: "▸ "; margin-right: 0.4rem; }
.lc-live-pairs[open] .lc-live-pairs-summary::before { content: "▾ "; }

/* Скелетон до первого ответа. */
.lc-live-skeleton .card-body {
    min-height: 200px;
    background: linear-gradient(90deg,
        rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.04));
    border-radius: var(--lc-radius, 10px);
}

/* Мягкое мерцание изменившегося блока (золото с низкой альфой → fade-out). */
@keyframes lc-pulse {
    0% { box-shadow: 0 0 0 3px rgba(196, 154, 69, 0.55); }
    100% { box-shadow: 0 0 0 3px rgba(196, 154, 69, 0); }
}
.lc-pulse {
    animation: lc-pulse 0.7s ease-out;
    border-radius: var(--lc-radius, 10px);
}
/* Уважение к prefers-reduced-motion: статичная подсветка без анимации. */
@media (prefers-reduced-motion: reduce) {
    .lc-pulse {
        animation: none;
        box-shadow: 0 0 0 3px rgba(196, 154, 69, 0.4);
    }
}

/* Десктоп: карточка слева (sticky), таблица справа — прогрессивное улучшение. */
@media (min-width: 768px) {
    .lc-live-card { position: sticky; top: 1rem; }
}

/* --- PWA: баннер установки (A2HS) --- */
/* Mobile-first: лента снизу, во всю ширину; на десктопе — компактная карточка справа. */
.lc-pwa-banner {
    position: fixed;
    left: 0.75rem;
    right: 0.75rem;
    /* Выше нижней таб-навигации, чтобы её не перекрывать. */
    bottom: calc(64px + env(safe-area-inset-bottom, 0px) + 0.75rem);
    z-index: 1095;
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 0.9rem 1rem;
    background: var(--lc-green, #00382b);
    border: 1px solid var(--lc-green-300, #1e5c49);
    border-radius: var(--lc-radius-lg, 16px);
    box-shadow: var(--lc-shadow-lg, 0 12px 34px rgba(0, 0, 0, 0.48));
    color: var(--lc-cream, #f4ecdb);
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.lc-pwa-banner--show {
    opacity: 1;
    transform: translateY(0);
}

.lc-pwa-banner__mark {
    /* Новый логотип-локап «lovechess» (белые глифы) на тёмно-зелёном баннере. */
    width: auto;
    height: 30px;
    max-width: 130px;
    flex-shrink: 0;
}

.lc-pwa-banner__body {
    flex: 1 1 auto;
    min-width: 0;
}

.lc-pwa-banner__title {
    font-family: var(--lc-font-display, serif);
    font-size: 1.05rem;
    margin: 0 0 0.15rem;
    color: var(--lc-cream, #f4ecdb);
}

.lc-pwa-banner__text {
    margin: 0 0 0.6rem;
    font-size: 0.9rem;
    line-height: 1.4;
    color: var(--lc-cream-soft, rgba(244, 236, 219, 0.72));
}

.lc-pwa-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.lc-pwa-banner__btn,
.lc-pwa-banner__dismiss {
    min-height: 44px;
    padding: 0.5rem 1.1rem;
    border-radius: var(--lc-radius, 10px);
    font: inherit;
    font-size: 0.95rem;
    cursor: pointer;
}

.lc-pwa-banner__btn {
    border: 0;
    background: var(--lc-wine, #a21420);
    color: var(--lc-cream, #f4ecdb);
}

.lc-pwa-banner__btn:hover,
.lc-pwa-banner__btn:focus {
    background: var(--lc-wine-700, #7e0c16);
}

.lc-pwa-banner__dismiss {
    border: 1px solid var(--lc-line, rgba(244, 236, 219, 0.14));
    background: transparent;
    color: var(--lc-cream-soft, rgba(244, 236, 219, 0.72));
}

.lc-pwa-banner__close {
    position: absolute;
    top: 0.35rem;
    right: 0.5rem;
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: var(--lc-cream-soft, rgba(244, 236, 219, 0.72));
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
}

@media (min-width: 576px) {
    .lc-pwa-banner {
        /* Слева снизу, чтобы не перекрывать круглую кнопку «+» справа. */
        right: auto;
        left: 1rem;
        bottom: 1rem;
        max-width: 380px;
    }
}

/* --- PWA: тост «доступно обновление» --- */
.lc-pwa-update {
    position: fixed;
    left: 50%;
    bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
    transform: translate(-50%, 16px);
    z-index: 1096;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: min(92vw, 420px);
    padding: 0.75rem 1rem;
    background: var(--lc-green-2, #0a4a39);
    border: 1px solid var(--lc-green-300, #1e5c49);
    border-radius: var(--lc-radius, 10px);
    box-shadow: var(--lc-shadow-lg, 0 12px 34px rgba(0, 0, 0, 0.48));
    color: var(--lc-cream, #f4ecdb);
    opacity: 0;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.lc-pwa-update--show {
    opacity: 1;
    transform: translate(-50%, 0);
}

.lc-pwa-update__text {
    flex: 1 1 auto;
    font-size: 0.92rem;
}

.lc-pwa-update__btn {
    flex-shrink: 0;
    min-height: 44px;
    padding: 0.45rem 1rem;
    border: 0;
    border-radius: var(--lc-radius, 10px);
    background: var(--lc-wine, #a21420);
    color: var(--lc-cream, #f4ecdb);
    font: inherit;
    font-size: 0.92rem;
    cursor: pointer;
}

.lc-pwa-update__btn:hover,
.lc-pwa-update__btn:focus {
    background: var(--lc-wine-700, #7e0c16);
}

/* ─────────────── Шахматные часы (ChessClock) ─────────────── */
.lc-clock-page {
    --lc-clock-chrome: 150px;            /* запас под экран игры (не для настроек) */
    padding-top: .75rem;
    padding-bottom: 5rem;                /* обычная прокручиваемая страница */
}
@media (min-width: 992px) {
    .lc-clock-page { --lc-clock-chrome: 104px; padding-bottom: 1.5rem; }
}

/* Экран настроек: обычный поток, низкие горизонтальные блоки. */
.lc-clock-settings {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.lc-clock-presets .lc-clock-preset { flex: 1 1 0; min-width: 64px; }
.lc-clock-start { padding-top: .8rem; padding-bottom: .8rem; font-size: 1.1rem; }
.lc-clock-sound { padding-left: 2.6em; }

/* Два блока игроков. На мобиле — друг под другом, на ширине — рядом. */
.lc-clock-sides {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
@media (min-width: 576px) {
    .lc-clock-sides { flex-direction: row; }
    .lc-clock-side { flex: 1 1 0; }
}
.lc-clock-side__body { padding: .6rem .75rem; }
/* Строка «метка — степпер», мин/сек/добавка друг под другом. */
.lc-clock-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: .2rem 0;
}
.lc-clock-line__label { font-size: .95rem; }

.lc-clock-preset.active {
    background: var(--lc-gold);
    color: var(--lc-ink);
    border-color: var(--lc-gold);
}

/* Горизонтальный степпер [−] значение [+]. */
.lc-clock-stepper {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
}
.lc-clock-step {
    min-width: 44px;
    min-height: 44px;
    line-height: 1;
    font-size: 1.4rem;
    padding: 0;
}
.lc-clock-stepper__val {
    font-size: 1.5rem;
    font-weight: 700;
    min-width: 3.6ch;          /* запас под 3 цифры / двузначную добавку «15 с» */
    text-align: center;
    font-variant-numeric: tabular-nums;
}

/* Мобила: ужимаем экран настроек по высоте, чтобы кнопка «Начать» влезала на
   низких экранах (отступы внутри и между блоками — чуть меньше). */
@media (max-width: 575.98px) {
    .lc-clock-settings { gap: 10px; }
    .lc-clock-sides { gap: 10px; }
    .lc-clock-side__body { padding: .45rem .6rem; }
    .lc-clock-line { padding: .12rem 0; }
    .lc-clock-line__label { font-size: .9rem; }
    .lc-clock-presets { gap: .4rem; }
    .lc-clock-start { padding-top: .6rem; padding-bottom: .6rem; }
}

/* ── Экран игры: сплит на пол-экрана ── */
.lc-clock {
    display: flex;
    flex-direction: column;
    gap: 8px;
    height: calc(100dvh - var(--lc-clock-chrome));
    min-height: 320px;
}

/* Полноэкранный иммерсивный режим: часы поверх всего, меню уезжают. */
body.clk-game .lc-clock {
    position: fixed;
    inset: 0;
    z-index: 1000;
    height: 100dvh;
    margin: 0;
    padding: 10px;
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--lc-green-2);
}

/* Слайд верхней и нижней навигации. Переход — всегда, чтобы было плавно. */
.navbar-lc { transition: transform .3s ease; }
.lc-tabbar { transition: transform .3s ease; }
/* В игре навигация лежит ПОВЕРХ часов (выезжает на паузе). */
body.clk-game .navbar-lc {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1100;
}
body.clk-game .lc-checker-strip { display: none; }
body.clk-game .lc-tabbar { z-index: 1100; }
/* На игровом экране часов PWA-плашки не должны перекрывать половины часов и
   блокировать тапы (особенно нижнюю белую половину). Прячем их на время партии. */
body.clk-game .lc-pwa-banner,
body.clk-game .lc-pwa-update { display: none !important; }
/* Иммерсия: меню уехали (часы на весь экран). */
body.clk-immersive .navbar-lc { transform: translateY(-110%); }
body.clk-immersive .lc-tabbar { transform: translateY(110%); }

.lc-clock__panel {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 8px;
    border: 1px solid var(--lc-line);
    border-radius: var(--lc-radius-lg);
    background: var(--lc-green);
    color: var(--lc-cream);
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    /* Не ждём разрешения жеста (скролл/зум) — переключение хода мгновенно (пуля). */
    touch-action: manipulation;
    transition: background-color .12s ease, color .12s ease;
}
.lc-clock__panel--top { transform: rotate(180deg); }
/* Явный контраст «чей ход»: активная сторона — яркая зелёная с белой
   обводкой, неактивная уходит в тёмный фон с приглушённым текстом. */
.lc-clock__panel--active {
    background: var(--lc-success);
    color: #fff;
    border-color: #fff;
    box-shadow: 0 0 0 2px var(--lc-success), 0 6px 22px rgba(0, 0, 0, .35);
}
.lc-clock__panel--idle {
    background: var(--lc-green-deep);
    color: var(--lc-muted-dark);
    border-color: var(--lc-green-700);
}
.lc-clock__panel--flag {
    background: var(--lc-wine);
    color: #fff;
    border-color: var(--lc-wine);
}
.lc-clock__time {
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    font-size: clamp(3.2rem, 16vw, 7rem);
}
.lc-clock__moves { font-size: .95rem; opacity: .85; }
.lc-clock__flag {
    display: none;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 700;
    font-size: .9rem;
}
.lc-clock__panel--flag .lc-clock__flag { display: block; }

.lc-clock__bar {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-around;
    align-items: center;
    gap: 8px;
    padding: 6px;
    background: var(--lc-green-deep);
    border-radius: var(--lc-radius-lg);
}
.lc-clock__ctrl {
    flex: 1 1 0;
    min-height: 48px;
    border: none;
    background: transparent;
    color: var(--lc-cream);
    font-size: 1.4rem;
    border-radius: var(--lc-radius);
    cursor: pointer;
}
.lc-clock__ctrl:hover,
.lc-clock__ctrl:focus { background: var(--lc-green-300); }

/* ── Модалка настроек поверх запущенных часов ──
   Минимальный рабочий каркас (бренд-дизайнер полирует визуал отдельно):
   фиксированный оверлей, затемнённый бэкдроп, центрированный прокручиваемый лист. */
.lc-clock-modal {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.lc-clock-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .6);
}
.lc-clock-modal__sheet {
    position: relative;
    width: 100%;
    max-width: 520px;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    background: var(--lc-cream, #f3ecd9);
    color: var(--lc-ink, #1a1a1a);
    border-radius: var(--lc-radius-lg, 16px);
    padding: 16px;
    -webkit-overflow-scrolling: touch;
}
.lc-clock-modal__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 12px;
}
.lc-clock-modal__title {
    font-size: 1.15rem;
    margin: 0;
}
.lc-clock-modal__close {
    flex: 0 0 auto;
    min-width: 44px;
    min-height: 44px;
    border: none;
    background: transparent;
    color: inherit;
    font-size: 1.8rem;
    line-height: 1;
    cursor: pointer;
}

/* Иконки пунктов меню (взято из прототипа): золотые, с отступом до подписи.
   Видны в боковой шторке; на десктопе шапка остаётся текстовой. */
.lc-nav-ic {
    display: inline-flex;
    align-items: center;
    color: var(--lc-gold);
    margin-right: .7rem;
}
@media (min-width: 992px) {
    .lc-nav-ic { display: none; }
}

/* ─────── Мобильное верхнее меню — шторка (drawer, <992px) ───────
   Выезжает справа поверх контента, поверх — затемнённый бэкдроп.
   Desktop (≥992px) не трогаем: #lcNav остаётся инлайн-меню Bootstrap. */

.lc-drawer-backdrop { display: none; }

@media (max-width: 991.98px) {
    /* Высота шапки (фон #000 + лого) — drawer и бэкдроп опускаются под неё,
       чтобы шапка с лого оставалась видимой и сверху. На 2px меньше реальной
       высоты шапки: шторка/бэкдроп подныривают под чёрную шапку (z-index выше),
       чтобы между шапкой и шторкой не светилась полоска фона. */
    .lc-drawer-backdrop,
    .navbar-lc .navbar-collapse.lc-drawer { --lc-nav-h: 64px; }

    /* Бэкдроп: затемнённая подложка под шапкой — ловит тап в любую точку
       (кроме самой панели) и закрывает шторку. */
    .lc-drawer-backdrop {
        display: block;
        position: fixed;
        top: var(--lc-nav-h);
        right: 0;
        bottom: 0;
        left: 0;
        background: rgba(8, 18, 13, .58);
        opacity: 0;
        transition: opacity .28s ease;
        z-index: 1200;
    }
    .lc-drawer-backdrop[hidden] { display: none; }
    .lc-drawer-backdrop.is-open { opacity: 1; }

    /* Панель-шторка: 78% ширины (но не более 360px), выезжает справа,
       начинается под чертой шапки. */
    .navbar-lc .navbar-collapse.lc-drawer {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: var(--lc-nav-h);
        right: 0;
        bottom: 0;
        width: 78vw;
        max-width: 360px;
        padding: 0;
        background: var(--lc-green-2, #1f3b2e);
        box-shadow: -8px 0 28px rgba(0, 0, 0, .45);
        transform: translateX(100%);
        transition: transform .3s ease;
        z-index: 1210;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
    /* Совсем узкие экраны — чуть шире, но не на весь экран. */
    @media (max-width: 360px) {
        .navbar-lc .navbar-collapse.lc-drawer { width: 86vw; }
    }
    .navbar-lc .navbar-collapse.lc-drawer.is-open { transform: translateX(0); }

    /* Список пунктов на всю ширину шторки. Закрываем по бургеру/бэкдропу —
       отдельной шапки с крестиком нет, лишнего отступа сверху тоже. */
    .navbar-lc .navbar-collapse.lc-drawer .navbar-nav {
        width: 100%;
        gap: .6rem;
        padding: 1rem .9rem 1.5rem;
    }
    .navbar-lc .navbar-collapse.lc-drawer .nav-item { width: 100%; }
    .navbar-lc .navbar-collapse.lc-drawer .nav-link {
        font-size: 1.2rem;
        padding: 1.05rem 1.15rem;
        min-height: 52px;
        display: flex;
        align-items: center;
        border-radius: var(--lc-radius);
    }
    /* Чередующийся фон — как в таблице рейтинга, но на тон светлее
       (панель осветлена до green-2, чтобы шторка не была слишком тёмной). */
    .navbar-lc .navbar-collapse.lc-drawer .nav-item:nth-of-type(odd) .nav-link {
        background-color: #26452f;
    }
    .navbar-lc .navbar-collapse.lc-drawer .nav-item:nth-of-type(even) .nav-link {
        background-color: #2c4f37;
    }
    /* Кнопка «Войти»/«Выйти» — полноразмерная, с воздухом. */
    .navbar-lc .navbar-collapse.lc-drawer .btn-on-green {
        width: 100%;
        margin-top: .75rem;
        margin-bottom: .25rem;
        border-radius: calc(var(--lc-radius-sm) + 2px);   /* кнопки меню — на 2px скруглённее */
    }

    /* Блокируем скролл фона, пока шторка открыта. */
    body.lc-drawer-open { overflow: hidden; }
}

/* Текст вкладок фильтра — по центру кнопки (на всех ширинах). */
#lifecycle-tabs.nav-pills .nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* ─── Фильтр турниров (Предстоящие/Идут сейчас/Завершённые) влезает в строку ─── */
@media (max-width: 575.98px) {
    /* Две строки фильтров — отдельными закруглёнными блоками с зазором. */
    .lc-toolbar {
        background: transparent;
        border-radius: 0;
        padding: 0;
        gap: 6px;
    }
    #lifecycle-tabs.nav-pills {
        width: 100%;
        background: var(--lc-green);
        border-radius: 12px;
        padding: 8px;
    }
    /* Блок «Список/Календарь» (+город) — без плашки, сливается с фоном. */
    .lc-toolbar__right {
        width: 100%;
        background: transparent;
        border-radius: 0;
        padding: 0;
    }
    #lifecycle-tabs.nav-pills {
        flex-wrap: nowrap;
        gap: 4px;
    }
    #lifecycle-tabs.nav-pills .nav-item { flex: 1 1 0; min-width: 0; }
    #lifecycle-tabs.nav-pills .nav-link {
        width: 100%;
        padding: 8px 4px;
        font-size: 13px;
        min-height: 40px;
        white-space: nowrap;
    }
}

/* ─────────── Вид «Календарь»: месяц целиком + просмотр дня ─────────── */
.lc-month {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}
.lc-month__wd {
    text-align: center;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--lc-cream-soft);
    font-weight: 600;
    padding: 2px 0 4px;
}
.lc-month__cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    min-height: 52px;
    min-width: 0;          /* колонки 1fr равной ширины — контент не «распирает» ячейку */
    padding: 4px 2px;
    background: var(--lc-green);
    border: 1px solid var(--lc-line);
    border-radius: var(--lc-radius);
    color: var(--lc-cream);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.lc-month__cell[data-day]:hover,
.lc-month__cell[data-day]:focus-visible {
    border-color: var(--lc-gold-line);
    background: var(--lc-green-300);
    outline: none;
}
.lc-month__cell.is-other {
    background: transparent;
    border-color: transparent;
    color: var(--lc-cream-soft);
    opacity: .45;
    cursor: default;
}
.lc-month__num {
    width: 1.9em;
    height: 1.9em;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-weight: 600;
    font-size: .95rem;
}
.lc-month__cell.is-today .lc-month__num {
    background: var(--lc-wine);
    color: #fff;
}
.lc-month__dots {
    display: flex;
    gap: 3px;
    margin-top: auto;
    min-height: 6px;
}
.lc-month__dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--lc-gold);
}
/* Строки-события — только на десктопе (на мобиле остаются точки). */
.lc-month__events { display: none; }
@media (min-width: 768px) {
    .lc-month { gap: 6px; }
    .lc-month__cell {
        min-height: 108px;
        align-items: stretch;
        padding: 6px;
    }
    .lc-month__num { align-self: center; }
    .lc-month__dots { display: none; }
    .lc-month__events {
        display: flex;
        flex-direction: column;
        gap: 2px;
        width: 100%;
        margin-top: 3px;
        min-width: 0;
    }
    .lc-month__event {
        display: flex;
        gap: 4px;
        align-items: baseline;
        min-width: 0;
        background: var(--lc-cream);
        color: var(--lc-ink);
        border-radius: var(--lc-radius-sm);
        padding: 1px 5px;
        font-size: .72rem;
        line-height: 1.3;
        white-space: nowrap;
        overflow: hidden;
    }
    .lc-month__event-time { font-weight: 700; color: var(--lc-wine); flex-shrink: 0; }
    /* Не влезающее название не обрезаем многоточием, а плавно затемняем к концу. */
    .lc-month__event-name {
        flex: 1 1 auto;
        min-width: 0;
        overflow: hidden;
        -webkit-mask-image: linear-gradient(to right, #000 72%, transparent);
        mask-image: linear-gradient(to right, #000 72%, transparent);
    }
    .lc-month__more { font-size: .68rem; color: var(--lc-cream-soft); padding-left: 5px; }
}

/* Просмотр дня: «Назад» + дата */
.lc-day-nav {
    display: flex;
    align-items: center;
    gap: .75rem;
}
.lc-day-nav .btn { min-height: 44px; }

/* ============================================================
   Глобальное уважение к prefers-reduced-motion.
   Гасим анимации/переходы/шиммер для пользователей с включённой
   настройкой «уменьшить движение» (точечные кейсы — выше по коду).
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
    /* Скелетоны: без бегущего шиммера — статичная заливка. */
    .lc-skeleton { animation: none; background: var(--lc-green); }
}

/* ============================================================
   Контент-страницы (О клубе): HTML, заданный админом через WYSIWYG.
   Аккуратные отступы и брендовые заголовки/ссылки на тёмной карточке.
   ============================================================ */
/* Контент «О клубе» живёт в КРЕМОВОЙ карточке (.card-lc-feature) → текст тёмный,
   иначе кремовый текст сливался с кремовым фоном (BUG-9). Заголовки явно перебиваем
   базовое правило h1..h6{color:cream}; ссылки — бордо для контраста на кремовом. */
.lc-rich-content { color: var(--lc-ink); line-height: 1.6; }
.lc-rich-content h1, .lc-rich-content h2, .lc-rich-content h3,
.lc-rich-content h4, .lc-rich-content h5, .lc-rich-content h6 { color: var(--lc-ink); }
.lc-rich-content a { color: var(--lc-wine); }
.lc-rich-content > :first-child { margin-top: 0; }
.lc-rich-content > :last-child { margin-bottom: 0; }
.lc-rich-content h2 { font-size: 1.35rem; margin-top: 1.5rem; margin-bottom: .5rem; }
.lc-rich-content h3 { font-size: 1.1rem; margin-top: 1.25rem; margin-bottom: .4rem; }
.lc-rich-content p,
.lc-rich-content ul,
.lc-rich-content ol { margin-bottom: 1rem; }
.lc-rich-content img { max-width: 100%; height: auto; border-radius: 10px; }
.lc-rich-content blockquote {
    border-left: 3px solid var(--lc-gold-line);
    padding-left: 1rem;
    margin: 1rem 0;
    color: var(--lc-ink-soft);
}