@font-face{font-family:Manrope;src:url(../fonts/manrope400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url(../fonts/manrope500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url(../fonts/manrope600.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url(../fonts/manrope700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

/* Светлая тема — по умолчанию. Тёмная включается атрибутом data-theme="dark",
   который ставит переключатель в шапке (см. header.html) и раннее
   восстановление выбора из localStorage в index.html. */
:root {
    --sf2-border-radius: 16px;
    --sf2-border-radius-sm: 8px;
    --sf2-background-primary: #F4F5F6;
    --sf2-color-links: #FF4D4D;
    --sf2-color-links-hover: #F9A826;
    --sf2-color-text: #101010;
    --sf2-color-text-secondary: #55585E;
    --sf2-color-text-muted: #8A8D93;
    --sf2-gradient-primary: linear-gradient(90deg, #db4944 0%, #ab1a39 100%);
    --sf2-color-success: #10B981;
    --sf2-color-warning: #F59E0B;
    --sf2-color-danger: #EF4444;
    --sf2-color-info: #38BDF8;
    --sf2-color-border-dashed: rgba(0, 0, 0, .1);
    --sf2-card-bg: #FFFFFF;
    --sf2-card-border: rgba(0, 0, 0, .08);
    --sf2-input-bg: rgba(0, 0, 0, .04);
    --sf2-shadow-glass: 0 8px 24px rgba(0, 0, 0, .1);
    --sf2-header-bg: rgba(255, 255, 255, .85);
    --sf2-surface-elevated: #FFFFFF;
    --sf2-tooltip-shadow: 0 4px 16px rgba(0, 0, 0, .12);
    --sf2-divider: rgba(0, 0, 0, .06);
    --sf2-overlay-faint: rgba(0, 0, 0, .015);
    --sf2-overlay-subtle: rgba(0, 0, 0, .03);
    --sf2-overlay-soft: rgba(0, 0, 0, .04);
    --sf2-overlay-strong: rgba(0, 0, 0, .06);
    --sf2-overlay-hover: rgba(0, 0, 0, .05);
    --sf2-ring: rgba(0, 0, 0, .1);
    --sf2-inset-bg: rgba(0, 0, 0, .05);
}

[data-theme="dark"] {
    --sf2-background-primary: #0B0E14;
    --sf2-color-text: #F1F5F9;
    --sf2-color-text-secondary: #94A3B8;
    --sf2-color-text-muted: #64748B;
    --sf2-color-border-dashed: rgba(255, 255, 255, .08);
    --sf2-card-bg: rgba(255, 255, 255, .04);
    --sf2-card-border: rgba(255, 255, 255, .08);
    --sf2-input-bg: rgba(255, 255, 255, .06);
    --sf2-shadow-glass: 0 8px 32px rgba(0, 0, 0, .4);
    --sf2-header-bg: rgba(11, 14, 20, .85);
    --sf2-surface-elevated: #10141D;
    --sf2-tooltip-shadow: 0 2px 10px rgba(0, 0, 0, .4);
    --sf2-divider: rgba(255, 255, 255, .04);
    --sf2-overlay-faint: rgba(255, 255, 255, .02);
    --sf2-overlay-subtle: rgba(255, 255, 255, .03);
    --sf2-overlay-soft: rgba(255, 255, 255, .05);
    --sf2-overlay-strong: rgba(255, 255, 255, .08);
    --sf2-overlay-hover: rgba(255, 255, 255, .1);
    --sf2-ring: rgba(255, 255, 255, .2);
    --sf2-inset-bg: rgba(0, 0, 0, .3);
}

html, body {
    padding: 0;
    margin: 0;
    font-family: 'Manrope', sans-serif;
    background: var(--sf2-background-primary);
    transition: background-color .2s ease, color .2s ease;
}

body {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.3;
    color: var(--sf2-color-text);
}

a { color: var(--sf2-color-links); }
a:hover { color: var(--sf2-color-links-hover); }

.container-fluid {
    max-width: 1440px;
    margin: 0 auto;
    padding-right: 15px;
    padding-left: 15px;
    box-sizing: border-box;
}

.h {
    width: 100%;
    background: var(--sf2-header-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--sf2-card-border);
    padding: 10px 0;
    position: sticky;
    top: 0;
    z-index: 100;
}
.h .container-fluid {
    display: flex;
    align-items: center;
    min-height: 40px;
}
.h__logo { line-height: 0; display: block; }
.h__menu { margin-left: 24px; }
.h__menu ul {
    list-style: none;
    padding: 4px;
    margin: 0;
    display: flex;
    align-items: center;
    grid-gap: 4px;
    background: var(--sf2-overlay-soft);
    border-radius: 12px;
    border: 1px solid var(--sf2-card-border);
}
.h__menu a {
    font-weight: 500;
    font-size: 14px;
    color: var(--sf2-color-text-secondary);
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 8px;
    display: block;
    transition: .3s;
}
.h__menu a:hover { color: var(--sf2-color-text); }
.h__menu a.active { background: rgba(255, 77, 77, .2); color: #FF4D4D; box-shadow: 0 0 15px rgba(255, 77, 77, .1); }
.h__btns {
    margin-left: auto;
    display: flex;
    align-items: center;
    grid-gap: 16px;
}
.h__user {
    display: flex;
    align-items: center;
    grid-gap: 8px;
    font-weight: 500;
    font-size: 14px;
    color: var(--sf2-color-text);
    text-decoration: none;
}
.h__user img { border-radius: 50%; object-fit: cover; }
.h__login {
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    background: var(--sf2-gradient-primary);
    border-radius: 10px;
    padding: 8px 16px;
    text-decoration: none;
}

.footer__wrap { background: var(--sf2-background-primary); margin-top: auto; border-top: 1px solid var(--sf2-card-border); }
.footer {
    padding: 40px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    grid-gap: 15px;
}
.footer__logo { line-height: 0; }
.footer__t { font-size: 14px; color: var(--sf2-color-text-secondary); margin-top: 10px; }
.footer__a { font-weight: 400; font-size: 14px; color: var(--sf2-color-text); text-decoration: none; }
.footer__a:hover { color: var(--sf2-color-links-hover); }
.footer__btm {
    border-top: 1px solid var(--sf2-card-border);
    padding: 13px 15px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    grid-gap: 15px;
}
.footer__btm a { font-size: 13px; color: var(--sf2-color-text-secondary); text-decoration: none; }

.title { font-weight: 600; color: var(--sf2-color-text); }
.title.title__h1 { font-size: 32px; margin-bottom: 10px; line-height: 132%; }
.title.title__h2 { font-size: 28px; margin-bottom: 15px; }
.breadcrumbs {
    font-size: 14px;
    line-height: 150%;
    color: var(--sf2-color-text);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    grid-gap: 4px;
}
.breadcrumbs a { color: var(--sf2-color-text); text-decoration: none; }
.breadcrumbs-last { color: var(--sf2-color-text-secondary); }

.page-descriptor {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 15px;
    border-radius: var(--sf2-border-radius);
    background: var(--sf2-card-bg);
    border: 1px solid var(--sf2-card-border);
    backdrop-filter: blur(10px);
    padding: 15px 15px 15px 20px;
    margin-bottom: 25px;
}
.pd-title { font-weight: 600; font-size: 20px; color: var(--sf2-color-text); }
.pd-text { font-size: 14px; color: var(--sf2-color-text-secondary); }

.btn-primary, .filter-submit input[type="submit"], .sf-btn-primary {
    border-radius: 10px;
    background: var(--sf2-gradient-primary);
    border: none;
    font-weight: 600;
    font-size: 14px;
    line-height: 150%;
    color: #fff;
    padding: 10px 16px;
    cursor: pointer;
    text-align: center;
    min-height: 40px;
}
.btn-primary:hover, .filter-submit input[type="submit"]:hover, .sf-btn-primary:hover { opacity: .9; color: #fff; }

.btn-ghost {
    padding: 8px 16px;
    border-radius: 20px;
    background: var(--sf2-card-bg);
    border: 1px solid var(--sf2-card-border);
    color: var(--sf2-color-text);
    font-weight: 500;
    cursor: pointer;
}
.btn-ghost:hover { background: var(--sf2-overlay-hover); }
.btn-ghost.active { background: rgba(255, 77, 77, .2); border-color: #FF4D4D; color: #FF4D4D; }

.match-filters { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }

/* Тулбар страницы "Матчи" — навигация по дням + LIVE + "Все матчи" + поиск (как на главной sf2) */
.matches-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 12px; }
.matches-toolbar__nav { display: flex; align-items: center; gap: 8px; }
.matches-nav-btn { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; min-width: 40px; border-radius: 12px; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); color: var(--sf2-color-text); flex-shrink: 0; text-decoration: none; }
.matches-nav-btn:hover { background: var(--sf2-overlay-hover); color: var(--sf2-color-text); }
.matches-date-pill { padding: 0 20px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); color: var(--sf2-color-text); font-weight: 600; font-size: 14px; white-space: nowrap; }
.matches-live-btn { display: flex; align-items: center; justify-content: center; height: 40px; padding: 0 18px; border-radius: 12px; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); color: var(--sf2-color-text-secondary); font-weight: 700; font-size: 13px; letter-spacing: .5px; text-decoration: none; }
.matches-live-btn:hover { color: var(--sf2-color-text); }
.matches-live-btn.active { background: var(--sf2-gradient-primary); border-color: transparent; color: #fff; }
.matches-all-link { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px; border-radius: 12px; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); color: var(--sf2-color-text); font-weight: 600; font-size: 14px; text-decoration: none; white-space: nowrap; }
.matches-all-link:hover { color: var(--sf2-color-links); }
.matches-search { position: relative; margin-bottom: 15px; }
.matches-search__input { width: 100%; box-sizing: border-box; height: 44px; border-radius: var(--sf2-border-radius); background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); padding: 0 44px 0 16px; font-size: 14px; color: var(--sf2-color-text); font-family: inherit; }
.matches-search__input::placeholder { color: var(--sf2-color-text-secondary); }
.matches-search__input:focus { outline: none; border-color: var(--sf2-color-links); }
.matches-search__icon { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--sf2-color-text-secondary); pointer-events: none; display: flex; }
@media (max-width: 640px) {
    .matches-toolbar { flex-direction: column; align-items: stretch; }
    .matches-toolbar__nav { justify-content: space-between; }
    .matches-date-pill { flex: 1; }
    .matches-all-link { justify-content: center; }
}

.theme-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 50%;
    background: var(--sf2-card-bg);
    border: 1px solid var(--sf2-card-border);
    color: var(--sf2-color-text);
    cursor: pointer;
    padding: 0;
}
.theme-toggle:hover { background: var(--sf2-overlay-hover); }
.theme-toggle__icon--sun { display: none; }
[data-theme="dark"] .theme-toggle__icon--sun { display: flex; }
[data-theme="dark"] .theme-toggle__icon--moon { display: none; }

.filters__table {
    background: var(--sf2-card-bg);
    border: 1px solid var(--sf2-card-border);
    backdrop-filter: blur(10px);
    border-radius: var(--sf2-border-radius);
    overflow: hidden;
    padding: 5px 20px;
}
.filters__table .filter {
    padding: 15px 0;
    border-bottom: 1px dashed var(--sf2-color-border-dashed);
}
.filters__table .filter:last-child { border-bottom: none; }
.filter-name { font-weight: 500; font-size: 14px; color: var(--sf2-color-text); margin-bottom: 8px; }
.filter.singlebox .filter-value {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
}
.singlebox-item {
    background: var(--sf2-input-bg);
    border: 1px solid var(--sf2-card-border);
    border-radius: 10px;
    min-width: 45px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
    font-weight: 500;
    font-size: 14px;
    line-height: 150%;
    color: var(--sf2-color-text);
    cursor: pointer;
    grid-gap: 5px;
}
.singlebox-item.selected, .singlebox-item.checked {
    background: rgba(255, 77, 77, .2);
    color: #FF4D4D;
    border-color: rgba(255, 77, 77, .3);
}
.filter-value select,
.filter-value input[type="text"],
.filter-value input[type="number"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    border: 1px solid var(--sf2-card-border);
    outline: none;
    font-size: 14px;
    padding: 0 20px;
    min-height: 40px;
    border-radius: 10px;
    background: var(--sf2-input-bg);
    font-weight: 400;
    color: var(--sf2-color-text);
    box-sizing: border-box;
}

.sf-card {
    background: var(--sf2-card-bg);
    border: 1px solid var(--sf2-card-border);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: var(--sf2-border-radius);
    padding: 15px 20px;
    margin-bottom: 15px;
    transition: .3s;
}
.color1 { color: var(--sf2-color-text-secondary); }
.sf-card p { font-size: 14px; color: var(--sf2-color-text-secondary); line-height: 150%; margin: 0 0 10px; }
.sf-card p:last-child { margin-bottom: 0; }
.sf-card ul { margin: 0; padding-left: 20px; }
.sf-card li { font-size: 14px; color: var(--sf2-color-text-secondary); line-height: 160%; margin-bottom: 8px; }
.sf-card li:last-child { margin-bottom: 0; }

.sf-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    grid-gap: 10px;
    margin-bottom: 15px;
}
.sf-card__header + .sf-card__header { margin-top: -5px; padding-top: 15px; border-top: 1px dashed var(--sf2-color-border-dashed); }
.sf-card__title { font-weight: 600; font-size: 18px; color: var(--sf2-color-text); margin: 0; }

/* Таблица/список, вложенные в .sf-card — не дублируем рамку и фон карточки */
.sf-card .sc-table { background: none; border: none; backdrop-filter: none; padding: 0; border-radius: 0; }

.months-table-scroll {
    max-height: 320px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--sf2-overlay-strong) transparent;
}
.months-table-scroll::-webkit-scrollbar { width: 6px; }
.months-table-scroll::-webkit-scrollbar-track { background: transparent; }
.months-table-scroll::-webkit-scrollbar-thumb { background: var(--sf2-overlay-strong); border-radius: 10px; }
.months-table-scroll::-webkit-scrollbar-thumb:hover { background: var(--sf2-overlay-hover); }
.months-table-scroll thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--sf2-surface-elevated);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: var(--sf2-color-text-muted);
    border-bottom: 1px solid var(--sf2-divider);
}
.sf-card__header select { max-width: 260px; }
.sf-card__header .select2-container { max-width: 260px; }
.select2-container .select2-selection--single {
    height: 40px;
    border-radius: var(--sf2-border-radius-sm);
    border: 1px solid var(--sf2-card-border) !important;
    background: var(--sf2-input-bg) !important;
}
.select2-container .select2-selection--single .select2-selection__rendered { line-height: 40px; padding-left: 15px; color: var(--sf2-color-text) !important; }
.select2-container .select2-selection--single .select2-selection__arrow { height: 38px; }
.select2-dropdown {
    background: var(--sf2-surface-elevated) !important;
    border: 1px solid var(--sf2-card-border) !important;
    color: var(--sf2-color-text);
}
.select2-search--dropdown .select2-search__field {
    background: var(--sf2-input-bg);
    border: 1px solid var(--sf2-card-border);
    color: var(--sf2-color-text);
}
.select2-results__option { color: var(--sf2-color-text-secondary); }
.select2-results__option--highlighted[aria-selected] {
    background: rgba(255, 77, 77, .2) !important;
    color: #FF4D4D !important;
}
.select2-results__option[aria-selected="true"] { background: var(--sf2-input-bg); color: var(--sf2-color-text); }

.profile-card {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    grid-gap: 20px;
    background: var(--sf2-card-bg);
    border: 1px solid var(--sf2-card-border);
    backdrop-filter: blur(10px);
    border-radius: var(--sf2-border-radius);
    padding: 20px;
    margin-bottom: 15px;
}
.profile-card__logo img { width: 64px; height: 64px; }
.profile-card__text { flex: 1 1 320px; }
.profile-card__text h1 { font-size: 20px; font-weight: 600; margin: 0 0 8px; color: var(--sf2-color-text); line-height: 130%; }
.profile-card__text p { font-size: 14px; color: var(--sf2-color-text-secondary); line-height: 150%; margin: 0; }
.profile-card__links { display: flex; flex-wrap: wrap; grid-gap: 12px; }
.profile-card__link {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-width: 90px;
    min-height: 64px;
    border-radius: var(--sf2-border-radius-sm);
    padding: 8px 14px;
    background: var(--sf2-gradient-primary);
}
.profile-card__link a { color: #fff; font-weight: 600; font-size: 13px; text-decoration: none; line-height: 140%; }

.profile-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    grid-gap: 15px;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px dashed var(--sf2-color-border-dashed);
}
.profile-card__user { display: flex; align-items: center; grid-gap: 10px; font-weight: 500; color: var(--sf2-color-text); }
.profile-card__user img { width: 48px; height: 48px; border-radius: 50%; }
/* KPI-полоса личного кабинета — единая строка с тонкими разделителями вместо отдельных
   плиток (те "плыли" на широких карточках, см. .stats-hero/.hero-stat-card ниже — тот
   паттерн остаётся для страницы рассылки verifierList.html, здесь используется новый). */
.kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); padding: 4px 4px 0; }
.kpi-item { padding: 0 20px; position: relative; display: flex; flex-direction: column; justify-content: center; gap: 4px; }
.kpi-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 60%;
    width: 1px;
    background: var(--sf2-card-border);
}
.kpi-label { font-size: 12px; font-weight: 500; color: var(--sf2-color-text-secondary); text-transform: uppercase; letter-spacing: .5px; }
.kpi-value { font-size: 26px; font-weight: 700; color: var(--sf2-color-text); }
.kpi-value--sm { font-size: 22px; }
.kpi-value--negative { color: var(--sf2-color-danger); }
.kpi-sub { font-size: 12px; color: var(--sf2-color-text-secondary); }
.kpi-sub--pos { color: var(--sf2-color-success); }
.kpi-sub--neg { color: var(--sf2-color-danger); }
.kpi-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
@media (max-width: 992px) {
    .kpi-grid { grid-template-columns: repeat(2, 1fr); gap: 16px 0; }
    .kpi-item:not(:last-child)::after { display: none; }
    .kpi-item { padding: 0 12px 12px; border-bottom: 1px solid var(--sf2-card-border); }
    .kpi-item:nth-last-child(-n+2) { border-bottom: none; padding-bottom: 0; }
}
@media (max-width: 480px) {
    .kpi-grid { grid-template-columns: 1fr; }
    .kpi-item:nth-last-child(-n+2) { border-bottom: 1px solid var(--sf2-card-border); padding-bottom: 12px; }
    .kpi-item:last-child { border-bottom: none; padding-bottom: 0; }
}

.verifier-list-subscribe-btn {
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: var(--sf2-gradient-primary);
    border: none;
    border-radius: var(--sf2-border-radius-sm);
    padding: 6px 12px;
    cursor: pointer;
}
.verifier-list-subscribe-btn:hover { opacity: .9; }
.verifier-list-subscribe-btn[data-subscribed="1"] { background: var(--sf2-overlay-strong); }

/* Дашборд-плитки статистики (профиль прогнозиста, "как в мобильном приложении") */
.stats-hero { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; margin-bottom: 15px; }
.hero-stat-card {
    background: var(--sf2-card-bg);
    border: 1px solid var(--sf2-card-border);
    border-radius: var(--sf2-border-radius);
    backdrop-filter: blur(10px);
    padding: 20px;
    transition: .3s;
}
.hero-stat-card:hover { transform: translateY(-4px); box-shadow: var(--sf2-shadow-glass); }
.hero-stat-card .label { font-size: 13px; color: var(--sf2-color-text-secondary); margin-bottom: 6px; text-transform: uppercase; letter-spacing: .5px; }
.hero-stat-card .number { font-size: 26px; font-weight: 700; margin-bottom: 4px; color: var(--sf2-color-text); }
.hero-stat-card .trend { font-size: 12px; font-weight: 600; }
.hero-stat-card .trend.up { color: var(--sf2-color-success); }
.hero-stat-card .trend.down { color: var(--sf2-color-danger); }

.pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 50px;
    padding: 4px 10px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 13px;
    color: var(--sf2-color-text);
    background: var(--sf2-overlay-strong);
    border: 1px solid var(--sf2-card-border);
    white-space: nowrap;
}
.pill--pos { background: rgba(16, 185, 129, .15); color: var(--sf2-color-success); border-color: rgba(16, 185, 129, .3); }
.pill--neg { background: rgba(239, 68, 68, .15); color: var(--sf2-color-danger); border-color: rgba(239, 68, 68, .3); }
.pill--warn, .pill--pend { background: rgba(245, 158, 11, .15); color: var(--sf2-color-warning); border-color: rgba(245, 158, 11, .3); }
.pill--accent { background: var(--sf2-gradient-primary); color: #fff; border: none; }
.pill--half-pos { background: rgba(16, 185, 129, .15); color: var(--sf2-color-success); border: 1px dashed rgba(16, 185, 129, .5); }
.pill--half-neg { background: rgba(239, 68, 68, .15); color: var(--sf2-color-danger); border: 1px dashed rgba(239, 68, 68, .5); }
.indicator-card > .pill { align-self: flex-start; }

.sc-table { width: 100%; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); backdrop-filter: blur(10px); border-radius: var(--sf2-border-radius); padding: 15px; overflow-x: auto; box-sizing: border-box; }
.sc-table table { width: 100%; border-collapse: collapse; font-size: 14px; }
.sc-table thead th { font-weight: 500; font-size: 13px; color: var(--sf2-color-text-secondary); text-align: center; padding: 0 10px 12px; border: none; border-bottom: 1px solid var(--sf2-card-border); white-space: nowrap; }
.sc-table tbody tr { background: transparent; border-bottom: 1px solid var(--sf2-divider); }
.sc-table tbody tr:last-child { border-bottom: none; }
.sc-table tbody td { padding: 14px 10px; text-align: center; border: none; vertical-align: middle; }
.sc-table tbody tr:hover { background: var(--sf2-overlay-subtle); }
.sc-table a { color: var(--sf2-color-text); text-decoration: underline; }
.sc-table a:hover { color: var(--sf2-color-links); }

.sc-empty { text-align: center; padding: 40px 20px; color: var(--sf2-color-text-secondary); font-size: 14px; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); backdrop-filter: blur(10px); border-radius: var(--sf2-border-radius); }

.page-hero { background: var(--sf2-gradient-primary); color: #fff; border-radius: var(--sf2-border-radius); padding: 32px 28px; margin-bottom: 15px; }
.page-hero__title { margin: 0 0 10px; font-size: 26px; font-weight: 700; letter-spacing: -.5px; }
.page-hero__text { margin: 0; font-size: 14px; line-height: 150%; color: rgba(255, 255, 255, .9); max-width: 640px; }
@media (max-width: 600px) { .page-hero { padding: 24px 20px; } .page-hero__title { font-size: 22px; } }

/* Баннер с загруженной картинкой: затемняющая подложка обязательна — иначе
   белый текст читается только на удачно подобранных фотографиях */
.page-hero--image { position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; }
.page-hero--image::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(90deg, rgba(0, 0, 0, .65) 0%, rgba(0, 0, 0, .35) 100%); }
.page-hero__body { position: relative; }

.promo-row { display: flex; flex-wrap: wrap; grid-gap: 15px; margin-bottom: 15px; }
.promo-card {
    flex: 1 1 260px;
    background: var(--sf2-gradient-primary);
    color: #fff;
    border-radius: var(--sf2-border-radius);
    padding: 20px;
    text-align: center;
}
.promo-card h4 { margin: 0 0 10px; font-size: 16px; font-weight: 600; }
.promo-card p { font-size: 13px; margin: 0 0 15px; color: rgba(255, 255, 255, .85); }
.promo-card a { display: inline-block; color: #fff; font-weight: 600; font-size: 13px; text-decoration: underline; }

/* Промо-блок с загруженной картинкой: затемняющая подложка обязательна —
   иначе белый текст читается только на удачно подобранных фотографиях */
.promo-card--image { position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; }
.promo-card--image::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(180deg, rgba(0, 0, 0, .35) 0%, rgba(0, 0, 0, .7) 100%); }
.promo-card__body { position: relative; }

.top-events-layout { display: flex; gap: 15px; align-items: stretch; margin-bottom: 15px; }
.top-events-layout > .sf-card {
    flex: 2 1 0;
    min-width: 0;
    margin-bottom: 0;
    max-height: 420px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--sf2-overlay-strong) transparent;
}
.top-events-layout > .sf-card::-webkit-scrollbar { width: 6px; }
.top-events-layout > .sf-card::-webkit-scrollbar-track { background: transparent; }
.top-events-layout > .sf-card::-webkit-scrollbar-thumb { background: var(--sf2-overlay-strong); border-radius: 10px; }
.top-events-layout > .sf-card::-webkit-scrollbar-thumb:hover { background: var(--sf2-overlay-hover); }
.top-events-layout > .promo-card { flex: 1 1 0; min-width: 0; text-align: left; display: flex; flex-direction: column; justify-content: center; }
@media (max-width: 900px) { .top-events-layout { flex-direction: column; } .top-events-layout > .sf-card { max-height: 360px; } }

.rating-cols { display: flex; flex-wrap: wrap; grid-gap: 15px; }
.rating-col { flex: 1 1 320px; }
.rating-row { display: flex; align-items: center; grid-gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--sf2-divider); }
.rating-row:last-child { border-bottom: none; }
.rating-row img { width: 40px; height: 40px; border-radius: 50%; }
.rating-row__info { flex: 1; display: flex; justify-content: space-between; align-items: center; grid-gap: 10px; font-size: 13px; color: var(--sf2-color-text-secondary); }
.rating-row__info span { display: block; color: var(--sf2-color-text); font-weight: 500; }
.rating-rank {
    width: 30px;
    height: 30px;
    min-width: 30px;
    background: var(--sf2-overlay-soft);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    color: var(--sf2-color-text-secondary);
}
.rating-rank--gold { background: #FCD34D; color: #0B0E14; box-shadow: 0 0 15px rgba(252, 211, 77, .3); }
.rating-rank--silver { background: #E2E8F0; color: #0B0E14; }
.rating-rank--bronze { background: #D97706; color: #fff; }

/* Строка рейтинга прогнозиста — отдельная от .rating-row (та ещё используется "Топ лиг"),
   т.к. тут нужен фиксированный неразрывный блок статистики справа, а не свободный space-between. */
.forecaster-row { display: flex; align-items: center; flex-wrap: wrap; grid-gap: 10px 16px; padding: 16px 0; border-bottom: 1px solid var(--sf2-divider); }
.forecaster-row:last-child { border-bottom: none; }
.forecaster-row__avatar { width: 40px; height: 40px; min-width: 40px; border-radius: 50%; }
.forecaster-row__info { flex: 1 1 140px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.forecaster-row__name { color: var(--sf2-color-text); font-weight: 600; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.forecaster-row__list { font-size: 12px; color: var(--sf2-color-text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.forecaster-row__stats { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--sf2-color-text-secondary); white-space: nowrap; margin-left: auto; }

.stat-panels { display: flex; flex-wrap: wrap; grid-gap: 15px; margin-bottom: 15px; align-items: stretch; }
.stat-panel { flex: 1 1 300px; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); backdrop-filter: blur(10px); border-radius: var(--sf2-border-radius); padding: 15px; }
.stat-panel__title { display: flex; align-items: center; justify-content: space-between; grid-gap: 10px; font-size: 14px; color: var(--sf2-color-text-secondary); margin-bottom: 15px; }
.stat-panel__title img { width: 18px; height: 18px; }
.stat-cards { display: flex; flex-wrap: wrap; grid-gap: 10px; }
.stat-card { flex: 1 1 45%; border: 1px solid var(--sf2-card-border); border-radius: var(--sf2-border-radius-sm); padding: 12px; font-size: 12px; color: var(--sf2-color-text-secondary); }
.stat-card__label { display: flex; align-items: center; justify-content: space-between; grid-gap: 8px; margin-bottom: 8px; }
.stat-card__label img { width: 16px; height: 16px; }
.stat-panel__chart-header { display: flex; align-items: center; grid-gap: 10px; margin-bottom: 15px; font-size: 14px; color: var(--sf2-color-text-secondary); }

/* "Показатели за" — индикаторы + график прогнозов рядом, как единый блок (личный кабинет) */
.analytics-grid { display: grid; grid-template-columns: 1.2fr 1.2fr; gap: 20px; }
.indicators-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; height: 100%; }
.indicator-card { background: var(--sf2-overlay-subtle); border: 1px solid var(--sf2-card-border); border-radius: var(--sf2-border-radius-sm); padding: 14px; display: flex; flex-direction: column; justify-content: space-between; gap: 8px; }
.indicator-top { display: flex; align-items: center; justify-content: space-between; grid-gap: 8px; font-size: 13px; color: var(--sf2-color-text-secondary); font-weight: 500; }
.indicator-top img { width: 16px; height: 16px; }
.indicator-sub { font-size: 12px; color: var(--sf2-color-text-secondary); margin-top: 2px; }
.chart-card { display: flex; flex-direction: column; }
.chart-header { display: flex; align-items: center; grid-gap: 10px; margin-bottom: 12px; font-size: 14px; color: var(--sf2-color-text-secondary); font-weight: 500; }
.link-predictions-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    padding: 8px 18px 8px 14px;
    background: rgba(56, 189, 248, .1);
    border: 1px solid rgba(56, 189, 248, .25);
    border-radius: 20px;
    color: var(--sf2-color-info);
    font-weight: 500;
    font-size: 13px;
    transition: all .3s cubic-bezier(.4, 0, .2, 1);
    width: fit-content;
}
.link-predictions-btn:hover { background: rgba(56, 189, 248, .18); border-color: rgba(56, 189, 248, .4); box-shadow: 0 0 20px rgba(56, 189, 248, .12); transform: translateX(4px); color: var(--sf2-color-info); }
.link-predictions-btn svg { width: 16px; height: 16px; }
@media (max-width: 900px) { .analytics-grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .indicators-grid { grid-template-columns: 1fr; } }

.bets-tabs { display: flex; grid-gap: 10px; margin-bottom: 15px; }
.bets-tab {
    padding: 10px 20px;
    border-radius: var(--sf2-border-radius-sm);
    font-weight: 600;
    font-size: 14px;
    background: var(--sf2-card-bg);
    border: 1px solid var(--sf2-card-border);
    color: var(--sf2-color-text-secondary);
    cursor: pointer;
}
.bets-tab.selected { background: var(--sf2-gradient-primary); border-color: transparent; color: #fff; }

.b-rates-rate { cursor: pointer; }
.b-rates-rate:hover .pill { opacity: .8; }

.event-card { display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; grid-gap: 20px; text-align: center; }
.event-card__team { display: flex; flex-direction: column; align-items: center; width: 180px; grid-gap: 10px; }
.event-card__team img { width: 72px; height: 72px; border-radius: 50%; background: var(--sf2-input-bg); padding: 10px; box-sizing: border-box; }
.event-card__team-name { font-weight: 600; font-size: 14px; }
.event-card__team-name a { color: var(--sf2-color-text); }
.event-card__info { display: flex; flex-direction: column; align-items: center; grid-gap: 6px; font-size: 13px; color: var(--sf2-color-text-secondary); min-width: 160px; }
.event-card__score { font-size: 18px; font-weight: 700; color: var(--sf2-color-text); background: var(--sf2-inset-bg); border: 1px solid var(--sf2-card-border); border-radius: var(--sf2-border-radius-sm); padding: 4px 12px; min-width: 60px; }
.event-card__start-time { text-align: center; margin-bottom: 15px; color: var(--sf2-color-text-secondary); font-size: 13px; }

.forecast-cards { display: flex; flex-wrap: wrap; grid-gap: 15px; margin-bottom: 15px; }
.forecast-card { flex: 1 1 280px; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); backdrop-filter: blur(10px); border-radius: var(--sf2-border-radius); padding: 15px; font-size: 13px; transition: .3s; }
.forecast-card:hover { box-shadow: var(--sf2-shadow-glass); }
.forecast-card__teams { display: flex; grid-gap: 4px; margin-bottom: 10px; }
.forecast-card__teams img { width: 24px; height: 24px; border-radius: 50%; }
.forecast-card__meta { display: flex; flex-direction: column; font-size: 12px; color: var(--sf2-color-text-secondary); margin-bottom: 10px; }
.forecast-card__title { font-weight: 600; color: var(--sf2-color-text); margin-bottom: 10px; }
.forecast-card__market { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; grid-gap: 10px; }
.forecast-card__date { font-size: 12px; color: var(--sf2-color-text-secondary); margin-bottom: 8px; }
.forecast-card__desc {
    color: var(--sf2-color-text-secondary);
    margin-bottom: 10px;
    height: 50px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.forecast-card__user { display: flex; align-items: center; grid-gap: 8px; font-weight: 500; color: var(--sf2-color-text); }
.forecast-card__user img { width: 24px; height: 24px; border-radius: 50%; }

/* Строка матча (главная, "как в мобильном приложении") — grid, а не flex, чтобы шапка
   .match-item-header гарантированно совпадала по колонкам со строками данных (у flex с
   разнородными фиксированными/гибкими ячейками ширины "плывут" в узких карточках). */
.match-item { display: grid; grid-template-columns: minmax(0, 1fr) 116px 172px 100px; align-items: center; gap: 15px; padding: 16px 0; border-bottom: 1px solid var(--sf2-divider); text-decoration: none; }
.match-item:last-child { border-bottom: none; }
.match-item--counted { grid-template-columns: minmax(0, 1fr) 116px 172px 50px 100px; }

.match-item-header { display: grid; grid-template-columns: minmax(0, 1fr) 116px 172px 50px 100px; align-items: center; gap: 15px; padding: 0 0 10px; margin-bottom: 4px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; color: var(--sf2-color-text-muted); border-bottom: 1px solid var(--sf2-divider); }
.match-item-header span:not(:first-child) { text-align: center; }
a.match-item:hover { background: var(--sf2-overlay-subtle); }
.match-teams { font-weight: 600; display: flex; flex-direction: column; gap: 2px; color: var(--sf2-color-text); min-width: 0; }
.match-teams span { font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.match-teams span.away { color: var(--sf2-color-text-secondary); font-weight: 400; }
a.match-teams:hover { color: var(--sf2-color-links); }
/* Колонка фиксированной ширины: без min-width:0 и переноса длинное название
   лиги («Португалия.Премьер Лига» — одно неразрывное слово из-за точки без
   пробела) вылезает из своей ячейки поверх коэффициентов. */
.match-league { display: block; font-size: 12px; line-height: 1.3; color: var(--sf2-color-text-muted); overflow-wrap: anywhere; }
.match-datetime { min-width: 0; text-align: center; }
.match-time { font-size: 13px; color: var(--sf2-color-text-secondary); text-align: center; white-space: nowrap; }
.match-odds { display: flex; gap: 8px; justify-content: center; }
.match-item__count { text-align: center; justify-self: center; }
.match-item__action { text-align: center; }
.odds-box { background: var(--sf2-overlay-soft); border: 1px solid var(--sf2-card-border); padding: 4px 12px; border-radius: var(--sf2-border-radius-sm); font-weight: 600; font-size: 13px; min-width: 40px; text-align: center; color: var(--sf2-color-text); }
a.match-item:hover .odds-box { background: rgba(255, 77, 77, .2); color: #FF4D4D; border-color: rgba(255, 77, 77, .3); }

.wa-form { background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); backdrop-filter: blur(10px); border-radius: var(--sf2-border-radius); padding: 20px; }
.wa-form .wa-field { margin-bottom: 15px; }
.wa-form .wa-field .wa-name { font-weight: 500; font-size: 14px; color: var(--sf2-color-text); margin-bottom: 8px; }
.wa-form .wa-field .wa-value .hint { font-size: 13px; color: var(--sf2-color-text-secondary); margin-top: 4px; }
.wa-form .wa-field .wa-value .hint:empty { display: none; }
.wa-form input[type="text"],
.wa-form input[type="email"],
.wa-form input[type="password"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    border: 1px solid var(--sf2-card-border);
    outline: none;
    font-size: 14px;
    padding: 0 15px;
    min-height: 40px;
    border-radius: 10px;
    background: var(--sf2-input-bg);
    font-weight: 400;
    color: var(--sf2-color-text);
    box-sizing: border-box;
}
.wa-form .form-message { padding: 10px 15px; border-radius: 10px; background: var(--sf2-input-bg); margin-bottom: 15px; font-size: 13px; color: var(--sf2-color-text-secondary); }
.wa-form input[type="submit"] {
    border-radius: 10px;
    background: var(--sf2-gradient-primary);
    border: none;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    padding: 10px 20px;
    cursor: pointer;
    min-height: 40px;
}
.wa-form input[type="submit"]:hover { opacity: .9; }

.form-card { background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); backdrop-filter: blur(10px); border-radius: var(--sf2-border-radius); padding: 20px; display: flex; flex-direction: column; grid-gap: 15px; }
.form-card label { font-weight: 500; font-size: 14px; color: var(--sf2-color-text); display: block; margin-bottom: 6px; }
.form-card select,
.form-card input[type="text"],
.form-card input[type="number"],
.form-card input[type="date"],
.form-card input[type="datetime-local"],
.form-card textarea {
    width: 100%;
    border: 1px solid var(--sf2-card-border);
    outline: none;
    font-size: 14px;
    padding: 0 15px;
    min-height: 40px;
    border-radius: 10px;
    background: var(--sf2-input-bg);
    font-weight: 400;
    color: var(--sf2-color-text);
    box-sizing: border-box;
    font-family: inherit;
}
.form-card textarea { padding: 10px 15px; min-height: 90px; resize: vertical; }
.form-card .form-message { font-size: 13px; color: var(--sf2-color-text-secondary); }
.form-summary { background: var(--sf2-input-bg); border: 1px solid var(--sf2-card-border); border-radius: 10px; padding: 12px 15px; font-size: 14px; color: var(--sf2-color-text); }
.form-checkbox { display: flex; align-items: center; grid-gap: 8px; }
.form-checkbox label { margin: 0; color: var(--sf2-color-text); }
.form-checkbox input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--sf2-color-success); cursor: pointer; }
.form-card input[type="submit"] {
    align-self: flex-start;
    border-radius: 10px;
    background: var(--sf2-gradient-primary);
    border: none;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    padding: 10px 20px;
    cursor: pointer;
    min-height: 40px;
}
.form-card input[type="submit"]:hover { opacity: .9; }

.modal-body .wa-form { background: none; border: none; padding: 0; }
.field-error { font-size: 12px; color: var(--sf2-color-danger); margin-top: 4px; }

.system-error { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; grid-gap: 10px; padding: 40px 20px; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); backdrop-filter: blur(10px); border-radius: var(--sf2-border-radius); margin-bottom: 15px; color: var(--sf2-color-text-secondary); }
.system-error-icon { width: 50px; height: 50px; background: url('../icons/favicon120.svg') center/contain no-repeat; opacity: .5; }
.system-error-text { font-size: 14px; }
.system-error-link { text-align: center; margin-top: 10px; }

.b-form-message, .b-manually-form-message { display: inline-block; padding: 10px 15px; border-radius: 10px; background: var(--sf2-input-bg); font-size: 13px; color: var(--sf2-color-text-secondary); }
.b-amount, .b-manually-amount { display: flex; flex-direction: column; grid-gap: 10px; }
.b-form > div:not(:last-child), .b-manually-form > div:not(:last-child) { padding-bottom: 15px; border-bottom: 1px dashed var(--sf2-color-border-dashed); }
.b-manually-form > span { display: block; font-size: 13px; color: var(--sf2-color-text-secondary); text-align: center; margin: -5px 0; }

.s-table-league-header { display: flex; align-items: center; justify-content: space-between; padding: 10px 15px; font-weight: 600; font-size: 14px; color: var(--sf2-color-text); background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); border-bottom: none; border-radius: var(--sf2-border-radius) var(--sf2-border-radius) 0 0; }
.s-table-league-header + table { width: 100%; background: var(--sf2-card-bg); border: 1px solid var(--sf2-card-border); border-radius: 0 0 var(--sf2-border-radius) var(--sf2-border-radius); margin-bottom: 15px; border-collapse: collapse; }
.mt-col-icon { width: 20px; }
.mt-col-time { width: 40px; }
.mt-col-state { width: 120px; }
.mt-col-min { width: 50px; }
.mt-state-pill { padding: 0 5px; border-radius: 5px; }
.mt-col-referee { text-align: right; }

.stat-card__delta { margin-top: 8px; font-size: 12px; color: var(--sf2-color-text-secondary); }

/* ===== Компоненты дизайн-системы sf2 (перенесено ранее, теперь в тёмной glass-палитре) ===== */

/* Loader / спиннер */
.loader__wrapper { display: flex; justify-content: center; align-items: center; }
.loader {
    width: 48px;
    height: 48px;
    border: 2px solid var(--sf2-ring);
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}
.loader.loader__min { width: 15px; height: 15px; }
@keyframes rotation {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Тултип */
.js-tooltip {
    width: fit-content;
    max-width: 250px;
    background: var(--sf2-surface-elevated);
    border: 1px solid var(--sf2-card-border);
    box-shadow: var(--sf2-tooltip-shadow);
    border-radius: var(--sf2-border-radius);
    color: var(--sf2-color-text);
    font-size: 12px;
    padding: 5px 10px;
    text-align: justify;
    opacity: 0;
    transition: opacity .3s;
}

/* Пагинация */
.pagination { display: flex; gap: 5px; margin: 25px auto; justify-content: center; }
.pagination a, .pagination div { padding: 8px 16px; border-radius: var(--sf2-border-radius); color: var(--sf2-color-text-secondary); }
.pagination a:not(.active) { transition: background-color .3s; }
.pagination a:not(.active):hover { background-color: var(--sf2-input-bg); }
.pagination a.active { color: #fff; background: var(--sf2-gradient-primary); }

/* Карточка матча/ставки (event-block) — базовый паттерн sf2 для списков прогнозов */
.event-block {
    background-color: var(--sf2-card-bg);
    border: 1px solid var(--sf2-card-border);
    backdrop-filter: blur(10px);
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: var(--sf2-border-radius);
    padding: 10px 15px;
    grid-gap: 3px;
}
.event-row-1, .event-row-2 { display: flex; flex-direction: row; align-items: center; }
.event-row-1 { grid-gap: 20px; }
.event-date { font-weight: 400; font-size: 12px; line-height: 1; color: var(--sf2-color-text); }
.event-status {
    min-width: 102px;
    font-weight: 400;
    font-size: 14px;
    line-height: 1;
    text-align: center;
    color: var(--sf2-color-success);
    background: rgba(16, 185, 129, .15);
    border: 1px solid rgba(16, 185, 129, .3);
    padding: 0 9px;
    height: 21px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--sf2-border-radius-sm);
    margin-left: auto;
}
.event-status__c-b { background: var(--sf2-overlay-strong); color: var(--sf2-color-text-secondary); border-color: var(--sf2-card-border); }
.event-score {
    margin-left: auto;
    align-items: center;
    grid-gap: 2px;
    min-width: 102px;
    display: grid;
    grid-template-columns: 1fr 5px 1fr;
    margin-bottom: auto;
}
.event-score-localteam, .event-score-visitorteam {
    font-weight: 600;
    font-size: 14px;
    line-height: 1;
    text-align: center;
    color: var(--sf2-color-text);
    background: var(--sf2-inset-bg);
    border: 1px solid var(--sf2-card-border);
    width: 100%;
    height: 21px;
    border-radius: var(--sf2-border-radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
}
.event-score-localteam.event-score_g, .event-score-visitorteam.event-score_g { background: rgba(16, 185, 129, .15); color: var(--sf2-color-success); border-color: rgba(16, 185, 129, .3); }

/* Раскрывающийся список с деталями (лига/событие) */
.lg { width: 100%; display: flex; flex-flow: column; border-radius: var(--sf2-border-radius); overflow: hidden; border: 1px solid var(--sf2-card-border); background: var(--sf2-card-bg); backdrop-filter: blur(10px); margin-bottom: 15px; }
.lg__h { padding: 6px 9px; width: 100%; height: 36px; display: flex; align-items: center; grid-gap: 15px; background: var(--sf2-overlay-soft); }
.lg__loc { font-weight: 600; font-size: 14px; color: var(--sf2-color-text-muted); }
.lg__name { margin-left: 5px; color: var(--sf2-color-text); text-decoration: underline; }
.lg__name:hover { color: var(--sf2-color-text); }
.lg__lg { margin-left: auto; font-size: 12px; line-height: 125%; color: var(--sf2-color-text-secondary); }
.lg__arrow {
    min-width: 20px; height: 20px; display: flex; justify-content: center; align-items: center;
    background: var(--sf2-overlay-strong); border-radius: 50%; cursor: pointer; transition: transform .3s ease; transform: rotate(90deg);
}
.lg.active .lg__arrow { transform: rotate(0); }
.lg__events { display: none; flex-flow: column; padding: 0 15px; }
.lg.active .lg__events { display: flex; }
.lg__events .match-item:last-child { border-bottom: none; }
.lg__block { background: var(--sf2-card-bg); width: 100%; }
.lg__block:has(+ .lg__block) { border-bottom: 1px dashed var(--sf2-color-border-dashed); }
.lg__block_h { padding: 6px 10px; display: grid; grid-template-columns: 40px 110px 1fr 250px 20px; align-items: center; grid-gap: 15px; background: transparent; }
.lg__block:hover .lg__block_h { background-color: rgba(255, 186, 51, .08); }
.lg__datetime { font-weight: 600; font-size: 14px; color: var(--sf2-color-text); white-space: nowrap; }
.lg__date { font-weight: 400; color: var(--sf2-color-text-muted); }
.lg__status { height: 20px; display: flex; justify-content: center; align-items: center; font-weight: 400; font-size: 12px; text-align: center; color: var(--sf2-color-text); border-radius: var(--sf2-border-radius-sm); }
.lg__status-live { font-weight: 600; color: #FF4D4D; height: 20px; display: flex; justify-content: center; align-items: center; font-size: 12px; text-align: center; }
.lg__status-live span { animation: blink 3s step-end infinite; }
@keyframes blink { 0%, 85% { visibility: visible; } 85.1%, 100% { visibility: hidden; } }
.lg__cnt { display: grid; grid-template-columns: 1fr 74px 1fr; grid-gap: 10px; align-items: center; }
.lg__team { font-weight: 600; font-size: 14px; line-height: 143%; text-align: right; color: var(--sf2-color-text); }
.lg__block:hover .lg__team { color: var(--sf2-color-links); }
.lg__scores + .lg__team { text-align: left; }
.lg__scores { display: grid; grid-template-columns: 1fr 14px 1fr; justify-content: center; align-items: center; font-weight: 600; font-size: 14px; line-height: 150%; text-align: center; color: var(--sf2-color-text); }
.lg__score { width: 30px; height: 24px; min-height: 24px; display: flex; justify-content: center; align-items: center; font-weight: 600; font-size: 14px; text-align: center; color: var(--sf2-color-text); border-radius: var(--sf2-border-radius-sm); background: var(--sf2-overlay-strong); line-height: 1; }
.lg__score_g { background: rgba(16, 185, 129, .2); color: var(--sf2-color-success); }
.lg__score_b { background: var(--sf2-overlay-strong); }

/* Кнопка отправки формы с shine-анимацией и disabled-состоянием (fSend уже проставляет [disabled]) */
.submit-btn {
    width: 100%;
    border-radius: 10px;
    background: var(--sf2-gradient-primary);
    border: none;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    color: #fff;
    padding: 10px 14px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    background-size: 200% 100%;
    background-position: 0% 0%;
    transition: .2s background;
}
.submit-btn:after {
    background: #fff;
    content: "";
    height: 170px;
    left: -180px;
    opacity: .1;
    position: absolute;
    top: -65px;
    transform: rotate(35deg);
    transition: all 550ms cubic-bezier(.19, 1, .22, 1);
    width: 150px;
    pointer-events: none;
}
.submit-btn:hover { background-position: 50% 0%; }
.submit-btn:hover:after { left: 130%; transition: all 1.2s cubic-bezier(.19, 1, .22, 1); }
.submit-btn:active { background-position: 100% 0%; }
.submit-btn:disabled { background: var(--sf2-overlay-strong); cursor: default; }
.submit-btn:disabled:after { opacity: 0; }

/* Модалка (доступна для новых попапов; существующие Bootstrap-модалки в этой итерации не мигрируем) */
.pp { max-width: 730px; width: 100%; border-radius: var(--sf2-border-radius); background-color: var(--sf2-surface-elevated); border: 1px solid var(--sf2-card-border); color: var(--sf2-color-text); }
.pp-cpt { padding: 10px 0; border-bottom: 1px solid var(--sf2-card-border); font-size: 1.1em; font-weight: bold; margin: 0 15px; }
.pp-cpt.no-margin { margin-bottom: 0; }
.pp-cnt { padding: 30px 15px; }
.pp-cnt.not-padded { padding: 0; }
.pp-close { float: right; position: absolute; top: 12px; right: 14px; cursor: pointer; color: var(--sf2-color-text-secondary); }
.pp-close svg { width: 24px; height: 24px; }
@media (max-width: 750px) {
    .pp { border-radius: 0; position: absolute; top: 0; left: 0; bottom: 0; padding: 0; width: 100%; overflow: auto; }
    .pp-cnt { padding: 15px; }
}

@media (max-width: 992px) {
    .stats-hero { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
    .stats-hero { grid-template-columns: 1fr; }
}

.hint { font-size: 13px; color: var(--sf2-color-text-secondary); text-decoration: none; }
a.hint:hover { color: var(--sf2-color-links); }

.cab-content__header { margin-bottom: 15px; display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.cab-content__header h1 { font-size: 22px; font-weight: 600; color: var(--sf2-color-text); margin: 0 0 4px; }
.cab-content__header .hint { font-size: 13px; color: var(--sf2-color-text-secondary); }

.content {
    padding-top: 25px;
    padding-bottom: 150px;
}

.icon-btn-delete {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--sf2-border-radius-sm);
    background: transparent;
    color: var(--sf2-color-text-muted);
    cursor: pointer;
}
.icon-btn-delete:hover { background: rgba(239, 68, 68, .15); color: var(--sf2-color-danger); }
.icon-btn-delete svg { pointer-events: none; }

.bet-expand-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: none;
    background: transparent;
    color: var(--sf2-color-text-muted);
    cursor: pointer;
    transition: transform .2s, color .2s;
}
.bet-expand-btn:hover { color: var(--sf2-color-text); }
.bet-expand-btn.active { transform: rotate(90deg); color: var(--sf2-color-text); }
.bet-expand-btn svg { pointer-events: none; }
.bet-detail-row td { background: var(--sf2-overlay-faint); }
.bet-detail { padding: 8px 10px; font-size: 13px; line-height: 150%; color: var(--sf2-color-text-secondary); text-align: left; }
.bet-detail__row { display: flex; flex-wrap: wrap; gap: 4px 8px; }
.bet-detail__row b { color: var(--sf2-color-text); font-weight: 600; }

/* Пилюля прогноза (рынок + коэффициент одной строкой, "как в мобильном приложении") */
.pred-tip { background: var(--sf2-input-bg); border: 1px solid var(--sf2-card-border); padding: 4px 10px; border-radius: var(--sf2-border-radius-sm); font-weight: 500; font-size: 13px; display: inline-block; color: var(--sf2-color-text); white-space: normal; }

/* Компактный счёт матча в таблицах прогнозов */
.score-box { font-weight: 700; font-size: 15px; background: var(--sf2-inset-bg); border: 1px solid var(--sf2-card-border); padding: 3px 10px; border-radius: var(--sf2-border-radius-sm); text-align: center; display: inline-block; min-width: 50px; color: var(--sf2-color-text); }