/* ==========================================================================
   STATIA Nova v2 — dark-navy redesign (Home + Match pages)
   Source of truth: STATIA_new_design/design_handoff_statia_home/
   Loaded after sc-redesign.css. Global chrome (header/footer/ticker/blobs)
   is scoped under body.stn2 (applied unconditionally in index.html) so it
   reskins every page. Page-content layout is scoped under .stn2-home /
   .stn2-match, wrapper classes added only inside home.html / event.html —
   League/Team/Referee pages keep their current look (old sc-redesign draft
   or plain sc.css) untouched.
   ========================================================================== */

/* ---------- 1. Fonts (self-hosted variable fonts) ---------- */
@font-face{
    font-family:'Space Grotesk';
    src:url('fonts/SpaceGrotesk-VariableFont_wght.woff2') format('woff2-variations'), url('fonts/SpaceGrotesk-VariableFont_wght.woff2') format('woff2');
    font-weight:300 700;
    font-style:normal;
    font-display:swap;
}
@font-face{
    font-family:'Inter';
    src:url('fonts/Inter-VariableFont_opsz,wght.woff2') format('woff2-variations'), url('fonts/Inter-VariableFont_opsz,wght.woff2') format('woff2');
    font-weight:100 900;
    font-style:normal;
    font-display:swap;
}

/* ---------- 2. Design tokens ---------- */
body.stn2{
    --stn2-bg: oklch(16% 0.015 260);
    --stn2-card: oklch(21% 0.02 262 / .6);
    --stn2-card-solid: oklch(21% 0.02 262);
    --stn2-card-alt-a: oklch(23% 0.02 262);
    --stn2-card-alt-b: oklch(19% 0.02 262);
    --stn2-border: oklch(100% 0 0 / .08);
    --stn2-border-2: oklch(100% 0 0 / .12);
    --stn2-text: oklch(97% 0.005 260);
    --stn2-text2: oklch(74% 0.01 260);
    --stn2-muted: oklch(62% 0.01 260);
    --stn2-faint: oklch(54% 0.01 260);
    --stn2-accent1: #7C5CFC;
    --stn2-accent2: #2DD4BF;
    --stn2-gradient: linear-gradient(120deg, var(--stn2-accent1), var(--stn2-accent2));
    --stn2-danger: oklch(66% 0.21 25);
    --stn2-danger-fg: oklch(80% 0.18 25);
    --stn2-success: oklch(78% 0.18 150);
    --stn2-success-fg: oklch(84% 0.16 150);
    --stn2-gold: oklch(88% 0.16 85);
    --stn2-gold-bg: oklch(80% 0.16 85 / .16);
    --stn2-gold-line: oklch(80% 0.16 85 / .35);
    --stn2-radius-lg: 20px;
    --stn2-radius-md: 14px;
    --stn2-radius-sm: 10px;
    --stn2-radius-pill: 999px;
    font-family:'Inter',system-ui,sans-serif;
    background:var(--stn2-bg) !important;
    color:var(--stn2-text);
}
html.stn2{ background:var(--stn2-bg); }
body.stn2 .content,
body.stn2 .header,
body.stn2 .footer__wrap{ background:transparent; }
.stn2-display{ font-family:'Space Grotesk',sans-serif; letter-spacing:-.01em; }

@keyframes stn2Drift{ 0%{transform:translate(0,0) scale(1);} 50%{transform:translate(-3%,2%) scale(1.06);} 100%{transform:translate(0,0) scale(1);} }
@keyframes stn2Drift2{ 0%{transform:translate(0,0) scale(1);} 50%{transform:translate(3%,-2%) scale(1.08);} 100%{transform:translate(0,0) scale(1);} }
@keyframes stn2PulseDot{ 0%,100%{opacity:1; box-shadow:0 0 0 0 rgba(255,90,80,.55);} 50%{opacity:.55; box-shadow:0 0 0 6px rgba(255,90,80,0);} }
@keyframes stn2Marquee{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
@keyframes stn2FadeUp{ from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:translateY(0);} }
@media (prefers-reduced-motion: reduce){
    .stn2-blobs > div, .stn2-ticker-track, .stn2-live-dot{ animation:none !important; }
}

/* ---------- 3. Background blobs + ticker (Home/Match only) ---------- */
.stn2-blobs{ position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.stn2-blobs > div{ position:absolute; border-radius:50%; filter:blur(40px); }
.stn2-blobs .b1{ width:900px; height:900px; left:-250px; top:-350px; background:radial-gradient(circle, var(--stn2-accent1) 0 0 / 20%, transparent 65%); background:radial-gradient(circle, color-mix(in oklch, var(--stn2-accent1) 20%, transparent), transparent 65%); animation:stn2Drift 22s ease-in-out infinite; }
.stn2-blobs .b2{ width:800px; height:800px; right:-260px; top:60px; background:radial-gradient(circle, color-mix(in oklch, var(--stn2-accent2) 17%, transparent), transparent 65%); animation:stn2Drift2 26s ease-in-out infinite; }
.stn2-blobs .b3{ width:600px; height:600px; left:30%; bottom:-320px; background:radial-gradient(circle, oklch(66% 0.21 25 / .18), transparent 65%); animation:stn2Drift 30s ease-in-out infinite; }
.stn2-blobs::after{
    content:'';
    position:absolute; inset:0;
    background-image:linear-gradient(oklch(100% 0 0 / .026) 1px, transparent 1px), linear-gradient(90deg, oklch(100% 0 0 / .026) 1px, transparent 1px);
    background-size:56px 56px;
    -webkit-mask-image:radial-gradient(ellipse 72% 45% at 50% 20%, #000, transparent 80%);
    mask-image:radial-gradient(ellipse 72% 45% at 50% 20%, #000, transparent 80%);
}

.stn2-ticker{ position:relative; z-index:2; overflow:hidden; border-bottom:1px solid var(--stn2-border); background:oklch(100% 0 0 / .03); padding:9px 0; white-space:nowrap; }
.stn2-ticker-track{ display:inline-flex; gap:48px; animation:stn2Marquee 32s linear infinite; padding-left:15px; }
/* Когда live-матчей мало и вторая (дублирующая, aria-hidden) копия не
   добавляется — см. header.html JS — анимация вхолостую сдвигала бы
   единственную копию влево до пустоты. Показываем её статично. */
.stn2-ticker-track_static{ animation:none; transform:translateX(0); }
.stn2-ticker-item{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; color:var(--stn2-text2); font-family:'Inter',sans-serif; }
.stn2-ticker-item a{ color:inherit; }
.stn2-live-dot{ display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--stn2-danger); animation:stn2PulseDot 1.4s ease-in-out infinite; flex:none; }
.stn2-ticker-item .stn2-min{ color:var(--stn2-muted); }
.stn2-ticker-empty{ display:none; }

/* ---------- 4. Header chrome (every page) ---------- */
/* Above .stn2-ticker (z-index:2, same stacking level, later in DOM) so the
   ⌘K search dropdown nested inside .h isn't trapped under the ticker despite
   its own higher z-index — z-index only resolves within the nearest
   stacking-context ancestor, and .h itself is one. */
body.stn2 .h{ z-index:5; }
body.stn2 .h{
    background:oklch(16% 0.015 260 / .72);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border-bottom:1px solid var(--stn2-border);
    box-shadow:none;
}
body.stn2 .h__menu > ul > li > a,
body.stn2 .h__menu > ul > li > div.js-btm{
    color:var(--stn2-text2);
    font-family:'Inter',sans-serif;
    font-weight:500;
    transition:color .15s;
}
body.stn2 .h__menu > ul > li > a:hover,
body.stn2 .h__menu > ul > li > div.js-btm:hover,
body.stn2 .h__menu > ul > li > div.js-btm.active,
body.stn2 .h__menu > ul > li > a.active{
    color:var(--stn2-text);
}
body.stn2 .h__btn{
    background:oklch(100% 0 0 / .06);
    border:1px solid var(--stn2-border);
    color:var(--stn2-text2);
}
body.stn2 .h__btn svg{ stroke:currentColor; }
body.stn2 .h__btn:hover{ background:oklch(100% 0 0 / .1); color:var(--stn2-text); }
body.stn2 .theme-toggle__icon{ color:var(--stn2-text2); }

/* Header timezone selector (moved here from the footer) */
body.stn2 .stn2-hdr-tz{ position:relative; display:flex; align-items:center; gap:6px; padding:8px 11px; border-radius:12px; border:1px solid var(--stn2-border); background:oklch(100% 0 0 / .05); color:var(--stn2-text2); font-size:12.5px; cursor:pointer; white-space:nowrap; transition:color .15s, background .15s; }
body.stn2 .stn2-hdr-tz:hover{ color:var(--stn2-text); background:oklch(100% 0 0 / .09); }
body.stn2 .stn2-hdr-tz-menu{ position:absolute; top:calc(100% + 8px); right:0; min-width:230px; max-height:60vh; overflow:auto; padding:6px; border-radius:14px; border:1px solid var(--stn2-border); background:linear-gradient(170deg, oklch(23% 0.026 274 / .98), oklch(18% 0.02 262 / .99)); box-shadow:0 40px 90px -40px rgba(0,0,0,.85); z-index:60; }
body.stn2 .stn2-hdr-tz-menu > div{ padding:8px 10px; border-radius:9px; cursor:pointer; color:var(--stn2-text2); font-size:12.5px; }
body.stn2 .stn2-hdr-tz-menu > div:hover{ background:oklch(100% 0 0 / .06); color:var(--stn2-text); }
body.stn2 .stn2-hdr-tz-menu > div.selected{ background:oklch(100% 0 0 / .1); color:var(--stn2-text); }
@media (max-width:1100px){ body.stn2 .stn2-hdr-tz-cur{ display:none; } }

/* Prominent "compare teams" button (team page) */
body.stn2 .stn2-compare-btn{ align-self:flex-start; display:inline-flex; align-items:center; gap:8px; padding:11px 18px; border-radius:12px; background:var(--stn2-gradient); border:none; font-size:13px; font-weight:600; color:#fff; white-space:nowrap; text-decoration:none; box-shadow:0 12px 28px -14px var(--stn2-accent1); transition:transform .12s, box-shadow .12s, filter .12s; }
body.stn2 .stn2-compare-btn:hover{ transform:translateY(-1px); filter:brightness(1.06); color:#fff; box-shadow:0 16px 34px -12px var(--stn2-accent1); }
body.stn2 .stn2-compare-btn svg{ flex-shrink:0; }
body.stn2 .stn2-compare-btn_active{ background:linear-gradient(120deg, oklch(78% 0.18 150), oklch(72% 0.15 175)); box-shadow:0 12px 28px -14px oklch(78% 0.18 150); }

/* Test-mode entry popup (toggled in admin: Настройки → Оформление) */
.stn2-tm-overlay{ position:fixed; inset:0; z-index:9000; display:flex; align-items:center; justify-content:center; padding:24px; background:oklch(10% 0.015 260 / .72); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.stn2-tm-modal{ width:100%; max-width:420px; text-align:center; padding:30px 28px; border-radius:20px; border:1px solid var(--stn2-border, #ffffff22); background:linear-gradient(170deg, oklch(23% 0.026 274 / .99), oklch(17% 0.02 262 / .995)); box-shadow:0 50px 120px -40px rgba(0,0,0,.85); color:var(--stn2-text, #eef); animation:stn2MmDropIn .18s ease both; }
.stn2-tm-icon{ width:56px; height:56px; margin:0 auto 14px; display:flex; align-items:center; justify-content:center; border-radius:16px; font-size:24px; color:#fff; background:var(--stn2-gradient, linear-gradient(120deg,#7C5CFC,#2DD4BF)); }
.stn2-tm-title{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:20px; margin-bottom:8px; }
.stn2-tm-text{ font-size:14px; line-height:1.55; color:var(--stn2-text2, #bcc); margin-bottom:22px; }
.stn2-tm-btn{ display:inline-flex; align-items:center; justify-content:center; padding:12px 26px; border:none; border-radius:12px; font-size:14px; font-weight:600; color:#fff; cursor:pointer; background:var(--stn2-gradient, linear-gradient(120deg,#7C5CFC,#2DD4BF)); }
.stn2-tm-btn:hover{ filter:brightness(1.06); }

/* Mega-menu dropdown panels: reskin, keep markup/JS untouched */
body.stn2 .btm{
    background:var(--stn2-bg);
    border-bottom:1px solid var(--stn2-border);
    /* Viewport-fixed (not absolute-against-the-sticky-header — that pairing
       isn't consistently specified across browsers and let the panel drift
       away from the header while scrolling), so it always tracks the sticky
       header's viewport position. overflow-y guards short viewports now that
       it's clipped to the viewport instead of pushing the document taller. */
    position:fixed !important;
    overflow-y:auto;
}
/* sc.js's open/close handlers only toggle the .active class — the "closed"
   state relies on sc.css's `.btm{top:-700px}` slide-off-screen rule, but
   btmPositionPanel() (called on open + on scroll/resize while open) sets an
   inline `top:<px>` style that the close handler never clears. That inline
   style outlives .active (inline beats a non-!important class rule), so the
   empty panel — background/border/padding, no content since .btm__i also
   lost .active — stayed pinned right under the ticker as a bare bar. Hiding
   unconditionally on :not(.active) sidesteps the leftover inline offset
   entirely, without touching sc.js. */
body.stn2 .btm:not(.active){ display:none !important; }
body.stn2 .btm__card,
body.stn2 .btm__live,
body.stn2 .btm__b{
    background-color:var(--stn2-card-solid);
    border:1px solid var(--stn2-border);
    color:var(--stn2-text);
}
body.stn2 .btm__wrap{ background-image:none !important; background-color:transparent; }
body.stn2 .btm__wrap:hover .btm__card{ border-color:var(--stn2-accent2); }
body.stn2 .btm__card{ background-size:76px !important; background-position:center right -14px !important; opacity:1; }
body.stn2 .btm__card:before{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, var(--stn2-card-solid) 45%, transparent 85%); pointer-events:none; }
body.stn2 .btm__card{ position:relative; }
body.stn2 .btm__card-title, body.stn2 .btm__card-text{ position:relative; z-index:1; }
body.stn2 .btm__card-title,
body.stn2 .btm__live-title{ color:var(--stn2-text); font-family:'Space Grotesk',sans-serif; }
body.stn2 .btm__card-text,
body.stn2 .btm__live-text{ color:var(--stn2-text2); }
body.stn2 .btm__card-text span,
body.stn2 .btm__live-text span{ color:var(--stn2-accent2); }
body.stn2 .btm__card-btn,
body.stn2 .btm__btn{
    background:var(--stn2-gradient);
    color:#fff;
    border:none;
}
body.stn2 .match__name{ color:var(--stn2-text); }
body.stn2 .match__score{ color:var(--stn2-text2); }
body.stn2 .match__score_g{ color:var(--stn2-success); }
body.stn2 .match__time{ color:var(--stn2-muted); }
body.stn2 .btm__search .search__input{
    background:var(--stn2-card-solid);
    border:1px solid var(--stn2-border);
    color:var(--stn2-text);
}
body.stn2 .btm__wrap_search .btm__card{ cursor:pointer; }
body.stn2 .btm__wrap_search.active .btm__card{ border-color:var(--stn2-accent2); }
body.stn2 .h-search__card{
    background:var(--stn2-card-solid);
    border:1px solid var(--stn2-border);
    color:var(--stn2-text);
}
body.stn2 .h-search__card a{ color:var(--stn2-text); }
/* Header search box + user chip (top bar) */
@keyframes stn2MmDropIn{ from{ opacity:0; transform:translateY(-8px); } to{ opacity:1; transform:translateY(0); } }
.stn2-hs{ position:relative; }
body.stn2 .stn2-hdr-search{
    display:flex; align-items:center; gap:9px; padding:8px 13px; border-radius:10px;
    background:oklch(100% 0 0 / .05); border:1px solid var(--stn2-border); min-width:210px; transition:all .15s;
}
body.stn2 .stn2-hdr-search.stn2-hdr-search_open{ background:oklch(22% 0.024 268 / .9); border-color:var(--stn2-accent1); box-shadow:0 0 0 3px color-mix(in oklab, var(--stn2-accent1) 13%, transparent); }
body.stn2 .stn2-hdr-search svg{ flex:none; stroke:var(--stn2-muted); }
body.stn2 .stn2-hdr-search-input{ flex:1; min-width:0; background:none; border:none; outline:none; font-size:13px; color:var(--stn2-text); font-family:inherit; }
body.stn2 .stn2-hdr-search-input::placeholder{ color:var(--stn2-muted); }
body.stn2 .stn2-hdr-search-kbd{ margin-left:auto; font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--stn2-muted); border:1px solid var(--stn2-border); border-radius:5px; padding:2px 5px; flex:none; }
/* position:fixed (not absolute) — same reason as .btm: .h and .stn2-ticker
   are sibling stacking contexts with equal z-index, so DOM order (ticker
   after .h) would otherwise paint the ticker over an absolutely-positioned
   descendant of .h regardless of that descendant's own z-index. JS sets
   top/right from the trigger's live viewport position. */
.stn2-hs-panel{ position:fixed; width:640px; max-width:82vw; max-height:74vh; display:flex; flex-direction:column; border-radius:20px; border:1px solid oklch(100% 0 0 / .11); background:linear-gradient(170deg, oklch(23% 0.026 274 / .98), oklch(18% 0.02 262 / .99)); box-shadow:0 50px 110px -46px rgba(0,0,0,.92); overflow:hidden; z-index:45; animation:stn2MmDropIn .16s ease both; }
.stn2-hs-scopes{ display:flex; align-items:center; gap:6px; padding:12px 14px; border-bottom:1px solid oklch(100% 0 0 / .07); overflow-x:auto; flex:none; }
.stn2-hs-scope{ display:flex; align-items:center; gap:7px; padding:7px 12px; border-radius:10px; font-size:12.5px; cursor:pointer; white-space:nowrap; color:var(--stn2-muted); border:1px solid transparent; }
.stn2-hs-scope_active{ color:#fff; font-weight:600; background:color-mix(in oklab, var(--stn2-accent1) 18%, transparent); border-color:color-mix(in oklab, var(--stn2-accent1) 40%, transparent); }
.stn2-hs-scope-count{ font-family:'JetBrains Mono',monospace; font-size:10.5px; padding:1px 5px; border-radius:5px; background:oklch(100% 0 0 / .07); color:var(--stn2-faint); }
.stn2-hs-scope_active .stn2-hs-scope-count{ color:var(--stn2-accent2); }
.stn2-hs-body{ flex:1; overflow-y:auto; padding:6px 0; }
.stn2-hs-section{ padding:8px 0 4px; }
.stn2-hs-label{ font-size:10.5px; text-transform:uppercase; letter-spacing:.6px; color:var(--stn2-faint); font-weight:700; padding:6px 16px; }
.stn2-hs-recent{ display:flex; gap:8px; flex-wrap:wrap; padding:0 16px 6px; }
.stn2-hs-recent-chip{ padding:7px 12px; border-radius:999px; background:oklch(100% 0 0 / .045); border:1px solid var(--stn2-border); font-size:12.5px; color:oklch(76% 0.01 260); cursor:pointer; }
.stn2-hs-hints{ display:grid; grid-template-columns:1fr 1fr; gap:9px; padding:0 16px 10px; }
.stn2-hs-hint{ padding:12px 13px; border-radius:13px; background:oklch(100% 0 0 / .03); border:1px solid oklch(100% 0 0 / .07); }
.stn2-hs-hint-title{ font-size:13px; font-weight:600; color:var(--stn2-text); }
.stn2-hs-hint-desc{ font-size:11.5px; color:var(--stn2-faint); margin-top:3px; line-height:1.4; }
.stn2-hs-row{ display:flex; align-items:center; gap:12px; padding:10px 16px; cursor:pointer; }
.stn2-hs-row_active{ background:oklch(100% 0 0 / .05); }
.stn2-hs-row-avatar{ width:32px; height:32px; border-radius:10px; flex:none; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-size:13px; font-weight:700; color:oklch(18% 0.02 262); background:var(--stn2-gradient); }
.stn2-hs-row-mid{ min-width:0; flex:1; }
.stn2-hs-row-top{ display:flex; align-items:center; gap:8px; min-width:0; }
.stn2-hs-row-title{ font-size:13.5px; font-weight:600; color:var(--stn2-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-hs-row-tag{ font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; padding:2px 6px; border-radius:5px; flex:none; background:color-mix(in oklab, var(--stn2-accent2) 16%, transparent); border:1px solid color-mix(in oklab, var(--stn2-accent2) 35%, transparent); color:var(--stn2-accent2); }
.stn2-hs-row-sub{ font-size:11.5px; color:var(--stn2-faint); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-hs-row-meta{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--stn2-muted); flex:none; }
.stn2-hs-row svg{ flex:none; color:var(--stn2-faint); }
.stn2-hs-empty{ padding:34px 22px; text-align:center; }
.stn2-hs-empty-title{ font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:600; color:var(--stn2-text); }
.stn2-hs-empty-text{ font-size:12.5px; line-height:1.55; color:var(--stn2-muted); margin-top:7px; max-width:380px; margin-left:auto; margin-right:auto; }
.stn2-hs-foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 16px; border-top:1px solid oklch(100% 0 0 / .07); background:oklch(100% 0 0 / .022); flex:none; }
.stn2-hs-foot-keys{ display:flex; align-items:center; gap:14px; }
.stn2-hs-foot-keys span{ display:flex; align-items:center; gap:6px; font-size:11px; color:var(--stn2-faint); }
.stn2-hs-foot-keys b{ font-family:'JetBrains Mono',monospace; font-weight:400; font-size:10px; padding:3px 6px; border-radius:5px; background:oklch(100% 0 0 / .07); border:1px solid var(--stn2-border); color:oklch(70% 0.01 260); }
.stn2-hs-foot-link{ font-size:12px; }
@media (max-width:900px){
    .stn2-hs-panel{ position:fixed; top:64px; left:12px; right:12px; width:auto; max-width:none; }
    .stn2-hs-hints{ grid-template-columns:1fr; }
}
body.stn2 .stn2-hdr-user{ display:flex; align-items:center; gap:9px; padding:6px 12px 6px 6px; border-radius:10px; background:oklch(100% 0 0 / .04); border:1px solid var(--stn2-border); color:var(--stn2-text); text-decoration:none; }
body.stn2 .stn2-hdr-user:hover{ background:oklch(100% 0 0 / .08); }
body.stn2 .stn2-hdr-user-photo{ width:26px; height:26px; border-radius:8px; object-fit:cover; }
body.stn2 .stn2-hdr-user-avatar{ width:26px; height:26px; border-radius:8px; background:var(--stn2-gradient); display:flex; align-items:center; justify-content:center; }
body.stn2 .stn2-hdr-user-avatar svg{ width:14px; height:14px; }
body.stn2 .stn2-hdr-user-name{ font-size:13px; font-weight:500; }

/* Mega-menu v2 (HeaderNav): rail of section cards + live/prematch side panel */
.stn2-mm{ grid-column:1/-1; display:grid; grid-template-columns:1.45fr 1fr; gap:28px; animation:stn2MmDropIn .16s ease both; }
.stn2-mm-railhead{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:14px; }
.stn2-mm-railtitle{ font-size:10.5px; text-transform:uppercase; letter-spacing:1px; color:var(--stn2-muted); }
.stn2-mm-raildate{ font-size:12px; color:var(--stn2-muted); }
.stn2-mm-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.stn2-mm-section{ padding:19px 20px; border-radius:16px; background:var(--stn2-card-solid); border:1px solid var(--stn2-border); cursor:pointer; transition:border-color .15s; }
.stn2-mm-section:hover{ border-color:var(--stn2-accent2); }
.stn2-mm-section-top{ display:flex; align-items:flex-start; gap:14px; }
.stn2-mm-icon{ width:40px; height:40px; flex:none; border-radius:13px; display:flex; align-items:center; justify-content:center; font-size:19px; color:var(--mm-c,var(--stn2-accent1)); background:color-mix(in oklab, var(--mm-c,var(--stn2-accent1)) 14%, transparent); border:1px solid color-mix(in oklab, var(--mm-c,var(--stn2-accent1)) 30%, transparent); }
.stn2-mm-section-body{ min-width:0; flex:1; }
.stn2-mm-section-title{ font-size:16.5px; font-weight:600; font-family:'Space Grotesk',sans-serif; letter-spacing:-.2px; color:var(--stn2-text); }
.stn2-mm-section-desc{ font-size:12.5px; color:var(--stn2-muted); margin-top:5px; line-height:1.45; }
.stn2-mm-count-row{ display:flex; align-items:baseline; gap:8px; margin-top:12px; }
.stn2-mm-count{ font-family:'JetBrains Mono',monospace; font-size:19px; font-weight:700; color:var(--stn2-text); }
.stn2-mm-unit{ font-size:11.5px; color:var(--stn2-muted); }
.stn2-mm-chips{ display:flex; gap:7px; margin-top:15px; }
.stn2-mm-chip{ padding:7px 13px; border-radius:9px; background:oklch(100% 0 0 / .05); border:1px solid var(--stn2-border); color:var(--stn2-text2); font-size:12.5px; font-weight:500; }
.stn2-mm-chip:hover{ border-color:var(--stn2-accent2); }
.stn2-mm-chip_on{ background:color-mix(in oklab, var(--stn2-accent1) 18%, transparent); border-color:color-mix(in oklab, var(--stn2-accent1) 40%, transparent); color:var(--stn2-accent1); font-weight:600; }

.stn2-mm-side{ display:flex; flex-direction:column; gap:12px; min-width:0; }
.stn2-mm-panel{ flex:1; display:flex; flex-direction:column; border-radius:16px; background:var(--stn2-card-solid); border:1px solid var(--stn2-border); overflow:hidden; }
.stn2-mm-panelhead{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; border-bottom:1px solid var(--stn2-border); }
.stn2-mm-panelhead-l{ display:flex; align-items:center; gap:9px; }
.stn2-mm-paneltitle{ font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:600; color:var(--stn2-text); }
.stn2-mm-panelcount{ font-family:'JetBrains Mono',monospace; font-size:12px; padding:2px 7px; border-radius:6px; background:oklch(100% 0 0 / .06); color:var(--stn2-text2); }
.stn2-mm-panellink{ font-size:12px; color:var(--stn2-accent1); text-decoration:none; }
.stn2-mm-panellink:hover{ text-decoration:underline; }
.stn2-mm-livedot{ width:7px; height:7px; border-radius:50%; background:var(--stn2-danger); animation:stn2PulseDot 1.4s ease-in-out infinite; }
.stn2-mm-row{ display:grid; grid-template-columns:1fr auto; gap:14px; align-items:center; padding:11px 18px; border-bottom:1px solid var(--stn2-border); text-decoration:none; }
.stn2-mm-row:last-of-type{ border-bottom:none; }
.stn2-mm-row:hover{ background:oklch(100% 0 0 / .03); }
.stn2-mm-teamline{ display:flex; align-items:center; gap:8px; font-size:13px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--stn2-text); }
.stn2-mm-dot{ width:5px; height:5px; border-radius:50%; flex:none; }
.stn2-mm-row-league{ font-size:10.5px; color:var(--stn2-muted); margin-top:5px; letter-spacing:.2px; }
.stn2-mm-row-r{ text-align:right; }
.stn2-mm-row-value{ font-family:'JetBrains Mono',monospace; font-size:17px; font-weight:700; letter-spacing:1px; color:var(--stn2-text); }
.stn2-mm-row-time{ font-size:11px; color:var(--stn2-muted); margin-top:4px; }
.stn2-mm-empty{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:34px 24px; text-align:center; }
.stn2-mm-empty-icon{ width:44px; height:44px; border-radius:14px; border:1px solid var(--stn2-border); background:oklch(100% 0 0 / .04); display:flex; align-items:center; justify-content:center; font-size:17px; color:var(--stn2-muted); }
.stn2-mm-empty-title{ font-size:14px; font-weight:600; color:var(--stn2-text); }
.stn2-mm-empty-text{ font-size:12px; color:var(--stn2-muted); margin-top:5px; max-width:260px; line-height:1.45; }
.stn2-mm-empty-btn{ padding:9px 16px; border-radius:10px; background:oklch(100% 0 0 / .06); border:1px solid var(--stn2-border); font-size:12.5px; font-weight:600; color:var(--stn2-text); text-decoration:none; }
.stn2-mm-actions{ display:flex; gap:8px; padding:13px 18px; border-top:1px solid var(--stn2-border); margin-top:auto; }
.stn2-mm-action-primary{ flex:1; text-align:center; padding:10px 14px; border-radius:10px; background:var(--stn2-gradient); color:#fff; font-size:12.5px; font-weight:700; text-decoration:none; }
.stn2-mm-action-ghost{ flex:1; text-align:center; padding:10px 14px; border-radius:10px; background:oklch(100% 0 0 / .05); border:1px solid var(--stn2-border); font-size:12.5px; font-weight:600; color:var(--stn2-text2); text-decoration:none; }
.stn2-mm-kpigrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.stn2-mm-kpi{ padding:11px 13px; border-radius:12px; background:var(--stn2-card-solid); border:1px solid var(--stn2-border); }
.stn2-mm-kpi-value{ font-family:'JetBrains Mono',monospace; font-size:16px; font-weight:700; color:var(--stn2-text); }
.stn2-mm-kpi-label{ font-size:10.5px; color:var(--stn2-muted); margin-top:4px; line-height:1.3; }
@media (max-width:900px){
    .stn2-mm{ grid-template-columns:1fr; }
    .stn2-mm-grid{ grid-template-columns:1fr; }
}

/* ---------- 5. Footer chrome (every page) ---------- */
body.stn2 .footer,
body.stn2 .footer__wrap{
    background:var(--stn2-bg);
    border-top:1px solid var(--stn2-border);
}
body.stn2 .footer__title{
    color:var(--stn2-muted);
    font-size:11.5px;
    letter-spacing:.4px;
}
body.stn2 .footer__a{
    color:var(--stn2-text2);
}
body.stn2 .footer__a:hover{ color:var(--stn2-text); }
body.stn2 .footer__t{ color:var(--stn2-muted); }
body.stn2 .footer__btm{
    border-top:1px solid var(--stn2-border);
    background:var(--stn2-bg);
}
body.stn2 .footer__i{ color:var(--stn2-muted); }
body.stn2 .footer__i:hover{ color:var(--stn2-text); }
body.stn2 .tz-select{
    background:var(--stn2-card-solid);
    border:1px solid var(--stn2-border);
    color:var(--stn2-text);
    /* .footer__wrap > .container-fluid has position:relative; z-index:2 (see
       below) — beats this dropdown's z-index:1 from sc.css, so the panel
       painted underneath the footer columns instead of over them. */
    z-index:50;
}
body.stn2 .f-cookie-cnt{
    background:var(--stn2-card-solid);
    border:1px solid var(--stn2-border);
    color:var(--stn2-text);
}

/* ==========================================================================
   6. HOME PAGE — .stn2-home
   ========================================================================== */
.stn2-home{ position:relative; color:var(--stn2-text); }
.stn2-home .container-fluid{ position:relative; z-index:1; }
.stn2-home-h1{
    font-size:12.5px; font-weight:500; text-transform:uppercase; letter-spacing:.5px;
    color:var(--stn2-muted); margin:16px 0 4px; background:none; -webkit-text-fill-color:currentColor;
}
.stn2-home-desc{ color:var(--stn2-text2); margin-bottom:16px; }
.stn2-home .title__h2{ font-family:'Space Grotesk',sans-serif; color:var(--stn2-text); font-size:22px; font-weight:600; }
.stn2-home .text{ color:var(--stn2-text2); font-size:13.5px; }
.stn2-home .error-simple{ color:var(--stn2-muted); }
.stn2-home .error-simple svg{ fill:var(--stn2-muted); }

/* Hero + Signals row */
.stn2-hero-row{ display:grid; grid-template-columns:1.5fr 1fr; gap:20px; margin:20px 0 24px; }
@media (max-width:900px){ .stn2-hero-row{ grid-template-columns:1fr; } }

.stn2-hero{
    position:relative; display:block; border-radius:var(--stn2-radius-lg); overflow:hidden;
    border:1px solid var(--stn2-border); min-height:340px;
    background:
        linear-gradient(180deg, transparent 40%, oklch(16% 0.015 260 / .92) 100%),
        repeating-linear-gradient(135deg, oklch(26% 0.02 262) 0 18px, oklch(20% 0.02 262) 18px 36px);
}
.stn2-hero-tag{
    position:absolute; top:16px; left:16px; z-index:1; font-family:ui-monospace,monospace; font-size:11px;
    color:var(--stn2-muted); background:oklch(16% 0.015 260 / .6); padding:4px 9px; border-radius:6px;
}
.stn2-hero-live{
    position:absolute; top:16px; right:16px; display:flex; align-items:center; gap:6px;
    background:oklch(66% 0.21 25 / .18); border:1px solid oklch(66% 0.21 25 / .4); color:var(--stn2-danger-fg);
    font-size:12px; font-weight:600; padding:5px 11px; border-radius:var(--stn2-radius-pill);
}
.stn2-hero-overlay{ position:absolute; bottom:20px; left:24px; right:24px; }
.stn2-hero-meta{ font-size:12px; color:var(--stn2-text2); margin-bottom:6px; }
.stn2-hero-teams{ display:flex; flex-direction:column; gap:6px; font-family:'Space Grotesk',sans-serif; font-weight:600; }
.stn2-hero-team{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:18px; color:var(--stn2-text); }
.stn2-hero-score{ font-size:20px; color:var(--stn2-accent2); white-space:nowrap; }

.stn2-signals{
    border-radius:var(--stn2-radius-lg); border:1px solid var(--stn2-border); background:var(--stn2-card);
    padding:6px; display:flex; flex-direction:column;
}
.stn2-signal-row{
    display:flex; align-items:center; gap:16px; padding:16px; border-radius:var(--stn2-radius-md);
    cursor:pointer; transition:background .15s; text-decoration:none; color:inherit;
}
.stn2-signal-row:hover{ background:oklch(100% 0 0 / .04); }
.stn2-signal-row_static{ cursor:default; }
.stn2-signal-divider{ height:1px; background:var(--stn2-border); margin:2px 16px; }
.stn2-ring-val{
    position:absolute; inset:6px; border-radius:50%; background:var(--stn2-card-solid);
    display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:700; color:var(--stn2-text);
}
.stn2-drop-badge{
    width:56px; height:56px; border-radius:var(--stn2-radius-md); background:oklch(78% 0.18 150 / .12);
    display:flex; flex-direction:column; align-items:center; justify-content:center; flex-shrink:0;
}
.stn2-drop-badge span{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; color:var(--stn2-success); }
.stn2-drop-badge small{ font-size:9px; color:var(--stn2-success); }
.stn2-signal-icon{
    width:56px; height:56px; border-radius:var(--stn2-radius-md); background:oklch(100% 0 0 / .05);
    display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--stn2-accent2);
}
.stn2-signal-body{ flex:1; min-width:0; }
.stn2-signal-label{ font-size:11px; color:var(--stn2-muted); text-transform:uppercase; letter-spacing:.4px; margin-bottom:2px; }
.stn2-signal-title{ font-size:14px; font-weight:600; color:var(--stn2-text); }
.stn2-signal-sub{ font-size:12px; color:var(--stn2-text2); margin-top:2px; line-height:1.4; }
.stn2-signal-arrow{ color:var(--stn2-muted); font-size:16px; }
.stn2-signal-cta{
    margin:auto 16px 12px; text-align:center; padding:11px; border-radius:12px;
    background:var(--stn2-gradient); font-weight:600; font-size:13px; color:#fff; display:block;
}

/* KPI strip */
.stn2-kpi-strip{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr 1fr; gap:16px; margin-bottom:12px; }
@media (max-width:1100px){ .stn2-kpi-strip{ grid-template-columns:1fr 1fr 1fr; } }
@media (max-width:640px){ .stn2-kpi-strip{ grid-template-columns:1fr 1fr; } }
.stn2-kpi{
    position:relative; overflow:hidden; display:block; color:inherit; text-decoration:none;
    border-radius:18px; padding:18px 20px; border:1px solid var(--stn2-border);
    background:linear-gradient(160deg, var(--stn2-card-alt-a), var(--stn2-card-alt-b));
    box-shadow:0 10px 30px -12px oklch(0% 0 0 / .5);
    transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s cubic-bezier(.2,.8,.2,1), border-color .3s;
}
.stn2-kpi:hover{ transform:translateY(-6px) scale(1.015); border-color:var(--kpi-hue, var(--stn2-accent2)); box-shadow:0 20px 40px -14px color-mix(in oklch, var(--kpi-hue, var(--stn2-accent2)) 38%, transparent), 0 0 0 1px color-mix(in oklch, var(--kpi-hue, var(--stn2-accent2)) 22%, transparent); }
.stn2-kpi::before{
    content:''; position:absolute; top:-30%; right:-20%; width:70%; height:70%; border-radius:50%;
    background:radial-gradient(circle, var(--kpi-hue, var(--stn2-accent2)), transparent 70%);
    opacity:.35; pointer-events:none; z-index:0;
}
.stn2-kpi-top, .stn2-kpi-value, .stn2-kpi-sub, .stn2-kpi-extra{ position:relative; z-index:1; }
.stn2-kpi-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.stn2-kpi-label{ font-size:12.5px; color:var(--stn2-text2); font-weight:500; }
.stn2-kpi-icon{
    width:30px; height:30px; border-radius:9px;
    background-color:color-mix(in oklch, var(--kpi-hue, var(--stn2-accent2)) 22%, transparent);
    background-repeat:no-repeat; background-position:center; background-size:60%; flex-shrink:0;
}
.stn2-kpi-value{ display:flex; align-items:baseline; gap:8px; }
.stn2-kpi-num{ font-size:30px; font-weight:700; letter-spacing:-.5px; color:var(--stn2-text); }
.stn2-kpi-badge{ font-size:11px; font-weight:700; color:var(--stn2-danger-fg); background:oklch(66% 0.21 25 / .15); padding:2px 7px; border-radius:6px; }
.stn2-kpi-sub{ font-size:11.5px; color:var(--stn2-muted); text-transform:uppercase; letter-spacing:.5px; margin-top:5px; }
.stn2-kpi-sub_lead{ text-transform:none; font-size:13px; color:var(--stn2-text2); letter-spacing:normal; line-height:1.4; margin-top:0; }
.stn2-kpi-extra{ font-size:11.5px; color:var(--stn2-faint); margin-top:2px; }
.stn2-kpi_compact{ display:flex; flex-direction:column; justify-content:space-between; }

/* Matches table (existing .lg/.lg__block markup from events-table.html,
   scoped to .stn2-home only — events.html's full listing page, which reuses
   the same include, keeps its current look untouched) */
.stn2-home .events-table{ border-radius:18px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; color:var(--stn2-text); position:relative; z-index:1; }
.stn2-home .events-table-header{ color:var(--stn2-text); margin:40px 0 16px; position:relative; z-index:1; }
.stn2-home .events-navigation{ flex-wrap:wrap; }
.stn2-home .events-table-heading{
    font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:600; color:var(--stn2-text);
    margin:0 auto 0 0; background:none; -webkit-text-fill-color:currentColor;
}
/* All three controls (date stepper / LIVE / Все матчи) sit together as one
   right-aligned cluster — only the heading's margin-right:auto should push
   the group; the button's own base margin-left:auto would otherwise split
   the cluster in two by fighting for the same free space. */
.stn2-home .all-events-button{
    background:var(--stn2-card-solid); border:1px solid var(--stn2-border); color:var(--stn2-text2);
    margin-left:0; height:40px; box-sizing:border-box; padding:0 20px;
}
/* Date stepper reads as one unified pill (arrows + date), not three separate chips */
.stn2-home .date-controls{
    background:var(--stn2-card-solid); border:1px solid var(--stn2-border); border-radius:var(--stn2-radius-sm);
    padding:0 4px; gap:2px !important; height:40px; box-sizing:border-box;
}
.stn2-home .nav-button{ width:32px; height:32px; background:transparent; border:none; color:var(--stn2-text2); border-radius:6px; }
.stn2-home .nav-button:hover{ background:oklch(100% 0 0 / .06); color:var(--stn2-text); }
.stn2-home .events-date-picker-container,
.stn2-home .events-custom-date-picker{ background:transparent; border:none; color:var(--stn2-text); height:40px; box-sizing:border-box; }
/* LIVE toggle — red-tinted, matches the hero/ticker live indicator language */
.stn2-home .live-button{
    display:flex; align-items:center; gap:7px;
    background:oklch(66% 0.21 25 / .15); border:1px solid oklch(66% 0.21 25 / .4); color:var(--stn2-danger-fg);
    font-weight:600; height:40px; box-sizing:border-box;
}
.stn2-home .live-button::before{
    content:''; width:6px; height:6px; border-radius:50%; background:var(--stn2-danger);
    animation:stn2PulseDot 1.4s ease-in-out infinite; flex:none;
}
.stn2-home .live-button.active{ background:var(--stn2-gradient); color:#fff; border-color:transparent; }
.stn2-home .live-button.active::before{ background:#fff; }
.stn2-home .search__bar .search__input{ background:var(--stn2-card-solid); border:1px solid var(--stn2-border); color:var(--stn2-text); }
.lg-priority-tabs{ display:flex; gap:8px; margin:14px 0 12px; position:relative; z-index:1; }
.lg-priority-empty{
    border-radius:18px; border:1px solid var(--stn2-border, oklch(100% 0 0 / .08));
    background:var(--stn2-card, oklch(21% 0.02 262 / .55)); margin-bottom:12px; position:relative; z-index:1;
}
.lg-priority-tab{
    font-family:'Inter',sans-serif; font-size:13px; font-weight:500; color:var(--stn2-text2, oklch(70% 0.01 260));
    background:oklch(100% 0 0 / .05); border:1px solid var(--stn2-border, oklch(100% 0 0 / .08));
    padding:8px 16px; border-radius:10px; cursor:pointer; transition:background .15s, color .15s;
}
.lg-priority-tab:hover{ background:oklch(100% 0 0 / .08); }
.lg-priority-tab.active{ background:var(--stn2-gradient, linear-gradient(120deg,#7C5CFC,#2DD4BF)); color:#fff; border-color:transparent; }
.stn2-home .lg{ background:transparent; }
.stn2-home .lg__block{ background:transparent !important; }
.stn2-home .lg__block:has(+ .lg__block){ border-bottom:1px solid oklch(100% 0 0 / .05) !important; }
.stn2-home .lg__h{ background:transparent !important; padding:14px 20px; border-bottom:1px solid var(--stn2-border); display:flex; align-items:center; justify-content:space-between; }
.stn2-home .lg__loc{ font-size:13.5px; color:var(--stn2-muted); }
.stn2-home .lg__arrow{ background:oklch(100% 0 0 / .06) !important; color:var(--stn2-text2); border-radius:50%; }
.stn2-home .lg__name{ font-weight:600; color:var(--stn2-text); text-decoration:none; }
.stn2-home .lg__block_h{
    background:transparent !important;
    display:grid; grid-template-columns:52px 1fr 108px 1fr 160px 140px 24px; align-items:center; gap:12px;
    padding:14px 20px; border-bottom:1px solid oklch(100% 0 0 / .05); transition:background .15s; cursor:pointer;
    color:var(--stn2-text);
}
.stn2-home .lg__odds{ display:flex; gap:6px; justify-content:flex-end; }
.stn2-home .lg__odd{ font-size:12.5px; padding:4px 8px; border-radius:7px; background:oklch(100% 0 0 / .05); color:oklch(80% 0.01 260); }
.stn2-home .lg__block:hover .lg__block_h,
.stn2-home .lg__block_h:hover{ background:oklch(100% 0 0 / .04) !important; }
.stn2-home .lg__time{ font-size:13px; color:var(--stn2-muted); }
.stn2-home .lg__cnt{ display:contents; }
.stn2-home .lg__team{ font-size:14px; color:var(--stn2-text); }
.stn2-home .lg__team:first-of-type{ text-align:right; }
.stn2-home .lg__team:last-of-type{ text-align:left; }
.stn2-home .lg__block:hover .lg__team{ color:var(--stn2-text); }
.stn2-home .lg__center{ display:flex; justify-content:center; }
.stn2-home .lg__status{ font-size:11.5px; color:var(--stn2-muted); background:oklch(100% 0 0 / .06); padding:4px 10px; border-radius:6px; white-space:nowrap; }
.stn2-home .lg__status-live{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:14px; color:var(--stn2-danger-fg); }
.stn2-home .lg__scores{ display:flex; justify-content:center; gap:4px; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:15px; }
.stn2-home .lg__score{ color:var(--stn2-text2); }
.stn2-home .lg__score-live{ color:var(--stn2-danger-fg); }
.stn2-home .lg__score_g{ color:var(--stn2-success); }
.stn2-home .lg__referee{ font-size:12px; color:var(--stn2-faint); text-align:right; }
.stn2-home .lg__referee a{ color:inherit; }
.stn2-home .lg__toggle{ color:var(--stn2-muted); background:none; border:none; cursor:pointer; justify-self:end; }
.stn2-home .lg__toggle.active{ transform:rotate(180deg); }
.stn2-home .lg__arrow{ color:var(--stn2-muted); cursor:pointer; }
.stn2-home .event-summary{ background:oklch(18% 0.02 262 / .6); border-bottom:1px solid var(--stn2-border); padding:16px 20px; }
.stn2-home .event-summary-tabs{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.stn2-home .event-summary-tab{
    font-size:12.5px; font-weight:600; padding:8px 14px; border-radius:10px;
    background:oklch(100% 0 0 / .05); color:var(--stn2-text2); border:1px solid transparent;
}
.stn2-home .event-summary-tab:first-child{ background:var(--stn2-gradient); color:#fff; }
.stn2-home .event-summary-avg-checkbox-text{ color:var(--stn2-muted); font-size:12px; }
.stn2-home .event-stats{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; align-items:start; }
.stn2-home .event-stats-group{
    border-radius:var(--stn2-radius-md); border:1px solid var(--stn2-border); background:var(--stn2-card);
    padding:16px 18px; margin-bottom:0; height:264px; overflow-y:auto;
    scrollbar-width:thin; scrollbar-color:var(--stn2-border) transparent;
    display:flex; flex-direction:column; gap:14px;
}
.stn2-home .event-stats-group::-webkit-scrollbar{ width:6px; }
.stn2-home .event-stats-group::-webkit-scrollbar-track{ background:transparent; }
.stn2-home .event-stats-group::-webkit-scrollbar-thumb{ background:var(--stn2-border); border-radius:3px; }
@media (max-width:700px){
    .stn2-home .event-stats{ grid-template-columns:1fr; }
}
.stn2-home .event-stats-group-name{ font-size:12px; font-weight:600; color:var(--stn2-text2); text-transform:uppercase; letter-spacing:.4px; margin-bottom:0; flex:none; }
.stn2-home .event-stats-field{ gap:14px; flex:none; }
.stn2-home .event-stats-name{ color:var(--stn2-text2); font-size:11.5px; }
.stn2-home .event-stats-row{ display:flex; align-items:center; justify-content:center; gap:10px; }
.stn2-home .event-stats-row .event-stats-name{ flex:0 1 auto; text-align:center; }
.stn2-home .event-stats-localteam,
.stn2-home .event-stats-visitorteam{ color:#fff; font-weight:700; border-radius:5px; padding:1px 7px; font-size:11.5px; min-width:26px; text-align:center; flex:none; }
.stn2-home .event-stats-localteam-avg,
.stn2-home .event-stats-visitorteam-avg{ flex:1 1 0; font-size:11px; color:var(--stn2-muted); min-width:0; }
.stn2-home .event-stats-localteam-avg{ text-align:right; }
.stn2-home .event-stats-visitorteam-avg{ text-align:left; }
.stn2-home .event-stats-splitbar{ display:flex; height:6px; border-radius:3px; overflow:hidden; background:oklch(100% 0 0 / .07); }
.stn2-home .event-stats-splitbar-local,
.stn2-home .event-stats-splitbar-visitor{ height:100%; }
.stn2-home .event-summary-error{ color:var(--stn2-muted); }
.stn2-home .loader__wrapper .loader{ border-color:var(--stn2-border) transparent transparent transparent; }
.stn2-home .event-pressure{
    margin-top:16px; border-radius:var(--stn2-radius-md); border:1px solid var(--stn2-border); background:var(--stn2-card);
    padding:16px 18px;
}
.stn2-home .event-pressure-title{ font-size:12px; font-weight:600; color:var(--stn2-text2); text-transform:uppercase; letter-spacing:.4px; margin-bottom:12px; }
.stn2-home .event-pressure-chart-wrap{ position:relative; height:200px; }

/* Horizontal-scroll league/team cards */
.stn2-hscroll{ display:grid; grid-auto-flow:column; grid-auto-columns:250px; gap:16px; overflow-x:auto; padding:8px 2px 6px; scrollbar-width:none; }
.stn2-hscroll::-webkit-scrollbar{ display:none; }

/* Mouse drag-to-scroll cursor — stn2-dragscroll.js toggles .stn2-hscrollable
   on hover only for instances that actually overflow (some of these same
   classes are also used for rows that just wrap, not scroll). */
.stn2-hscrollable{ cursor:grab; }
.stn2-hscrollable.stn2-dragscrolling{ cursor:grabbing; user-select:none; -webkit-user-select:none; }
.stn2-league-card,
.stn2-team-card{
    display:block; border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card);
    padding:18px; color:inherit; text-decoration:none; transition:transform .2s, border-color .2s;
}
.stn2-league-card:hover,
.stn2-team-card:hover{ border-color:color-mix(in oklch, var(--stn2-accent2) 40%, transparent); transform:translateY(-4px); }
.stn2-card-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.stn2-card-top > div{ min-width:0; flex:1; }
.stn2-card-name{ font-size:14.5px; font-weight:600; line-height:1.3; color:var(--stn2-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-card-sub{ font-size:11.5px; color:var(--stn2-muted); margin-top:2px; }
.stn2-live-badge{
    display:flex; align-items:center; gap:5px; font-size:11px; font-weight:700; color:oklch(95% 0.01 25);
    background:oklch(66% 0.21 25 / .35); padding:4px 9px; border-radius:var(--stn2-radius-pill); flex-shrink:0; white-space:nowrap;
}
.stn2-live-badge_static{ margin-top:12px; align-self:flex-start; background:oklch(78% 0.18 150 / .18); color:var(--stn2-success); }
.stn2-league-crest{ display:flex; align-items:center; justify-content:center; margin-top:16px; height:44px; }
.stn2-league-crest img{ max-height:100%; max-width:80px; object-fit:contain; }
.stn2-league-stats{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-top:18px; }
.stn2-league-avg{ font-family:'Space Grotesk',sans-serif; font-size:26px; font-weight:700; line-height:1; color:var(--stn2-text); }
.stn2-league-avg-label{ font-size:9.5px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; color:var(--stn2-muted); margin-top:4px; }
.stn2-league-bars{ display:flex; align-items:flex-end; gap:3px; height:36px; flex-shrink:0; }
.stn2-league-bar{
    width:7px; min-height:3px; border-radius:3px 3px 1px 1px;
    background:linear-gradient(180deg, var(--stn2-accent2), var(--stn2-accent1));
    opacity:.85;
}
.stn2-card-footer{ font-size:11.5px; color:var(--stn2-muted); margin-top:12px; }
.stn2-team-top{ display:flex; align-items:center; gap:10px; }
.stn2-team-crest{ width:32px; height:32px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.stn2-team-avatar{
    width:32px; height:32px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg, color-mix(in oklch, var(--stn2-accent1) 55%, transparent), color-mix(in oklch, var(--stn2-accent2) 55%, transparent));
    font-size:12.5px; font-weight:700; color:var(--stn2-text);
}
.stn2-team-next{ font-size:11.5px; color:var(--stn2-muted); margin-top:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* Blog / CTA banner */
.stn2-blog-cta{
    position:relative; overflow:hidden; border-radius:22px; border:1px solid var(--stn2-border);
    padding:40px 44px; background:linear-gradient(120deg, oklch(23% 0.03 280 / .8), oklch(20% 0.03 200 / .6));
}
.stn2-blog-glow{ position:absolute; width:340px; height:340px; right:-100px; top:-140px; border-radius:50%; background:radial-gradient(circle, color-mix(in oklch, var(--stn2-accent2) 20%, transparent), transparent 70%); filter:blur(10px); }
.stn2-blog-body{ position:relative; max-width:640px; }
.stn2-blog-title{ font-size:24px; font-weight:600; margin-bottom:8px; color:var(--stn2-text); }
.stn2-blog-text{ font-size:14px; color:var(--stn2-text2); margin-bottom:22px; line-height:1.5; }
.stn2-blog-btn{
    display:inline-flex; align-items:center; gap:8px; padding:12px 22px; border-radius:12px;
    background:var(--stn2-gradient); font-weight:600; font-size:14px; color:#fff; text-decoration:none;
    box-shadow:0 10px 28px color-mix(in oklch, var(--stn2-accent1) 40%, transparent);
}
@media (max-width:640px){
    .stn2-blog-cta{ padding:28px 24px; }
    body.stn2 .lg__block_h{ grid-template-columns:44px 1fr 76px 1fr 20px; }
    body.stn2 .lg__referee,
    body.stn2 .lg__odds{ display:none; }
}

/* ==========================================================================
   7. MATCH PAGE — .stn2-match
   ========================================================================== */
.stn2-match{ position:relative; color:var(--stn2-text); }
.stn2-match .container-fluid{ position:relative; z-index:1; }
.stn2-match .breadcrumbs{ color:var(--stn2-muted); font-size:12.5px; }
.stn2-match .breadcrumbs a{ color:var(--stn2-text2); }
.stn2-match .breadcrumbs-last{ color:var(--stn2-text2); }
.stn2-match .title__h1{ font-family:'Space Grotesk',sans-serif; font-size:24px; font-weight:600; color:var(--stn2-text); background:none; -webkit-text-fill-color:currentColor; }

/* Unified header card: .event__r (league/venue/position) flows first via
   order:-1 as the top strip, .event__l (home | data | away) is the body —
   no DOM changes, so schema.org microdata order/parsing is untouched. */
.stn2-match .event.mt25{
    display:flex; flex-direction:column; gap:0;
    border-radius:var(--stn2-radius-lg); border:1px solid var(--stn2-border); background:var(--stn2-card);
    padding:0; overflow:hidden;
}
.stn2-match .event__r{
    background:transparent !important;
    order:-1; display:flex; flex-direction:row; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
    padding:14px 24px; border-bottom:1px solid var(--stn2-border); font-size:12px; color:var(--stn2-muted);
}
.stn2-match .event__title{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:600; color:var(--stn2-text); text-decoration:none; }
.stn2-match .event__r .event__text{ color:var(--stn2-muted); font-size:12px; line-height:1.7; text-align:right; }
.stn2-match .event__l{
    background:transparent !important;
    display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:16px;
    padding:24px 28px;
}
.stn2-match .event__c{ display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; }
.stn2-match .event__c img{ width:56px; height:56px; border-radius:14px; object-fit:contain; background:oklch(100% 0 0 / .05); }
.stn2-match .event__c-name{ font-size:14.5px; font-weight:600; color:var(--stn2-text); }
.stn2-match .event__c-winner{ color:var(--stn2-text); }
.stn2-match .event__position{ font-size:11px; color:var(--stn2-muted); }
.stn2-match .event__goals{ display:flex; gap:4px; justify-content:center; }
.stn2-match .event__data{ display:flex; flex-direction:column; align-items:center; gap:8px; min-width:170px; }
.stn2-match .event__status{ font-size:11px; color:var(--stn2-text2); background:oklch(100% 0 0 / .06) !important; padding:3px 12px; border-radius:var(--stn2-radius-pill); }
.stn2-match .event__score{ display:flex; align-items:center; justify-content: center; gap:10px; }
.stn2-match .event__score-i{
    font-family:'Space Grotesk',sans-serif; font-size:26px; font-weight:700; color:var(--stn2-text);
    background:oklch(100% 0 0 / .06); padding:6px 16px; border-radius:10px;
}
.stn2-match .event__score-i[data-team="visitorteam"]{ background:color-mix(in oklch, var(--stn2-accent2) 15%, transparent); color:var(--stn2-accent2); }
.stn2-match .event__score-g{ color:var(--stn2-success) !important; }
.stn2-match .event__data .event__text{ font-size:12px; color:var(--stn2-muted); text-align:center; }
.stn2-match .event__data .event__text b{ color:var(--stn2-text2); font-weight:600; }
.stn2-match .event__referee{ text-align:center; margin-top:2px; }
.stn2-match .event__referee-link a{ color:var(--stn2-accent1); font-size:12px; }
@media (max-width:640px){
    .stn2-match .event__l{ grid-template-columns:1fr; justify-items:center; }
    .stn2-match .event__r{ flex-direction:column; align-items:flex-start; }
    .stn2-match .event__r .event__text{ text-align:left; }
}

/* Tab bar (.js-league, shared with League/Team/Referee — scope match-only
   tweaks with the .stn2-match parent class for higher specificity so those
   other pages keep the old sc-redesign draft's tab-bar look untouched) */
.stn2-match.js-league,
.stn2-match .js-league{ margin-top:20px; }
.stn2-match .mySwiper{
    background:transparent !important; margin:0 auto 20px !important;
    position:static !important; top:auto !important;
}
.stn2-match .tools.tools__active{ gap:8px; border-bottom:1px solid var(--stn2-border); padding-bottom:0; }
.stn2-match .tools__active .tools__wrap{
    background:transparent !important; border:none; border-radius:0; box-shadow:none; min-width:0; width:auto !important; overflow:visible;
}
.stn2-match .tools__active .tools__card{
    background-image:none !important; max-width:none; width:auto !important; min-height:0; padding:12px 4px; display:flex; align-items:center; gap:8px;
    border-bottom:2px solid transparent; overflow:visible;
}
.stn2-match .tools__active .tools__icon,
.stn2-match .tools__active .tools__wrap > .tools__card > div[style*="background-image"]{ display:none; }
.stn2-match .tools__active .tools__text{ display:none; }
.stn2-match .tools__active .tools__title{ font-size:13.5px; font-weight:500; color:var(--stn2-muted); white-space:nowrap; }
.stn2-match .tools__active .tools__wrap.active .tools__card{ border-bottom-color:var(--stn2-accent2); }
.stn2-match .tools__active .tools__wrap.active .tools__title{ color:var(--stn2-text); font-weight:600; }
.stn2-match .nova-tab-underline{ display:none; } /* replaced by native border-bottom above; avoid double indicator */

/* ---- Generic tab-content primitives shared by every match-page tab
   (Обзор/Live/Коэффициенты/Команды/Рефери/AI/H2H/vbet/trends all reuse
   these same handful of classes — one pass here covers every tab). ---- */
.stn2-match .title__cnt{ font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:600; color:var(--stn2-text); margin:28px 0 10px; }
.stn2-match .text{ color:var(--stn2-text2); font-size:13.5px; line-height:1.6; }
.stn2-match .event__description{ background:var(--stn2-card) !important; border:1px solid var(--stn2-border); color:var(--stn2-text2); font-size:13.5px; line-height:1.6; }

/* Quick-nav grid (Обзор tab) */
.stn2-quicknav{ display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:14px; margin-top:14px; }
.stn2-quicknav-card{
    display:block; border-radius:var(--stn2-radius-md); border:1px solid var(--stn2-border); background:var(--stn2-card);
    padding:16px 18px; color:inherit; text-decoration:none; transition:border-color .2s, transform .2s;
}
.stn2-quicknav-card:hover{ border-color:var(--stn2-accent2); transform:translateY(-2px); }
.stn2-quicknav-title{ font-size:14px; font-weight:600; color:var(--stn2-text); margin-bottom:4px; }
.stn2-quicknav-desc{ font-size:12.5px; color:var(--stn2-text2); line-height:1.4; }

/* "Статистика встреч" + "Ключевые тренды" pair (Обзор tab) */
.stn2-overview-pair{ display:grid; grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); gap:16px; }
.stn2-overview-card{
    border-radius:var(--stn2-radius-lg); border:1px solid var(--stn2-border); background:var(--stn2-card);
    padding:20px 22px;
}
.stn2-overview-title{ font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:600; color:var(--stn2-text); }
.stn2-overview-sub{ font-size:12.5px; color:var(--stn2-text2); margin-top:4px; margin-bottom:14px; }
.stn2-trends-list{ display:flex; flex-direction:column; gap:12px; margin-top:14px; }
.stn2-trend-row{ display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--stn2-text2); line-height:1.5; }
.stn2-trend-row b{ color:var(--stn2-text); }
.stn2-trend-row .arrow-line-up,
.stn2-trend-row .arrow-line-down{ margin-top:4px; flex-shrink:0; }
.stn2-trend-arrow{ flex-shrink:0; font-weight:700; }

.stn2-summary-card{ border-radius:16px; border:1px solid var(--stn2-border); background:linear-gradient(120deg, color-mix(in oklch, var(--stn2-accent1) 16%, var(--stn2-card-solid)), color-mix(in oklch, var(--stn2-accent2) 12%, var(--stn2-card-solid))); padding:22px; }
.stn2-summary-text{ font-size:13.5px; color:var(--stn2-text2); line-height:1.6; margin-top:10px; }

/* Generic "info card" tiles (.block1__i and friends, reused across Обзор/summary preview cards) */
.stn2-match .block1__i,
.stn2-match .block1__i-ml{
    background:var(--stn2-card); border:1px solid var(--stn2-border); border-radius:var(--stn2-radius-lg);
    color:var(--stn2-text); box-shadow:none;
}
/* These cards carry an inline background-image (v.svg/ml.png/ml2.png) meant
   for the light theme — no dark-mode asset exists, so suppress it rather
   than show a raw light-mode watermark image on the new dark card. */
.stn2-match .block1__i_v,
.stn2-match .block1__i-ml{
    background-image:none !important;
}
.stn2-match .block1__h{ color:var(--stn2-text); font-family:'Space Grotesk',sans-serif; }
.stn2-match .block1__t{ color:var(--stn2-text2); }
.stn2-match .block1__btn{ background:var(--stn2-gradient); color:#fff; border-radius:var(--stn2-radius-pill); box-shadow:none; }
.stn2-match .block1__event-stats{ color:var(--stn2-text); }
.stn2-match .block1__event-stat span{ color:var(--stn2-text2); }
.stn2-match .block1__event-stat b{ color:var(--stn2-text); }

/* Averages / stat tables (Обзор, Команды, Рефери, H2H results). The old
   sc-redesign.css draft also scopes `.js-league .table__row` (present here
   too, since .js-league is the shared tab-JS wrapper) into individual
   rounded light "glass rows" — explicitly neutralize that so the match
   page gets one flat continuous dark table instead. */
.stn2-match .table{ background:var(--stn2-card) !important; border:1px solid var(--stn2-border); border-radius:var(--stn2-radius-md); overflow:hidden; color:var(--stn2-text); box-shadow:none !important; }
.stn2-match .table__h,
.stn2-match .table__row{
    background:transparent !important; border:none !important; border-radius:0 !important;
    border-bottom:1px solid oklch(100% 0 0 / .05) !important; padding:12px 18px; color:var(--stn2-text); transform:none !important;
}
.stn2-match .table__row:hover{ background:oklch(100% 0 0 / .03) !important; }
.stn2-match .table__row:last-child{ border-bottom:none !important; }
.stn2-match .table__name{ color:var(--stn2-text2); }
.stn2-match .table__stat,
.stn2-match .table__events b{ color:var(--stn2-text); font-weight:600; }
.stn2-match .table__events.table__events-h{ color:var(--stn2-muted); font-size:11.5px; text-transform:uppercase; letter-spacing:.4px; background:transparent; }
.stn2-match .has-stat-bar{ position:relative; }

/* Stat split-bars (Live центр + Обзор preview) */
.stn2-match .event-stats-field{ margin-bottom:14px; }
.stn2-match .event-stats-name{ color:var(--stn2-text2); font-size:12px; }
.stn2-match .event-stats-values{ color:var(--stn2-text2); font-size:11.5px; }
.stn2-match .event-stats-localteam,
.stn2-match .event-stats-visitorteam{ color:#fff; font-weight:700; border-radius:5px; padding:1px 8px; font-size:11.5px; }
.stn2-match .event-stats-progress-bar-wrapper{ background:oklch(100% 0 0 / .07); border-radius:4px; overflow:hidden; }
.stn2-match .event-stats-localteam-avg,
.stn2-match .event-stats-visitorteam-avg,
.stn2-match .event-stats-referee-avg{ color:var(--stn2-faint); font-size:11px; }

/* Page-descriptor info banner (every ajax tab: odds/stats/referee/ai/h2h/vbet/trends) */
.stn2-match .page-descriptor{
    display:flex; align-items:center; gap:14px; background:var(--stn2-card); border:1px solid var(--stn2-border);
    border-radius:var(--stn2-radius-md); padding:16px 18px; color:var(--stn2-text);
}
.stn2-match .pd-img{ color:var(--stn2-accent2); flex-shrink:0; }
.stn2-match .pd-title{ font-size:14px; font-weight:600; color:var(--stn2-text); margin:0 0 2px; }
.stn2-match .pd-text{ font-size:12.5px; color:var(--stn2-text2); }
.stn2-match .pd-text a{ color:var(--stn2-accent2); }

/* Odds tables/chips (Коэффициенты tab + Обзор preview) */
.stn2-match .market-odds{ background:var(--stn2-card); border:1px solid var(--stn2-border); border-radius:var(--stn2-radius-md); overflow:hidden; color:var(--stn2-text); }
.stn2-match .odds__h{ color:var(--stn2-muted); font-size:11.5px; text-transform:uppercase; letter-spacing:.4px; border-bottom:1px solid var(--stn2-border); }
.stn2-match .odds__row{ background:transparent !important; border-bottom:1px solid oklch(100% 0 0 / .05); }
.stn2-match .odds__title{ color:var(--stn2-text2); }
.stn2-match .odds__i{ background:oklch(100% 0 0 / .05); color:var(--stn2-text2); border-radius:7px; }
.stn2-match .odds__i-g{ color:var(--stn2-success); }
.stn2-match .odds__i-r{ color:var(--stn2-danger-fg); }
.stn2-match .odds__i-t{ color:var(--stn2-text); font-weight:600; }
.stn2-match .markets-select-rotator .btn,
.stn2-match .btn{
    background:oklch(100% 0 0 / .06); color:var(--stn2-text2); border:1px solid var(--stn2-border); border-radius:var(--stn2-radius-pill);
}
.stn2-match .markets-select-rotator .btn.active,
.stn2-match .markets-select-rotator .btn.selected,
.stn2-match .btn.active,
.stn2-match .btn.selected{ background:var(--stn2-gradient) !important; color:#fff !important; border-color:transparent !important; }
.stn2-match .mySwiper2 .tools__wrap{ background:var(--stn2-card-solid) !important; border:1px solid var(--stn2-border); }
.stn2-match .mySwiper2 .tools__title,
.stn2-match .mySwiper2 .tools__text{ color:var(--stn2-text2); }

/* Filter widgets (filter.html / filters_split.html — Команды/Рефери/AI/H2H/vbet/trends) */
.stn2-match .filters-wrapper{ background:var(--stn2-card); border:1px solid var(--stn2-border); border-radius:var(--stn2-radius-lg); padding:18px; color:var(--stn2-text); }
.stn2-match .filters__title{ color:var(--stn2-text); font-family:'Space Grotesk',sans-serif; }
.stn2-match .filter.multibox,
.stn2-match .filter.singlebox{ background:var(--stn2-card-solid) !important; border-radius:var(--stn2-radius-sm); }
.stn2-match .filter-value select{ background:var(--stn2-card-solid) !important; color:var(--stn2-text) !important; }
.stn2-match .filters-select-single,
.stn2-match .filters-select-multiple,
.stn2-match .filters-input,
.stn2-match .filters-input-search-ajax{
    background:var(--stn2-card-solid); border:1px solid var(--stn2-border); color:var(--stn2-text); border-radius:var(--stn2-radius-sm);
}
.stn2-match .filters-select-rotator-value-wrap,
.stn2-match .filter-multibox-control,
.stn2-match .custombox-button{
    background:oklch(100% 0 0 / .06); border:1px solid var(--stn2-border); color:var(--stn2-text2); border-radius:var(--stn2-radius-pill); flex-wrap:wrap;
}
.stn2-match .filters-select-rotator-value-wrap.selected,
.stn2-match .filters-select-rotator-value-wrap.active{ background:var(--stn2-gradient); color:#fff; }
.stn2-match .filter-submit button{ background:var(--stn2-gradient); color:#fff; border:none; border-radius:var(--stn2-radius-pill); }
.stn2-match .filters__wrap,
.stn2-match .filter{ flex-wrap:wrap; }

/* Probability accordion (Команды/Рефери/H2H) */
.stn2-match .table__statistic-h{ cursor:pointer; color:var(--stn2-text); }
.stn2-match .table__prob{ border-radius:6px; }
.stn2-match .table__win{ color:var(--stn2-success); font-weight:700; }
.stn2-match .table__info-i{ background:oklch(100% 0 0 / .08) !important; color:var(--stn2-muted); }
.stn2-match .table__info{ background:var(--stn2-card-solid); border:1px solid var(--stn2-border); color:var(--stn2-text); }

/* Circular gauge arcs (vbet/trends) */
.stn2-match .arc__wrap{ display:flex; gap:20px; flex-wrap:wrap; }
.stn2-match .arc{ color:var(--stn2-text); }
.stn2-match .arc__val{ color:var(--stn2-text); font-family:'Space Grotesk',sans-serif; }
.stn2-match .arc__text{ color:var(--stn2-text2); font-size:12.5px; }
.stn2-match .table__metrics{ background:var(--stn2-card); border:1px solid var(--stn2-border); color:var(--stn2-text); }

/* Loader/skeleton neutrals */
.stn2-match .loader__wrapper .loader{ border-color:var(--stn2-border) transparent transparent transparent; }
.stn2-match .submit-progress-content-cpt{ color:var(--stn2-text); }
.stn2-match .submit-progress-content-cnt{ color:var(--stn2-text2); }

@media (max-width:600px){
    .stn2-match .event__l{ gap:20px; }
    .stn2-quicknav{ grid-template-columns:1fr; }
}

/* ---- Live центр tab: reorder Ход матча (timeline) to appear first, right
   after the info banner, ahead of stats/xG/pressure/lineups — done purely
   via flex order on distinguishing classes added to event_live.html's
   existing top-level sections, no content was moved. ---- */
.stn2-match .js-league-cnt[data-id="live"]{ flex-direction:column; }
.stn2-match .js-league-cnt.active[data-id="live"]{ display:flex; }
.stn2-match .js-league-cnt[data-id="live"] .stn2-sec-banner{ order:1; }
.stn2-match .js-league-cnt[data-id="live"] .stn2-sec-timeline{ order:2; }
.stn2-match .js-league-cnt[data-id="live"] .stn2-sec-stats{ order:3; }
.stn2-match .js-league-cnt[data-id="live"] .stn2-sec-xg{ order:4; }
.stn2-match .js-league-cnt[data-id="live"] .stn2-sec-pressure{ order:5; }
.stn2-match .js-league-cnt[data-id="live"] .stn2-sec-lineups{ order:6; }
.stn2-match .js-league-cnt[data-id="live"] .content-placeholder{ order:3; }

.stn2-match .event__box{ background:var(--stn2-card); border:1px solid var(--stn2-border); border-radius:var(--stn2-radius-lg); padding:18px 20px; }
.stn2-match .way{ display:flex; flex-direction:column; gap:10px; }
.stn2-match .way__h{
    text-align:center; font-size:12px; color:var(--stn2-muted); background:var(--stn2-card-solid);
    border:1px solid var(--stn2-border); border-radius:var(--stn2-radius-sm); padding:8px 14px;
    display:flex; align-items:center; justify-content:center; gap:10px;
}
.stn2-match .way__row,
.stn2-match .way__row-v{ background:transparent; }
.stn2-match .way__title{ color:var(--stn2-text); font-weight:600; font-size:13px; }
.stn2-match .way__time{ color:var(--stn2-muted); font-size:11.5px; }
.stn2-match .way__b{ color:var(--stn2-text2); font-size:12.5px; }
.stn2-match .way__logo img{ border-radius:8px; background:oklch(100% 0 0 / .06); }

.stn2-match .table__h{ color:var(--stn2-muted); font-size:11px; text-transform:uppercase; letter-spacing:.4px; border-bottom:1px solid var(--stn2-border); }
.stn2-match .table__numb{ color:var(--stn2-faint); }
.stn2-match .event__table-sub{ color:var(--stn2-text); }
.stn2-match .table__ind{ color:var(--stn2-text2); }
.stn2-match .table__bg_r:not(:empty){ background:color-mix(in oklch, var(--stn2-danger) 22%, transparent) !important; }
.stn2-match .table__bg_y:not(:empty){ background:oklch(78% 0.18 85 / .22) !important; color:var(--stn2-text) !important; }
.stn2-match .table__bg_g:not(:empty){ background:color-mix(in oklch, var(--stn2-success) 20%, transparent) !important; }
.stn2-match .lineups-extra-stats{ background:var(--stn2-card-solid) !important; border:1px solid var(--stn2-border); color:var(--stn2-text); }

/* ---- Extra filter-widget primitives (Команды/Рефери/AI/H2H/vbet/trends
   filter forms — singlebox/multibox checkbox chips, custombox dropdown,
   odds horizontal-scroll, misc small tables) not covered by the earlier
   generic pass. ---- */
.stn2-match .singlebox-item,
.stn2-match .multibox-item{
    background:oklch(100% 0 0 / .05); border:1px solid var(--stn2-border); color:var(--stn2-text2); border-radius:var(--stn2-radius-pill);
}
.stn2-match .singlebox-item.selected,
.stn2-match .singlebox-item.checked,
.stn2-match .multibox-item.selected,
.stn2-match .multibox-item.checked{ background:var(--stn2-gradient); color:#fff; border-color:transparent; }
.stn2-match .custombox,
.stn2-match .custombox-button,
.stn2-match .custombox-swiper{ background:var(--stn2-card-solid); border:1px solid var(--stn2-border); color:var(--stn2-text); }
.stn2-match .odds__scroll{ overflow-x:auto; }
.stn2-match .table__judges,
.stn2-match .table__stats,
.stn2-match .table__trend,
.stn2-match .table__warnings{ color:var(--stn2-text2); }
.stn2-match .league-events-wrap,
.stn2-match .event-name-col,
.stn2-match .event-score-col{ color:var(--stn2-text); }
.stn2-match .bets-probability-table-stat-count-value{ color:var(--stn2-text); }
.stn2-match select,
.stn2-match input[type="text"],
.stn2-match input[type="number"]{ background:var(--stn2-card-solid); border:1px solid var(--stn2-border); color:var(--stn2-text); }
.stn2-match input::placeholder{ color:var(--stn2-faint); }

/* error-simple.html's "test-content" placeholder ships its own inline
   <style> with a hardcoded white background — override for the match page */
.stn2-match .test-content{ background:var(--stn2-card) !important; border:1px solid var(--stn2-border); color:var(--stn2-text); }
.stn2-match .test-content-content-cpt{ color:var(--stn2-text); }
.stn2-match .test-content-content-cnt{ color:var(--stn2-text2); }
.stn2-match .test-content-icon img{ display:none; }
.stn2-home .test-content{ background:var(--stn2-card) !important; border:1px solid var(--stn2-border); color:var(--stn2-text); }
.stn2-home .test-content-content-cpt{ color:var(--stn2-text); }
.stn2-home .test-content-content-cnt{ color:var(--stn2-text2); }
.stn2-home .test-content-icon img{ display:none; }

/* ---------- Match tabs redesign (Рефери / Команды / Личные встречи / AI / Коэффициенты) ---------- */
.stn2-match .stn2-chip-row, .stn2-entity .stn2-chip-row{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.stn2-match .stn2-chip, .stn2-entity .stn2-chip{ font-size:12px; font-weight:600; padding:6px 12px; border-radius:8px; cursor:pointer; background:var(--stn2-border); color:var(--stn2-text2); transition:background .2s,color .2s; white-space:nowrap; }
.stn2-match .stn2-chip.active, .stn2-entity .stn2-chip.active{ background:var(--stn2-gradient); color:#fff; }

/* Odds market picker (event_odds.html) — search + grouped-by-category chips */
.stn2-match .stn2-odds-search-wrap{ position:relative; margin-bottom:16px; max-width:340px; }
.stn2-match .stn2-odds-search-icon{ position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--stn2-muted); pointer-events:none; }
.stn2-match .stn2-odds-search-input{ width:100%; background:oklch(100% 0 0 / .04); border:1px solid var(--stn2-border); border-radius:9px; color:var(--stn2-text); font-size:12.5px; font-family:'Inter',sans-serif; padding:8px 12px 8px 34px; }
.stn2-match .stn2-odds-search-input::placeholder{ color:var(--stn2-faint); }
.stn2-match .stn2-odds-search-input:focus{ outline:none; border-color:color-mix(in oklch, var(--stn2-accent2) 45%, transparent); }
.stn2-match .stn2-odds-market-picker{ max-height:340px; overflow-y:auto; padding-right:4px; margin-bottom:20px; border:1px solid var(--stn2-border); border-radius:14px; padding:14px 14px 4px; background:oklch(100% 0 0 / .015); scrollbar-width:thin; scrollbar-color:var(--stn2-border) transparent; }
.stn2-match .stn2-odds-market-picker::-webkit-scrollbar{ width:6px; }
.stn2-match .stn2-odds-market-picker::-webkit-scrollbar-track{ background:transparent; }
.stn2-match .stn2-odds-market-picker::-webkit-scrollbar-thumb{ background:var(--stn2-border); border-radius:3px; }
.stn2-match .stn2-odds-category{ margin-bottom:14px; }
.stn2-match .stn2-odds-category-label{ font-size:10px; text-transform:uppercase; letter-spacing:.5px; font-weight:700; color:var(--stn2-muted); margin-bottom:8px; }
.stn2-match .stn2-odds-category-chips{ margin-bottom:0; }
.stn2-match .stn2-odds-category-chips .stn2-chip{ font-size:11.5px; padding:5px 10px; }

.stn2-match .stn2-filter-card, .stn2-entity .stn2-filter-card{ border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); margin-bottom:20px; overflow:hidden; }
.stn2-match .stn2-filter-head, .stn2-entity .stn2-filter-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px; cursor:pointer; }
.stn2-match .stn2-filter-title, .stn2-entity .stn2-filter-title{ font-family:'Space Grotesk',sans-serif; font-size:14.5px; font-weight:600; margin-bottom:3px; }
.stn2-match .stn2-filter-summary, .stn2-entity .stn2-filter-summary{ font-size:11.5px; color:var(--stn2-muted); }
.stn2-match .stn2-filter-chevron, .stn2-entity .stn2-filter-chevron{ font-size:18px; color:var(--stn2-muted); flex-shrink:0; transition:transform .2s; }
.stn2-match .stn2-filter-card.collapsed .stn2-filter-chevron, .stn2-entity .stn2-filter-card.collapsed .stn2-filter-chevron{ transform:rotate(-90deg); }
.stn2-match .stn2-filter-card.collapsed .stn2-filter-body, .stn2-entity .stn2-filter-card.collapsed .stn2-filter-body{ display:none; }
.stn2-match .stn2-filter-body, .stn2-entity .stn2-filter-body{ padding:0 20px 20px; border-top:1px solid var(--stn2-border); }
.stn2-match .stn2-filter-group-label, .stn2-entity .stn2-filter-group-label{ font-size:10.5px; color:var(--stn2-faint); text-transform:uppercase; letter-spacing:.4px; margin:16px 0 8px; }
.stn2-match .stn2-filter-static-chip, .stn2-entity .stn2-filter-static-chip{ display:inline-block; font-size:11.5px; color:var(--stn2-text2); background:var(--stn2-border); padding:6px 11px; border-radius:8px; margin-right:6px; }
.stn2-match .stn2-cta-btn, .stn2-entity .stn2-cta-btn{ display:block; text-align:center; padding:13px; border-radius:12px; background:var(--stn2-gradient); color:#fff; font-weight:600; font-size:14px; cursor:pointer; border:none; width:100%; margin-bottom:28px; }
.stn2-match .stn2-cta-btn:disabled, .stn2-entity .stn2-cta-btn:disabled{ opacity:.6; cursor:default; }

.stn2-match .stn2-ref-kpis{ display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:14px; }
.stn2-match .stn2-ref-kpi{ border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:16px 18px; transition:box-shadow .2s; }
.stn2-match .stn2-ref-kpi_active{ box-shadow:0 0 0 1.5px var(--stn2-accent1); }
.stn2-match .stn2-ref-kpi-label{ font-size:12px; color:var(--stn2-text2); margin-bottom:8px; }
.stn2-match .stn2-ref-kpi-value{ font-family:'Space Grotesk',sans-serif; font-size:28px; font-weight:700; color:var(--stn2-text); }
.stn2-match .stn2-ref-kpi-sub{ font-size:11px; color:var(--stn2-faint); margin-top:2px; }

.stn2-match .stn2-bar-legend{ display:flex; gap:16px; padding:12px 0 4px; }
.stn2-match .stn2-bar-legend span{ display:flex; align-items:center; gap:6px; font-size:11.5px; color:var(--stn2-text2); }
.stn2-match .stn2-bar-legend-dot{ width:9px; height:9px; border-radius:3px; display:inline-block; }

.stn2-match .stn2-team-filters{ display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:16px; }
.stn2-match .stn2-team-filter{ border-radius:12px; background:var(--stn2-border); padding:14px 16px; border-left:3px solid var(--stn2-accent2); }
.stn2-match .stn2-team-filter-name{ font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:600; margin-bottom:10px; }

.stn2-match .stn2-radar-row{ display:grid; grid-template-columns:minmax(220px, 280px) 1fr; gap:20px; margin-bottom:28px; align-items:start; }
.stn2-match .stn2-radar-card{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:18px; display:flex; flex-direction:column; align-items:center; }
.stn2-match .stn2-radar-wrap{ position:relative; width:100%; max-width:230px; aspect-ratio:260/250; }
.stn2-match .stn2-radar-svg{ width:100%; height:100%; display:block; }
.stn2-match .stn2-radar-grid{ fill:none; stroke:var(--stn2-border-2); stroke-width:1; }
.stn2-match .stn2-radar-poly{ stroke-width:1.5; }
.stn2-match .stn2-radar-poly_home{ fill:color-mix(in oklch, var(--stn2-accent2) 20%, transparent); stroke:var(--stn2-accent2); }
.stn2-match .stn2-radar-poly_away{ fill:color-mix(in oklch, var(--stn2-accent1) 20%, transparent); stroke:var(--stn2-accent1); }
.stn2-match .stn2-radar-label{ position:absolute; transform:translate(-50%,-50%); font-size:9.5px; line-height:1.2; text-align:center; color:var(--stn2-text2); white-space:nowrap; pointer-events:none; }
.stn2-match .stn2-radar-bars{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:8px 20px; }
.stn2-match .event-stats-field.stn2-bar-row_active{ box-shadow:inset 3px 0 0 var(--stn2-accent1); padding-left:9px; }

.stn2-match .stn2-ai-group, .stn2-entity .stn2-ai-group{ margin-bottom:28px; }
.stn2-match .stn2-ai-group-title, .stn2-entity .stn2-ai-group-title{ display:flex; align-items:center; gap:10px; font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:600; color:var(--stn2-text); margin-bottom:14px; }
.stn2-match .stn2-ai-group-count, .stn2-entity .stn2-ai-group-count{ font-family:'Inter',sans-serif; font-size:11.5px; font-weight:600; color:var(--stn2-muted); background:var(--stn2-border); border-radius:999px; padding:2px 9px; }
.stn2-match .stn2-ai-grid, .stn2-entity .stn2-ai-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; }
@media (max-width:900px){ .stn2-match .stn2-ai-grid, .stn2-entity .stn2-ai-grid{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:600px){ .stn2-match .stn2-ai-grid, .stn2-entity .stn2-ai-grid{ grid-template-columns:1fr; } }
.stn2-match .stn2-ai-card, .stn2-entity .stn2-ai-card{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:18px; display:flex; gap:14px; align-items:center; }
.stn2-match .stn2-ai-ring, .stn2-entity .stn2-ai-ring{ position:relative; width:64px; height:64px; border-radius:50%; flex-shrink:0; }
.stn2-match .stn2-ai-ring-inner, .stn2-entity .stn2-ai-ring-inner{ position:absolute; inset:6px; border-radius:50%; background:var(--stn2-card-solid); display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:15px; color:var(--stn2-text); }
.stn2-match .stn2-ai-card-body, .stn2-entity .stn2-ai-card-body{ flex:1; min-width:0; }
.stn2-match .stn2-ai-card-meta, .stn2-entity .stn2-ai-card-meta{ font-size:12px; color:var(--stn2-faint); margin-bottom:5px; }
.stn2-match .stn2-ai-card-title, .stn2-entity .stn2-ai-card-title{ display:block; font-size:14px; font-weight:600; margin-bottom:8px; line-height:1.3; color:var(--stn2-text); }
.stn2-match .stn2-ai-card-chips, .stn2-entity .stn2-ai-card-chips{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.stn2-match .stn2-ai-chip, .stn2-entity .stn2-ai-chip{ font-size:11.5px; font-weight:600; background:var(--stn2-border); padding:3px 9px; border-radius:6px; color:var(--stn2-text); }
.stn2-match .stn2-ai-chip_prob, .stn2-entity .stn2-ai-chip_prob{ color:var(--stn2-accent2); background:color-mix(in oklch, var(--stn2-accent2) 12%, transparent); font-weight:700; }
.stn2-match .stn2-ai-card-sub, .stn2-entity .stn2-ai-card-sub{ font-size:11px; color:var(--stn2-faint); }

.stn2-match .stn2-drop-card{ flex:0 0 190px; border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:16px; }
.stn2-match .stn2-drop-card-pct{ display:flex; align-items:center; gap:6px; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:17px; margin-bottom:8px; }
.stn2-match .stn2-drop-card-vals{ display:flex; align-items:center; gap:6px; font-size:12.5px; margin-bottom:10px; color:var(--stn2-text2); }
.stn2-match .stn2-drop-card-from{ background:var(--stn2-border); padding:2px 7px; border-radius:6px; }
.stn2-match .stn2-drop-card-to{ background:color-mix(in oklch, var(--stn2-accent2) 15%, transparent); color:var(--stn2-accent2); padding:2px 7px; border-radius:6px; }
.stn2-match .stn2-drop-card-market{ font-size:12px; font-weight:600; color:var(--stn2-text); }
.stn2-match .stn2-drop-card-book{ font-size:11px; color:var(--stn2-faint); margin-top:2px; }

.stn2-match .stn2-odds-summary-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:14px; margin:16px 0 22px; }
.stn2-match .stn2-odds-summary-card{ border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:16px 18px; }
.stn2-match .stn2-odds-summary-label{ font-size:12.5px; color:var(--stn2-text2); margin-bottom:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-match .stn2-odds-summary-avg{ display:flex; align-items:baseline; gap:8px; margin-bottom:10px; font-family:'Space Grotesk',sans-serif; font-size:26px; font-weight:700; color:var(--stn2-text); }
.stn2-match .stn2-odds-summary-avg span{ font-size:12px; font-weight:400; color:var(--stn2-muted); }
.stn2-match .stn2-odds-summary-prob-row{ display:flex; align-items:center; justify-content:space-between; font-size:11px; color:var(--stn2-muted); margin-bottom:5px; }
.stn2-match .stn2-odds-summary-prob-row span:last-child{ font-weight:600; color:var(--stn2-text); }
.stn2-match .stn2-odds-summary-bar{ height:6px; border-radius:5px; background:var(--stn2-border); overflow:hidden; }
.stn2-match .stn2-odds-summary-bar div{ height:100%; border-radius:5px; background:var(--stn2-gradient); }

.stn2-match .stn2-odds-table-wrap{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow-x:auto; margin-bottom:28px; }
.stn2-match .stn2-odds-table{ display:table; width:100%; }
.stn2-match .stn2-odds-row{ display:grid; align-items:center; padding:13px 20px; border-bottom:1px solid var(--stn2-border); gap:8px; }
.stn2-match .stn2-odds-row:last-child{ border-bottom:none; }
.stn2-match .stn2-odds-row_head{ font-size:11.5px; color:var(--stn2-faint); text-transform:uppercase; letter-spacing:.4px; padding:12px 20px; }
.stn2-match .stn2-odds-row_avg{ background:color-mix(in oklch, var(--stn2-text) 3%, transparent); font-weight:700; font-size:12.5px; color:var(--stn2-text2); }
.stn2-match .stn2-odds-book{ display:flex; align-items:center; gap:9px; font-size:13.5px; font-weight:500; color:var(--stn2-text); }
.stn2-match .stn2-odds-book-initials{ width:26px; height:26px; border-radius:8px; background:var(--stn2-border); display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; color:var(--stn2-text2); flex-shrink:0; }
.stn2-match .stn2-odds-cell{ font-size:12.5px; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.stn2-match .stn2-odds-cell_empty{ color:var(--stn2-faint); }
.stn2-match .stn2-odds-val{ background:var(--stn2-border); padding:3px 9px; border-radius:6px; font-weight:600; color:var(--stn2-text); }
.stn2-match .stn2-odds-val_best{ background:var(--stn2-gradient); color:#fff; font-weight:700; box-shadow:0 0 0 1px color-mix(in oklch, white 15%, transparent); }
.stn2-match .stn2-odds-change{ font-size:11px; color:var(--stn2-muted); }

.stn2-match .stn2-facts-row{ display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:20px; margin-bottom:28px; }
.stn2-match .stn2-facts-card{ border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; margin-top: 10px; }
.stn2-match .stn2-fact-item{ display:flex; align-items:flex-start; gap:10px; padding:12px 16px; border-bottom:1px solid var(--stn2-border); font-size:12.5px; color:var(--stn2-text2); line-height:1.4; }
.stn2-match .stn2-fact-item:last-child{ border-bottom:none; }
.stn2-match .stn2-fact-arrow{ flex-shrink:0; font-weight:700; }

.stn2-match .stn2-samples-pair{ display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:20px; }
.stn2-match .stn2-samples-heading{ font-size:13px; font-weight:600; color:var(--stn2-text2); margin-bottom:10px; }
.stn2-match .stn2-samples-table{ border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; }
.stn2-match .stn2-samples-row{ display:grid; grid-template-columns:88px 1.2fr 1fr 60px; gap:10px; align-items:center; padding:12px 16px; border-bottom:1px solid var(--stn2-border); font-size:12px; color:var(--stn2-text); text-decoration:none; }
.stn2-match .stn2-samples-row:last-child{ border-bottom:none; }
.stn2-match .stn2-samples-row:hover{ background:color-mix(in oklch, var(--stn2-text) 3%, transparent); }
.stn2-match .stn2-samples-date{ color:var(--stn2-faint); white-space:nowrap; }
.stn2-match .stn2-samples-competition{ color:var(--stn2-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-match .stn2-samples-teams{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stn2-match .stn2-samples-vs{ color:var(--stn2-faint); }
.stn2-match .stn2-samples-score{ font-weight:700; text-align:right; }
.stn2-match .stn2-samples-row-outer .stn2-samples-row{ padding-right:36px; }
.stn2-match .stn2-samples-exclude, .stn2-entity .stn2-samples-exclude{ position:absolute; right:10px; top:50%; transform:translateY(-50%); width:20px; height:20px; display:flex; align-items:center; justify-content:center; border-radius:50%; color:var(--stn2-muted); cursor:pointer; font-size:16px; line-height:1; }
.stn2-match .stn2-samples-exclude:hover, .stn2-entity .stn2-samples-exclude:hover{ background:color-mix(in oklch, var(--stn2-danger) 15%, transparent); color:var(--stn2-danger); }
/* Чекбокс «учитывать матч в выборке» (замена крестика). Ставится поверх строки
   справа; остаётся кликабельным даже когда строка помечена исключённой, чтобы
   матч можно было вернуть обратно (снять/поставить галку). */
.stn2-match .stn2-samples-toggle, .stn2-entity .stn2-samples-toggle{ position:absolute; right:10px; top:50%; transform:translateY(-50%); display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:2; padding:4px; }
.stn2-match .stn2-samples-toggle-input, .stn2-entity .stn2-samples-toggle-input{ width:16px; height:16px; margin:0; cursor:pointer; accent-color:var(--stn2-accent2); }
/* Исключённый матч: гасим/зачёркиваем только СТРОКУ-ссылку и запрещаем переход по
   ней; сам чекбокс (в .stn2-samples-toggle) остаётся активным. */
.stn2-match .stn2-samples-row-outer.stn2-samples-row-excluded .stn2-samples-row, .stn2-entity .stn2-samples-row-outer.stn2-samples-row-excluded .stn2-samples-row, .stn2-match .stn2-samples-row-outer.stn2-samples-row-excluded .stn2-match-card, .stn2-entity .stn2-samples-row-outer.stn2-samples-row-excluded .stn2-match-card{ opacity:.35; text-decoration:line-through; pointer-events:none; }

.stn2-match .stn2-prob-accordion, .stn2-entity .stn2-prob-accordion{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; }
.stn2-match .stn2-prob-market-head, .stn2-entity .stn2-prob-market-head{ display:flex; align-items:center; justify-content:space-between; padding:14px 20px; border-bottom:1px solid var(--stn2-border); cursor:pointer; font-size:13.5px; font-weight:500; color:var(--stn2-text); }
.stn2-match .stn2-prob-market:last-child .stn2-prob-market-head, .stn2-entity .stn2-prob-market:last-child .stn2-prob-market-head{ border-bottom:none; }
.stn2-match .stn2-prob-market_open .stn2-prob-market-head, .stn2-entity .stn2-prob-market_open .stn2-prob-market-head{ border-bottom:1px solid var(--stn2-border); }
.stn2-match .stn2-prob-market-chevron, .stn2-entity .stn2-prob-market-chevron{ color:var(--stn2-muted); transition:transform .2s; display:inline-block; }
.stn2-match .stn2-prob-market_open .stn2-prob-market-chevron, .stn2-entity .stn2-prob-market_open .stn2-prob-market-chevron{ transform:rotate(90deg); }
.stn2-match .stn2-prob-market-body, .stn2-entity .stn2-prob-market-body{ padding:6px 20px 16px; border-bottom:1px solid var(--stn2-border); overflow-x:auto; }
.stn2-match .stn2-prob-market:last-child .stn2-prob-market-body, .stn2-entity .stn2-prob-market:last-child .stn2-prob-market-body{ border-bottom:none; }
.stn2-match .stn2-prob-row, .stn2-entity .stn2-prob-row{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; gap:8px; align-items:center; padding:6px 0; font-size:12px; }
.stn2-match .stn2-prob-row_head, .stn2-entity .stn2-prob-row_head{ font-size:10.5px; color:var(--stn2-faint); text-transform:uppercase; letter-spacing:.4px; padding:8px 0; }
.stn2-match .stn2-prob-threshold, .stn2-entity .stn2-prob-threshold{ color:var(--stn2-text2); }
.stn2-match .stn2-prob-count, .stn2-entity .stn2-prob-count{ padding:2px 8px; border-radius:6px; text-align:center; color:var(--stn2-text); }
.stn2-match .stn2-prob-pct, .stn2-entity .stn2-prob-pct{ color:var(--stn2-muted); }

/* ==========================================================================
   League / Team / Referee entity pages — shared shell + components
   Source of truth: STATIA_new_design2/design_handoff_league_team_referee/
   ========================================================================== */
.stn2-entity{ max-width:1360px; margin:0 auto; padding:0 40px; }
.stn2-entity-crumbs{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--stn2-faint); margin-bottom:12px; }
.stn2-entity-crumbs a{ color:var(--stn2-faint); text-decoration:none; }
.stn2-entity-head{ display:flex; align-items:center; gap:14px; margin-bottom:10px; }
.stn2-entity-avatar{ width:46px; height:46px; border-radius:12px; background:var(--stn2-gradient); display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:18px; flex-shrink:0; color:#fff; overflow:hidden; }
.stn2-entity-avatar img{ width:100%; height:100%; object-fit:cover; }
.stn2-entity-title{ font-family:'Space Grotesk',sans-serif; font-size:25px; font-weight:600; color:var(--stn2-text); }
.stn2-entity-desc{ font-size:13px; color:var(--stn2-muted); line-height:1.6; max-width:820px; margin-bottom:22px; }
/* Team-page rating radar — mirrors .stn2-match .stn2-radar-* (used by the match-page
   H2H radar) but scoped to .stn2-entity instead, since that class isn't present on
   team.html's wrapper and none of the .stn2-match-scoped rules would otherwise apply
   here. Single-card layout (no second bars column, unlike the H2H version) since this
   shows one team's own rating profile, not a two-team comparison. */
.stn2-entity .stn2-radar-row{ display:flex; margin-bottom:28px; }
.stn2-entity .stn2-radar-card{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:18px; display:flex; flex-direction:column; align-items:center; width:100%; max-width:280px; }
.stn2-entity .stn2-radar-wrap{ position:relative; width:100%; max-width:230px; aspect-ratio:260/250; }
.stn2-entity .stn2-radar-svg{ width:100%; height:100%; display:block; }
.stn2-entity .stn2-radar-grid{ fill:none; stroke:var(--stn2-border-2); stroke-width:1; }
.stn2-entity .stn2-radar-poly{ stroke-width:1.5; }
.stn2-entity .stn2-radar-poly_home{ fill:color-mix(in oklch, var(--stn2-accent2) 20%, transparent); stroke:var(--stn2-accent2); }
.stn2-entity .stn2-radar-label{ position:absolute; transform:translate(-50%,-50%); font-size:9.5px; line-height:1.2; text-align:center; color:var(--stn2-text2); white-space:nowrap; pointer-events:none; }

.stn2-entity-kpistrip{ display:flex; gap:10px; flex-wrap:wrap; }
.stn2-entity-kpistrip-item{ text-align:right; }
.stn2-entity-kpistrip-value{ font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:700; color:var(--stn2-accent2); }
.stn2-entity-kpistrip-label{ font-size:10.5px; color:var(--stn2-faint); text-transform:uppercase; letter-spacing:.4px; }

.stn2-entity-tabs{ position:sticky; top:69px; z-index:20; display:flex; gap:4px; background:var(--stn2-card); backdrop-filter:blur(12px); border:1px solid var(--stn2-border); border-radius:14px; padding:5px; margin-bottom:22px; overflow-x:auto; width:fit-content; max-width:100%; scrollbar-width:none; }
.stn2-entity-tabs::-webkit-scrollbar{ display:none; }
.stn2-entity-tab{ display:flex; align-items:center; gap:8px; padding:10px 16px; border-radius:10px; cursor:pointer; font-size:13.5px; font-weight:500; white-space:nowrap; color:var(--stn2-text2); transition:background .15s; }
.stn2-entity-tab.active{ background:var(--stn2-gradient); color:#fff; font-weight:600; }
.stn2-entity-tab svg{ display:block; }

.stn2-entity-info{ display:flex; align-items:center; gap:10px; font-size:12.5px; color:var(--stn2-muted); margin-bottom:22px; line-height:1.5; }
.stn2-entity-info-dot{ width:6px; height:6px; border-radius:50%; background:var(--stn2-accent2); flex-shrink:0; }

.stn2-kpitile-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-bottom:28px; }
.stn2-kpitile{ border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:13px 15px; }
.stn2-kpitile-value{ font-family:'Space Grotesk',sans-serif; font-size:19px; font-weight:700; color:var(--stn2-text); }
.stn2-kpitile-label{ font-size:11px; color:var(--stn2-faint); margin-top:3px; line-height:1.3; }

.stn2-matches-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:10px; margin-bottom:28px; }
.stn2-match-card{ border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:13px 16px; text-decoration:none; display:block; color:inherit; }
.stn2-match-card-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; gap:8px; }
.stn2-match-card-meta{ font-size:11px; color:var(--stn2-faint); }
.stn2-match-card-status{ font-size:11px; font-weight:600; padding:4px 10px; border-radius:999px; background:color-mix(in oklch, var(--stn2-accent2) 15%, transparent); color:var(--stn2-accent2); white-space:nowrap; flex-shrink:0; }
.stn2-match-card-status_final{ font-size:13px; font-weight:700; color:var(--stn2-text); background:none; padding:0; border-radius:0; }
.stn2-match-card-teams{ font-size:13.5px; font-weight:500; color:var(--stn2-text); }
.stn2-match-card-sub{ font-size:11.5px; color:var(--stn2-faint); margin-top:4px; }

.stn2-avatar-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:14px; margin-bottom:28px; }
.stn2-avatar-tile{ display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; text-decoration:none; color:inherit; }
.stn2-avatar-tile-icon{ width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:14px; color:#fff; flex-shrink:0; overflow:hidden; }
.stn2-avatar-tile-icon img{ width:100%; height:100%; object-fit:cover; }
.stn2-avatar-tile-label{ font-size:11.5px; color:var(--stn2-text2); line-height:1.3; }

.stn2-scroll-list{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; max-height:320px; overflow-y:auto;     scrollbar-width: thin; scrollbar-color: var(--stn2-border) transparent; }
.stn2-scroll-list-row{ padding:11px 18px; border-top:1px solid var(--stn2-border); font-size:12.5px; color:var(--stn2-accent2); cursor:pointer; text-decoration:none; display:block; }
.stn2-scroll-list-row:first-child{ border-top:none; }

.stn2-leaderboard{ border-radius:18px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; }
.stn2-leaderboard-head{ display:flex; align-items:center; gap:8px; padding:12px 20px; font-size:11px; color:var(--stn2-faint); border-bottom:1px solid var(--stn2-border); }
.stn2-leaderboard-row{ position:relative; padding:11px 20px; border-top:1px solid var(--stn2-border); overflow:hidden; }
.stn2-leaderboard-row:first-child{ border-top:none; }
.stn2-leaderboard-fill{ position:absolute; inset:0; background:linear-gradient(90deg, color-mix(in oklch, var(--stn2-accent2) 22%, transparent), color-mix(in oklch, var(--stn2-accent2) 8%, transparent)); border-right:2px solid color-mix(in oklch, var(--stn2-accent2) 30%, transparent); }
.stn2-leaderboard-content{ position:relative; display:flex; align-items:center; gap:14px; font-size:13px; }
.stn2-leaderboard-content b{ font-family:'Space Grotesk',sans-serif; }

.stn2-medal-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin-bottom:20px; }
.stn2-medal-card{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:16px; }
.stn2-medal-card_gold{ background:linear-gradient(135deg, color-mix(in oklch, var(--stn2-accent2) 16%, var(--stn2-card-solid)), var(--stn2-card-solid)); }
.stn2-medal-card-top{ display:flex; align-items:center; gap:8px; font-size:18px; margin-bottom:8px; }
.stn2-medal-card-name{ font-size:13px; font-weight:600; color:var(--stn2-text); margin-bottom:6px; }
.stn2-medal-card-pct{ font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700; color:var(--stn2-accent2); }
.stn2-medal-card-sub{ font-size:11px; color:var(--stn2-faint); margin-top:2px; }

.stn2-standings{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; }
.stn2-standings-row{ display:grid; grid-template-columns:28px 1.6fr repeat(6,36px); gap:6px; align-items:center; padding:9px 16px; border-top:1px solid var(--stn2-border); font-size:12.5px; border-left:3px solid transparent; }
.stn2-standings-row:first-child{ border-top:none; }
.stn2-standings-row_euro{ border-left-color:var(--stn2-accent2); }
.stn2-standings-row_relegation{ border-left-color:oklch(66% 0.21 25); }
.stn2-standings-head{ display:grid; grid-template-columns:28px 1.6fr repeat(6,36px); gap:6px; padding:9px 16px; font-size:10.5px; color:var(--stn2-faint); text-transform:uppercase; letter-spacing:.4px; }
.stn2-standings-team{ display:flex; align-items:center; gap:8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stn2-standings-crest{ width:22px; height:22px; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; color:#fff; flex-shrink:0; }




.stn2-league-grid{ display:grid; grid-template-columns:1.7fr 1fr; gap:22px; align-items:start; }
@media (max-width: 900px){ .stn2-league-grid{ grid-template-columns:1fr; } }
.stn2-league-kpis{ display:flex; gap:10px; flex-wrap:wrap; }
.stn2-league-kpi{ border-radius:12px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:9px 16px; min-width:96px; }
.stn2-league-kpi-value{ font-family:'Space Grotesk',sans-serif; font-size:17px; font-weight:700; color:var(--stn2-accent2); }
.stn2-league-kpi-label{ font-size:10.5px; color:var(--stn2-faint); text-transform:uppercase; letter-spacing:.3px; margin-top:1px; }

/* ==========================================================================
   Analytics tools pages (Тренды на дату / Анализ дня / Прогрузы / AI прогнозы)
   Source of truth: STATIA_new_design3/design_handoff_analytics_tools/
   ========================================================================== */
.stn2-tools-title-row{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:20px; }
.stn2-tools-title{ display:flex; align-items:center; gap:14px; }
.stn2-tools-title-icon{ width:46px; height:46px; border-radius:12px; background:var(--stn2-gradient); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:#fff; }
.stn2-tools-title-text{ font-family:'Space Grotesk',sans-serif; font-size:26px; font-weight:600; }
.stn2-live-badge{ display:flex; align-items:center; gap:8px; font-size:12px; color:var(--stn2-accent2); background:color-mix(in oklch, var(--stn2-accent2) 14%, transparent); border:1px solid color-mix(in oklch, var(--stn2-accent2) 30%, transparent); padding:8px 14px; border-radius:999px; }
.stn2-live-dot{ width:7px; height:7px; border-radius:50%; background:var(--stn2-accent2); animation:stn2PulseDot 1.8s ease-in-out infinite; }
@keyframes stn2PulseDot{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }

.stn2-info-callout{ display:flex; gap:14px; align-items:flex-start; border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:16px 20px; margin-bottom:26px; }
.stn2-info-callout-icon{ width:30px; height:30px; border-radius:9px; background:color-mix(in oklch, var(--stn2-accent1) 22%, transparent); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--stn2-accent1); }
.stn2-info-callout-text{ font-size:13px; color:var(--stn2-text2); line-height:1.6; }
.stn2-info-callout-text a{ color:var(--stn2-accent2); }

.stn2-tools-filtercard{ border-radius:20px; border:1px solid var(--stn2-border); background:linear-gradient(180deg, color-mix(in oklch, var(--stn2-card-solid) 88%, var(--stn2-accent1) 6%), var(--stn2-card-solid)); overflow:hidden; margin-bottom:26px; box-shadow:0 20px 50px -30px rgba(0,0,0,.6); }
.stn2-tools-filtercard-row{ display:flex; flex-wrap:wrap; gap:16px; align-items:flex-end; padding:20px 22px; border-bottom:1px solid var(--stn2-border); }
.stn2-tools-filtercard-grid{ padding:20px 22px; display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:20px; }
.stn2-tools-fgroup-label{ display:flex; align-items:center; gap:7px; font-size:10.5px; text-transform:uppercase; letter-spacing:.4px; color:var(--stn2-faint); font-weight:600; margin-bottom:9px; }

.stn2-dd{ position:relative; flex:1; min-width:220px; }
.stn2-dd-label{ font-size:10.5px; text-transform:uppercase; letter-spacing:.4px; color:var(--stn2-faint); margin-bottom:7px; font-weight:600; }
.stn2-dd-trigger{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:11px 15px; border-radius:11px; background:color-mix(in oklch, #fff 5%, transparent); border:1px solid var(--stn2-border); cursor:pointer; }
.stn2-dd-trigger span:first-child{ font-size:13.5px; font-weight:500; }
.stn2-dd-chevron{ font-size:12px; color:var(--stn2-faint); display:inline-block; transition:transform .2s; }
.stn2-dd-panel{ position:absolute; top:100%; left:0; right:0; margin-top:6px; border-radius:12px; background:var(--stn2-card-solid); border:1px solid var(--stn2-border); box-shadow:0 16px 40px -12px rgba(0,0,0,.6); z-index:25; overflow:hidden; display:none; }
.stn2-dd-panel.open{ display:block; }
.stn2-dd-option{ padding:10px 15px; font-size:13px; cursor:pointer; color:var(--stn2-text2); }
.stn2-dd-option:hover{ background:color-mix(in oklch, #fff 4%, transparent); }
.stn2-dd-option.active{ color:var(--stn2-accent2); background:color-mix(in oklch, var(--stn2-accent2) 12%, transparent); }

.stn2-slider-group{ flex:1.4; min-width:260px; }
.stn2-slider-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:7px; }
.stn2-slider-value{ font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:700; color:var(--stn2-accent2); }
input[type=range].stn2-slider{ -webkit-appearance:none; appearance:none; height:6px; border-radius:4px; outline:none; width:100%; display:block; }
input[type=range].stn2-slider::-webkit-slider-thumb{ -webkit-appearance:none; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 0 0 4px var(--stn2-accent2), 0 2px 8px rgba(0,0,0,.4); cursor:pointer; }
input[type=range].stn2-slider::-moz-range-thumb{ width:18px; height:18px; border:none; border-radius:50%; background:#fff; box-shadow:0 0 0 4px var(--stn2-accent2), 0 2px 8px rgba(0,0,0,.4); cursor:pointer; }

.stn2-tools-cta{ text-align:center; padding:15px; background:var(--stn2-gradient); font-weight:600; font-size:14.5px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; color:#fff; }
.stn2-tools-cta:hover{ filter:brightness(1.05); }

.stn2-results-head{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:6px; }
.stn2-results-title{ font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:600; }
.stn2-results-disclaimer{ font-size:11.5px; color:var(--stn2-faint); margin-bottom:16px; }
.stn2-results-disclaimer a{ color:var(--stn2-accent2); }

.stn2-search-bar{ display:flex; align-items:center; gap:12px; border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:12px 16px; margin-bottom:24px; }
.stn2-search-bar input{ flex:1; background:transparent; border:none; outline:none; color:var(--stn2-text); font-size:13.5px; font-family:'Inter',sans-serif; }
.stn2-search-bar input::placeholder{ color:var(--stn2-faint); }

.stn2-daygroup-head{ display:flex; align-items:baseline; gap:10px; margin-bottom:12px; }
.stn2-daygroup-name{ font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:600; }
.stn2-daygroup-meta{ font-size:11.5px; color:var(--stn2-faint); }

.stn2-daymatch-row{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:16px 18px; display:grid; grid-template-columns:1fr auto; gap:16px; align-items:center; margin-bottom:10px; }
.stn2-daymatch-meta{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:9px; }
.stn2-daymatch-date{ font-size:11.5px; color:var(--stn2-faint); font-weight:500; }
.stn2-daymatch-ref{ display:flex; align-items:center; gap:5px; font-size:11px; color:var(--stn2-muted); background:color-mix(in oklch, #fff 5%, transparent); padding:3px 9px; border-radius:999px; }
.stn2-daymatch-team{ display:flex; align-items:center; gap:10px; margin-bottom:5px; }
.stn2-daymatch-team:last-child{ margin-bottom:0; }
.stn2-daymatch-avatar{ width:24px; height:24px; border-radius:7px; display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; color:#fff; flex-shrink:0; }
.stn2-daymatch-team-name{ font-size:13.5px; font-weight:500; }
.stn2-gauge-wrap{ display:flex; flex-direction:column; align-items:flex-end; gap:8px; min-width:150px; }
.stn2-gauge-val-chips{ display:flex; gap:6px; }
.stn2-gauge-chip{ font-size:11px; font-weight:600; padding:5px 10px; border-radius:8px; background:color-mix(in oklch, #fff 6%, transparent); color:var(--stn2-text2); min-width:36px; text-align:center; }
.stn2-gauge-ring{ width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stn2-gauge-inner{ width:34px; height:34px; border-radius:50%; background:var(--stn2-card-solid); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; }

.stn2-range-group{ flex:1.3; min-width:250px; }
.stn2-range-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:7px; }
.stn2-range-value{ font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:700; color:var(--stn2-accent2); }
.stn2-range-track{ position:relative; height:6px; border-radius:4px; background:color-mix(in oklch, #fff 9%, transparent); }
.stn2-range-track-fill{ position:absolute; top:0; bottom:0; border-radius:4px; background:var(--stn2-gradient); }
.stn2-range-inputs{ display:flex; gap:8px; margin-top:8px; }
.stn2-range-inputs input{ width:64px; background:color-mix(in oklch, #fff 5%, transparent); border:1px solid var(--stn2-border); border-radius:8px; color:var(--stn2-text); font-size:12.5px; padding:5px 8px; font-family:'Inter',sans-serif; -moz-appearance:textfield; }
.stn2-range-inputs input::-webkit-outer-spin-button, .stn2-range-inputs input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }

.stn2-sort-dd{ position:relative; }
.stn2-sort-trigger{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--stn2-text2); background:color-mix(in oklch, #fff 5%, transparent); border:1px solid var(--stn2-border); padding:8px 13px; border-radius:9px; cursor:pointer; }
.stn2-sort-trigger b{ font-weight:600; color:var(--stn2-text); }
.stn2-sort-panel{ position:absolute; top:100%; right:0; margin-top:6px; min-width:170px; border-radius:12px; background:var(--stn2-card-solid); border:1px solid var(--stn2-border); box-shadow:0 16px 40px -12px rgba(0,0,0,.6); z-index:25; overflow:hidden; display:none; }
.stn2-sort-panel.open{ display:block; }

.stn2-vcard{ border-radius:18px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; margin-bottom:14px; }
.stn2-vcard-head{ padding:16px 20px; border-bottom:1px solid var(--stn2-border); }
.stn2-vcard-meta{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.stn2-vcard-league-tag{ font-size:11px; color:var(--stn2-accent2); background:color-mix(in oklch, var(--stn2-accent2) 14%, transparent); padding:3px 9px; border-radius:999px; font-weight:600; }
.stn2-vcard-team{ display:flex; align-items:center; gap:10px; margin-bottom:5px; }
.stn2-vcard-team:last-child{ margin-bottom:0; }
.stn2-vcard-team-name{ font-size:14px; font-weight:600; }
.stn2-vcard-market{ padding:14px 20px; border-bottom:1px solid color-mix(in oklch, #fff 5%, transparent); }
.stn2-vcard-market:last-child{ border-bottom:none; }
.stn2-vcard-market-title{ font-size:12.5px; font-weight:600; color:var(--stn2-text2); margin-bottom:10px; }
.stn2-vcard-row{ display:grid; grid-template-columns:70px 1fr 1fr auto; gap:16px; align-items:center; margin-bottom:10px; }
.stn2-vcard-row:last-child{ margin-bottom:0; }
.stn2-vcard-row-threshold{ font-size:13px; font-weight:600; color:var(--stn2-text); }
.stn2-vcard-stat-label{ font-size:10.5px; color:var(--stn2-faint); flex-shrink:0; }
.stn2-vcard-stat-chip{ font-size:12px; font-weight:700; padding:2px 9px; border-radius:7px; min-width:36px; text-align:center; display:inline-block; }
.stn2-vcard-stat-pct{ font-size:11px; color:var(--stn2-muted); }
.stn2-vcard-stat-bar{ height:4px; border-radius:3px; background:color-mix(in oklch, #fff 7%, transparent); overflow:hidden; margin-top:4px; }
.stn2-vcard-roi-label{ font-size:10.5px; color:var(--stn2-faint); }
.stn2-vcard-roi-value{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; }
.stn2-vcard-empty{ font-size:12px; color:var(--stn2-faint); }

.stn2-chip-locked{ opacity:.45; cursor:not-allowed !important; }

/* AI predictions page — hero banner */
@keyframes stn2SpinSlow{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
.stn2-ai-hero{ position:relative; border-radius:24px; overflow:hidden; margin-bottom:24px; padding:30px 32px; background:linear-gradient(120deg, color-mix(in oklch, var(--stn2-accent1) 22%, transparent), color-mix(in oklch, var(--stn2-accent2) 14%, transparent) 55%, transparent); border:1px solid var(--stn2-border); }
.stn2-ai-hero-ring{ position:absolute; border-radius:50%; pointer-events:none; }
.stn2-ai-hero-ring_1{ top:-40px; right:-30px; width:220px; height:220px; border:1px dashed color-mix(in oklch, var(--stn2-accent2) 40%, transparent); animation:stn2SpinSlow 40s linear infinite; }
.stn2-ai-hero-ring_2{ top:-10px; right:20px; width:160px; height:160px; border:1px dashed color-mix(in oklch, var(--stn2-accent1) 35%, transparent); animation:stn2SpinSlow 30s linear infinite reverse; }
.stn2-ai-hero-row{ position:relative; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; }
.stn2-ai-hero-icon{ width:52px; height:52px; border-radius:14px; background:var(--stn2-gradient); display:flex; align-items:center; justify-content:center; flex-shrink:0; box-shadow:0 12px 30px -10px color-mix(in oklch, var(--stn2-accent2) 60%, transparent); color:#fff; }
.stn2-ai-hero-pill{ font-size:10.5px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:var(--stn2-accent2); background:color-mix(in oklch, var(--stn2-accent2) 16%, transparent); border:1px solid color-mix(in oklch, var(--stn2-accent2) 35%, transparent); padding:3px 10px; border-radius:999px; }
.stn2-ai-hero-title{ font-family:'Space Grotesk',sans-serif; font-size:28px; font-weight:600; margin-top:5px; }
.stn2-ai-hero-count{ font-family:'Space Grotesk',sans-serif; font-size:24px; font-weight:700; color:var(--stn2-accent2); text-align:right; }
.stn2-ai-hero-count-label{ font-size:11px; color:var(--stn2-muted); text-align:right; }
.stn2-ai-hero-info-btn{ width:38px; height:38px; border-radius:11px; background:color-mix(in oklch, #fff 7%, transparent); border:1px solid var(--stn2-border); display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; color:var(--stn2-text2); }
.stn2-ai-hero-info-body{ position:relative; margin-top:18px; padding-top:18px; border-top:1px solid var(--stn2-border); font-size:13px; color:var(--stn2-text2); line-height:1.6; max-width:900px; display:none; }
.stn2-ai-hero-info-body.open{ display:block; }
.stn2-ai-hero-info-body a{ color:var(--stn2-accent2); }

.stn2-ai-market-chip{ display:flex; align-items:center; gap:10px; padding:12px 18px; border-radius:13px; cursor:pointer; white-space:nowrap; flex-shrink:0; min-width:150px; background:color-mix(in oklch, #fff 5%, transparent); color:var(--stn2-text2); border:1px solid var(--stn2-border); transition:background .15s; }
.stn2-ai-market-chip.active{ background:var(--stn2-gradient); color:#fff; border-color:transparent; }
.stn2-ai-market-chip.stn2-chip-locked{ opacity:.45; cursor:not-allowed; }
.stn2-ai-market-chip-label{ font-size:13.5px; font-weight:700; }
.stn2-ai-market-chip-sub{ font-size:10.5px; opacity:.75; font-weight:500; }

.stn2-ai-filterbar{ border-radius:18px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:16px 20px; margin-bottom:26px; }
.stn2-ai-filterbar-row{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; }
.stn2-ai-divider{ width:1px; height:22px; background:var(--stn2-border); margin:0 4px; }
.stn2-ai-adv-toggle{ display:flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:var(--stn2-text2); background:color-mix(in oklch, #fff 5%, transparent); border:1px solid var(--stn2-border); padding:8px 14px; border-radius:9px; cursor:pointer; white-space:nowrap; }
.stn2-ai-adv-panel{ margin-top:16px; padding-top:16px; border-top:1px solid var(--stn2-border); display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:18px; display:none; }
.stn2-ai-adv-panel.open{ display:grid; }

/* Inline multi-select picker (leagues/bookmakers) — window.staMultiPicker(), see
   js/stn2-multipicker.js. Same show/hide convention as .stn2-ai-adv-panel above. */
.stn2-entity .stn2-multipicker-panel, .stn2-match .stn2-multipicker-panel{ display:none; width:100%; max-width:320px; margin-top:8px; border-radius:12px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:10px; }
.stn2-entity .stn2-multipicker-panel.open, .stn2-match .stn2-multipicker-panel.open{ display:block; }
.stn2-entity .stn2-multipicker-search, .stn2-match .stn2-multipicker-search{ width:100%; box-sizing:border-box; background:color-mix(in oklch, #fff 5%, transparent); border:1px solid var(--stn2-border); border-radius:8px; color:var(--stn2-text); font-size:12.5px; padding:7px 9px; font-family:'Inter',sans-serif; margin-bottom:8px; }
.stn2-entity .stn2-multipicker-list, .stn2-match .stn2-multipicker-list{ max-height:220px; overflow-y:auto; display:flex; flex-direction:column; gap:2px; }
.stn2-entity .stn2-multipicker-item, .stn2-match .stn2-multipicker-item{ display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:7px; font-size:12.5px; color:var(--stn2-text2); cursor:pointer; }
.stn2-entity .stn2-multipicker-item:hover, .stn2-match .stn2-multipicker-item:hover{ background:color-mix(in oklch, #fff 5%, transparent); }
.stn2-entity .stn2-multipicker-item input, .stn2-match .stn2-multipicker-item input{ accent-color:var(--stn2-accent2); }
.stn2-entity .stn2-multipicker-empty, .stn2-match .stn2-multipicker-empty{ padding:10px 8px; font-size:12px; color:var(--stn2-faint); }
.stn2-entity .stn2-multipicker-footer, .stn2-match .stn2-multipicker-footer{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; padding-top:8px; border-top:1px solid var(--stn2-border); }
.stn2-entity .stn2-multipicker-apply, .stn2-match .stn2-multipicker-apply, .stn2-entity .stn2-multipicker-clear, .stn2-match .stn2-multipicker-clear{ font-size:12px; font-weight:600; cursor:pointer; }
.stn2-entity .stn2-multipicker-apply, .stn2-match .stn2-multipicker-apply{ color:var(--stn2-accent2); }
.stn2-entity .stn2-multipicker-clear, .stn2-match .stn2-multipicker-clear{ color:var(--stn2-faint); }

/* --- sfnb: match prediction card (v2 — design5 refinement) --- */
.stn2-predict-card{ border-radius:18px; border:1px solid color-mix(in oklch, oklch(70% 0.19 320) 25%, transparent); background:linear-gradient(120deg, oklch(23% 0.03 280 / .8), oklch(20% 0.03 200 / .6)); padding:22px; }
.stn2-predict-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:20px; flex-wrap:wrap; }
.stn2-predict-ai-badge{ display:flex; align-items:center; height:24px; padding:0 10px; border-radius:7px; background:oklch(80% 0.16 85 / .16); color:oklch(85% 0.16 85); font-size:10.5px; font-weight:700; letter-spacing:.8px; text-transform:uppercase; }
.stn2-predict-badge{ display:flex; align-items:center; gap:7px; padding:5px 11px; border-radius:999px; border:1px solid var(--stn2-border); background:color-mix(in oklch, #fff 4%, transparent); font-size:11px; color:var(--stn2-text2); pointer-events:none; }
.stn2-predict-dot{ width:6px; height:6px; border-radius:50%; background:var(--stn2-success); flex-shrink:0; }
.stn2-predict-label{ font-size:10.5px; color:var(--stn2-muted); text-transform:uppercase; letter-spacing:.7px; }

.stn2-predict-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; margin-bottom:16px; }
.stn2-predict-main{ border-radius:16px; background:color-mix(in oklch, #fff 5%, transparent); border:1px solid var(--stn2-border); padding:18px; display:flex; align-items:center; gap:18px; }
.stn2-predict-winner{ font-family:'Space Grotesk',sans-serif; font-size:21px; font-weight:700; line-height:1.15; margin:6px 0; }
.stn2-predict-sub{ font-size:12.5px; color:var(--stn2-text2); line-height:1.45; }

.stn2-predict-dist{ border-radius:16px; background:color-mix(in oklch, #fff 4%, transparent); border:1px solid var(--stn2-border); padding:16px 18px; }
.stn2-predict-dist-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.stn2-predict-dist-hint{ font-size:10.5px; color:var(--stn2-muted); }
.stn2-predict-segbar{ display:flex; gap:2px; height:8px; border-radius:5px; overflow:hidden; margin-bottom:14px; }
.stn2-predict-segbar span{ display:block; height:100%; }
.stn2-predict-oc-rows{ display:flex; flex-direction:column; gap:7px; }
.stn2-predict-oc-row{ display:grid; grid-template-columns:44px minmax(0,1fr) 60px; align-items:center; gap:12px; padding:10px 12px; border-radius:12px; border:1px solid color-mix(in oklch, #fff 5%, transparent); }
.stn2-predict-oc-row_lead{ background:color-mix(in oklch, #fff 7%, transparent); border-color:color-mix(in oklch, var(--oc) 35%, transparent); }
.stn2-predict-oc-tag{ display:flex; align-items:center; justify-content:center; height:26px; border-radius:8px; font-size:11.5px; font-weight:700; letter-spacing:.5px; color:var(--oc); background:color-mix(in oklch, var(--oc) 18%, transparent); }
.stn2-predict-oc-mid{ min-width:0; }
.stn2-predict-oc-who{ font-size:12.5px; color:var(--stn2-text2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:5px; }
.stn2-predict-oc-bar{ height:6px; border-radius:5px; background:oklch(100% 0 0 / .07); overflow:hidden; }
.stn2-predict-oc-bar span{ display:block; height:100%; border-radius:5px; background:var(--oc); }
.stn2-predict-oc-val{ font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:700; text-align:right; color:var(--stn2-text2); }
.stn2-predict-oc-row_lead .stn2-predict-oc-val{ color:var(--oc); }
.stn2-predict-oc-home{ --oc: oklch(72% 0.13 200); }
.stn2-predict-oc-draw{ --oc: oklch(80% 0.16 85); }
.stn2-predict-oc-away{ --oc: oklch(70% 0.19 320); }

.stn2-predict-totals{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; margin-bottom:16px; }
.stn2-predict-total{ border-radius:14px; border:1px solid var(--stn2-border); border-top:2px solid var(--oc); background:color-mix(in oklch, #fff 4%, transparent); padding:14px 16px; display:flex; flex-direction:column; gap:4px; }
.stn2-predict-total-title{ font-size:11px; color:var(--stn2-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-predict-total-val{ font-family:'Space Grotesk',sans-serif; font-size:19px; font-weight:700; color:var(--oc); }
.stn2-predict-total-note{ font-size:11px; color:var(--stn2-muted); }

.stn2-predict-combo{ display:flex; align-items:center; gap:14px; border-radius:14px; border:1px solid oklch(80% 0.16 85 / .35); background:linear-gradient(100deg, oklch(80% 0.16 85 / .12), oklch(80% 0.16 85 / .03)); padding:14px 16px; margin-bottom:20px; flex-wrap:wrap; }
.stn2-predict-combo-badge{ display:flex; align-items:center; height:24px; padding:0 10px; border-radius:7px; background:oklch(80% 0.16 85 / .2); color:oklch(88% 0.16 85); font-size:10.5px; font-weight:700; letter-spacing:.7px; text-transform:uppercase; flex-shrink:0; }
.stn2-predict-combo-text{ font-size:13.5px; color:var(--stn2-text); line-height:1.4; min-width:0; }

.stn2-predict-poisson-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px; flex-wrap:wrap; }
.stn2-predict-poisson-legend{ display:flex; align-items:center; gap:7px; font-size:11px; color:var(--stn2-muted); }
.stn2-predict-poisson-marker{ display:inline-block; width:2px; height:11px; background:oklch(95% 0 0 / .8); border-radius:2px; }
.stn2-predict-poisson{ display:flex; flex-direction:column; gap:11px; }
.stn2-predict-poisson-row{ display:grid; grid-template-columns:minmax(90px,150px) minmax(0,1fr) 52px; align-items:center; gap:14px; }
.stn2-predict-poisson-name{ font-size:12.5px; color:var(--stn2-text2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-predict-poisson-bar{ position:relative; height:8px; border-radius:5px; background:oklch(100% 0 0 / .07); }
.stn2-predict-poisson-bar span{ display:block; height:100%; border-radius:4px; background:var(--oc); }
.stn2-predict-poisson-bar i{ position:absolute; top:-4px; bottom:-4px; width:2px; background:oklch(95% 0 0 / .8); border-radius:2px; }
.stn2-predict-poisson-val{ font-family:'Space Grotesk',sans-serif; font-size:13.5px; font-weight:700; text-align:right; color:var(--stn2-text2); }

/* --- sfnb: injuries & disqualifications --- */
.stn2-injuries-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; margin-top:14px; margin-bottom:8px; }
.stn2-injuries-col{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:14px; }
.stn2-injuries-col-title{ font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:600; margin-bottom:10px; padding:0 4px; }
.stn2-injuries-empty{ font-size:12.5px; color:var(--stn2-text2); padding:10px 4px; }
.stn2-injury-row{ display:flex; align-items:center; gap:11px; padding:10px 4px; border-top:1px solid var(--stn2-border); }
.stn2-injury-row:first-of-type{ border-top:none; }
.stn2-injury-initials{ flex-shrink:0; width:34px; height:34px; border-radius:50%; background:var(--stn2-gradient); color:#fff; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.stn2-injury-info{ flex:1; min-width:0; }
.stn2-injury-name{ font-size:13px; font-weight:600; }
.stn2-injury-reason{ font-size:11.5px; color:var(--stn2-text2); margin-top:1px; }
.stn2-injury-badge{ flex-shrink:0; font-size:10.5px; font-weight:700; padding:5px 10px; border-radius:var(--stn2-radius-pill); white-space:nowrap; }
.stn2-injury-badge_out{ background:oklch(66% 0.21 25 / .16); color:var(--stn2-danger-fg); }
.stn2-injury-badge_doubt{ background:oklch(80% 0.16 85 / .16); color:oklch(80% 0.16 85); }

/* --- sfnb: per-half stats widget --- */
.stn2-select{ width:100%; max-width:340px; background:var(--stn2-card); border:1px solid var(--stn2-border); color:var(--stn2-text); border-radius:11px; padding:10px 14px; font-size:13px; margin-bottom:16px; appearance:none; cursor:pointer; }
.stn2-half-block{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:6px 16px; margin-bottom: 16px; }
.stn2-half-row{ display:flex; align-items:center; gap:12px; padding:12px 0; border-top:1px solid var(--stn2-border); }
.stn2-half-row:first-child{ border-top:none; }
.stn2-half-row-label{ flex:0 0 auto; width:64px; font-size:11.5px; color:var(--stn2-text2); }
.stn2-half-row-val{ flex:0 0 auto; width:36px; text-align:center; font-weight:600; font-size:13px; }
.stn2-half-row-bar{ flex:1; height:8px; border-radius:99px; background:oklch(100% 0 0 / .08); overflow:hidden; display:flex; }
.stn2-half-row-bar span{ display:block; height:100%; }

/* --- sfnb: team squad tab --- */
.stn2-squad-intro-title{ font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:600; margin-bottom:4px; color:var(--stn2-text); }
.stn2-squad-intro-sub{ font-size:12.5px; color:var(--stn2-muted); margin-bottom:22px; line-height:1.5; }
.stn2-squad-group-label{ font-size:11px; color:var(--stn2-muted); text-transform:uppercase; letter-spacing:.4px; margin-bottom:10px; }
.stn2-squad-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:12px; margin-bottom:24px; }
.stn2-squad-card,
.stn2-squad-card:hover{ display:flex; align-items:center; gap:12px; border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:12px 14px; color:var(--stn2-text); text-decoration:none; transition:border-color .15s; }
.stn2-squad-card:hover{ border-color:color-mix(in oklch, var(--stn2-accent2) 40%, transparent); }
.stn2-squad-avatar-wrap{ position:relative; width:44px; height:44px; flex-shrink:0; }
.stn2-squad-avatar{ width:44px; height:44px; border-radius:50%; background:var(--stn2-gradient); color:#fff; font-size:15px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.stn2-squad-num{ position:absolute; bottom:-3px; right:-3px; width:18px; height:18px; border-radius:50%; background:var(--stn2-card-solid); border:1px solid var(--stn2-border-2); display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:700; color:var(--stn2-text); }
.stn2-squad-info{ flex:1; min-width:0; display:flex; flex-direction:column; }
.stn2-squad-name{ font-size:13.5px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-squad-captain{ margin-left:6px; color:var(--stn2-accent2); font-weight:700; }
.stn2-squad-pos{ font-size:11px; color:var(--stn2-muted); margin-top:2px; }
.stn2-squad-arrow{ flex-shrink:0; color:oklch(50% 0.01 260); font-size:15px; }

/* --- design5(9): team page "Показатели игроков" heatmap table ---
   Numbers use a system monospace stack (not JetBrains Mono, which isn't
   loaded anywhere else on the site) — the point of the spec is tabular
   digit alignment, which any monospace font gives equally. */
.stn2-pm-mono{ font-family:ui-monospace, 'SFMono-Regular', 'Roboto Mono', Consolas, 'Liberation Mono', monospace; }
.stn2-pm-card{ font-family:'Inter',system-ui,sans-serif; color:var(--stn2-text); border-radius:22px; border:1px solid var(--stn2-border); background:oklch(19.5% 0.018 262 / .75); overflow:hidden; margin-top:24px; margin-bottom:24px; }
.stn2-pm-head{ padding:22px 24px 18px; border-bottom:1px solid oklch(100% 0 0 / .07); display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.stn2-pm-title{ margin:0; font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:600; }
.stn2-pm-subtitle{ font-size:13px; color:var(--stn2-muted); margin-top:6px; }
.stn2-pm-tabs{ display:flex; gap:6px; padding:4px; border-radius:12px; background:oklch(100% 0 0 / .045); border:1px solid var(--stn2-border); flex-wrap:wrap; }
.stn2-pm-tab{ padding:8px 15px; border-radius:9px; border:none; background:transparent; font-size:12.5px; font-weight:600; color:var(--stn2-muted); cursor:pointer; white-space:nowrap; font-family:inherit; }
.stn2-pm-tab.active{ background:var(--stn2-gradient); color:oklch(16% 0.02 262); }
.stn2-pm-scroll{ overflow-x:auto; }
.stn2-pm-thead{ display:grid; align-items:center; padding:0 24px; height:46px; background:oklch(100% 0 0 / .03); border-bottom:1px solid oklch(100% 0 0 / .07); font-size:10.5px; text-transform:uppercase; letter-spacing:.9px; color:oklch(56% 0.01 260); }
.stn2-pm-th-match{ text-align:center; line-height:1.25; }
.stn2-pm-th-code{ color:var(--stn2-text2); font-weight:600; }
.stn2-pm-th-opp{ font-size:9.5px; letter-spacing:.3px; text-transform:none; color:oklch(48% 0.01 260); }
.stn2-pm-th-avg{ text-align:center; color:var(--stn2-accent2); }
.stn2-pm-th-trend{ text-align:right; }
.stn2-pm-row{ display:grid; align-items:center; padding:0 24px; height:56px; border-bottom:1px solid oklch(100% 0 0 / .045); cursor:pointer; text-decoration:none; color:inherit; }
.stn2-pm-row:hover{ background:color-mix(in oklch, #fff 3%, transparent); }
.stn2-pm-row:last-child{ border-bottom:none; }
.stn2-pm-player{ display:flex; align-items:center; gap:12px; min-width:0; }
.stn2-pm-numbadge{ width:28px; height:28px; border-radius:9px; background:oklch(100% 0 0 / .06); border:1px solid var(--stn2-border); display:flex; align-items:center; justify-content:center; font-size:11.5px; color:var(--stn2-muted); flex-shrink:0; }
.stn2-pm-name{ font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-pm-meta{ font-size:11px; color:oklch(54% 0.01 260); margin-top:2px; }
.stn2-pm-cellwrap{ display:flex; justify-content:center; }
.stn2-pm-cell{ width:46px; height:32px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:500; border:1px solid oklch(100% 0 0 / .05); }
.stn2-pm-cell-empty{ width:46px; height:32px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:14px; color:oklch(40% 0.01 260); border:1px dashed oklch(100% 0 0 / .09); }
.stn2-pm-avg{ text-align:center; font-size:16px; font-weight:700; }
.stn2-pm-trendwrap{ display:flex; align-items:flex-end; justify-content:flex-end; gap:4px; height:30px; }
.stn2-pm-spark{ width:7px; border-radius:3px; }
.stn2-pm-trend{ width:34px; text-align:right; font-size:11.5px; }
.stn2-pm-foot{ display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 24px; flex-wrap:wrap; }
.stn2-pm-legend{ display:flex; align-items:center; gap:18px; font-size:11.5px; color:oklch(55% 0.01 260); flex-wrap:wrap; }
.stn2-pm-legend-item{ display:flex; align-items:center; gap:7px; }
.stn2-pm-legend-bar{ width:22px; height:6px; border-radius:3px; background:linear-gradient(90deg, oklch(100% 0 0 / .08), var(--stn2-accent2)); }
.stn2-pm-legend-dash{ color:oklch(45% 0.01 260); }
.stn2-pm-foot-right{ display:flex; align-items:center; gap:12px; }
.stn2-pm-shown{ font-size:12px; color:var(--stn2-muted); }
.stn2-pm-showall{ padding:8px 16px; border-radius:11px; background:oklch(100% 0 0 / .05); border:1px solid oklch(100% 0 0 / .11); font-size:12.5px; font-weight:600; color:inherit; font-family:inherit; cursor:pointer; }

/* --- sfnb: team season form tab --- */
.stn2-season-hero{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; border-radius:18px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:20px; margin-bottom:24px; }
.stn2-radial{ width:92px; height:92px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stn2-radial-inner{ width:74px; height:74px; border-radius:50%; background:var(--stn2-card-solid); display:flex; flex-direction:column; align-items:center; justify-content:center; }
.stn2-radial-value{ font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:700; }
.stn2-radial-label{ font-size:9.5px; color:var(--stn2-text2); max-width:56px; text-align:center; line-height:1.3; margin-top:1px; }
.stn2-season-hero-info{ flex:1; min-width:200px; }
.stn2-form-table{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; margin-bottom:24px; }
.stn2-form-table-row{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; padding:11px 16px; border-top:1px solid var(--stn2-border); font-size:12.5px; }
.stn2-form-table-row:first-child{ border-top:none; }
.stn2-form-table-row span:not(:first-child){ text-align:center; font-weight:600; }
.stn2-form-table-head{ color:var(--stn2-text2); font-weight:600; font-size:11px; }
.stn2-form-table-head span:not(:first-child){ font-weight:600; }

/* --- sfnb: player page --- */
.stn2-player-hero{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:20px; }
.stn2-player-hero-info{ flex:1; min-width:200px; }
.stn2-player-hero-sub{ font-size:12.5px; color:var(--stn2-text2); }
.stn2-statbar-list{ border-radius:16px; border:1px solid var(--stn2-border); background:var(--stn2-card); margin-bottom:24px; overflow:hidden; }
.stn2-statbar-row{ display:flex; align-items:center; gap:12px; padding:11px 16px; border-top:1px solid var(--stn2-border); }
.stn2-statbar-row:first-child{ border-top:none; }
.stn2-statbar-label{ flex:0 0 auto; width:150px; font-size:12px; color:var(--stn2-text2); }
.stn2-statbar-bar{ flex:1; height:8px; border-radius:99px; background:oklch(100% 0 0 / .08); overflow:hidden; }
.stn2-statbar-bar span{ display:block; height:100%; background:var(--stn2-gradient); }
.stn2-statbar-val{ flex:0 0 auto; width:44px; text-align:right; font-weight:600; font-size:13px; }

/* --- design5: homepage match row — "Ход матча" tab (Статистика remains old design, unchanged) --- */
@media (min-width:681px){
    .event-summary-tabs{ grid-template-columns:repeat(4,auto) 1fr; }
}
.event-summary-tab_switch{ user-select:none; }

.stn2-flow-status{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:12px 16px; margin-bottom:12px; }
.stn2-flow-status_live{ border-color:oklch(66% 0.21 25 / .28); background:linear-gradient(100deg, oklch(66% 0.21 25 / .1), var(--stn2-card)); }
.stn2-flow-status-left{ display:flex; align-items:center; gap:9px; flex-shrink:0; }
.stn2-flow-live-badge{ display:flex; align-items:center; gap:5px; font-size:10px; font-weight:700; letter-spacing:.6px; color:oklch(95% 0.01 25); background:oklch(66% 0.21 25 / .35); padding:3px 8px; border-radius:999px; }
.stn2-flow-live-dot{ width:5px; height:5px; border-radius:50%; background:oklch(95% 0.01 25); }
.stn2-flow-status-text{ font-size:11px; color:var(--stn2-text2); }
.stn2-flow-progress{ flex:1; min-width:180px; }
.stn2-flow-progress-bar{ position:relative; height:6px; border-radius:4px; background:oklch(100% 0 0 / .08); overflow:hidden; }
.stn2-flow-progress-bar span{ display:block; height:100%; background:var(--stn2-gradient); }
.stn2-flow-progress-marks{ display:flex; justify-content:space-between; font-size:9.5px; color:var(--stn2-muted); margin-top:5px; }

.stn2-flow-card{ border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:14px 16px; margin-bottom:12px; }
.stn2-flow-card-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; flex-wrap:wrap; }
.stn2-flow-caption{ font-size:11px; font-weight:600; color:var(--stn2-text2); text-transform:uppercase; letter-spacing:.5px; }
.stn2-flow-legend{ display:flex; gap:12px; font-size:10.5px; color:var(--stn2-muted); flex-wrap:wrap; }
.stn2-flow-key{ display:flex; align-items:center; gap:5px; }
.stn2-flow-key-dot{ width:8px; height:8px; border-radius:2px; }
.stn2-flow-key-dot_home{ background:var(--stn2-accent2); }
.stn2-flow-key-dot_away{ background:var(--stn2-accent1); }

.stn2-flow-axis{ position:relative; height:86px; }
.stn2-flow-axis-line{ position:absolute; left:0; right:0; top:50%; height:2px; margin-top:-1px; border-radius:2px; background:oklch(100% 0 0 / .1); }
.stn2-flow-axis-mid{ position:absolute; left:50%; top:32%; bottom:32%; width:1px; background:oklch(100% 0 0 / .18); }
.stn2-flow-pt{ position:absolute; transform:translateX(-50%); display:flex; align-items:center; gap:3px; }
.stn2-flow-pt_home{ top:0; flex-direction:column; }
.stn2-flow-pt_away{ bottom:0; flex-direction:column-reverse; }
.stn2-flow-pt-min{ font-size:9px; font-family:'Space Grotesk',sans-serif; color:var(--stn2-muted); }
.stn2-flow-pt-dot{ width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:9.5px; line-height:1; border:1px solid oklch(100% 0 0 / .18); background:oklch(100% 0 0 / .08); }
.stn2-flow-pt_goal .stn2-flow-pt-dot{ color:oklch(84% 0.16 150); background:oklch(78% 0.18 150 / .18); border-color:oklch(78% 0.18 150 / .5); }
.stn2-flow-pt_yellow .stn2-flow-pt-dot{ color:oklch(88% 0.16 85); background:oklch(80% 0.16 85 / .18); border-color:oklch(80% 0.16 85 / .5); }
.stn2-flow-pt_red .stn2-flow-pt-dot{ color:oklch(78% 0.16 25); background:oklch(66% 0.21 25 / .18); border-color:oklch(66% 0.21 25 / .5); }
.stn2-flow-pt_sub .stn2-flow-pt-dot{ color:oklch(78% 0.01 260); }

.stn2-flow-feed{ display:grid; grid-template-columns:repeat(2,1fr); gap:6px 12px; }
@media (max-width:560px){ .stn2-flow-feed{ grid-template-columns:1fr; } }
.stn2-flow-feed-row{ display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:8px; background:oklch(100% 0 0 / .03); border-left:2px solid var(--stn2-accent2); }
.stn2-flow-feed-row_away{ border-left-color:var(--stn2-accent1); }
.stn2-flow-feed-min{ font-family:'Space Grotesk',sans-serif; font-size:11px; font-weight:700; color:var(--stn2-text2); width:26px; flex-shrink:0; }
.stn2-flow-feed-ico{ width:18px; height:18px; border-radius:5px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:9px; }
.stn2-flow-feed-player{ flex:1; min-width:0; font-size:11px; color:var(--stn2-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-flow-feed-note{ font-size:9.5px; color:var(--stn2-muted); flex-shrink:0; }
.stn2-flow-empty{ text-align:center; padding:20px; font-size:12.5px; color:var(--stn2-muted); }

/* ================= design5: personal account (my/) — shared component kit ================= */
.stn2-acct{ font-family:'Inter',system-ui,sans-serif; color:var(--stn2-text); }
.stn2-acct h1{ font-family:'Space Grotesk',sans-serif; }
.stn2-acct-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:18px; }
.stn2-acct-col{ display:flex; flex-direction:column; gap:18px; }
.stn2-acct-panel{ border-radius:20px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:24px; }
.stn2-acct-label{ font-size:11px; color:var(--stn2-muted); text-transform:uppercase; letter-spacing:.8px; margin-bottom:16px; }
.stn2-acct-display{ font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:700; }
.stn2-acct-pill{ padding:7px 13px; border-radius:999px; font-size:11.5px; font-weight:600; flex-shrink:0; border:1px solid transparent; display:inline-flex; align-items:center; gap:6px; }
.stn2-acct-btn{ display:inline-flex; align-items:center; gap:8px; padding:12px 22px; border-radius:12px; background:var(--stn2-gradient); color:oklch(15% 0.02 262); font-size:13.5px; font-weight:700; cursor:pointer; border:none; font-family:inherit; }
.stn2-acct-btn:hover{ opacity:.92; }
.stn2-acct-btn-ghost{ display:inline-flex; align-items:center; gap:8px; padding:11px 16px; border-radius:11px; border:1px solid var(--stn2-border-2); background:color-mix(in oklch, #fff 5%, transparent); font-size:13px; color:var(--stn2-text2); cursor:pointer; font-family:inherit; }
.stn2-acct-btn-ghost:hover{ background:color-mix(in oklch, #fff 8%, transparent); }
.stn2-acct-btn[disabled], .stn2-acct-btn-ghost[disabled]{ opacity:.45; cursor:not-allowed; pointer-events:none; }
.stn2-acct-field{ display:block; }
.stn2-acct-field-label{ display:block; font-size:12px; color:var(--stn2-muted); margin-bottom:7px; }
.stn2-acct-input{ width:100% !important; padding:13px 15px !important; border-radius:12px !important; border:1px solid var(--stn2-border-2) !important; background:color-mix(in oklch, #fff 5%, transparent) !important; color:var(--stn2-text) !important; font-size:14px !important; outline:none; font-family:inherit; box-sizing:border-box; margin:0 !important; }
.stn2-acct-input::placeholder{ color:var(--stn2-muted); }
.stn2-acct-input:focus{ border-color:var(--stn2-accent2); }
.stn2-acct-toggle{ position:relative; width:52px; height:28px; border-radius:999px; flex-shrink:0; cursor:pointer; transition:background .18s; background:oklch(100% 0 0 / .1); border:1px solid var(--stn2-border-2); }
.stn2-acct-toggle.on{ background:var(--stn2-accent2); border-color:var(--stn2-accent2); }
.stn2-acct-toggle span{ position:absolute; top:2px; left:2px; width:20px; height:20px; border-radius:50%; background:oklch(80% 0.01 260); transition:left .18s; }
.stn2-acct-toggle.on span{ left:26px; background:oklch(17% 0.02 262); }
.stn2-acct-ring{ position:relative; border-radius:50%; flex-shrink:0; }
.stn2-acct-ring-inner{ position:absolute; inset:10px; border-radius:50%; background:var(--stn2-card-solid); display:flex; flex-direction:column; align-items:center; justify-content:center; }
.stn2-acct-ring-value{ font-family:'Space Grotesk',sans-serif; font-weight:700; line-height:1; }
.stn2-acct-ring-caption{ font-size:9.5px; color:var(--stn2-muted); text-transform:uppercase; letter-spacing:.6px; margin-top:3px; }
.stn2-acct-empty{ padding:56px 22px; text-align:center; }
.stn2-acct-empty-icon{ width:52px; height:52px; margin:0 auto 14px; border-radius:16px; background:color-mix(in oklch, #fff 5%, transparent); border:1px solid var(--stn2-border-2); display:flex; align-items:center; justify-content:center; color:var(--stn2-muted); font-size:20px; }
.stn2-acct-empty-title{ font-size:15px; font-weight:600; margin-bottom:6px; }
.stn2-acct-empty-note{ font-size:13px; color:var(--stn2-muted); }
.stn2-acct-crumb{ font-size:11px; color:var(--stn2-muted); text-transform:uppercase; letter-spacing:.6px; margin-bottom:6px; }
.stn2-acct-sub{ font-size:13px; color:var(--stn2-text2); margin-top:4px; margin-bottom:22px; }
/* Legacy wa-2.0.css/sta.css rules on ul.menu>li>a are more specific than a single
   custom class, so key layout/color props are forced with !important here rather
   than chasing selector specificity across two stylesheets we don't fully own. */
body.stn2-acct{ background:var(--stn2-bg) !important; }
body.stn2-acct #wa-nav{ background-color:oklch(16% 0.015 260 / .72) !important; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); box-shadow:none !important; height:auto; }
body.stn2-acct #wa-nav #wa-header{ display:flex !important; align-items:center; justify-content:space-between; height:auto !important; min-height:0 !important; grid-template-columns:none; gap:0; padding:16px 40px !important; background-color:transparent !important; border-bottom:1px solid var(--stn2-border) !important; box-shadow:none !important; }
body.stn2-acct #wa-nav #wa-header-logo-area{ margin-right:0 !important; align-self:center !important; }
body.stn2-acct #wa-nav #wa-header-user-area{ margin-left:0 !important; align-self:center !important; }
body.stn2-acct .sta-sidebar-toggle{ background:color-mix(in oklch, #fff 6%, transparent) !important; color:var(--stn2-text) !important; border:1px solid var(--stn2-border-2) !important; display:none; }
@media (max-width:900px){ body.stn2-acct .sta-sidebar-toggle{ display:inline-flex !important; } }
@media (max-width:900px){ body.stn2-acct:has(.sta-main-sidebar.opened)::before{ content:""; position:fixed; inset:0; background:oklch(0% 0 0 / .5); z-index:45; } }
.stn2-acct-header-nav{ display:flex !important; align-items:center; gap:44px; }
.stn2-acct-header-logo{ display:flex; align-items:center; flex-shrink:0; }
.stn2-acct-header-logo svg{ height:22px; width:auto; display:block; }
.stn2-acct-header-links{ display:flex; align-items:center; gap:30px; }
.stn2-acct-header-links a{ font-size:14px; color:oklch(72% 0.01 260); text-decoration:none; white-space:nowrap; }
.stn2-acct-header-links a:hover{ color:var(--stn2-text); }
@media (max-width:900px){ .stn2-acct-header-links{ display:none; } }
@media (max-width:900px){ body.stn2-acct #wa-nav #wa-header{ padding:14px 16px !important; } }
@media (max-width:900px){
    body.stn2-acct .stn2-acct-header-balance-label{ display:none; }
    body.stn2-acct .stn2-acct-header-balance{ padding:7px 10px; }
    body.stn2-acct .stn2-acct-header-user-name{ display:none; }
    body.stn2-acct .stn2-acct-header-user{ padding:5px; }
    body.stn2-acct #wa-header-user-area{ gap:8px !important; }
}
@media (max-width:760px){
    body.stn2-acct #wa-nav #wa-header-user-area{ position:static !important; height:auto !important; background:transparent !important; padding:0 !important; flex-direction:row !important; }
    body.stn2-acct #wa-nav #wa-header-user-area::after{ display:none !important; }
}
body.stn2-acct #wa-userprofile .wa-userpic{ border-radius:50% !important; }
body.stn2-acct #wa-userprofile .dropdown-body{ background:var(--stn2-card-solid) !important; border:1px solid var(--stn2-border) !important; border-radius:16px !important; box-shadow:0 16px 40px oklch(0% 0 0 / .4) !important; padding:8px !important; min-width:180px; }
body.stn2-acct #wa-userprofile .dropdown-body .bricks{ margin:0 !important; }
body.stn2-acct #wa-userprofile .dropdown-body .brick{ display:flex !important; align-items:center; gap:10px !important; width:100% !important; text-align:left !important; padding:11px 12px !important; border-radius:11px !important; color:var(--stn2-text2) !important; font-size:13.5px !important; background:transparent !important; border:none !important; }
body.stn2-acct #wa-userprofile .dropdown-body .brick:hover{ background:color-mix(in oklch, #fff 6%, transparent) !important; color:var(--stn2-text) !important; }
body.stn2-acct #wa-userprofile .dropdown-body .brick .icon{ width:16px !important; max-width:16px !important; height:16px !important; max-height:16px !important; flex:0 0 16px !important; margin:0 !important; display:flex; align-items:center; justify-content:center; color:inherit !important; font-size:13px; }
body.stn2-acct #wa-userprofile .dropdown-body .brick span:not(.icon){ flex:1 1 auto; text-align:left !important; }
.stn2-acct-nav{ display:flex; flex-direction:column; gap:3px; margin:0 0 6px !important; }
.stn2-acct-nav-group-label{ font-size:10px; color:oklch(55% 0.01 260); text-transform:uppercase; letter-spacing:.9px; padding:12px 12px 6px; margin:0 !important; }
.stn2-acct-nav-item{ display:flex !important; align-items:center; gap:10px !important; padding:11px 14px !important; border-radius:12px; color:oklch(70% 0.01 260) !important; text-decoration:none; font-size:13.5px; cursor:pointer; border:1px solid transparent; }
.stn2-acct-nav-item:hover{ background:color-mix(in oklch, #fff 4%, transparent); }
.stn2-acct-nav-item .stn2-acct-nav-dot{ flex:0 0 6px !important; width:6px !important; height:6px !important; border-radius:50%; background:oklch(45% 0.01 260); }
.stn2-acct-nav-item span.stn2-acct-nav-label{ flex:1 1 auto !important; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-acct-nav-item .stn2-acct-nav-count{ flex:0 0 auto !important; margin-left:auto; }
.stn2-acct-nav .sta-menu li.selected > .stn2-acct-nav-item,
.stn2-acct-nav-item.active{ background:color-mix(in oklch, #fff 7%, transparent) !important; color:var(--stn2-text) !important; font-weight:600; border-color:color-mix(in oklch, var(--stn2-accent2) 24%, transparent) !important; }
.stn2-acct-nav .sta-menu li.selected > .stn2-acct-nav-item .stn2-acct-nav-dot,
.stn2-acct-nav-item.active .stn2-acct-nav-dot{ background:var(--stn2-accent2); }
.stn2-acct-nav-count{ font-size:11px; font-weight:700; padding:2px 7px; border-radius:7px; background:color-mix(in oklch, #fff 7%, transparent); color:var(--stn2-text2); }
.stn2-acct-nav .sta-menu li.selected .stn2-acct-nav-count{ background:color-mix(in oklch, #fff 25%, transparent); color:#fff; }
.stn2-acct-user-card{ border-radius:20px; border:1px solid var(--stn2-border); background:linear-gradient(150deg, oklch(23% 0.03 280 / .85), oklch(20% 0.02 262 / .7)); padding:20px; margin-bottom:0; }
.stn2-acct-user-row{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.stn2-acct-user-avatar{ width:42px; height:42px; border-radius:50%; object-fit:cover; flex-shrink:0; background:var(--stn2-gradient); }
.stn2-acct-user-card_stacked{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px; }
.stn2-acct-user-avatar_lg{ width:76px; height:76px; margin-bottom:0; }
.stn2-acct-user-card_stacked .stn2-acct-user-name{ white-space:normal; }
.stn2-acct-user-card_stacked .stn2-acct-user-plan{ margin-bottom:10px; }
.stn2-acct-user-card_stacked .stn2-acct-tariff-pill{ margin-top:2px; }
.stn2-acct-user-card_stacked .stn2-acct-user-expiry,
.stn2-acct-user-card_stacked .stn2-acct-user-expiry-bar{ width:100%; }
.stn2-acct-user-name{ font-family:'Space Grotesk',sans-serif; font-size:17px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-acct-user-id{ font-size:12px; color:oklch(62% 0.01 260); margin-top:2px; }
.stn2-acct-user-plan{ font-size:11px; color:var(--stn2-muted); }
.stn2-acct-tariff-pill{ padding:5px 12px; background:linear-gradient(120deg, color-mix(in oklch, var(--stn2-accent1) 18%, transparent), color-mix(in oklch, var(--stn2-accent2) 14%, transparent)); border-color:color-mix(in oklch, var(--stn2-accent2) 30%, transparent); color:var(--stn2-text); margin-bottom:0; }
.stn2-acct-tariff-dot{ width:6px; height:6px; border-radius:50%; background:var(--stn2-accent2); display:inline-block; }
.stn2-acct-user-expiry{ display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:10.5px; color:var(--stn2-muted); margin-bottom:6px; }
.stn2-acct-user-expiry-bar{ height:4px; border-radius:99px; background:oklch(100% 0 0 / .08); overflow:hidden; }
.stn2-acct-user-expiry-bar span{ display:block; height:100%; background:var(--stn2-gradient); }

/* header balance pill + user chip */
body.stn2-acct .stn2-acct-header-balance{ display:flex; align-items:center; gap:9px; padding:7px 14px; border-radius:999px; border:1px solid color-mix(in oklch, var(--stn2-success) 30%, transparent); background:color-mix(in oklch, var(--stn2-success) 12%, transparent); font-size:12px; white-space:nowrap; }
body.stn2-acct .stn2-acct-header-balance-label{ color:oklch(72% 0.06 150); text-transform:uppercase; font-size:11px; letter-spacing:.6px; }
body.stn2-acct .stn2-acct-header-balance-value{ color:var(--stn2-success-fg); font-weight:700; font-size:13.5px; font-family:'Space Grotesk',sans-serif; }
body.stn2-acct .stn2-acct-header-user{ display:flex !important; align-items:center; gap:10px; padding:5px 14px 5px 5px; border-radius:999px; background:oklch(100% 0 0 / .06); border:1px solid oklch(100% 0 0 / .1); }
body.stn2-acct .stn2-acct-header-user-name{ font-size:13px; color:oklch(88% 0.01 260); font-weight:400; max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
body.stn2-acct #wa-header-user-area{ display:flex; align-items:center; gap:14px; }
.stn2-acct-shell{ position:relative; z-index:10; max-width:1440px; margin:0 auto; padding:32px 40px 80px; display:grid; grid-template-columns:280px minmax(0,1fr); gap:26px; align-items:start; }
.stn2-acct-aside{ position:sticky; top:96px; display:flex; flex-direction:column; gap:14px; }
@media (max-width:900px){
    .stn2-acct-shell{ grid-template-columns:1fr; padding:20px 16px 60px; }
    .stn2-acct-aside{ position:fixed; top:0; left:0; bottom:0; z-index:50; width:280px; max-width:84vw; padding:16px; overflow-y:auto;
        background:var(--stn2-bg); border-right:1px solid var(--stn2-border);
        transform:translateX(-100%); transition:transform .2s ease; }
    .stn2-acct-aside.opened{ transform:translateX(0); box-shadow:20px 0 50px oklch(0% 0 0 / .5); }
}
.stn2-acct-form-msg{ font-size:12.5px; margin-top:10px; }
.stn2-acct-form-msg.success{ color:var(--stn2-success); }
.stn2-acct-form-msg.error{ color:var(--stn2-danger-fg); }

/* --- design5: account DataTables (balance history / payouts) reskin --- */
.stn2-acct-table-card{ padding:0 !important; overflow:hidden; }
.stn2-acct-table-card .dataTables_wrapper{ padding:6px 6px 14px; }
table.stn2-acct-table{ width:100% !important; border-collapse:collapse; font-size:13px; color:var(--stn2-text2); }
table.stn2-acct-table thead th{ text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:.5px; color:var(--stn2-muted); font-weight:600; padding:14px 18px; border-bottom:1px solid var(--stn2-border); }
table.stn2-acct-table tbody td{ padding:13px 18px; border-bottom:1px solid var(--stn2-border); vertical-align:middle; }
table.stn2-acct-table tbody tr:last-child td{ border-bottom:none; }
table.stn2-acct-table.zebra tbody tr:nth-child(even){ background:color-mix(in oklch, #fff 2.5%, transparent); }
table.stn2-acct-table tbody tr:hover{ background:color-mix(in oklch, #fff 4%, transparent); }
.stn2-acct-table-card .dataTables_filter{ padding:14px 18px 0; }
.stn2-acct-table-card .dataTables_filter input{ background:color-mix(in oklch, #fff 5%, transparent); border:1px solid var(--stn2-border-2); border-radius:10px; color:var(--stn2-text); padding:8px 12px; margin-left:6px; }
.stn2-acct-table-card .dataTables_info{ padding:12px 18px 0; font-size:11.5px; color:var(--stn2-muted); }
.stn2-acct-table-card .dataTables_paginate{ padding:12px 18px 4px; text-align:right; }
.stn2-acct-table-card .dataTables_paginate .paginate_button{ display:inline-flex; align-items:center; justify-content:center; min-width:28px; height:28px; padding:0 8px; margin-left:4px; border-radius:8px; border:1px solid var(--stn2-border-2); color:var(--stn2-text2) !important; cursor:pointer; font-size:12px; }
.stn2-acct-table-card .dataTables_paginate .paginate_button:hover{ background:color-mix(in oklch, #fff 6%, transparent); }
.stn2-acct-table-card .dataTables_paginate .paginate_button.current{ background:var(--stn2-gradient); border-color:transparent; color:#fff !important; }
.stn2-acct-table-card .dataTables_paginate .paginate_button.disabled{ opacity:.35; pointer-events:none; }
.stn2-acct-table-card .dataTables_processing{ color:var(--stn2-muted); }
.stn2-acct-table-toolbar{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:16px 18px 0; }
.stn2-acct-table-tabs{ display:flex; gap:8px; flex-wrap:wrap; }
.stn2-acct-tab{ cursor:pointer; padding:8px 14px; border-radius:10px; font-size:12.5px; background:transparent; border:1px solid oklch(100% 0 0 / .1); color:oklch(68% 0.01 260); }
.stn2-acct-tab.active{ background:color-mix(in oklch, #fff 9%, transparent); border-color:color-mix(in oklch, var(--stn2-accent2) 27%, transparent); color:var(--stn2-text); }
.stn2-acct-table-foot{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:4px 18px 4px; }
.stn2-acct-table-foot .dataTables_info{ padding:0; }
.stn2-acct-table-foot .dataTables_paginate{ padding:0; }

/* --- design5: helpdesk / support screens --- */
body.stn2-acct .paging{ display:flex; gap:6px; margin-top:16px; }
body.stn2-acct .paging a, body.stn2-acct .paging span{ display:inline-flex; align-items:center; justify-content:center; min-width:30px; height:30px; padding:0 8px; border-radius:8px; border:1px solid var(--stn2-border-2); color:var(--stn2-text2) !important; text-decoration:none !important; font-size:12.5px; }
body.stn2-acct .paging a:hover{ background:color-mix(in oklch, #fff 6%, transparent); }
body.stn2-acct .paging .current, body.stn2-acct .paging .active{ background:var(--stn2-gradient); border-color:transparent; color:#fff !important; }
.stn2-helpdesk-form-card,
.stn2-helpdesk-thread .stn2-helpdesk-msg{ background:var(--stn2-card); border-color:var(--stn2-border); }
.stn2-helpdesk-form-card input[type="text"],
.stn2-helpdesk-form-card input[type="email"],
.stn2-helpdesk-form-card textarea,
.stn2-helpdesk-form-card select{ width:100%; padding:12px 14px !important; border-radius:11px !important; border:1px solid var(--stn2-border-2) !important; background:color-mix(in oklch, #fff 5%, transparent) !important; color:var(--stn2-text) !important; font-family:inherit; box-sizing:border-box; }
.stn2-helpdesk-form-card label{ color:var(--stn2-text2); font-size:12.5px; }
.stn2-helpdesk-form-card .button,
.stn2-helpdesk-form-card input[type="submit"],
body.stn2-acct .ticket-buttons input[type="submit"]{ background:var(--stn2-gradient) !important; color:oklch(15% 0.02 262) !important; border:none !important; border-radius:11px !important; padding:11px 20px !important; font-weight:700 !important; cursor:pointer; }
/* Helpdesk's own form_frontend.html injects an inline <style>{$css}</style>
   (include_form_frontend_default_css.html) built for its classic float-left-
   label / fixed-px-width layout — never accounted for the nova redesign, so
   labels/inputs overlapped instead of stacking, and the raw file input had
   no styling at all. Overriding the layout-relevant rules here; the input/
   button skin above still applies on top. */
.stn2-helpdesk-form-card .wa-form{ width:100% !important; margin:0 !important; }
.stn2-helpdesk-form-card .wa-field{ clear:none !important; width:100% !important; padding-top:0 !important; margin-bottom:16px !important; }
.stn2-helpdesk-form-card .wa-field .wa-name{ float:none !important; width:100% !important; padding:0 0 6px !important; font-size:12.5px !important; color:var(--stn2-text2); }
.stn2-helpdesk-form-card .wa-field .wa-value{ margin-left:0 !important; }
.stn2-helpdesk-form-card .wa-field .wa-value.buttons{ margin-top:6px !important; }
.stn2-helpdesk-form-card .wa-field .wa-value input[type="text"],
.stn2-helpdesk-form-card .wa-field .wa-value input[type="email"],
.stn2-helpdesk-form-card .wa-field .wa-value input[type="password"],
.stn2-helpdesk-form-card .wa-field .wa-value textarea{ min-width:0 !important; width:100% !important; }
.stn2-helpdesk-form-card .wa-field .wa-value .wa-error-msg,
.stn2-helpdesk-form-card .state-error-hint{ color:var(--stn2-danger,#F43F5E) !important; font-size:12px !important; margin:6px 0 0 !important; }
.stn2-helpdesk-form-card .wa-field .wa-value input.wa-error,
.stn2-helpdesk-form-card .state-error{ border-color:var(--stn2-danger,#F43F5E) !important; }
/* Attachments: native <input type=file> can't be restyled directly, so the
   button/filename chrome comes from the browser (e.g. "Choose file" in the
   OS locale) — wrap it in a themed dropzone instead of leaving it bare. */
.stn2-helpdesk-form-card .h-file-attachments{ display:flex; flex-direction:column; gap:8px; }
.stn2-helpdesk-form-card .h-file-attachments .value.attach{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:11px; border:1px dashed var(--stn2-border-2); background:color-mix(in oklch, #fff 4%, transparent); }
.stn2-helpdesk-form-card .h-file-attachments .value.attach.is-highlighted{ border-color:var(--stn2-accent2); background:color-mix(in oklch, var(--stn2-accent2) 8%, transparent); }
.stn2-helpdesk-form-card .h-file-attachments input[type="file"]{ color:var(--stn2-text2); font-size:12.5px; max-width:100%; }
.stn2-helpdesk-form-card .h-file-attachments .remove-attach{ color:var(--stn2-muted); font-size:12px; }
.stn2-helpdesk-form-card .wa-captcha{ float:none !important; padding:10px 0 !important; }
.stn2-helpdesk-form-card .wa-captcha img{ float:none !important; margin:0 0 8px !important; border-radius:8px; }
.stn2-helpdesk-form-card .wa-captcha input[type="text"]{ width:6em !important; min-width:6em !important; }
body.stn2-acct #wa-header-content-area{ display:none !important; }
/* neutralize UI2 .article/.article-body defaults (max-width:960px, 3rem/5rem padding)
   fighting the account grid's own width/padding */
body.stn2-acct .article.sta-base-article{ max-width:none !important; margin:0 !important; width:100%; }
body.stn2-acct .article-body.sta-ajax-content{ padding:0 !important; }
.stn2-acct-content{ min-width:0; display:flex; flex-direction:column; gap:22px; }
.stn2-acct-page-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.stn2-acct-page-head h1{ margin:0; font-size:31px; font-weight:600; line-height:1.1; }
.stn2-acct-page-sub{ font-size:13.5px; color:oklch(66% 0.01 260); margin-top:8px; }
.stn2-acct-page-action{ display:inline-flex; align-items:center; gap:8px; padding:11px 20px; border-radius:12px; background:var(--stn2-gradient); color:oklch(15% 0.02 262); font-size:13.5px; font-weight:700; cursor:pointer; border:none; }
body.stn2-acct .sidebar-footer .stn2-acct-nav-item{ color:oklch(70% 0.13 25) !important; }
body.stn2-acct .sidebar-footer .stn2-acct-nav-item:hover{ background:oklch(66% 0.21 25 / .12) !important; }
body.stn2-acct .sidebar-footer .stn2-acct-nav-item .stn2-acct-nav-dot{ background:oklch(66% 0.21 25); }
body.stn2-acct .sidebar-footer{ border-top:none !important; padding-top:0; }

/* Profile: avatar dropzone */
.stn2-acct-avatar-row{ display:flex; align-items:center; gap:18px; margin-bottom:22px; }
.stn2-acct-avatar-drop{ position:relative; cursor:pointer; flex-shrink:0; width:88px; height:88px; border-radius:50%; }
.stn2-acct-avatar-drop .sta-profile-photo{ border-radius:50%; object-fit:cover; width:88px; height:88px; display:block; border:1.5px dashed var(--stn2-border-2); }
.stn2-acct-avatar-drop-hint{ position:absolute; inset:0; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; background:oklch(10% 0.02 262 / .62); opacity:0; transition:opacity .15s; text-align:center; }
.stn2-acct-avatar-drop-hint i{ color:#fff; font-size:14px; }
.stn2-acct-avatar-drop-hint span{ color:oklch(90% 0.01 260); font-size:9px; line-height:1.3; }
.stn2-acct-avatar-drop-hint span u{ color:var(--stn2-accent2); }
.stn2-acct-avatar-drop:hover .stn2-acct-avatar-drop-hint{ opacity:1; }

/* Subscription Control: steps / formula / breakdown */
.stn2-refund-steps{ display:flex; flex-direction:column; gap:12px; margin-bottom:20px; }
.stn2-refund-step{ display:flex; align-items:flex-start; gap:12px; font-size:12.5px; color:var(--stn2-text2); line-height:1.5; }
.stn2-refund-step-num{ flex-shrink:0; width:20px; height:20px; border-radius:50%; background:color-mix(in oklch, var(--stn2-accent2) 20%, transparent); color:var(--stn2-accent2); font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.stn2-refund-formula{ border-top:1px solid var(--stn2-border); padding-top:16px; }
.stn2-refund-formula-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.stn2-refund-token{ background:color-mix(in oklch, #fff 6%, transparent); border-color:var(--stn2-border-2); color:var(--stn2-text2); }
.stn2-refund-token_accent{ background:color-mix(in oklch, var(--stn2-accent2) 16%, transparent); border-color:color-mix(in oklch, var(--stn2-accent2) 35%, transparent); color:var(--stn2-accent2); }
.stn2-refund-op{ color:var(--stn2-muted); font-weight:700; }
.stn2-refund-breakdown{ display:flex; flex-direction:column; gap:2px; margin-bottom:18px; }
.stn2-refund-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 4px; border-top:1px solid var(--stn2-border); font-size:12.5px; color:var(--stn2-text2); }
.stn2-refund-row:first-child{ border-top:none; }
.stn2-refund-row_total{ border-top:1px solid var(--stn2-border-2); margin-top:4px; padding-top:14px; }

/* Withdraw: request cards */
.stn2-payout-list{ display:flex; flex-direction:column; gap:10px; }
.stn2-payout-card{ border-radius:14px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:14px 16px; }
.stn2-payout-card a.sta-payout-request-cancel{ font-size:11.5px; color:oklch(78% 0.16 25); text-decoration:none; }
.stn2-payout-card a.sta-payout-request-cancel:hover{ text-decoration:underline; }

/* Support: counters row */
.stn2-support-counters{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-top:22px; }
.stn2-support-counter{ padding:16px; }
.stn2-support-counter-label{ display:flex; align-items:center; gap:7px; font-size:11.5px; color:var(--stn2-muted); margin-bottom:8px; }
.stn2-support-counter-dot{ width:7px; height:7px; border-radius:50%; flex-shrink:0; }

/* Settings: toggle rows */
.stn2-settings-row{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:16px 0; border-top:1px solid var(--stn2-border); }
.stn2-settings-row:first-of-type{ border-top:none; }
.stn2-settings-row-title{ font-size:13.5px; font-weight:600; margin-bottom:3px; }
.stn2-settings-row-note{ font-size:12px; color:var(--stn2-muted); max-width:480px; }

/* --- design5: account drawers (email/password/telegram) — dark theme pass ---
   These aren't covered by the design handoff; restyled to the same tokens
   without touching markup so the fSend/waDrawer JS wiring stays intact. */
body.stn2-acct .sta-email-drawer .drawer-body,
body.stn2-acct .sta-password-drawer .drawer-body,
body.stn2-acct .sta-telegram-drawer .drawer-body,
body.stn2-acct .sta-telegram-reset-drawer .drawer-body{ background:var(--stn2-card-solid) !important; color:var(--stn2-text); }
body.stn2-acct .sta-email-drawer .drawer-background,
body.stn2-acct .sta-password-drawer .drawer-background,
body.stn2-acct .sta-telegram-drawer .drawer-background,
body.stn2-acct .sta-telegram-reset-drawer .drawer-background{ background:oklch(10% 0.02 262 / .7) !important; }
body.stn2-acct .sta-email-drawer .drawer-header h1,
body.stn2-acct .sta-password-drawer .drawer-header h1,
body.stn2-acct .sta-telegram-drawer .drawer-header h1,
body.stn2-acct .sta-telegram-reset-drawer .drawer-header h1{ font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:700; color:var(--stn2-text); }
body.stn2-acct .sta-email-drawer .field > .name,
body.stn2-acct .sta-password-drawer .field > .name,
body.stn2-acct .sta-telegram-drawer .field > .name,
body.stn2-acct .sta-telegram-reset-drawer .field > .name{ color:var(--stn2-muted); font-size:12px; margin-bottom:7px; }
body.stn2-acct .sta-email-drawer .field input,
body.stn2-acct .sta-email-drawer .field textarea,
body.stn2-acct .sta-password-drawer .field input,
body.stn2-acct .sta-password-drawer .field textarea,
body.stn2-acct .sta-telegram-drawer .field input,
body.stn2-acct .sta-telegram-reset-drawer .field input{ width:100% !important; padding:13px 15px !important; border-radius:12px !important; border:1px solid var(--stn2-border-2) !important; background:color-mix(in oklch, #fff 5%, transparent) !important; color:var(--stn2-text) !important; font-size:14px !important; box-sizing:border-box; }
body.stn2-acct .sta-email-drawer .hint,
body.stn2-acct .sta-password-drawer .hint,
body.stn2-acct .sta-telegram-drawer .hint,
body.stn2-acct .sta-telegram-reset-drawer .hint{ color:var(--stn2-muted); font-size:12px; }
body.stn2-acct .sta-email-drawer .alert,
body.stn2-acct .sta-password-drawer .alert,
body.stn2-acct .sta-telegram-drawer .alert,
body.stn2-acct .sta-telegram-reset-drawer .alert{ border-radius:12px; padding:12px 14px; font-size:12.5px; }
body.stn2-acct .sta-email-drawer .alert.info,
body.stn2-acct .sta-password-drawer .alert.info,
body.stn2-acct .sta-telegram-drawer .alert.info,
body.stn2-acct .sta-telegram-reset-drawer .alert.info{ background:color-mix(in oklch, var(--stn2-accent2) 12%, transparent); color:var(--stn2-text2); border:1px solid color-mix(in oklch, var(--stn2-accent2) 30%, transparent); }
body.stn2-acct .sta-email-drawer .alert.success,
body.stn2-acct .sta-password-drawer .alert.success,
body.stn2-acct .sta-telegram-drawer .alert.success,
body.stn2-acct .sta-telegram-reset-drawer .alert.success{ background:color-mix(in oklch, var(--stn2-success) 14%, transparent); color:var(--stn2-success-fg); border:1px solid color-mix(in oklch, var(--stn2-success) 32%, transparent); }
body.stn2-acct .sta-email-drawer .alert.danger,
body.stn2-acct .sta-password-drawer .alert.danger,
body.stn2-acct .sta-telegram-drawer .alert.danger,
body.stn2-acct .sta-telegram-reset-drawer .alert.danger{ background:color-mix(in oklch, var(--stn2-danger) 14%, transparent); color:var(--stn2-danger-fg); border:1px solid color-mix(in oklch, var(--stn2-danger) 32%, transparent); }
body.stn2-acct .sta-email-drawer .drawer-footer .button,
body.stn2-acct .sta-password-drawer .drawer-footer .button,
body.stn2-acct .sta-telegram-drawer .drawer-footer .button,
body.stn2-acct .sta-telegram-reset-drawer .drawer-footer .button{ display:inline-flex !important; align-items:center; gap:8px; padding:12px 22px !important; border-radius:12px !important; background:var(--stn2-gradient) !important; color:oklch(15% 0.02 262) !important; font-size:13.5px; font-weight:700; border:none !important; }
body.stn2-acct .sta-email-drawer .drawer-footer .button.light-gray,
body.stn2-acct .sta-password-drawer .drawer-footer .button.light-gray,
body.stn2-acct .sta-telegram-drawer .drawer-footer .button.light-gray,
body.stn2-acct .sta-telegram-reset-drawer .drawer-footer .button.light-gray{ background:color-mix(in oklch, #fff 6%, transparent) !important; color:var(--stn2-text2) !important; }
body.stn2-acct .sta-email-drawer .drawer-close,
body.stn2-acct .sta-password-drawer .drawer-close,
body.stn2-acct .sta-telegram-drawer .drawer-close,
body.stn2-acct .sta-telegram-reset-drawer .drawer-close{ color:var(--stn2-text2) !important; }
body.stn2-acct .sta-email-drawer .switch,
body.stn2-acct .sta-telegram-reset-drawer .switch{ background:color-mix(in oklch, #fff 10%, transparent) !important; }

/* --- design5(10): TeamComparison page — colors are fixed per side (not the
   site accent scheme): home=teal, away=orange, draw=amber — see README
   "Цвет стороны закреплён... держится во всех блоках экрана". --- */
.stn2-cmp{ --cmp-home:#2DD4BF; --cmp-away:#FF8A3D; --cmp-draw:oklch(80% 0.14 85); }
.stn2-cmp-heads{ display:grid; grid-template-columns:1fr 88px 1fr; gap:14px; align-items:stretch; margin-bottom:20px; }
.stn2-cmp-teamcard{ padding:22px 24px; border-radius:18px; background:oklch(19% 0.016 262); border:1px solid oklch(100% 0 0 / .08); }
.stn2-cmp-teamcard_home{ border-top:3px solid var(--cmp-home); }
.stn2-cmp-teamcard_away{ border-top:3px solid var(--cmp-away); }
.stn2-cmp-crest{ width:46px; height:46px; flex-shrink:0; border-radius:14px; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:700; }
.stn2-cmp-crest_home{ color:var(--cmp-home); background:color-mix(in oklab, var(--cmp-home) 14%, transparent); border:1px solid color-mix(in oklab, var(--cmp-home) 34%, transparent); }
.stn2-cmp-crest_away{ color:var(--cmp-away); background:color-mix(in oklab, var(--cmp-away) 14%, transparent); border:1px solid color-mix(in oklab, var(--cmp-away) 34%, transparent); }
.stn2-cmp-team-name{ font-family:'Space Grotesk',sans-serif; font-size:21px; font-weight:600; letter-spacing:-.3px; }
.stn2-cmp-team-meta{ font-size:12.5px; color:oklch(56% 0.01 260); margin-top:4px; }
.stn2-cmp-replace{ margin-left:auto; padding:6px 11px; border-radius:9px; background:oklch(100% 0 0 / .05); border:1px solid oklch(100% 0 0 / .09); font-size:11.5px; color:oklch(66% 0.01 260); white-space:nowrap; cursor:pointer; text-decoration:none; }
.stn2-cmp-team-foot{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:20px; padding-top:18px; border-top:1px solid oklch(100% 0 0 / .06); }
.stn2-cmp-form-label{ font-size:10.5px; text-transform:uppercase; letter-spacing:.9px; color:oklch(52% 0.01 260); margin-bottom:9px; }
.stn2-cmp-place{ font-family:'JetBrains Mono',monospace; font-size:24px; font-weight:700; text-align:right; }
.stn2-cmp-place-label{ font-size:11px; color:oklch(52% 0.01 260); margin-top:3px; text-align:right; }
.stn2-cmp-vs-col{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; }
.stn2-cmp-vs{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; color:oklch(52% 0.01 260); letter-spacing:1px; }
.stn2-cmp-vs-line{ width:1px; flex:1; background:linear-gradient(180deg, transparent, oklch(100% 0 0 / .14), transparent); }
.stn2-cmp-vs-count{ padding:6px 10px; border-radius:8px; background:oklch(100% 0 0 / .05); border:1px solid oklch(100% 0 0 / .09); font-family:'JetBrains Mono',monospace; font-size:11px; color:oklch(60% 0.01 260); white-space:nowrap; }

.stn2-cmp-scope-row{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:20px; }
.stn2-cmp-scope-label{ font-size:11px; text-transform:uppercase; letter-spacing:.9px; color:oklch(52% 0.01 260); }
.stn2-cmp-scope{ padding:8px 14px; border-radius:10px; font-size:12.5px; font-weight:500; background:oklch(100% 0 0 / .04); border:1px solid oklch(100% 0 0 / .08); color:oklch(66% 0.01 260); white-space:nowrap; text-decoration:none; display:inline-block; }
.stn2-cmp-scope.active{ font-weight:600; background:color-mix(in oklab, var(--cmp-away) 12%, transparent); border-color:color-mix(in oklab, var(--cmp-away) 35%, transparent); color:var(--cmp-away); }

.stn2-cmp-metriccard{ border-radius:20px; background:oklch(18.5% 0.015 262); border:1px solid oklch(100% 0 0 / .08); overflow:hidden; margin-bottom:14px; }
.stn2-cmp-grouphead{ display:flex; align-items:center; justify-content:space-between; padding:14px 24px; background:oklch(100% 0 0 / .03); border-top:1px solid oklch(100% 0 0 / .06); border-bottom:1px solid oklch(100% 0 0 / .06); }
.stn2-cmp-metriccard > div:first-child .stn2-cmp-grouphead{ border-top:none; }
.stn2-cmp-grouptitle{ font-size:11px; text-transform:uppercase; letter-spacing:1px; color:oklch(62% 0.01 260); font-weight:600; }
.stn2-cmp-groupnote{ font-size:11.5px; color:oklch(48% 0.01 260); }
.stn2-cmp-metricrow{ display:grid; grid-template-columns:76px 1fr 190px 1fr 76px; align-items:center; gap:14px; padding:13px 24px; border-bottom:1px solid oklch(100% 0 0 / .04); }
.stn2-cmp-metricval{ font-family:'JetBrains Mono',monospace; font-size:16px; font-weight:700; color:oklch(72% 0.01 260); }
.stn2-cmp-metricval.win{ color:inherit; }
.stn2-cmp-metriclabel{ font-size:13px; font-weight:500; color:oklch(84% 0.01 260); }
.stn2-cmp-metrichint{ font-size:10.5px; color:oklch(47% 0.01 260); margin-top:3px; }
.stn2-cmp-barslot-l{ display:flex; justify-content:flex-end; height:10px; }
.stn2-cmp-barslot-r{ display:flex; justify-content:flex-start; height:10px; }
.stn2-cmp-bar{ height:100%; }

.stn2-cmp-bottom-grid{ display:grid; grid-template-columns:1.25fr 1fr; gap:14px; align-items:start; }
.stn2-cmp-card{ border-radius:20px; background:oklch(18.5% 0.015 262); border:1px solid oklch(100% 0 0 / .08); overflow:hidden; }
.stn2-cmp-cardhead{ display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid oklch(100% 0 0 / .06); }
.stn2-cmp-cardtitle{ font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:600; }
.stn2-cmp-cardsub{ font-size:12px; color:oklch(56% 0.01 260); margin:4px 0 16px; }
.stn2-cmp-cardlink{ font-size:12px; color:var(--cmp-away); }

.stn2-cmp-splitbar{ display:flex; align-items:center; gap:2px; padding:16px 20px 0; }
.stn2-cmp-splitseg{ height:30px; display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono',monospace; font-size:12.5px; font-weight:700; color:oklch(20% 0.02 262); }
.stn2-cmp-splitlegend{ display:flex; justify-content:space-between; padding:9px 20px 14px; font-size:11px; color:oklch(52% 0.01 260); }
.stn2-cmp-h2hrow{ display:grid; grid-template-columns:64px 1fr 68px 1fr; align-items:center; gap:12px; padding:12px 20px; border-top:1px solid oklch(100% 0 0 / .04); text-decoration:none; color:inherit; }
.stn2-cmp-h2hrow:hover{ background:color-mix(in oklch, #fff 3%, transparent); }
.stn2-cmp-h2hdate{ font-family:'JetBrains Mono',monospace; font-size:11px; color:oklch(50% 0.01 260); }
.stn2-cmp-h2hteam{ font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-cmp-h2hscore{ text-align:center; font-family:'JetBrains Mono',monospace; font-size:14px; font-weight:700; letter-spacing:.5px; padding:4px 0; border-radius:7px; }

.stn2-cmp-probbar{ display:flex; height:36px; border-radius:11px; overflow:hidden; border:1px solid oklch(100% 0 0 / .07); }
.stn2-cmp-probseg{ display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono',monospace; font-size:12.5px; font-weight:700; color:oklch(20% 0.02 262); }
.stn2-cmp-problegend{ display:flex; justify-content:space-between; margin-top:9px; font-size:11px; color:oklch(52% 0.01 260); }
.stn2-cmp-factors{ margin-top:16px; padding-top:14px; border-top:1px solid oklch(100% 0 0 / .06); display:flex; flex-direction:column; gap:9px; }
.stn2-cmp-factor-dot{ width:5px; height:5px; border-radius:50%; margin-top:6px; flex-shrink:0; }
.stn2-cmp-factor-text{ font-size:12.5px; color:oklch(74% 0.01 260); line-height:1.45; }
.stn2-cmp-verdict-note{ font-size:10.5px; color:oklch(50% 0.01 260); margin-top:12px; font-style:italic; }

.stn2-cmp-empty{ padding:60px 24px; text-align:center; border-radius:20px; background:oklch(18.5% 0.015 262); border:1px solid oklch(100% 0 0 / .08); }
.stn2-cmp-empty-title{ font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:600; margin-bottom:8px; }
.stn2-cmp-empty-text{ font-size:13px; color:oklch(58% 0.01 260); max-width:420px; margin:0 auto; }

/* Generic "nothing found" card (error-simple.html) — reused by ML/trend-deck/steamers-style search results */
.stn2-noresult{ margin-top:20px; padding:22px; border-radius:16px; background:var(--stn2-card-solid); border:1px solid var(--stn2-border); display:flex; align-items:flex-start; gap:16px; }
.stn2-noresult-icon{ width:44px; height:44px; flex:none; border-radius:14px; border:1px solid var(--stn2-border); background:oklch(100% 0 0 / .04); display:flex; align-items:center; justify-content:center; color:var(--stn2-muted); }
.stn2-noresult-title{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:600; color:var(--stn2-text); }
.stn2-noresult-text{ font-size:12.5px; color:var(--stn2-muted); margin-top:5px; line-height:1.5; }

/* Trend deck results table ("Тренды на дату") */
.stn2-td-empty{ padding:48px 20px; text-align:center; color:var(--stn2-muted); font-size:13.5px; }
.stn2-td-group{ border-radius:18px; border:1px solid var(--stn2-border); background:oklch(20% 0.02 262 / .45); overflow:hidden; box-shadow:0 18px 44px -34px rgba(0,0,0,.7); }
.stn2-td-group-head{ display:flex; align-items:center; gap:13px; flex-wrap:wrap; padding:13px 18px; border-bottom:1px solid var(--stn2-border); background:oklch(100% 0 0 / .022); }
.stn2-td-group-bar{ width:3px; height:24px; border-radius:2px; flex:none; }
.stn2-td-group-title{ font-family:'Space Grotesk',sans-serif; font-size:15.5px; font-weight:600; color:var(--stn2-text); }
.stn2-td-group-meta{ font-size:11.5px; color:var(--stn2-muted); }
.stn2-td-group-stats{ margin-left:auto; display:flex; align-items:center; gap:20px; }
.stn2-td-stat{ text-align:right; }
.stn2-td-stat-label{ font-size:9.5px; text-transform:uppercase; letter-spacing:.5px; color:var(--stn2-muted); font-weight:600; }
.stn2-td-stat-value{ font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:700; color:var(--stn2-text); }
.stn2-td-colhead{ display:grid; grid-template-columns:72px minmax(158px,1fr) 338px 150px; gap:12px; padding:9px 18px 8px; border-bottom:1px solid oklch(100% 0 0 / .05); font-size:9.5px; text-transform:uppercase; letter-spacing:.55px; color:var(--stn2-muted); font-weight:600; }
.stn2-td-row{ display:grid; grid-template-columns:72px minmax(158px,1fr) 338px 150px; gap:12px; align-items:center; padding:13px 18px; border-bottom:1px solid oklch(100% 0 0 / .045); color:inherit; cursor:pointer; transition:background .15s; }
.stn2-td-row-outer:last-child .stn2-td-row{ border-bottom:none; }
.stn2-td-row:hover{ background:oklch(100% 0 0 / .045); }
.stn2-td-row_top{ background:color-mix(in oklab, var(--stn2-accent2) 5%, transparent); }
.stn2-td-row_open{ background:oklch(100% 0 0 / .045); }
.stn2-td-time{ font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:600; letter-spacing:.3px; color:var(--stn2-text); }
.stn2-td-date{ font-size:10.5px; color:var(--stn2-muted); margin-top:1px; }
.stn2-td-topbadge{ display:inline-flex; margin-top:6px; font-size:9px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; padding:3px 7px; border-radius:6px; background:color-mix(in oklab, var(--stn2-accent2) 18%, transparent); color:var(--stn2-accent2); border:1px solid color-mix(in oklab, var(--stn2-accent2) 35%, transparent); }
.stn2-td-teams{ min-width:0; display:flex; flex-direction:column; gap:7px; }
.stn2-td-team{ display:flex; align-items:center; gap:9px; }
.stn2-td-team-badge{ width:22px; height:22px; border-radius:7px; flex:none; display:flex; align-items:center; justify-content:center; font-size:9.5px; font-weight:700; color:#fff; }
.stn2-td-team-name{ font-size:13.5px; font-weight:500; color:var(--stn2-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-td-formbars{ margin-left:auto; display:flex; align-items:flex-end; gap:2.5px; height:17px; flex:none; }
.stn2-td-formbar{ display:block; width:4px; border-radius:2px; }
.stn2-td-ref{ display:flex; align-items:center; gap:5px; font-size:10.5px; color:var(--stn2-muted); padding-left:31px; }
.stn2-td-sources{ display:flex; gap:6px; }
.stn2-td-card{ width:80px; flex:none; padding:8px 9px; border-radius:11px; background:oklch(100% 0 0 / .035); border:1px solid oklch(100% 0 0 / .06); }
.stn2-td-card_main{ background:color-mix(in oklab, var(--stn2-accent2) 6%, transparent); border-color:color-mix(in oklab, var(--stn2-accent2) 20%, transparent); }
.stn2-td-card-label{ display:flex; align-items:center; gap:5px; font-size:9px; text-transform:uppercase; letter-spacing:.5px; font-weight:700; white-space:nowrap; }
.stn2-td-card-dot{ width:4px; height:4px; border-radius:50%; background:var(--stn2-accent2); }
.stn2-td-card-line{ font-family:'Space Grotesk',sans-serif; font-size:14.5px; font-weight:700; margin-top:6px; letter-spacing:.2px; }
.stn2-td-card-foot{ display:flex; flex-direction:column; gap:1px; margin-top:5px; }
.stn2-td-card-foot-l{ font-size:9px; color:var(--stn2-muted); white-space:nowrap; }
.stn2-td-card-foot-r{ font-size:9.5px; font-weight:700; }
.stn2-td-summary{ display:flex; flex-direction:column; gap:7px; }
.stn2-td-summary-top{ display:flex; align-items:center; gap:8px; }
.stn2-td-summary-line{ font-family:'Space Grotesk',sans-serif; font-size:21px; font-weight:700; }
.stn2-td-summary-badge{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; padding:3px 7px; border-radius:6px; white-space:nowrap; }
.stn2-td-scale{ position:relative; height:22px; }
.stn2-td-scale-track{ position:absolute; left:0; right:0; top:9px; height:4px; border-radius:3px; background:oklch(100% 0 0 / .07); }
.stn2-td-scale-fill{ position:absolute; top:9px; height:4px; border-radius:3px; }
.stn2-td-scale-line{ position:absolute; top:4px; width:2px; height:14px; border-radius:2px; }
.stn2-td-scale-dot{ position:absolute; top:6px; width:9px; height:9px; border-radius:50%; background:#fff; box-shadow:0 0 0 2.5px oklch(20% 0.02 262); }
.stn2-td-summary-foot{ display:flex; justify-content:space-between; font-size:10px; color:var(--stn2-muted); }
.stn2-td-summary-foot b{ color:oklch(85% 0.01 260); font-weight:600; }
.stn2-td-summary-history{ font-size:10px; color:var(--stn2-muted); }
.stn2-td-summary-calc{ display:flex; align-items:center; justify-content:space-between; gap:6px; font-size:10px; color:var(--stn2-muted); }
.stn2-td-calc-toggle{ display:inline-flex; align-items:center; gap:3px; color:var(--stn2-accent2); font-weight:600; }
.stn2-td-calc-chevron{ transition:transform .18s; }
.stn2-td-row_open .stn2-td-calc-chevron{ transform:rotate(180deg); }

/* Header column tooltips — position:fixed via JS (trend-deck.html), .stn2-td-group
   has overflow:hidden so a plain absolute tooltip would get clipped (same fix as
   the ⌘K search panel earlier in this project). */
.stn2-td-th{ position:relative; display:flex; align-items:center; gap:5px; cursor:help; }
.stn2-td-th-icon{ opacity:.7; flex-shrink:0; }
.stn2-td-th-tip{ display:none; width:268px; padding:11px 13px; border-radius:11px; background:oklch(17% 0.02 262); border:1px solid oklch(100% 0 0 / .13); box-shadow:0 22px 44px -22px rgba(0,0,0,.85); text-transform:none; letter-spacing:0; font-weight:400; font-size:11.5px; line-height:1.55; color:oklch(78% 0.01 260); }
.stn2-td-th-tip-formula{ margin-top:7px; font-family:'Space Grotesk',sans-serif; font-size:11px; color:var(--stn2-accent2); }

/* MatchBreakdown — раскрывающийся расчёт по строке */
.stn2-td-breakdown{ display:none; padding:2px 18px 18px; }
.stn2-td-breakdown.open{ display:block; }
.stn2-td-bd-inner{ border-radius:14px; border:1px solid oklch(100% 0 0 / .08); background:oklch(100% 0 0 / .028); padding:15px 17px; }
.stn2-td-bd-head{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:13px; }
.stn2-td-bd-kicker{ font-size:11px; text-transform:uppercase; letter-spacing:.5px; font-weight:700; color:oklch(60% 0.01 260); }
.stn2-td-bd-scope{ font-size:11px; color:var(--stn2-muted); }
.stn2-td-bd-open{ margin-left:auto; font-size:11px; color:var(--stn2-accent2); font-weight:600; text-decoration:none; }
.stn2-td-bd-open:hover{ text-decoration:underline; }
.stn2-td-bd-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:oklch(100% 0 0 / .07); border-radius:11px; overflow:hidden; }
.stn2-td-bd-step{ background:oklch(19% 0.02 262); padding:12px 13px; }
.stn2-td-bd-step-title{ font-size:10px; text-transform:uppercase; letter-spacing:.45px; color:var(--stn2-muted); font-weight:600; margin-bottom:6px; }
.stn2-td-bd-step-value{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; color:oklch(92% 0.01 260); }
.stn2-td-bd-step-text{ font-size:10.5px; line-height:1.5; color:oklch(58% 0.01 260); margin-top:6px; }
.stn2-td-bd-formula{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:13px; padding:11px 13px; border-radius:11px; background:color-mix(in oklab, var(--stn2-accent2) 8%, transparent); border:1px solid color-mix(in oklab, var(--stn2-accent2) 15%, transparent); }
.stn2-td-bd-formula-label{ font-size:10px; text-transform:uppercase; letter-spacing:.45px; color:var(--stn2-accent2); font-weight:700; flex:none; }
.stn2-td-bd-formula-text{ font-family:'Space Grotesk',sans-serif; font-size:12.5px; color:oklch(92% 0.01 260); }
.stn2-td-bd-meta{ display:flex; flex-wrap:wrap; gap:16px; margin-top:12px; font-size:10.5px; color:var(--stn2-muted); }
.stn2-td-bd-meta-k{ color:oklch(43% 0.01 260); }
.stn2-td-bd-meta-v{ color:oklch(80% 0.01 260); font-weight:600; }

/* MethodologyPanel — "Откуда эти цифры и как считаются" */
.stn2-td-meth{ border-radius:16px; border:1px solid var(--stn2-border); background:oklch(20% 0.02 262 / .5); margin-bottom:18px; overflow:hidden; }
.stn2-td-meth-head{ display:flex; align-items:center; gap:10px; padding:13px 18px; cursor:pointer; }
.stn2-td-meth-title{ font-size:13px; font-weight:600; }
.stn2-td-meth-sub{ font-size:11.5px; color:oklch(52% 0.01 260); }
.stn2-td-meth-chevron{ margin-left:auto; transition:transform .18s; }
.stn2-td-meth-body{ display:none; padding:0 18px 16px; }
.stn2-td-meth.open .stn2-td-meth-body{ display:block; }
.stn2-td-meth.open .stn2-td-meth-chevron{ transform:rotate(180deg); }
.stn2-td-meth-steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.stn2-td-meth-step{ padding:12px 13px; border-radius:12px; background:oklch(100% 0 0 / .035); border:1px solid oklch(100% 0 0 / .06); }
.stn2-td-meth-step-head{ display:flex; align-items:center; gap:7px; margin-bottom:7px; }
.stn2-td-meth-step-n{ width:17px; height:17px; border-radius:5px; background:color-mix(in oklab, var(--stn2-accent2) 12%, transparent); color:var(--stn2-accent2); font-size:9.5px; font-weight:700; display:flex; align-items:center; justify-content:center; flex:none; }
.stn2-td-meth-step-title{ font-size:11.5px; font-weight:600; color:oklch(90% 0.01 260); }
.stn2-td-meth-step-text{ font-size:11px; line-height:1.55; color:oklch(62% 0.01 260); }
.stn2-td-meth-step-formula{ margin-top:8px; font-family:'Space Grotesk',sans-serif; font-size:11px; color:var(--stn2-accent2); }
.stn2-td-meth-meta{ display:flex; flex-wrap:wrap; gap:18px; margin-top:12px; font-size:11px; color:oklch(55% 0.01 260); }
.stn2-td-meth-meta-k{ color:oklch(45% 0.01 260); }
.stn2-td-meth-meta-v{ color:oklch(82% 0.01 260); font-weight:600; }
.stn2-td-meth-link{ color:var(--stn2-accent2); text-decoration:none; }
.stn2-td-meth-link:hover{ text-decoration:underline; }

@media (max-width:1100px){
    .stn2-td-colhead, .stn2-td-row{ grid-template-columns:1fr; }
    .stn2-td-sources{ flex-wrap:wrap; }
    .stn2-td-colhead > div:not(:first-child){ display:none; }
    .stn2-td-meth-steps, .stn2-td-bd-steps{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
    .stn2-td-meth-steps, .stn2-td-bd-steps{ grid-template-columns:1fr; }
}

/* 404 page */
.stn2-err-wrap{ position:relative; z-index:2; display:grid; grid-template-columns:1.05fr .95fr; gap:64px; align-items:center; padding:64px 0 40px; }
.stn2-err-eyebrow{ display:inline-flex; align-items:center; gap:8px; padding:6px 13px; border-radius:999px; background:oklch(100% 0 0 / .05); border:1px solid var(--stn2-border); font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:1px; color:oklch(66% 0.01 260); }
.stn2-err-eyebrow-dot{ width:5px; height:5px; border-radius:50%; background:var(--stn2-accent1); }
.stn2-err-h1{ margin:22px 0 0; font-family:'Space Grotesk',sans-serif; font-size:52px; line-height:1.06; font-weight:600; letter-spacing:-1px; color:var(--stn2-text); }
.stn2-err-desc{ margin:18px 0 0; font-size:16px; line-height:1.6; color:oklch(68% 0.01 260); max-width:440px; }
.stn2-err-btns{ display:flex; gap:12px; margin-top:30px; flex-wrap:wrap; }
.stn2-err-btn-primary{ display:inline-flex; align-items:center; gap:9px; padding:14px 26px; border-radius:13px; font-size:14.5px; font-weight:700; background:var(--stn2-gradient); color:oklch(16% 0.02 262); text-decoration:none; }
.stn2-err-btn-secondary{ display:inline-flex; align-items:center; gap:9px; padding:14px 26px; border-radius:13px; font-size:14.5px; font-weight:600; background:oklch(100% 0 0 / .05); border:1px solid var(--stn2-border); color:oklch(88% 0.01 260); text-decoration:none; }
.stn2-err-search-wrap{ margin-top:34px; max-width:460px; position:relative; }
.stn2-err-search{ display:flex; align-items:center; gap:12px; padding:13px 16px; border-radius:14px; background:oklch(21% 0.02 262 / .75); border:1px solid var(--stn2-border); color:oklch(58% 0.01 260); }
.stn2-err-search input{ flex:1; background:none; border:none; color:var(--stn2-text); font-size:14px; outline:none; font-family:inherit; }
.stn2-err-search-results{ position:absolute; top:calc(100% + 8px); left:0; right:0; z-index:10; border-radius:14px; background:var(--stn2-card-solid); border:1px solid var(--stn2-border); overflow:hidden; box-shadow:0 24px 50px -20px rgba(0,0,0,.6); }
.stn2-err-search-row{ display:block; padding:11px 16px; font-size:13.5px; color:var(--stn2-text); text-decoration:none; border-bottom:1px solid var(--stn2-border); }
.stn2-err-search-row:last-child{ border-bottom:none; }
.stn2-err-search-row:hover{ background:oklch(100% 0 0 / .04); }
.stn2-err-search-empty{ padding:14px 16px; font-size:12.5px; color:var(--stn2-muted); }
.stn2-err-chips{ display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.stn2-err-chip{ padding:7px 13px; border-radius:999px; background:oklch(100% 0 0 / .045); border:1px solid var(--stn2-border); font-size:12.5px; color:oklch(72% 0.01 260); cursor:pointer; }
.stn2-err-art{ display:flex; justify-content:center; }
.stn2-err-art-panel{ position:relative; width:100%; max-width:420px; aspect-ratio:1/1; border-radius:28px; border:1px solid var(--stn2-border); background:linear-gradient(155deg, oklch(23% 0.03 280 / .8), oklch(19% 0.02 262 / .6)); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.stn2-err-art-grid{ position:absolute; inset:0; background-image:linear-gradient(oklch(100% 0 0 / .04) 1px, transparent 1px), linear-gradient(90deg, oklch(100% 0 0 / .04) 1px, transparent 1px); background-size:34px 34px; }
.stn2-err-art-scan{ position:absolute; top:0; left:0; width:26%; height:100%; background:linear-gradient(90deg, transparent, #2DD4BF14, transparent); animation:stn2ErrScan 6s linear infinite; }
.stn2-err-art-404{ position:relative; font-family:'Space Grotesk',sans-serif; font-size:150px; font-weight:700; letter-spacing:-6px; line-height:1; background:linear-gradient(150deg,var(--stn2-accent1),var(--stn2-accent2)); -webkit-background-clip:text; background-clip:text; color:transparent; animation:stn2ErrFloat 5.5s ease-in-out infinite; }
.stn2-err-art-foot{ position:absolute; bottom:26px; left:26px; right:26px; display:flex; justify-content:space-between; font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.8px; color:var(--stn2-muted); }
@keyframes stn2ErrScan{ 0%{ transform:translateX(-100%); } 100%{ transform:translateX(420%); } }
@keyframes stn2ErrFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-14px); } }
.stn2-err-links{ position:relative; z-index:2; padding:0 0 60px; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.stn2-err-link-card{ padding:18px 20px; border-radius:16px; background:oklch(21% 0.02 262 / .55); border:1px solid var(--stn2-border); text-decoration:none; display:block; }
.stn2-err-link-title{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:600; margin-bottom:5px; color:var(--stn2-text); }
.stn2-err-link-desc{ font-size:12.5px; color:oklch(60% 0.01 260); line-height:1.45; }
@media (max-width:900px){
    .stn2-err-wrap{ grid-template-columns:1fr; gap:36px; padding-top:36px; }
    .stn2-err-art{ order:-1; }
    .stn2-err-art-panel{ max-width:280px; }
}

/* 500 page */
.stn2-blobs_danger .b1{ background:radial-gradient(circle, oklch(66% 0.21 25 / .16), transparent 65%); }
.stn2-err500-wrap{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:72px 20px; max-width:760px; margin:0 auto; min-height:calc(100vh - 250px); }
.stn2-err500-icon{ width:88px; height:88px; border-radius:26px; background:oklch(66% 0.21 25 / .12); border:1px solid oklch(66% 0.21 25 / .3); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; animation:stn2ErrFloat 5s ease-in-out infinite; }
.stn2-err500-icon-bar{ width:5px; height:30px; border-radius:3px; background:var(--stn2-danger); }
.stn2-err500-icon-dot{ width:5px; height:5px; border-radius:50%; background:var(--stn2-danger); }
.stn2-err500-eyebrow{ margin-top:26px; display:inline-flex; align-items:center; gap:8px; padding:6px 13px; border-radius:999px; background:oklch(66% 0.21 25 / .1); border:1px solid oklch(66% 0.21 25 / .26); font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:1px; color:oklch(74% 0.12 25); }
.stn2-err500-h1{ margin:20px 0 0; font-family:'Space Grotesk',sans-serif; font-size:46px; line-height:1.08; font-weight:600; letter-spacing:-.8px; color:var(--stn2-text); }
.stn2-err500-desc{ margin:16px 0 0; font-size:16px; line-height:1.6; color:oklch(68% 0.01 260); max-width:520px; }
.stn2-err500-btns{ display:flex; gap:12px; margin-top:28px; flex-wrap:wrap; justify-content:center; }
.stn2-err500-details{ margin-top:34px; width:100%; max-width:520px; border-radius:16px; border:1px solid var(--stn2-border); background:oklch(21% 0.02 262 / .55); padding:16px 18px; text-align:left; }
.stn2-err500-details-label{ font-size:10.5px; text-transform:uppercase; letter-spacing:.6px; color:var(--stn2-faint); font-weight:700; }
.stn2-err500-details-rows{ display:flex; flex-direction:column; gap:8px; margin-top:12px; }
.stn2-err500-details-row{ display:flex; justify-content:space-between; gap:12px; font-size:12.5px; }
.stn2-err500-details-row span:first-child{ color:var(--stn2-muted); }
.stn2-err500-details-row span:last-child{ font-family:'JetBrains Mono',monospace; color:oklch(88% 0.01 260); }

/* Auth page */
.stn2-auth-wrap{ position:relative; z-index:2; display:grid; grid-template-columns:1fr 468px; gap:72px; align-items:center; padding:40px 0 64px; }
.stn2-auth-eyebrow{ display:inline-flex; align-items:center; gap:8px; padding:6px 13px; border-radius:999px; background:oklch(100% 0 0 / .05); border:1px solid var(--stn2-border); font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:1px; color:oklch(66% 0.01 260); }
.stn2-auth-eyebrow-dot{ width:5px; height:5px; border-radius:50%; background:var(--stn2-accent1); }
.stn2-auth-h1{ margin:22px 0 0; font-family:'Space Grotesk',sans-serif; font-size:48px; line-height:1.07; font-weight:600; letter-spacing:-1px; color:var(--stn2-text); }
.stn2-auth-desc{ margin:18px 0 0; font-size:16px; line-height:1.6; color:oklch(68% 0.01 260); max-width:440px; }
.stn2-auth-perks{ display:flex; flex-direction:column; gap:12px; margin-top:34px; max-width:460px; }
.stn2-auth-perk{ display:flex; align-items:flex-start; gap:13px; padding:14px 16px; border-radius:14px; background:oklch(21% 0.02 262 / .55); border:1px solid var(--stn2-border); }
.stn2-auth-perk-n{ width:32px; height:32px; border-radius:10px; background:oklch(100% 0 0 / .05); border:1px solid oklch(100% 0 0 / .1); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-family:'Space Grotesk',sans-serif; font-size:13px; font-weight:700; color:var(--stn2-accent2); }
.stn2-auth-perk-title{ font-size:14px; font-weight:600; margin-bottom:3px; color:var(--stn2-text); }
.stn2-auth-perk-desc{ font-size:12.5px; color:oklch(60% 0.01 260); line-height:1.45; }
.stn2-auth-card{ position:relative; border-radius:24px; border:1px solid var(--stn2-border); background:linear-gradient(165deg, oklch(23% 0.028 275 / .82), oklch(19% 0.02 262 / .72)); box-shadow:0 40px 90px -50px rgba(0,0,0,.85); overflow:hidden; }
.stn2-auth-scan{ position:absolute; top:0; left:0; width:26%; height:2px; background:linear-gradient(90deg, transparent, var(--stn2-accent2), transparent); animation:stn2AuthScan 7s linear infinite; }
@keyframes stn2AuthScan{ 0%{ transform:translateX(0); } 100%{ transform:translateX(380%); } }
.stn2-auth-tabs{ display:flex; gap:4px; padding:14px 14px 0; }
.stn2-auth-tab{ padding:11px 16px; border-radius:12px 12px 0 0; font-size:13px; font-weight:600; cursor:pointer; transition:all .15s; color:oklch(58% 0.01 260); border:1px solid transparent; border-bottom:none; }
.stn2-auth-tab.active{ color:#fff; background:oklch(100% 0 0 / .07); border-color:oklch(100% 0 0 / .1); box-shadow:inset 0 2px 0 var(--stn2-accent2); }
.stn2-auth-body{ padding:22px 26px 26px; }
.stn2-auth-panel{ display:none; }
.stn2-auth-panel.active{ display:block; }
.stn2-auth-title{ margin:0; font-family:'Space Grotesk',sans-serif; font-size:26px; font-weight:600; letter-spacing:-.4px; color:var(--stn2-text); }
.stn2-auth-subtitle{ margin:9px 0 0; font-size:13.5px; line-height:1.55; color:var(--stn2-muted); }
.stn2-auth-form{ display:flex; flex-direction:column; gap:12px; margin-top:22px; }
.stn2-auth-field-label{ font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:oklch(54% 0.01 260); font-weight:600; margin-bottom:7px; }
.stn2-auth-field-label-row{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:7px; }
.stn2-auth-field-label-row .stn2-auth-field-label{ margin-bottom:0; }
.stn2-auth-forgot-link{ font-size:11.5px; color:var(--stn2-accent1); cursor:pointer; }
.stn2-auth-input{ width:100%; padding:14px 15px; border-radius:13px; background:oklch(100% 0 0 / .04); border:1px solid oklch(100% 0 0 / .11); color:var(--stn2-text); font-size:14.5px; font-family:inherit; outline:none; box-sizing:border-box; }
.stn2-auth-pass-wrap{ position:relative; }
.stn2-auth-pass-wrap .stn2-auth-input{ padding-right:78px; }
.stn2-auth-pass-toggle{ position:absolute; right:11px; top:50%; transform:translateY(-50%); font-size:11px; font-weight:600; color:oklch(62% 0.01 260); background:oklch(100% 0 0 / .06); border:1px solid oklch(100% 0 0 / .1); border-radius:8px; padding:6px 9px; cursor:pointer; }
.stn2-auth-checks{ display:flex; flex-direction:column; gap:11px; margin-top:4px; }
.stn2-auth-check{ display:flex; align-items:flex-start; gap:11px; cursor:pointer; }
.stn2-auth-check input{ position:absolute; opacity:0; width:19px; height:19px; margin:0; cursor:pointer; }
.stn2-auth-check-box{ width:19px; height:19px; border-radius:6px; flex-shrink:0; margin-top:1px; display:flex; align-items:center; justify-content:center; background:oklch(100% 0 0 / .05); border:1px solid oklch(100% 0 0 / .16); transition:all .15s; }
.stn2-auth-check-box::after{ content:""; width:9px; height:6px; border-left:2.4px solid oklch(16% 0.02 262); border-bottom:2.4px solid oklch(16% 0.02 262); transform:rotate(-45deg) translateY(-1px); opacity:0; }
.stn2-auth-check input:checked ~ .stn2-auth-check-box{ background:var(--stn2-accent2); border-color:var(--stn2-accent2); }
.stn2-auth-check input:checked ~ .stn2-auth-check-box::after{ opacity:1; }
.stn2-auth-check-text{ font-size:12.5px; line-height:1.5; color:oklch(70% 0.01 260); }
.stn2-auth-notice{ display:flex; align-items:flex-start; gap:10px; padding:12px 14px; border-radius:12px; background:oklch(100% 0 0 / .04); border:1px solid oklch(100% 0 0 / .08); font-size:12.5px; line-height:1.5; color:oklch(68% 0.01 260); }
.stn2-auth-submit-row{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.stn2-auth-submit{ display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:14px 26px; border-radius:13px; font-size:14.5px; font-weight:700; cursor:pointer; background:var(--stn2-gradient); color:oklch(16% 0.02 262); border:none; font-family:inherit; }
.stn2-auth-message{ font-size:12.5px; color:var(--stn2-danger); }
.stn2-auth-switch{ margin-top:20px; padding-top:18px; border-top:1px solid oklch(100% 0 0 / .07); display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:12.5px; color:oklch(58% 0.01 260); }
.stn2-auth-switch-link{ font-weight:600; color:var(--stn2-accent1); cursor:pointer; }
.stn2-auth-legal{ margin-top:16px; font-size:11.5px; line-height:1.5; color:var(--stn2-faint); }
@media (max-width:900px){
    .stn2-auth-wrap{ grid-template-columns:1fr; gap:36px; }
}

.mb10 { margin-bottom: 10px; }

@media (max-width:820px){
    .stn2-cmp-heads{ grid-template-columns:1fr; }
    .stn2-cmp-vs-col{ flex-direction:row; padding:8px 0; }
    .stn2-cmp-vs-line{ width:auto; height:1px; flex:1; background:linear-gradient(90deg, transparent, oklch(100% 0 0 / .14), transparent); }
    .stn2-cmp-metricrow{ grid-template-columns:1fr; text-align:center; gap:6px; }
    .stn2-cmp-barslot-l, .stn2-cmp-barslot-r{ justify-content:center; }
    .stn2-cmp-bottom-grid{ grid-template-columns:1fr; }
}

/* Contacts page */
.stn2-ct-h1{ margin:14px 0 0; font-family:'Space Grotesk',sans-serif; font-size:44px; line-height:1.06; font-weight:600; letter-spacing:-1px; color:var(--stn2-text); }
.stn2-ct-lead{ margin:14px 0 0; font-size:15.5px; line-height:1.6; color:oklch(68% 0.01 260); max-width:600px; }
.stn2-ct-grid{ display:grid; grid-template-columns:268px 1fr; gap:28px; margin-top:34px; align-items:start; padding-bottom:70px; }
.stn2-ct-aside{ display:flex; flex-direction:column; gap:20px; position:sticky; top:24px; }
.stn2-ct-nav{ border-radius:18px; border:1px solid var(--stn2-border); background:var(--stn2-card); overflow:hidden; }
.stn2-ct-nav-item{ padding:13px 17px; font-size:13.5px; border-bottom:1px solid oklch(100% 0 0 / .055); color:var(--stn2-muted); }
.stn2-ct-nav-item:last-child{ border-bottom:none; }
.stn2-ct-nav-item a{ color:inherit; text-decoration:none; }
.stn2-ct-nav-item_active{ display:flex; align-items:center; justify-content:space-between; gap:8px; color:#fff; font-weight:600; background:oklch(100% 0 0 / .05); box-shadow:inset 2px 0 0 var(--stn2-accent2); }
.stn2-ct-nav-dot{ width:5px; height:5px; border-radius:50%; background:var(--stn2-accent2); }
/* Проза статических страниц «О сервисе» (features/guides/payment/refund/terms/privacy) */
.stn2-doc{ display:flex; flex-direction:column; gap:14px; }
.stn2-doc-card{ border-radius:18px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:18px 20px; }
.stn2-doc-card h1, .stn2-doc-card h2, .stn2-doc-card h3{ color:var(--stn2-text); font-weight:700; margin:18px 0 8px; }
.stn2-doc-card h2{ font-size:16px; }
.stn2-doc-card h3{ font-size:14.5px; }
.stn2-doc-card > :first-child{ margin-top:0; }
.stn2-doc-card p{ font-size:14px; line-height:1.65; color:var(--stn2-text2); margin:0 0 10px; }
.stn2-doc-card p:last-child{ margin-bottom:0; }
.stn2-doc-card ul, .stn2-doc-card ol{ margin:0 0 10px; padding-left:20px; color:var(--stn2-text2); font-size:14px; line-height:1.6; }
.stn2-doc-card li{ margin-bottom:6px; }
.stn2-doc-card a{ color:var(--stn2-accent2); text-decoration:none; font-weight:600; }
.stn2-doc-card a:hover{ text-decoration:underline; }
.stn2-ct-card{ border-radius:18px; border:1px solid var(--stn2-border); background:var(--stn2-card); padding:18px; }
.stn2-ct-card-label{ font-size:10.5px; text-transform:uppercase; letter-spacing:.6px; color:var(--stn2-faint); font-weight:700; }
.stn2-ct-channels{ display:flex; flex-direction:column; gap:14px; margin-top:14px; }
.stn2-ct-channel{ display:flex; align-items:flex-start; gap:11px; }
.stn2-ct-channel-icon{ width:30px; height:30px; border-radius:9px; background:oklch(100% 0 0 / .05); border:1px solid var(--stn2-border); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--stn2-accent2); }
.stn2-ct-channel-title{ font-size:13.5px; font-weight:600; color:var(--stn2-text); }
.stn2-ct-channel-desc{ font-size:11.5px; color:oklch(58% 0.01 260); margin-top:2px; line-height:1.4; }
.stn2-ct-main{ display:flex; flex-direction:column; gap:20px; }
.stn2-ct-hint{ border-radius:20px; border:1px solid color-mix(in oklab, var(--stn2-accent2) 18%, transparent); background:linear-gradient(140deg, color-mix(in oklab, var(--stn2-accent2) 7%, transparent), oklch(20% 0.02 262 / .55)); padding:22px 24px; }
.stn2-ct-hint-top{ display:flex; align-items:center; gap:12px; }
.stn2-ct-hint-icon{ width:34px; height:34px; border-radius:11px; border:1px solid color-mix(in oklab, var(--stn2-accent2) 33%, transparent); background:color-mix(in oklab, var(--stn2-accent2) 10%, transparent); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stn2-ct-hint-title{ font-family:'Space Grotesk',sans-serif; font-size:19px; font-weight:600; color:var(--stn2-text); }
.stn2-ct-hint-text{ margin:12px 0 0; font-size:13.5px; line-height:1.6; color:oklch(70% 0.01 260); }
.stn2-ct-bullets{ display:flex; flex-direction:column; gap:9px; margin-top:16px; }
.stn2-ct-bullet{ display:flex; align-items:flex-start; gap:9px; font-size:13px; line-height:1.5; color:oklch(78% 0.01 260); }
.stn2-ct-bullet svg{ flex-shrink:0; margin-top:3px; }
.stn2-ct-form{ border-radius:20px; border:1px solid var(--stn2-border); background:linear-gradient(165deg, oklch(22% 0.026 275 / .7), oklch(19% 0.02 262 / .62)); padding:24px 26px 26px; box-shadow:0 34px 80px -56px rgba(0,0,0,.85); }
.stn2-ct-form-top{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.stn2-ct-form-title{ font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:600; color:var(--stn2-text); }
.stn2-ct-form-req{ font-size:11.5px; color:var(--stn2-dim, var(--stn2-muted)); }
.stn2-ct-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:20px; }
.stn2-ct-field-label{ font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:oklch(54% 0.01 260); font-weight:600; margin-bottom:8px; }
.stn2-ct-field-label-row{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:8px; }
.stn2-ct-field-label-row .stn2-ct-field-label{ margin-bottom:0; }
.stn2-ct-counter{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--stn2-faint); }
.stn2-ct-input{ width:100%; padding:13px 15px; border-radius:12px; background:oklch(100% 0 0 / .04); border:1px solid oklch(100% 0 0 / .11); color:var(--stn2-text); font-size:14px; font-family:inherit; outline:none; box-sizing:border-box; }
.stn2-ct-input.stn2-ct-invalid{ border-color:var(--stn2-danger); }
.stn2-ct-textarea{ line-height:1.55; resize:vertical; }
.stn2-ct-field-error{ font-size:11.5px; color:var(--stn2-danger); margin-top:6px; min-height:0; }
.stn2-ct-topics{ display:flex; gap:8px; flex-wrap:wrap; }
.stn2-ct-topic{ padding:9px 15px; border-radius:999px; font-size:13px; cursor:pointer; color:oklch(70% 0.01 260); background:oklch(100% 0 0 / .045); border:1px solid oklch(100% 0 0 / .08); }
.stn2-ct-topic_active{ color:#fff; font-weight:600; background:color-mix(in oklab, var(--stn2-accent1) 15%, transparent); border-color:color-mix(in oklab, var(--stn2-accent1) 47%, transparent); }
.stn2-ct-drop{ display:flex; align-items:center; gap:12px; padding:16px 18px; border-radius:13px; border:1.5px dashed oklch(100% 0 0 / .14); background:oklch(100% 0 0 / .022); cursor:pointer; }
.stn2-ct-drop svg{ flex-shrink:0; color:var(--stn2-muted); }
.stn2-ct-drop-title{ font-size:13.5px; font-weight:500; color:var(--stn2-text); }
.stn2-ct-drop-desc{ font-size:11.5px; color:oklch(54% 0.01 260); margin-top:2px; }
.stn2-ct-files{ display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.stn2-ct-file{ display:flex; align-items:center; gap:11px; padding:10px 13px; border-radius:11px; background:oklch(100% 0 0 / .04); border:1px solid oklch(100% 0 0 / .08); }
.stn2-ct-file-ext{ width:26px; height:26px; border-radius:8px; background:color-mix(in oklab, var(--stn2-accent1) 11%, transparent); border:1px solid color-mix(in oklab, var(--stn2-accent1) 27%, transparent); display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:600; color:#a58cff; flex-shrink:0; }
.stn2-ct-file-name{ font-size:13px; flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--stn2-text); }
.stn2-ct-file-size{ font-size:11.5px; color:var(--stn2-dim, var(--stn2-muted)); }
.stn2-ct-file-rm{ width:22px; height:22px; border-radius:7px; display:flex; align-items:center; justify-content:center; cursor:pointer; color:oklch(58% 0.01 260); flex-shrink:0; font-size:16px; line-height:1; }
.stn2-ct-check{ display:flex; align-items:flex-start; gap:11px; cursor:pointer; }
.stn2-ct-check input{ position:absolute; opacity:0; width:19px; height:19px; margin:0; }
.stn2-ct-check-box{ width:19px; height:19px; border-radius:6px; flex-shrink:0; margin-top:1px; display:flex; align-items:center; justify-content:center; background:oklch(100% 0 0 / .05); border:1px solid oklch(100% 0 0 / .16); }
.stn2-ct-check-box::after{ content:""; width:9px; height:6px; border-left:2.4px solid oklch(16% 0.02 262); border-bottom:2.4px solid oklch(16% 0.02 262); transform:rotate(-45deg) translateY(-1px); opacity:0; }
.stn2-ct-check input:checked ~ .stn2-ct-check-box{ background:var(--stn2-accent2); border-color:var(--stn2-accent2); }
.stn2-ct-check input:checked ~ .stn2-ct-check-box::after{ opacity:1; }
.stn2-ct-check-text{ font-size:12.5px; line-height:1.5; color:oklch(70% 0.01 260); }
/* Webasyst's default captcha widget ({$wa->captcha()}) ships with no styling
   of its own beyond a plain <img>/<input>/<a> — matches the same gap fixed
   for .stn2-helpdesk-form-card, here scoped to the contact form instead. */
[data-role="ct-captcha-wrap"]{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
[data-role="ct-captcha-wrap"] .wa-captcha{ display:flex; align-items:center; gap:10px; float:none; }
[data-role="ct-captcha-wrap"] .wa-captcha p{ margin:0; display:flex; align-items:center; gap:10px; }
[data-role="ct-captcha-wrap"] .wa-captcha-img{ border-radius:10px; float:none !important; margin:0 !important; cursor:pointer; }
[data-role="ct-captcha-wrap"] .wa-captcha-input{ width:9em !important; min-width:9em !important; padding:13px 15px; border-radius:12px; background:oklch(100% 0 0 / .04); border:1px solid oklch(100% 0 0 / .11); color:var(--stn2-text); font-size:14px; font-family:inherit; outline:none; box-sizing:border-box; }
[data-role="ct-captcha-wrap"] .wa-captcha-refresh{ font-size:12px; color:var(--stn2-muted); text-decoration:underline; }
.stn2-ct-message{ margin-top:16px; font-size:12.5px; padding:12px 14px; border-radius:12px; background:oklch(66% 0.21 25 / .1); border:1px solid oklch(66% 0.21 25 / .26); color:oklch(74% 0.14 25); }
.stn2-ct-message_success{ background:color-mix(in oklab, var(--stn2-accent2) 12%, transparent); border-color:color-mix(in oklab, var(--stn2-accent2) 33%, transparent); color:var(--stn2-accent2); }
.stn2-ct-submit-row{ display:flex; align-items:center; gap:16px; margin-top:20px; flex-wrap:wrap; }
.stn2-ct-submit{ display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:13px 20px; border-radius:12px; font-size:13.5px; font-weight:700; cursor:pointer; background:var(--stn2-gradient); color:oklch(16% 0.02 262); border:none; font-family:inherit; }
.stn2-ct-submit-note{ font-size:12px; color:var(--stn2-dim, var(--stn2-muted)); }
@media (max-width:900px){
    .stn2-ct-grid{ grid-template-columns:1fr; }
    .stn2-ct-aside{ position:static; }
    .stn2-ct-form-row{ grid-template-columns:1fr; }
}

/* Pricing page */
.stn2-pr-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:32px; flex-wrap:wrap; margin-top:14px; }
.stn2-pr-h1{ margin:0; font-family:'Space Grotesk',sans-serif; font-size:44px; line-height:1.06; font-weight:600; letter-spacing:-1px; color:var(--stn2-text); }
.stn2-pr-lead{ margin:14px 0 0; font-size:15.5px; line-height:1.6; color:oklch(68% 0.01 260); max-width:620px; }
.stn2-pr-info-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:26px; }
.stn2-pr-info-card{ display:flex; align-items:flex-start; gap:13px; padding:18px 20px; border-radius:16px; background:var(--stn2-card); border:1px solid var(--stn2-border); }
.stn2-pr-info-icon{ width:32px; height:32px; border-radius:10px; background:oklch(100% 0 0 / .05); border:1px solid oklch(100% 0 0 / .12); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:oklch(72% 0.01 260); }
.stn2-pr-info-title{ font-size:14px; font-weight:600; color:var(--stn2-text); }
.stn2-pr-info-text{ font-size:12.5px; line-height:1.55; color:var(--stn2-muted); margin-top:4px; }
.stn2-pr-gift{ display:flex; align-items:center; gap:16px; padding:18px 20px; border-radius:16px; background:linear-gradient(120deg, #FFC53D14, oklch(20% 0.02 262 / .55)); border:1px solid #FFC53D3a; flex-wrap:wrap; position:relative; }
.stn2-pr-gift-body{ min-width:0; flex:1; }
.stn2-pr-gift-top{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.stn2-pr-gift-badge{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.9px; font-weight:600; color:var(--stn2-warn); background:#FFC53D1c; border:1px solid #FFC53D44; padding:3px 8px; border-radius:6px; }
.stn2-pr-gift-title{ font-size:14px; font-weight:600; color:var(--stn2-text); }
.stn2-pr-gift-desc{ font-size:12.5px; line-height:1.5; color:oklch(66% 0.01 260); margin-top:6px; }
.stn2-pr-gift-btn{ display:inline-flex; align-items:center; gap:8px; padding:11px 18px; border-radius:11px; background:var(--stn2-warn); color:oklch(20% 0.04 80); font-size:13.5px; font-weight:700; cursor:pointer; white-space:nowrap; }
.stn2-pr-gift-msg{ position:absolute; bottom:-24px; left:20px; font-size:11.5px; color:var(--stn2-accent2); }
.stn2-pr-plans{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:20px; align-items:start; }
.stn2-pr-plan{ position:relative; display:flex; flex-direction:column; min-height:100%; border-radius:20px; border:1px solid var(--stn2-border); background:var(--stn2-card); }
.stn2-pr-plan_badge{ border-color:color-mix(in oklab, var(--pcolor) 33%, transparent); background:linear-gradient(170deg, color-mix(in oklab, var(--pcolor) 6%, transparent), oklch(19% 0.02 262 / .68)); box-shadow:0 34px 80px -58px rgba(0,0,0,.9); }
.stn2-pr-plan-badge{ position:absolute; top:0; left:22px; transform:translateY(-50%); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.6px; padding:5px 11px; border-radius:999px; background:var(--pcolor); color:oklch(20% 0.04 60); }
.stn2-pr-plan-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:22px 22px 0; }
.stn2-pr-plan-name{ font-family:'Space Grotesk',sans-serif; font-size:19px; font-weight:700; letter-spacing:.6px; padding:5px 13px; border-radius:9px; background:var(--pcolor); color:oklch(20% 0.04 60); }
.stn2-pr-plan-brand{ font-family:'Space Grotesk',sans-serif; font-size:13px; font-weight:700; color:oklch(46% 0.01 260); letter-spacing:.4px; }
.stn2-pr-plan-desc{ font-size:12.5px; line-height:1.55; color:oklch(66% 0.01 260); margin-top:13px; min-height:64px; padding:0 22px; }
.stn2-pr-plan-features-label{ font-size:10.5px; text-transform:uppercase; letter-spacing:.6px; color:var(--stn2-faint); font-weight:700; padding:18px 22px 0; }
.stn2-pr-plan-features{ display:flex; flex-direction:column; padding:0 22px; margin-top:11px; }
.stn2-pr-feature{ display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px dashed oklch(100% 0 0 / .07); }
.stn2-pr-feature svg{ flex-shrink:0; }
.stn2-pr-feature-name{ font-size:12.5px; flex:1; min-width:0; color:oklch(88% 0.01 260); }
.stn2-pr-feature-name_off{ color:var(--stn2-dim, var(--stn2-muted)); }
.stn2-pr-feature-info{ width:15px; height:15px; border-radius:50%; border:1px solid oklch(100% 0 0 / .14); display:flex; align-items:center; justify-content:center; font-size:9px; color:var(--stn2-dim, var(--stn2-muted)); flex-shrink:0; text-decoration:none; }
.stn2-pr-plan-foot{ padding:20px 22px 22px; margin-top:auto; }
.stn2-pr-plan-price-v{ font-family:'Space Grotesk',sans-serif; font-size:30px; font-weight:700; letter-spacing:-.8px; color:var(--stn2-text); }
.stn2-pr-plan-price-u{ font-size:12.5px; color:oklch(58% 0.01 260); }
.stn2-pr-plan-price-alt{ font-size:12px; color:var(--stn2-dim, var(--stn2-muted)); margin-top:5px; }
.stn2-pr-plan-btn{ display:flex; align-items:center; justify-content:center; gap:9px; margin-top:16px; padding:13px 20px; border-radius:12px; font-size:13.5px; font-weight:700; cursor:pointer; background:var(--pcolor); color:oklch(20% 0.04 60); }
.stn2-pr-plan_badge .stn2-pr-plan-btn{ background:var(--stn2-gradient); color:oklch(16% 0.02 262); }
.stn2-pr-plan-upgrade-note{ font-size:11.5px; color:oklch(66% 0.01 260); margin-top:8px; }
.stn2-pr-plan-owned{ display:flex; align-items:center; gap:9px; font-size:12.5px; color:oklch(78% 0.01 260); margin-top:8px; }
.stn2-pr-bottom-grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:16px; margin-top:16px; align-items:start; padding-bottom:70px; }
.stn2-pr-free{ border-radius:20px; border:1px solid #22C55E33; background:linear-gradient(140deg, #22C55E10, oklch(20% 0.02 262 / .5)); padding:22px 24px; }
.stn2-pr-free-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.stn2-pr-free-badge{ font-family:'Space Grotesk',sans-serif; font-size:19px; font-weight:700; letter-spacing:.5px; padding:5px 13px; border-radius:9px; background:#22C55E; color:oklch(20% 0.05 150); }
.stn2-pr-free-note{ font-size:12.5px; color:oklch(56% 0.01 260); }
.stn2-pr-free-desc{ font-size:12.5px; line-height:1.55; color:oklch(68% 0.01 260); margin-top:13px; }
.stn2-pr-free-list{ display:grid; grid-template-columns:1fr 1fr; gap:0 20px; margin-top:16px; }
.stn2-pr-free-item{ display:flex; align-items:center; gap:9px; padding:8px 0; border-bottom:1px dashed oklch(100% 0 0 / .07); font-size:12.5px; color:oklch(82% 0.01 260); }
.stn2-pr-free-item svg{ flex-shrink:0; }
.stn2-pr-promo{ border-radius:20px; border:1px solid var(--stn2-border); background:linear-gradient(165deg, oklch(22% 0.026 275 / .7), oklch(19% 0.02 262 / .62)); padding:24px 26px 26px; }
.stn2-pr-promo-title{ font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:600; color:var(--stn2-text); }
.stn2-pr-promo-desc{ font-size:12.5px; line-height:1.55; color:var(--stn2-muted); margin-top:9px; max-width:520px; }
.stn2-pr-promo-form{ display:flex; gap:10px; margin-top:18px; flex-wrap:wrap; position:relative; }
.stn2-pr-promo-input{ flex:1; min-width:220px; padding:14px 15px; border-radius:12px; background:oklch(100% 0 0 / .04); border:1px solid oklch(100% 0 0 / .11); color:var(--stn2-text); font-family:'JetBrains Mono',monospace; font-size:14px; letter-spacing:1.5px; text-transform:uppercase; outline:none; }
.stn2-pr-promo-btn{ display:inline-flex; align-items:center; gap:9px; padding:14px 24px; border-radius:13px; font-size:14px; font-weight:700; cursor:pointer; background:var(--stn2-gradient); color:oklch(16% 0.02 262); white-space:nowrap; }
.stn2-pr-promo-msg{ width:100%; margin-top:6px; font-size:12px; }
@media (max-width:1000px){
    .stn2-pr-plans{ grid-template-columns:1fr; }
    .stn2-pr-info-grid{ grid-template-columns:1fr; }
    .stn2-pr-bottom-grid{ grid-template-columns:1fr; }
}

/* Order modal */
.stn2-om-overlay{ position:fixed; inset:0; z-index:80; background:oklch(12% 0.015 260 / .78); backdrop-filter:blur(6px); align-items:center; justify-content:center; padding:32px; }
.stn2-om-modal{ width:100%; max-width:560px; max-height:88vh; overflow:auto; border-radius:24px; border:1px solid oklch(100% 0 0 / .1); background:linear-gradient(168deg, oklch(23% 0.028 275 / .96), oklch(18% 0.02 262 / .98)); box-shadow:0 60px 130px -50px rgba(0,0,0,.9); }
.stn2-om-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:24px 26px 0; }
.stn2-om-step{ display:inline-flex; align-items:center; gap:8px; padding:5px 12px; border-radius:999px; background:oklch(100% 0 0 / .05); border:1px solid oklch(100% 0 0 / .1); font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:1px; color:var(--stn2-muted); }
.stn2-om-step-dot{ width:5px; height:5px; border-radius:50%; background:var(--stn2-accent1); }
.stn2-om-title{ margin:14px 0 0; font-family:'Space Grotesk',sans-serif; font-size:24px; font-weight:600; letter-spacing:-.5px; color:var(--stn2-text); }
.stn2-om-subtitle{ margin:8px 0 0; font-size:13px; line-height:1.55; color:var(--stn2-muted); }
.stn2-om-close{ width:34px; height:34px; border-radius:11px; border:1px solid oklch(100% 0 0 / .1); background:oklch(100% 0 0 / .04); display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; color:oklch(66% 0.01 260); }
.stn2-om-body{ display:flex; flex-direction:column; gap:18px; padding:22px 26px; }
.stn2-om-plan{ border-radius:16px; border:1px solid var(--stn2-border); background:oklch(100% 0 0 / .028); padding:16px 18px; }
.stn2-om-plan-desc{ font-size:12.5px; line-height:1.55; color:oklch(66% 0.01 260); margin-top:10px; }
.stn2-om-label{ font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:oklch(54% 0.01 260); font-weight:600; margin-bottom:9px; }
.stn2-om-periods{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.stn2-om-period{ padding:14px 16px; border-radius:13px; cursor:pointer; background:oklch(100% 0 0 / .03); border:1px solid var(--stn2-border); }
.stn2-om-period_active{ background:color-mix(in oklab, var(--stn2-accent1) 10%, transparent); border-color:color-mix(in oklab, var(--stn2-accent1) 40%, transparent); }
.stn2-om-period-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:13.5px; font-weight:600; color:var(--stn2-text); }
.stn2-om-period-radio{ width:15px; height:15px; border-radius:50%; border:1.6px solid oklch(100% 0 0 / .2); display:inline-block; }
.stn2-om-period_active .stn2-om-period-radio{ border-color:var(--stn2-accent2); box-shadow:inset 0 0 0 3.5px var(--stn2-accent2); }
.stn2-om-period-price{ font-family:'Space Grotesk',sans-serif; font-size:19px; font-weight:700; margin-top:8px; color:var(--stn2-text); }
.stn2-om-note{ font-size:11.5px; line-height:1.5; color:var(--stn2-faint); }
.stn2-om-message{ font-size:12px; color:var(--stn2-danger); }
.stn2-om-foot{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 26px 22px; border-top:1px solid oklch(100% 0 0 / .08); flex-wrap:wrap; }
.stn2-om-total{ display:flex; align-items:baseline; gap:10px; font-size:12.5px; color:oklch(60% 0.01 260); }
.stn2-om-total-v{ font-family:'Space Grotesk',sans-serif; font-size:22px; font-weight:700; color:var(--stn2-text); }
.stn2-om-submit{ display:inline-flex; align-items:center; gap:9px; padding:13px 22px; border-radius:12px; background:var(--stn2-gradient); color:oklch(16% 0.02 262); font-size:13.5px; font-weight:700; cursor:pointer; }

/* Unified directory (leagues/teams/referees/players) */
body.stn2 .container-fluid{ position:relative; z-index:2; }
.stn2-dir-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:28px; flex-wrap:wrap; margin-top:12px; }
.stn2-dir-h1{ margin:0; font-family:'Space Grotesk',sans-serif; font-size:38px; line-height:1.06; font-weight:600; letter-spacing:-.9px; color:var(--stn2-text); }
.stn2-dir-desc{ margin:11px 0 0; font-size:14.5px; line-height:1.55; color:var(--stn2-muted); max-width:560px; }
.stn2-dir-tabs{ display:flex; gap:6px; padding:5px; border-radius:14px; background:oklch(100% 0 0 / .04); border:1px solid var(--stn2-border); flex-wrap:wrap; }
.stn2-dir-tab{ display:flex; align-items:center; gap:8px; padding:10px 15px; border-radius:11px; font-size:13px; color:var(--stn2-muted); text-decoration:none; white-space:nowrap; }
.stn2-dir-tab_active{ color:oklch(16% 0.02 262); font-weight:600; background:var(--stn2-gradient); }
.stn2-dir-tab-count{ font-family:'JetBrains Mono',monospace; font-size:10px; padding:1px 5px; border-radius:5px; background:oklch(100% 0 0 / .07); color:var(--stn2-faint); }
.stn2-dir-tab_active .stn2-dir-tab-count{ background:oklch(18% 0.02 262 / .22); color:oklch(18% 0.02 262); }
.stn2-dir-search-row{ display:flex; gap:12px; margin-top:22px; flex-wrap:wrap; align-items:center; }
.stn2-dir-search{ position:relative; flex:1; min-width:280px; display:flex; align-items:center; }
.stn2-dir-search svg{ position:absolute; left:17px; pointer-events:none; }
.stn2-dir-search input{ width:100%; padding:14px 16px 14px 46px; border-radius:14px; background:oklch(20% 0.02 262 / .6); border:1px solid var(--stn2-border); color:var(--stn2-text); font-size:14.5px; font-family:inherit; outline:none; box-sizing:border-box; }
.stn2-dir-chips{ display:flex; gap:7px; flex-wrap:wrap; }
.stn2-dir-chip{ padding:11px 14px; border-radius:12px; font-size:12.5px; color:var(--stn2-muted); background:oklch(100% 0 0 / .04); border:1px solid var(--stn2-border); text-decoration:none; white-space:nowrap; }
.stn2-dir-chip_active{ color:#fff; font-weight:600; background:color-mix(in oklab, var(--stn2-accent1) 18%, transparent); border-color:color-mix(in oklab, var(--stn2-accent1) 45%, transparent); }
.stn2-dir-sort{ display:flex; align-items:center; gap:8px; padding:11px 14px; border-radius:12px; background:oklch(100% 0 0 / .04); border:1px solid var(--stn2-border); color:var(--stn2-muted); }
.stn2-dir-sort-opt{ font-size:12.5px; color:var(--stn2-muted); text-decoration:none; padding:2px 6px; border-radius:6px; }
.stn2-dir-sort-opt_active{ color:var(--stn2-accent2); font-weight:600; }
.stn2-dir-alphabet{ display:flex; align-items:center; gap:4px; margin-top:14px; flex-wrap:wrap; }
.stn2-dir-letter{ min-width:26px; height:26px; padding:0 6px; border-radius:7px; display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono',monospace; font-size:11px; text-decoration:none; color:oklch(78% 0.01 260); background:oklch(100% 0 0 / .05); border:1px solid oklch(100% 0 0 / .06); }
.stn2-dir-letter_active{ color:oklch(16% 0.02 262); background:var(--stn2-accent2); border-color:var(--stn2-accent2); }
.stn2-dir-letter_off{ color:oklch(38% 0.01 260); background:transparent; cursor:default; pointer-events:none; }
.stn2-dir-table{ margin-top:18px; border-radius:20px; border:1px solid var(--stn2-border); background:oklch(20% 0.02 262 / .42); overflow:hidden; }
.stn2-dir-colhead{ display:grid; grid-template-columns:minmax(240px,1.5fr) minmax(120px,.9fr) 96px 30px; gap:16px; padding:11px 20px; border-bottom:1px solid oklch(100% 0 0 / .07); background:oklch(100% 0 0 / .022); font-size:9.5px; text-transform:uppercase; letter-spacing:.55px; color:var(--stn2-faint); font-weight:700; }
.stn2-dir-col-right{ text-align:right; }
.stn2-dir-row{ display:grid; grid-template-columns:minmax(240px,1.5fr) minmax(120px,.9fr) 96px 30px; gap:16px; align-items:center; padding:13px 20px; border-bottom:1px solid oklch(100% 0 0 / .05); text-decoration:none; color:inherit; }
.stn2-dir-row:last-of-type{ border-bottom:none; }
.stn2-dir-row:hover{ background:oklch(100% 0 0 / .03); }
.stn2-dir-row-main{ display:flex; align-items:center; gap:13px; min-width:0; }
.stn2-dir-avatar{ width:36px; height:36px; border-radius:11px; flex:none; display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:700; color:oklch(18% 0.02 262); background:var(--stn2-gradient); overflow:hidden; }
.stn2-dir-avatar img{ width:100%; height:100%; object-fit:cover; }
.stn2-dir-row-text{ min-width:0; }
.stn2-dir-row-title{ display:flex; align-items:center; gap:8px; font-size:14px; font-weight:600; color:var(--stn2-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-dir-row-sub{ font-size:11.5px; color:var(--stn2-faint); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-dir-tag{ font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; padding:2px 7px; border-radius:5px; flex-shrink:0; background:color-mix(in oklab, var(--stn2-accent1) 16%, transparent); border:1px solid color-mix(in oklab, var(--stn2-accent1) 35%, transparent); color:#a58cff; }
.stn2-dir-tag_cup{ background:#FFC53D1c; border-color:#FFC53D44; color:var(--stn2-warn); }
.stn2-dir-row-col{ font-size:13px; color:oklch(76% 0.01 260); min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stn2-dir-metric{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; color:var(--stn2-text); }
.stn2-dir-row-arrow{ display:flex; align-items:center; justify-content:flex-end; color:var(--stn2-faint); }
.stn2-dir-empty{ padding:44px 24px; text-align:center; }
.stn2-dir-empty-title{ font-family:'Space Grotesk',sans-serif; font-size:17px; font-weight:600; color:var(--stn2-text); }
.stn2-dir-empty-text{ font-size:13px; color:var(--stn2-muted); margin-top:8px; }
.stn2-dir-empty-btn{ display:inline-flex; align-items:center; gap:8px; margin-top:16px; padding:11px 20px; border-radius:11px; background:oklch(100% 0 0 / .06); border:1px solid oklch(100% 0 0 / .12); font-size:13px; font-weight:600; color:var(--stn2-text); text-decoration:none; }
.stn2-dir-foot{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:18px; padding-bottom:70px; flex-wrap:wrap; }
.stn2-dir-foot-count{ font-size:12.5px; color:var(--stn2-faint); }
.stn2-dir-pages{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.stn2-dir-page{ min-width:34px; height:34px; padding:0 6px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:500; text-decoration:none; color:oklch(70% 0.01 260); background:oklch(100% 0 0 / .045); border:1px solid var(--stn2-border); }
.stn2-dir-page_active{ color:oklch(16% 0.02 262); font-weight:700; background:var(--stn2-gradient); border-color:transparent; }
.stn2-dir-page_ellipsis{ background:transparent; border-color:transparent; cursor:default; }
@media (max-width:900px){
    .stn2-dir-colhead, .stn2-dir-row{ grid-template-columns:1fr; }
    .stn2-dir-colhead > div:not(:first-child), .stn2-dir-row-arrow{ display:none; }
}