:root {
    --bg-main: #041020;
    --stadium-bg-url: url("assets/branding/alphalex_stadium_background.png");
    --stadium-image-opacity: 1;
    --stadium-overlay-top: rgba(3, 10, 24, 0.03);
    --stadium-overlay-bottom: rgba(3, 10, 24, 0.08);
    --stadium-overlay: rgba(3, 10, 24, 0.06);
    --stadium-glow: rgba(10, 16, 28, 0.05);
    --ax-glass-strong: rgba(5, 18, 38, 0.32);
    --ax-glass-panel: rgba(5, 16, 34, 0.26);
    --ax-glass-header: rgba(5, 18, 38, 0.24);
    --ax-glass-terminal: rgba(5, 16, 34, 0.26);
    --ax-glass-card: rgba(5, 16, 34, 0.34);
    --ax-shell-overlay: transparent;
    --ax-shell-overlay-faint: transparent;
    --ax-shell-overlay-strong: transparent;
    --panel-bg: var(--ax-glass-panel);
    --panel-bg-strong: var(--ax-glass-strong);
    --border-blue: rgba(132, 218, 246, 0.32);
    --border-blue-strong: rgba(124, 226, 252, 0.42);
    --accent-cyan: #48e8ff;
    --accent-blue: #3f7dff;
    --accent-purple: #9b35ff;
    --ax-chrome-accent: #7a94a8;
    --ax-chrome-accent-soft: #8fa3b5;
    --ax-chrome-blue: #4a6280;
    --bg: var(--bg-main);
    --panel-glass: var(--panel-bg);
    --cyan: var(--accent-cyan);
    --green-glow: #39ff88;
    --purple: var(--accent-purple);
    --red: #ff385c;
    --amber: #ffd166;
    --text: #eef3f8;
    --muted: #b1c1d0;
    --faint: rgba(178, 194, 210, 0.64);
    --line: var(--border-blue);
    --line-strong: var(--border-blue-strong);
    --ax-edge-line: rgba(176, 232, 255, 0.38);
    --ax-edge-line-soft: rgba(176, 232, 255, 0.24);
    --ax-edge-line-strong: rgba(153, 236, 255, 0.52);
    --ax-corner-glow: rgba(72, 232, 255, 0.14);
    --ax-frame-highlight: rgba(255, 255, 255, 0.09);
    --radius: 8px;
    --shadow: 0 18px 45px rgba(0, 0, 0, 0.20);
    --sidebar-width: 308px;
    --glass-bg: var(--ax-glass-panel);
    --glass-border: rgba(132, 218, 246, 0.32);
    --glass-shadow: 0 18px 45px rgba(0, 0, 0, 0.28);
    --glass-blur: 2px;
    --glass-saturate: 100%;
    --terminal-glass-bg: var(--ax-glass-terminal);
    --terminal-glass-border: rgba(132, 218, 246, 0.34);
    --card-glass-bg: rgba(5, 16, 34, 0.34);
    --card-glass-border: rgba(132, 218, 246, 0.32);
    --card-neon-edge: 0 4px 18px rgba(0, 0, 0, 0.18);
}

* { box-sizing: border-box; }

.hidden { display: none !important; }

html,
body {
    height: 100%;
    overflow: hidden;
    background: var(--bg-main);
}

body {
    margin: 0;
    color: var(--text);
    font-family: "Segoe UI", system-ui, sans-serif;
    background-color: var(--bg-main);
    position: relative;
    min-height: 100vh;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        linear-gradient(var(--stadium-overlay-top), var(--stadium-overlay-bottom)),
        var(--stadium-bg-url) center / cover no-repeat;
    opacity: var(--stadium-image-opacity);
    filter: brightness(0.98) contrast(1.32) saturate(0.80);
}

body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    opacity: 1;
    background:
        linear-gradient(
            180deg,
            transparent 0%,
            rgba(0, 8, 18, 0.20) 55%,
            rgba(0, 8, 18, 0.34) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0, 8, 22, 0.42),
            rgba(0, 10, 28, 0.32) 45%,
            rgba(0, 8, 18, 0.48)
        ),
        radial-gradient(circle at 50% 20%, rgba(40, 180, 220, 0.08), transparent 42%);
}

a { color: var(--ax-chrome-accent-soft); text-decoration: none; }
button, input { font: inherit; }

.playnaptic-app {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
    align-items: stretch;
    height: 100vh;
    gap: 12px;
    padding: 12px;
    overflow: hidden;
    box-sizing: border-box;
}

.glass-panel {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.sidebar,
.sidebar-card,
.sidebar.sidebar-shell {
    border-radius: calc(var(--radius) + 2px);
    display: flex;
    flex-direction: column;
    padding: 14px 16px 12px;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    box-shadow: var(--glass-shadow);
}

.sidebar-fixed-top,
.brand,
.explorer-search,
.live-command {
    flex-shrink: 0;
}

.ax-sidebar-leagues,
.ax-sidebar-leagues.ax-sidebar {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 6px;
    min-height: 0;
    overflow: hidden;
}

.ax-section,
.sidebar-section {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-height: 0;
}

.ax-section-favorites,
.sidebar-section.ax-favorites {
    flex: 0 0 auto;
}

.ax-section-countries,
.sidebar-section.ax-countries {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.ax-section-international,
.sidebar-section.ax-international {
    display: none;
}

.ax-section-title {
    color: var(--text);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 2px 2px 2px;
    margin-bottom: 0;
    flex-shrink: 0;
    line-height: 1.2;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.ax-sidebar-divider {
    flex-shrink: 0;
    height: 1px;
    margin: 2px 2px;
    background: linear-gradient(90deg, transparent, rgba(90, 115, 140, 0.22), transparent);
}

.ax-fav-leagues,
.ax-country-list,
.ax-international-list,
.sidebar-scroll {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    overflow-x: hidden;
    scrollbar-color: rgba(90, 115, 140, 0.38) rgba(2, 6, 23, 0.30);
    scrollbar-width: thin;
}

.ax-fav-leagues,
.ax-fav-leagues.sidebar-scroll,
.sidebar-scroll.ax-favorites-list {
    max-height: 188px;
    flex: 0 0 auto;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px;
    padding-bottom: 16px;
    gap: 4px;
    scroll-padding-bottom: 16px;
}

.ax-section-countries .ax-country-list,
.ax-country-list.sidebar-scroll,
.sidebar-scroll.ax-country-list-scroll {
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 2px;
    padding-bottom: 36px;
    scroll-padding-bottom: 36px;
}

@media (min-height: 920px) {
    .ax-section-countries .ax-country-list,
    .sidebar-scroll.ax-country-list-scroll {
        min-height: 420px;
    }
}

.ax-international-list,
.ax-international-list.sidebar-scroll,
.sidebar-scroll.ax-international-list-scroll {
    display: none;
}

.league-hub-next-fixture-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.league-hub-next-fixture-row {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto auto auto;
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid var(--card-glass-border);
    border-radius: 8px;
    background: var(--card-glass-bg);
    box-shadow: var(--card-neon-edge);
}

.league-hub-next-team {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.odds-pick-league-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ax-fav-leagues::-webkit-scrollbar,
.ax-country-list::-webkit-scrollbar,
.ax-international-list::-webkit-scrollbar,
.sidebar-scroll::-webkit-scrollbar {
    width: 6px;
}

.ax-fav-leagues::-webkit-scrollbar-track,
.ax-country-list::-webkit-scrollbar-track,
.ax-international-list::-webkit-scrollbar-track,
.sidebar-scroll::-webkit-scrollbar-track {
    background: rgba(2, 6, 23, 0.30);
    border-radius: 999px;
}

.ax-fav-leagues::-webkit-scrollbar-thumb,
.ax-country-list::-webkit-scrollbar-thumb,
.ax-international-list::-webkit-scrollbar-thumb,
.sidebar-scroll::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(90, 115, 140, 0.58), rgba(72, 88, 108, 0.42));
    border-radius: 999px;
}

.ax-country-block {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex-shrink: 0;
    min-width: 0;
    max-width: 100%;
}

.ax-continent-block {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex-shrink: 0;
    min-width: 0;
}

.ax-continent-row {
    display: grid;
    grid-template-columns: 14px 28px minmax(0, 1fr) auto;
    align-items: center;
    width: 100%;
    min-height: 28px;
    gap: 4px;
    padding: 5px 6px;
    border: 1px solid rgba(104, 132, 158, 0.20);
    border-radius: 7px;
    background: rgba(8, 24, 44, 0.52);
    color: var(--text);
    font-weight: 800;
    font-size: 11px;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.18s ease, background-color 0.18s ease;
}

.ax-continent-block.is-open > .ax-continent-row {
    border-color: rgba(112, 144, 170, 0.34);
    background: rgba(10, 32, 54, 0.56);
}

.ax-continent-block.is-open > .ax-continent-row .ax-country-chevron,
.ax-country-block.is-open > .ax-country-row .ax-country-chevron {
    color: var(--ax-chrome-accent-soft);
    transform: rotate(90deg);
}

.ax-continent-countries {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 2px 0 4px 6px;
    padding-left: 4px;
    border-left: 1px solid rgba(104, 132, 158, 0.16);
}

.ax-continent-international {
    margin-top: 6px;
    padding-top: 4px;
    border-top: 1px solid rgba(104, 132, 158, 0.18);
}

.ax-international-leagues {
    border-left: none;
    margin-left: 0;
    padding-left: 0;
}

.ax-continent-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 18px;
}

.ax-continent-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 16px;
    padding: 0 3px;
    border-radius: 4px;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.04em;
    color: var(--ax-chrome-accent-soft);
    background: rgba(104, 132, 158, 0.16);
    border: 1px solid rgba(104, 132, 158, 0.22);
}

.ax-country-row {
    position: relative;
    opacity: 1;
    display: grid;
    align-items: center;
    width: 100%;
    max-width: 100%;
    min-height: 24px;
    box-sizing: border-box;
    gap: 4px;
    border: 1px solid rgba(160, 176, 198, 0.18);
    border-radius: 6px;
    background: rgba(9, 22, 38, 0.52);
    color: var(--muted);
    text-align: left;
    cursor: pointer;
    font: inherit;
    overflow: hidden;
    transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease, transform 0.12s ease;
}

.ax-league-row,
.ax-fav-row {
    position: relative;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    width: 100%;
    max-width: 100%;
    min-height: 28px;
    box-sizing: border-box;
    border: 1px solid rgba(160, 176, 198, 0.18);
    border-radius: 6px;
    background: rgba(9, 22, 38, 0.52);
    color: var(--muted);
    overflow: hidden;
    transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.ax-country-row {
    grid-template-columns: 14px 28px minmax(0, 1fr) auto;
    background: rgba(10, 25, 40, 0.56);
    color: var(--text);
    font-weight: 800;
    font-size: 10px;
    line-height: 1.2;
    padding: 3px 6px;
    height: 24px;
    max-height: 24px;
}

.ax-country-chevron {
    color: var(--faint);
    font-size: 10px;
    line-height: 1;
    text-align: center;
    display: inline-block;
    transform-origin: center center;
    transition: transform 0.24s ease, color 0.18s ease;
}

.ax-country-flag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 18px;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: 0 0 0 1px rgba(148, 163, 184, 0.18);
    background: rgba(2, 6, 23, 0.72);
    flex-shrink: 0;
}

.ax-flag-img {
    display: block;
    width: 24px;
    height: 18px;
    object-fit: cover;
}

.ax-flag-fallback {
    display: none;
    min-width: 24px;
    height: 18px;
    padding: 0 3px;
    align-items: center;
    justify-content: center;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.04em;
    color: var(--cyan);
    background: rgba(34, 211, 238, 0.1);
}

.ax-country-flag.is-fallback .ax-flag-fallback,
.ax-country-flag.is-fallback .ax-flag-img[hidden] + .ax-flag-fallback {
    display: inline-flex;
}

.ax-fav-star {
    color: #ffd166;
    font-size: 14px;
    line-height: 1;
    text-align: center;
    text-shadow: 0 0 12px rgba(255, 209, 102, 0.55);
}

.ax-country-row.active {
    color: var(--cyan);
    border-color: rgba(34, 211, 238, 0.42);
    background: #082235;
}

.ax-accordion-panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.26s ease;
    overflow: hidden;
}

.ax-accordion-panel.is-open {
    grid-template-rows: 1fr;
}

.ax-accordion-inner {
    min-height: 0;
    overflow: visible;
}

.ax-accordion-panel.is-open .ax-accordion-inner {
    overflow: visible;
}

.ax-country-leagues {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    max-width: 100%;
    background: rgba(3, 11, 22, 0.42);
    border: 1px solid rgba(34, 211, 238, 0.14);
    border-radius: 8px;
    margin: 4px 0 6px 8px;
    padding: 4px 4px 8px;
    overflow: visible;
}

.ax-country-block.is-international-group {
    margin-top: 4px;
    padding-top: 4px;
    border-top: 1px solid rgba(34, 211, 238, 0.14);
}

.ax-country-flag.is-international {
    background: rgba(34, 211, 238, 0.12);
    box-shadow: 0 0 0 1px rgba(34, 211, 238, 0.22);
}

.ax-international-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 18px;
    font-size: 13px;
    line-height: 1;
}

@keyframes axCountryExpand {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ax-league-row {
    background: rgba(9, 21, 37, 0.45);
    padding: 0 0 0 2px;
}

.ax-fav-row {
    color: #d9ecfb;
    background: rgba(10, 24, 42, 0.62);
    padding: 0 0 0 2px;
}

.ax-league-row-main,
.ax-fav-row-main {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    width: 100%;
    min-width: 0;
    min-height: 28px;
    padding: 0 6px 0 0;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    font: inherit;
    overflow: hidden;
}

.ax-league-row-main {
    font-size: 10px;
    line-height: 1;
}

.ax-fav-row-main {
    font-size: 11px;
    line-height: 1;
}

.ax-fav-row.active,
.ax-league-row.active {
    color: var(--cyan);
    border-color: rgba(34, 211, 238, 0.42);
    background: #082235;
}

.ax-country-row:hover,
.ax-league-row:hover,
.ax-fav-row:hover {
    border-color: rgba(34, 211, 238, 0.28);
    background: #0a1a2d;
}

.ax-country-row:active {
    transform: translateY(1px);
}

.ax-league-row-main:active,
.ax-fav-row-main:active {
    opacity: 0.88;
}

.ax-pin-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 22px;
    min-width: 22px;
    max-width: 22px;
    height: 22px;
    margin: 0;
    border-radius: 6px;
    color: var(--faint);
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    line-height: 1;
    flex-shrink: 0;
}

.ax-pin-btn.active {
    color: var(--amber);
    background: rgba(245, 158, 11, 0.14);
}

.ax-pin-btn.is-curated {
    cursor: default;
    opacity: 0.92;
}

.ax-pin-btn:disabled {
    cursor: default;
}

.ax-count {
    color: rgba(196, 220, 240, 0.88);
    flex-shrink: 0;
    min-width: 52px;
    max-width: 92px;
    text-align: right;
    font-size: 9px;
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
}

.ax-country-row .ax-count {
    font-size: 9px;
}

.ax-league-row .ax-count,
.ax-fav-row .ax-count {
    font-size: 9px;
}

.ax-count.muted {
    color: rgba(148, 163, 184, 0.52);
}

.ax-fav-row .league-name,
.ax-league-row .league-name,
.ax-country-row .league-name {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1;
    align-self: center;
    padding: 0;
}

.ax-fav-row .league-name {
    color: #eef8ff;
    font-weight: 800;
}

.ax-league-row-main .ax-league-logo-wrap,
.ax-fav-row-main .ax-league-logo-wrap {
    align-self: center;
    justify-self: center;
}

.ax-league-row .ax-count,
.ax-fav-row .ax-count {
    justify-self: end;
    align-self: center;
}

.ax-fav-row .ax-league-logo-wrap .ax-league-logo,
.ax-fav-row .ax-league-logo-wrap .ax-league-logo-fallback {
    width: 20px;
    height: 20px;
}

.fixture-group-title--hub {
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.1em;
    color: var(--accent-cyan);
    text-transform: uppercase;
}

.league-hub-match-intelligence-stack {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sidebar-league-empty {
    padding: 8px 10px;
    font-size: 12px;
    line-height: 1.4;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-height: 900px) {
    .sidebar.sidebar-shell {
        padding: 12px 14px 10px;
    }

    .explorer-search {
        padding: 8px 0 6px;
    }

    .live-command {
        margin: 2px 0 6px;
    }

    .ax-fav-leagues,
    .sidebar-scroll.ax-favorites-list {
        max-height: 200px;
    }

    .ax-section-countries .ax-country-list,
    .sidebar-scroll.ax-country-list-scroll {
        min-height: 0;
        padding-bottom: 28px;
    }
}

.ax-league-logo-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    min-width: 20px;
    max-width: 20px;
    height: 20px;
    flex-shrink: 0;
    overflow: hidden;
}

.ax-league-logo {
    display: block;
    object-fit: contain;
    border-radius: 4px;
    background: rgba(2, 6, 23, 0.55);
}

.ax-league-logo--sm {
    width: 18px;
    height: 18px;
}

.ax-league-logo--lg {
    width: 42px;
    height: 42px;
}

.ax-league-logo-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background: rgba(34, 211, 238, 0.08);
    color: var(--cyan);
    font-size: 11px;
}

.ax-league-logo.is-hidden,
.ax-league-logo-fallback.is-hidden {
    display: none;
}

.filter-pill-secondary {
    opacity: 0.62;
    font-size: 11px;
}

.fixture-group-block {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 14px;
}

.fixture-group-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid rgba(110, 220, 250, 0.34);
    background:
        linear-gradient(
            90deg,
            rgba(20, 85, 120, 0.35),
            rgba(8, 35, 70, 0.24)
        );
    box-shadow: var(--glass-shadow);
}

.fixture-group-title {
    flex: 1;
    min-width: 0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--text);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.fixture-group-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.fixture-group-list .compact-fixture-card:not(:last-child) {
    border-bottom: 1px solid rgba(190, 225, 245, 0.14);
    padding-bottom: 6px;
    margin-bottom: 2px;
}

.fixture-league-line--compact .fixture-meta {
    margin-left: auto;
}

.league-hub-grid .league-hub-panel {
    min-width: 0;
}

.league-hub-header {
    margin-bottom: 14px;
    padding: 14px;
    border-radius: 10px;
    border: 1px solid var(--glass-border);
    background: var(--ax-glass-header);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.league-hub-brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.league-hub-titles {
    min-width: 0;
}

.league-hub-country {
    font-size: 12px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.league-hub-league {
    margin: 2px 0 0;
    font-size: 22px;
    line-height: 1.15;
}

.league-hub-season {
    margin-top: 4px;
    font-size: 12px;
    color: var(--faint);
}

.league-hub-header-friendlies .league-hub-country {
    color: var(--cyan);
    font-weight: 800;
}

.league-hub-header-friendlies .league-hub-league {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text);
    text-transform: none;
    letter-spacing: normal;
}

.league-hub-tabs {
    display: flex;
    gap: 8px;
    margin: 0 0 12px;
    flex-wrap: wrap;
}

.league-hub-tab {
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid var(--glass-border);
    background: rgba(8, 16, 35, 0.58);
    color: var(--muted);
    font-size: 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
}

.league-hub-tab:hover,
.league-hub-tab.active {
    color: var(--text);
    border-color: rgba(72, 232, 255, 0.28);
    background: rgba(8, 22, 42, 0.72);
    box-shadow: 0 0 18px rgba(0, 180, 255, 0.08);
}

.league-hub-tab.ai-tab {
    border-color: rgba(72, 232, 255, 0.22);
    background: rgba(4, 14, 28, 0.72);
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.league-hub-tab.ai-tab.active {
    color: #031018;
    border-color: rgba(72, 232, 255, 0.85);
    background: linear-gradient(135deg, var(--accent-cyan), #67e8f9);
    box-shadow: 0 0 20px rgba(72, 232, 255, 0.28);
}

.ax-ai-tab-glyph {
    font-size: 8px;
    opacity: 0.9;
}

.ax-ai-tab-panel {
    gap: 12px;
}

.ax-ai-placeholder {
    padding: 28px 16px;
    border: 1px dashed rgba(72, 232, 255, 0.22);
    border-radius: 10px;
    background: rgba(4, 12, 28, 0.42);
}

.ax-ai-placeholder-glyph {
    font-size: 22px;
    color: var(--accent-cyan);
    margin-bottom: 8px;
    text-shadow: 0 0 16px rgba(72, 232, 255, 0.45);
}

.ax-ai-placeholder-hint {
    margin-top: 6px;
    font-size: 12px;
}

.ax-ai-fixture-line {
    font-weight: 800;
    letter-spacing: 0.03em;
}

.ax-intel-matrix,
.ax-market-lab-grid {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.ax-intel-group-title {
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--accent-cyan);
}

.ax-prob-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
    gap: 8px;
}

.glass-card {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: 10px;
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    box-shadow: var(--glass-shadow);
}

.ax-intel-module {
    padding: 12px;
}

.ax-intel-module-title {
    margin: 0 0 10px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--accent-cyan);
    text-shadow: 0 0 14px rgba(72, 232, 255, 0.18);
}

.ax-prob-card.is-pending,
.ax-momentum-signal.is-pending,
.ax-market-lab-meta .ax-data-pending {
    opacity: 0.92;
}

.ax-data-pending {
    color: var(--faint);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ax-momentum-signal-grid,
.ax-market-lab-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 8px;
}

.ax-momentum-signal {
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ax-momentum-signal-label,
.ax-market-lab-meta-label {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
}

.ax-momentum-signal-value,
.ax-market-lab-meta-value {
    font-size: 18px;
    font-weight: 900;
    color: var(--text);
}

.ax-radar-placeholder-note {
    padding: 12px;
    text-align: center;
}

.ax-market-lab-meta {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ax-market-lab-row.is-pending {
    grid-template-columns: minmax(0, 1fr) auto;
}

.ax-prob-card {
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 92px;
}

.ax-prob-card-label {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--muted);
    text-transform: uppercase;
}

.ax-prob-card-prob {
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
    color: var(--text);
    text-shadow: 0 0 18px rgba(72, 232, 255, 0.18);
}

.ax-prob-card-bar {
    height: 4px;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.14);
    overflow: hidden;
}

.ax-prob-card-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent-cyan), #67e8f9);
    box-shadow: 0 0 10px rgba(72, 232, 255, 0.35);
}

.ax-prob-card-meta {
    font-size: 10px;
    color: var(--faint);
    font-weight: 700;
}

.ax-momentum-radar-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
}

.ax-momentum-team,
.ax-momentum-h2h {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ax-momentum-team-head {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    font-size: 11px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.ax-momentum-team-head strong {
    color: var(--text);
    font-size: 13px;
    text-transform: none;
    letter-spacing: 0;
}

.ax-momentum-form {
    min-height: 22px;
}

.ax-radar-axis-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.ax-radar-axis {
    padding: 8px;
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.12);
    background: rgba(2, 8, 20, 0.45);
}

.ax-radar-axis.is-empty .ax-radar-axis-track span {
    width: 18% !important;
    opacity: 0.25;
}

.ax-radar-axis-head {
    display: flex;
    justify-content: space-between;
    gap: 6px;
    font-size: 10px;
    color: var(--muted);
    margin-bottom: 6px;
}

.ax-radar-axis-track {
    height: 4px;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.12);
    overflow: hidden;
}

.ax-radar-axis-track span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, rgba(72, 232, 255, 0.55), var(--accent-cyan));
}

.ax-radar-placeholder-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.ax-radar-placeholder-bar {
    height: 28px;
    border-radius: 8px;
    border: 1px dashed rgba(148, 163, 184, 0.18);
    background: rgba(2, 8, 20, 0.35);
}

.ax-market-lab-section {
    padding: 12px;
}

.ax-market-lab-head,
.ax-market-lab-row {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) 72px 72px 72px;
    gap: 8px;
    align-items: center;
    font-size: 11px;
}

.ax-market-lab-head {
    color: var(--faint);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
    margin-bottom: 4px;
}

.ax-market-lab-row {
    padding: 6px 0;
    border-bottom: 1px solid rgba(148, 163, 184, 0.08);
}

.ax-market-lab-market {
    font-weight: 800;
    color: var(--text);
}

.ax-market-lab-prob,
.ax-market-lab-odds {
    color: var(--muted);
    font-weight: 700;
}

.ax-market-lab-gap.positive {
    color: var(--green-glow);
    font-weight: 900;
}

.league-hub-tab-panel {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.league-hub-tab-note {
    margin: 0;
    font-size: 12px;
    color: var(--cyan);
}

.league-hub-placeholder {
    padding: 18px 12px;
    text-align: center;
}

.league-hub-fixture-list {
    gap: 8px;
}

.league-hub-next-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.league-hub-next-row {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr) auto auto;
    gap: 8px;
    align-items: center;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.14);
    background: #07111f;
    cursor: pointer;
}

.league-hub-next-row:hover {
    border-color: rgba(34, 211, 238, 0.28);
}

.league-hub-sections {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.league-hub-section {
    padding: 12px;
    border-radius: 10px;
    border: 1px solid rgba(148, 163, 184, 0.14);
    background: rgba(3, 11, 22, 0.72);
}

.league-hub-section-title {
    margin: 0 0 10px;
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cyan);
}

.league-hub-pick-row {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr) auto auto;
    gap: 8px;
    align-items: center;
    width: 100%;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.14);
    background: #07111f;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.league-hub-pick-row:hover {
    border-color: rgba(34, 211, 238, 0.28);
}

.league-hub-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.league-hub-stat-card {
    padding: 10px;
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.12);
    background: #07111f;
}

.league-hub-stat-label {
    display: block;
    font-size: 10px;
    color: var(--muted);
    margin-bottom: 4px;
}

.league-hub-stat-value {
    font-size: 16px;
    color: var(--text);
}

.league-hub-empty-note {
    margin: 10px 0 0;
    font-size: 12px;
}

.standings-team-cell {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 140px;
}

.standings-team-cell img {
    width: 18px;
    height: 18px;
    object-fit: contain;
    flex-shrink: 0;
}

.league-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--line);
    flex-shrink: 0;
}

.brand-logo {
    width: 72px !important;
    height: 72px !important;
    display: grid;
    place-items: center;
    border-radius: var(--radius);
    background: linear-gradient(135deg, rgba(34, 211, 238, 0.96), rgba(139, 92, 246, 0.96));
    color: #020617;
    font-weight: 900;
    object-fit: contain;
    padding: 0 !important;
    box-shadow: 0 0 42px rgba(34, 211, 238, 0.42), 0 14px 32px rgba(2, 6, 23, 0.42);
}

.brand-title { font-size: 20px; font-weight: 900; letter-spacing: 0.04em; }

.brand-subtitle, .eyebrow, .panel-meta, .fixture-meta, .analysis-label {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.explorer-search { padding: 16px 0 12px; flex-shrink: 0; }

.explorer-search input, .form-field input {
    width: 100%;
    background: rgba(2, 6, 23, 0.78);
    border: 1px solid var(--line);
    color: var(--text);
    border-radius: var(--radius);
    padding: 12px 13px;
    outline: none;
}

.explorer-search input:focus, .form-field input:focus {
    border-color: var(--line-strong);
    box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.09);
}

.nav-btn {
    min-height: 40px;
    color: var(--muted);
    background: rgba(15, 23, 42, 0.58);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    font-weight: 800;
    cursor: pointer;
    width: 100%;
}

.nav-btn:hover {
    color: var(--text);
    border-color: rgba(34, 211, 238, 0.34);
    background: rgba(34, 211, 238, 0.08);
}

.live-command { margin: 4px 0 14px; flex-shrink: 0; }

.nav-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--cyan);
    box-shadow: 0 0 16px currentColor;
    flex-shrink: 0;
}

.nav-dot.live { color: var(--red); background: var(--red); }

.nav-count {
    margin-left: auto;
    min-width: 30px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(239, 68, 68, 0.15);
    color: #fecaca;
    text-align: center;
    font-size: 12px;
}

.sidebar-placeholder {
    padding: 10px;
    border-radius: var(--radius);
    border: 1px dashed rgba(111, 250, 255, 0.22);
    background: rgba(2, 6, 23, 0.28);
}

.sidebar-placeholder p { margin: 0; font-size: 12px; line-height: 1.5; }

.main-column {
    position: relative;
    z-index: 2;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.top-header {
    border-radius: var(--radius);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    flex-shrink: 0;
}

.top-header.glass-panel {
    background: var(--ax-glass-header);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.page-title {
    margin: 4px 0 0;
    font-size: clamp(22px, 3vw, 28px);
    line-height: 1.1;
    font-weight: 900;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.site-nav { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }

.site-nav a {
    padding: 8px 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    background: rgba(15, 23, 42, 0.58);
}

.site-nav a:hover, .site-nav a.active {
    color: #031018;
    background: linear-gradient(135deg, var(--cyan), #67e8f9);
    border-color: rgba(34, 211, 238, 0.8);
    box-shadow: 0 0 22px rgba(34, 211, 238, 0.22);
}

.top-header-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.settings-menu {
    position: relative;
    z-index: 10000;
}

.settings-menu-toggle {
    gap: 8px;
}

.settings-menu-panel {
    position: fixed;
    z-index: 10000;
    width: min(300px, calc(100vw - 16px));
    max-width: calc(100vw - 16px);
    padding: 12px;
    border-radius: 8px;
    display: grid;
    gap: 10px;
    overflow-y: auto;
    background: var(--bg-main);
    border: 1px solid var(--line-strong);
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.55), inset 0 1px 0 var(--ax-frame-highlight);
    pointer-events: auto;
}

.settings-menu-panel[hidden] {
    display: none !important;
}

.settings-section {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.settings-section-toggle,
.settings-option {
    width: 100%;
    min-width: 0;
    border-radius: 6px;
    border: 1px solid var(--line);
    background: rgba(5, 14, 31, 0.96);
    color: var(--text);
    cursor: pointer;
    font: inherit;
}

.settings-section-toggle {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 10px;
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.settings-section-selected {
    margin-left: auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: none;
}

.settings-section-chevron {
    flex: 0 0 auto;
    color: var(--cyan);
    transition: transform 0.16s ease;
}

.settings-section.is-open .settings-section-chevron {
    transform: rotate(180deg);
}

.settings-section-options {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.settings-section-options[hidden] {
    display: none !important;
}

.settings-option {
    min-height: 34px;
    padding: 7px 10px;
    text-align: left;
    font-size: 0.82rem;
    font-weight: 700;
}

.settings-option:hover,
.settings-section-toggle:hover,
.settings-option.is-active {
    border-color: var(--line-strong);
    background: var(--panel-bg-strong);
}

.settings-option.is-active {
    color: var(--cyan);
}

.voice-control {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 190px;
    max-width: 260px;
    padding: 5px 8px;
    border: 1px solid rgba(34, 211, 238, 0.20);
    border-radius: 999px;
    background: rgba(2, 6, 23, 0.42);
}

.voice-control-btn {
    width: 34px;
    height: 34px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--ax-chrome-accent);
    background: rgba(15, 23, 42, 0.86);
    font-size: 9px;
    font-weight: 950;
    letter-spacing: 0.08em;
    cursor: pointer;
}

.voice-control-btn:hover:not(:disabled),
.voice-control-btn.listening {
    color: #031018;
    border-color: rgba(34, 211, 238, 0.82);
    background: linear-gradient(135deg, var(--cyan), #67e8f9);
    box-shadow: 0 0 20px rgba(34, 211, 238, 0.24);
}

.voice-control-btn:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.voice-control-copy {
    min-width: 0;
}

.voice-control-status,
.voice-control-transcript {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.voice-control-status {
    color: var(--text);
    font-size: 10px;
    font-weight: 900;
}

.voice-control-transcript {
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
}

/* Sounds & Vibration preferences (Alerts page) */
.np-prefs-card { display: flex; flex-direction: column; gap: 10px; }
.np-prefs-title { font-size: 13px; font-weight: 900; color: var(--text); }
.np-pref-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.np-pref-label { font-size: 12px; font-weight: 700; color: var(--text); }
.np-pref-toggle {
    min-width: 64px;
    padding: 6px 14px;
    border-radius: 999px;
    border: 1px solid var(--border, rgba(255, 255, 255, 0.14));
    background: rgba(255, 255, 255, 0.06);
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
    cursor: pointer;
}
.np-pref-toggle.is-on {
    background: var(--ax-chrome-accent, #38bdf8);
    border-color: transparent;
    color: #04121f;
}
.np-pref-toggle:disabled { opacity: 0.45; cursor: not-allowed; }
.np-pref-volume { flex: 1; max-width: 200px; }
.np-pref-hint { font-size: 10px; font-weight: 700; color: var(--muted); }

/* Voice Commands help (Alerts page) */
.np-voice-help-card { display: flex; flex-direction: column; gap: 10px; }
.np-voice-help-title { font-size: 13px; font-weight: 900; color: var(--text); }
.np-voice-help-intro,
.np-voice-help-assistant-intro,
.np-voice-help-notes p {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    color: var(--muted);
    line-height: 1.45;
}
.np-voice-help-notes { display: flex; flex-direction: column; gap: 6px; padding-top: 4px; border-top: 1px solid rgba(255, 255, 255, 0.06); }
.np-voice-help-columns-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
    padding: 0 2px;
}
.np-voice-help-group { border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 8px; overflow: hidden; }
.np-voice-help-group-title {
    cursor: pointer;
    list-style: none;
    padding: 8px 10px;
    font-size: 11px;
    font-weight: 800;
    color: var(--text);
    background: rgba(255, 255, 255, 0.03);
}
.np-voice-help-group-title::-webkit-details-marker { display: none; }
.np-voice-help-list { list-style: none; margin: 0; padding: 4px 8px 8px; display: flex; flex-direction: column; gap: 4px; }
.np-voice-help-item {
    display: grid;
    grid-template-columns: auto 1fr 1fr;
    gap: 6px 8px;
    align-items: baseline;
    font-size: 11px;
    font-weight: 600;
    color: var(--text);
}
.np-voice-help-item:not(:has(.np-voice-help-badge)) { grid-template-columns: 1fr 1fr; }
.np-voice-help-en { color: var(--text); }
.np-voice-help-ro { color: var(--muted); }
.np-voice-help-badge {
    grid-column: 1 / -1;
    justify-self: start;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--amber, #f5a623);
    background: rgba(245, 166, 35, 0.12);
    border-radius: 4px;
    padding: 1px 5px;
}
.np-voice-help-assistant { margin-top: 2px; }

.terminal-clock { text-align: right; color: var(--muted); font-weight: 800; font-size: 11px; }
#currentTime { color: var(--ax-chrome-accent); font-size: 20px; }

.route-content {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.route-content:not(:has(.content-grid)):not(:has(.audit-page)):not(:has(.special-board-stack)) {
    overflow-y: auto;
    overscroll-behavior: contain;
}

.legal-footer {
    padding: 8px 4px 0;
    color: var(--faint);
    font-size: 11px;
    line-height: 1.5;
    flex-shrink: 0;
}
.legal-footer p { margin: 0; }

.panel-inner, .hero-panel, .landing-hero, .fixtures-panel, .analysis-panel {
    background: var(--ax-glass-panel);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    border-radius: var(--radius);
}

.fixtures-panel,
.analysis-panel {
    height: 100%;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.analysis-panel {
    position: sticky;
    top: 0;
}

.panel-header {
    min-height: 48px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-weight: 900;
    flex-shrink: 0;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.panel-body {
    padding: 14px;
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}


.content-grid,
.workspace-grid {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(620px, 1fr) minmax(460px, 0.85fr);
    grid-template-rows: minmax(0, 1fr);
    gap: 12px;
    align-items: stretch;
    overflow: hidden;
}

.fixtures-panel,
.analysis-panel {
    min-width: 0;
}

.dashboard-stack,
.section-stack {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.route-content > .dashboard-stack,
.route-content > .content-grid,
.route-content > .workspace-grid,
.route-content > .audit-page,
.route-content > .board-premium-shell {
    flex: 1;
    min-height: 0;
}

.route-content:has(.audit-page),
.route-content:has(.special-board-stack) {
    overflow: hidden;
}

.audit-page {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-bottom: 20px;
}

.audit-page-intro,
.audit-page-footer {
    padding: 20px 16px;
    flex-shrink: 0;
}

.special-board-stack {
    overflow: hidden;
}

.special-board-panel {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.special-board-scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 16px 24px;
}

.odds-picks-heading {
    margin: 0 0 8px;
    font-size: 20px;
    font-weight: 900;
}

.odds-picks-section {
    margin-top: 16px;
}

.odds-picks-section h3 {
    margin: 0 0 10px;
    font-size: 15px;
    font-weight: 900;
    color: var(--cyan);
}

.section-stack { display: grid; }

.grid-2, .grid-3, .grid-4, .grid-5 { display: grid; gap: 10px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

.landing-hero { padding: 32px; text-align: center; }

.landing-hero h1 {
    margin: 0 0 12px;
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 950;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-blue), var(--accent-purple));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.landing-hero .lead { max-width: 640px; margin: 0 auto 12px; font-size: 16px; line-height: 1.6; }
.landing-hero .disclaimer { max-width: 680px; margin: 0 auto 24px; color: var(--muted); font-size: 13px; line-height: 1.6; }

.feature-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 28px 0; text-align: left; }

.feature-card {
    padding: 20px;
    border-radius: var(--radius);
    border: 1px solid var(--border-blue);
    background: linear-gradient(135deg, rgba(63, 125, 255, 0.05), rgba(155, 53, 255, 0.03)), var(--panel-bg);
}

.feature-card h3 { margin: 0 0 8px; color: var(--cyan); font-size: 15px; }
.feature-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }

.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 8px; }

.home-page {
    padding: 28px 32px 32px;
    max-width: 920px;
    margin: 0 auto;
}

.home-hero {
    text-align: center;
    margin-bottom: 28px;
}

.home-hero-emblem {
    width: 112px !important;
    height: 112px !important;
    margin: 0 auto 18px;
    display: grid;
    place-items: center;
    border-radius: 24px;
    font-size: 22px;
    font-weight: 950;
    color: #031018;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));
    object-fit: contain;
    padding: 0 !important;
    box-shadow: 0 0 56px rgba(63, 125, 255, 0.48), 0 22px 46px rgba(2, 6, 23, 0.42);
}

.home-hero-title {
    margin: 0 0 12px;
    font-size: clamp(26px, 3.6vw, 38px);
    font-weight: 950;
    line-height: 1.15;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-blue), var(--accent-purple));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.home-hero-lead {
    margin: 0 auto;
    max-width: 680px;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.65;
}

.home-how-to {
    margin-bottom: 24px;
    padding: 18px 20px;
    border-radius: var(--radius);
    border: 1px solid var(--border-blue);
    background: linear-gradient(135deg, rgba(63, 125, 255, 0.05), rgba(5, 16, 34, 0.55)), var(--panel-bg-strong);
}

.home-section-title {
    margin: 0 0 12px;
    color: var(--cyan);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.home-steps {
    margin: 0;
    padding-left: 22px;
    color: var(--text);
    font-size: 14px;
    line-height: 1.7;
}

.home-steps li + li {
    margin-top: 6px;
}

.home-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}

.home-cards-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-info-card {
    padding: 18px 20px;
    border-radius: var(--radius);
    border: 1px solid var(--border-blue);
    background: linear-gradient(135deg, rgba(63, 125, 255, 0.05), rgba(155, 53, 255, 0.03)), var(--panel-bg);
    scroll-margin-top: 18px;
}

.home-info-card h3 {
    margin: 0 0 8px;
    color: var(--cyan);
    font-size: 15px;
    font-weight: 900;
}

.home-info-card p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.6;
}

.home-disclaimer {
    margin: 0 0 22px;
    padding: 14px 16px;
    border-radius: var(--radius);
    border: 1px dashed var(--border-blue);
    background: rgba(5, 16, 34, 0.45);
    color: var(--muted);
    font-size: 12px;
    line-height: 1.6;
}

.home-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}

.performance-board {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.performance-board-section {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.performance-board-title {
    margin: 0;
    color: var(--cyan);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.performance-board-meta {
    margin: 0;
}

.audit-shortcut-card .btn {
    margin-top: 10px;
}

.desktop-app-panel {
    padding: 16px;
}

.desktop-app-card h3 {
    color: var(--amber);
}

.btn {
    border: 1px solid var(--border-blue-strong);
    border-radius: var(--radius);
    background: linear-gradient(135deg, rgba(63, 125, 255, 0.18), rgba(155, 53, 255, 0.10));
    color: #fff;
    padding: 10px 18px;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
}

.btn.secondary { border-color: var(--line); background: rgba(15, 23, 42, 0.58); }
.btn.danger { border-color: rgba(255, 56, 92, 0.4); background: rgba(255, 56, 92, 0.08); }

.metric-card, .performance-metric-card {
    padding: 12px;
    border-radius: var(--radius);
    border: 1px solid var(--border-blue);
    background: linear-gradient(135deg, rgba(63, 125, 255, 0.07), rgba(155, 53, 255, 0.04)), var(--panel-bg-strong);
}

.metric-card span, .performance-metric-card span {
    display: block;
    color: var(--muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.metric-card strong, .performance-metric-card strong { display: block; margin-top: 7px; color: #fff; font-size: 20px; font-weight: 900; }
.metric-card strong.positive, .performance-metric-card strong.positive { color: var(--green-glow); }
.metric-card strong.negative { color: var(--red); }

.fixtures-scroll {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-bottom: 24px;
}

.fixture-card {
    background:
        linear-gradient(
            90deg,
            rgba(10, 40, 80, 0.32),
            rgba(6, 24, 52, 0.24),
            rgba(10, 40, 80, 0.28)
        ),
        rgba(2, 12, 28, 0.26);
    border: 1px solid rgba(120, 210, 240, 0.30);
    border-radius: var(--radius);
    padding: 14px;
    cursor: pointer;
    box-shadow: var(--card-neon-edge), inset 0 1px 0 rgba(0, 0, 0, 0.18);
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.fixture-card:hover, .fixture-card.active {
    transform: translateY(-1px);
    background:
        linear-gradient(
            90deg,
            rgba(12, 60, 100, 0.34),
            rgba(12, 60, 100, 0.30),
            rgba(12, 60, 100, 0.34)
        ),
        rgba(2, 12, 28, 0.30);
    border-color: rgba(120, 210, 240, 0.38);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
}

.fixture-topline { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }

.fixture-match {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.team-name {
    font-weight: 700;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}
.team-name.away { text-align: right; }

.fixture-score {
    justify-self: center;
    padding: 7px 0;
    border-radius: var(--radius);
    background: rgba(2, 6, 23, 0.64);
    border: 1px solid rgba(34, 211, 238, 0.18);
    color: var(--cyan);
    text-align: center;
    font-weight: 900;
    font-size: 13px;
    min-width: 64px;
}

.league-badge, .status-badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    border-radius: 999px;
    padding: 0 8px;
    font-size: 10px;
    font-weight: 900;
    color: var(--muted);
    border: 1px solid var(--line);
    background: rgba(2, 6, 23, 0.48);
}

.status-badge.live {
    color: #fecaca;
    border-color: rgba(239, 68, 68, 0.38);
    background: rgba(239, 68, 68, 0.12);
    animation: status-live-pulse 1.5s ease-in-out infinite;
}

.status-badge.ft {
    color: #cbd5e1;
    border-color: rgba(148, 163, 184, 0.35);
    background: rgba(148, 163, 184, 0.1);
}

@keyframes status-live-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.25); }
    50% { box-shadow: 0 0 10px 2px rgba(244, 114, 182, 0.35); }
}

.prediction-strip { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.primary-pick { color: var(--text); font-size: 12px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.analysis-container {
    padding: 14px;
    line-height: 1.58;
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.empty-analysis {
    min-height: 200px;
    display: grid;
    place-items: center;
    text-align: center;
    color: var(--muted);
    gap: 8px;
    padding: 24px;
}

.empty-kicker { color: var(--cyan); font-size: 12px; font-weight: 900; text-transform: uppercase; }

.match-terminal-header {
    padding: 14px;
    border-radius: var(--radius);
    border: 1px solid var(--terminal-glass-border);
    background: var(--ax-glass-terminal);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    margin-bottom: 12px;
}

.match-terminal-header-top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.match-terminal-kicker {
    color: var(--cyan);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.analysis-label-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.ax-analysis-icon {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 950;
    color: #031018;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));
    box-shadow: 0 0 12px rgba(63, 125, 255, 0.22);
    flex-shrink: 0;
}

.ax-analysis-icon-header {
    width: 24px;
    height: 24px;
    font-size: 10px;
    border-radius: 7px;
}

.match-meta-line { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }

.match-meta-line span {
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.56);
    border: 1px solid rgba(148, 163, 184, 0.12);
    color: var(--muted);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}

.match-scoreboard {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(80px, auto) minmax(0, 1fr);
    align-items: center;
    gap: 12px;
}

.match-team { font-size: 17px; font-weight: 950; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.match-team.away { text-align: right; }

.match-score-core {
    text-align: center;
    padding: 8px 12px;
    border-radius: var(--radius);
    background: rgba(2, 6, 23, 0.66);
    border: 1px solid rgba(34, 211, 238, 0.22);
    color: var(--cyan);
    font-weight: 900;
    font-size: 18px;
}

.primary-analysis-card {
    padding: 14px;
    border-radius: var(--radius);
    border: 1px solid var(--border-blue);
    background: linear-gradient(135deg, rgba(63, 125, 255, 0.05), rgba(5, 16, 34, 0.65)), var(--panel-bg-strong);
    margin-bottom: 12px;
}

.reference-prediction-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-bottom: 12px; }
.primary-prediction-text { font-size: 22px; font-weight: 950; color: var(--cyan); margin-top: 6px; }
.reference-prediction-numbers { display: flex; gap: 14px; }
.reference-prediction-number b { display: block; font-size: 22px; color: #fff; }
.reference-prediction-number span { display: block; color: var(--muted); font-size: 10px; font-weight: 900; text-transform: uppercase; margin-top: 4px; }

.primary-terminal-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }

.risk-badge {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    border: 1px solid var(--line);
}

.risk-badge.safe { color: #031018; background: linear-gradient(135deg, #22ff7a, #86efac); }
.risk-badge.warning { color: #020617; background: linear-gradient(135deg, var(--amber), #fde68a); }
.risk-badge.danger { color: #fee2e2; background: rgba(239, 68, 68, 0.20); border-color: rgba(239, 68, 68, 0.38); }

.pick-explainability-card { margin-top: 12px; padding: 12px; border-radius: var(--radius); border: 1px solid rgba(111, 250, 255, 0.30); background: rgba(2, 6, 23, 0.36); }
.pick-explainability-card--no-bet { border-color: rgba(255, 56, 92, 0.35); }
.pick-explainability-title { color: var(--cyan); font-size: 11px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 8px; }
.pick-explainability-list { margin: 0; padding-left: 18px; font-size: 13px; line-height: 1.55; }
.pick-explainability-rejected-list { display: grid; gap: 8px; }
.pick-explainability-rejected-row { padding: 10px; border-radius: var(--radius); border: 1px solid rgba(148, 163, 184, 0.12); background: rgba(15, 23, 42, 0.48); }
.pick-explainability-rejected-head { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.pick-explainability-rejected-meta { display: flex; flex-wrap: wrap; gap: 10px; color: var(--muted); font-size: 11px; font-weight: 800; margin-bottom: 4px; }
.pick-explainability-rejected-reason { font-size: 12px; line-height: 1.45; }

.terminal-section { margin-top: 12px; padding: 12px; border-radius: var(--radius); border: 1px solid rgba(111, 250, 255, 0.30); background: rgba(2, 6, 23, 0.32); }
.terminal-section h4 { margin: 0 0 10px; color: var(--cyan); font-size: 11px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }

.audit-hero-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 24px;
    border-radius: 14px;
    border: 1px solid rgba(34, 211, 238, 0.32);
    background: radial-gradient(circle at 12% 10%, rgba(34, 211, 238, 0.18), transparent 30%), linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(8, 47, 73, 0.72));
    margin-bottom: 14px;
}

.audit-hero-rate {
    font-size: clamp(46px, 6vw, 72px);
    line-height: 0.95;
    font-weight: 950;
    color: var(--green-glow);
    text-shadow: 0 0 28px rgba(57, 255, 136, 0.28);
}

.audit-reason-bars { display: grid; gap: 10px; }
.audit-reason-row { display: grid; grid-template-columns: minmax(120px, 180px) minmax(0, 1fr) 72px; gap: 10px; align-items: center; }
.audit-reason-label { font-size: 11px; font-weight: 800; }
.audit-reason-track { height: 10px; border-radius: 999px; background: rgba(148, 163, 184, 0.12); overflow: hidden; }
.audit-reason-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg, rgba(34, 211, 238, 0.85), rgba(139, 92, 246, 0.85)); }
.audit-reason-meta { text-align: right; }
.audit-reason-meta strong { display: block; color: #fff; font-size: 12px; }
.audit-reason-meta span { color: var(--muted); font-size: 10px; }

.performance-table-card { overflow-x: auto; }

table { width: 100%; border-collapse: collapse; min-width: 480px; }
th, td { padding: 9px 10px; border-bottom: 1px solid rgba(148, 163, 184, 0.08); text-align: left; font-size: 12px; }
th { color: var(--muted); font-size: 10px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }

.login-panel { max-width: 440px; margin: 40px auto; padding: 28px; }
.login-panel h2 { margin: 0 0 8px; }
.form-field { display: grid; gap: 6px; margin-bottom: 14px; }
.form-field label { color: var(--muted); font-size: 12px; font-weight: 800; }

.status-pill { display: inline-block; padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.status-pill.online { color: var(--green-glow); background: rgba(57, 255, 136, 0.12); border: 1px solid rgba(57, 255, 136, 0.28); }

.muted { color: var(--muted); line-height: 1.6; }

.loading-state, .error-state, .empty-state {
    padding: 24px;
    border: 1px dashed rgba(111, 250, 255, 0.22);
    border-radius: var(--radius);
    color: var(--muted);
    text-align: center;
    background: rgba(2, 6, 23, 0.28);
}

.board-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.board-refresh-btn {
    min-height: 32px;
    padding: 6px 12px;
    font-size: 11px;
}

.board-loading-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px;
    margin-bottom: 12px;
    border-radius: var(--radius);
    border: 1px dashed rgba(111, 250, 255, 0.22);
    background: rgba(2, 6, 23, 0.28);
    color: var(--cyan);
    font-size: 13px;
    font-weight: 800;
}

.board-spinner {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(33, 244, 255, 0.22);
    border-top-color: var(--cyan);
    border-radius: 50%;
    animation: board-spin 0.75s linear infinite;
    flex-shrink: 0;
}

@keyframes board-spin {
    to { transform: rotate(360deg); }
}

.fixture-skeleton {
    padding: 14px;
    border-radius: var(--radius);
    border: 1px solid rgba(111, 250, 255, 0.18);
    background: rgba(1, 14, 28, 0.22);
    margin-bottom: 10px;
    display: grid;
    gap: 10px;
    animation: skeleton-pulse 1.4s ease-in-out infinite;
}

.fixture-skeleton-line {
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(33, 244, 255, 0.08), rgba(33, 244, 255, 0.18), rgba(33, 244, 255, 0.08));
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.4s ease-in-out infinite;
}

.fixture-skeleton-line.short { width: 34%; }
.fixture-skeleton-line.medium { width: 58%; }
.fixture-skeleton-line.wide { width: 82%; }

@keyframes skeleton-pulse {
    0%, 100% { opacity: 0.72; }
    50% { opacity: 1; }
}

@keyframes skeleton-shimmer {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

.live-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 32px 24px;
}

.live-empty-state p {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
}

.error-state { color: var(--red); border-color: rgba(255, 56, 92, 0.28); }

.lang-toggle select {
    min-height: 34px;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: rgba(2, 6, 23, 0.78);
    color: var(--text);
    padding: 0 10px;
    font-weight: 800;
    color-scheme: dark;
}

.board-filters,
.ax-date-switcher-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 10px;
    flex-shrink: 0;
    background: var(--ax-glass-panel);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.ax-date-switcher {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding: 2px 0 4px;
    scrollbar-width: thin;
}

.ax-board-specials {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
    padding-top: 2px;
    border-top: 1px solid rgba(72, 232, 255, 0.1);
}

.ax-date-chip {
    min-width: 72px;
    position: relative;
}

.ax-date-chip-live .ax-date-live-dot {
    position: absolute;
    top: 6px;
    right: 8px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--green-glow);
    box-shadow: 0 0 8px var(--green-glow);
    animation: ax-live-pulse 1.8s ease-in-out infinite;
}

@keyframes ax-live-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.55; transform: scale(0.85); }
}

.ax-date-chip.active {
    box-shadow: 0 0 24px rgba(72, 232, 255, 0.32), inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.filter-pill {
    min-height: 38px;
    padding: 0 14px;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: rgba(15, 23, 42, 0.58);
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    text-decoration: none;
}

.filter-pill small {
    font-size: 10px;
    font-weight: 700;
    opacity: 0.85;
}

.filter-pill:hover,
.filter-pill.active {
    color: #031018;
    background: linear-gradient(135deg, var(--cyan), #67e8f9);
    border-color: rgba(34, 211, 238, 0.8);
    box-shadow: 0 0 22px rgba(34, 211, 238, 0.22);
}

.clear-filter-pill {
    color: var(--amber);
    border-color: rgba(245, 158, 11, 0.42);
    background: rgba(245, 158, 11, 0.10);
}

.clear-filter-pill:hover {
    color: #031018;
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    border-color: rgba(245, 158, 11, 0.72);
}

.bet-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 12px;
}

.bet-tab {
    min-height: 32px;
    padding: 0 10px;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: rgba(15, 23, 42, 0.58);
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

.bet-tab.active {
    color: #031018;
    background: linear-gradient(135deg, var(--cyan), #67e8f9);
    border-color: rgba(34, 211, 238, 0.8);
}

.analysis-market-pane.hidden { display: none; }

.fixture-pick-hint {
    margin-top: 8px;
    padding: 8px 10px;
    border-radius: var(--radius);
    border: 1px dashed rgba(111, 250, 255, 0.24);
    background: rgba(2, 6, 23, 0.32);
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-align: center;
    letter-spacing: 0.02em;
}

.fixture-bottomline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 8px;
}

.fixture-probability,
.fixture-confidence {
    font-size: 11px;
    font-weight: 800;
    color: var(--cyan);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.result-badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 900;
    border: 1px solid var(--line);
}

.result-badge.won { color: var(--green-glow); border-color: rgba(57, 255, 136, 0.35); background: rgba(57, 255, 136, 0.1); }
.result-badge.lost { color: var(--red); border-color: rgba(255, 56, 92, 0.35); background: rgba(255, 56, 92, 0.1); }
.result-badge.push { color: #fbbf24; border-color: rgba(251, 191, 36, 0.4); background: rgba(251, 191, 36, 0.12); }
.result-badge.pending { color: var(--muted); border-color: rgba(148, 163, 184, 0.35); background: rgba(148, 163, 184, 0.08); }

.fixture-favorite-btn {
    min-width: 28px;
    height: 24px;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: rgba(2, 6, 23, 0.52);
    color: var(--faint);
    cursor: pointer;
    font-size: 12px;
}

.fixture-favorite-btn.active {
    color: #031018;
    background: var(--cyan);
    border-color: rgba(34, 211, 238, 0.72);
}

/* PATCH UI-S3: per-card action cluster — league ★ (favorite), ♥ (My Match), 🔔 (Alert) */
.fixture-actions {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    justify-content: flex-end;
}
.fixture-mymatch-btn,
.fixture-alert-btn {
    min-width: 24px;
    height: 24px;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: rgba(2, 6, 23, 0.52);
    color: var(--faint);
    cursor: pointer;
    font-size: 11px;
    line-height: 1;
    padding: 0;
}
.fixture-mymatch-btn:hover,
.fixture-alert-btn:hover {
    border-color: rgba(122, 170, 212, 0.5);
    color: var(--text);
}
.fixture-mymatch-btn { font-size: 13px; }
.fixture-mymatch-btn.active {
    color: #ffd166;
    border-color: rgba(255, 209, 102, 0.6);
    background: rgba(255, 209, 102, 0.12);
}
.fixture-alert-btn.active {
    color: #ffd166;
    border-color: rgba(255, 209, 102, 0.6);
    background: rgba(255, 209, 102, 0.12);
}

.secondary-card, .market-detail-card, .top-pick-card {
    padding: 12px;
    border-radius: var(--radius);
    border: 1px solid rgba(111, 250, 255, 0.30);
    background: rgba(2, 6, 23, 0.36);
    margin-bottom: 8px;
}

/* PATCH 4A2: muted note shown in the Analysis deep-dive tab now that the legacy
   Market Details section is removed and the premium cards explain the pick. */
.analysis-premium-note {
    font-size: 12.5px;
    line-height: 1.5;
    color: rgba(226, 232, 240, 0.72);
    text-align: center;
}

.market-detail-grid {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 4px 10px;
    font-size: 12px;
    margin-top: 8px;
}

.weekly-boost-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.weekly-boost-card {
    padding: 16px;
    border-radius: var(--radius);
    border: 1px solid var(--border-blue);
    background: linear-gradient(135deg, rgba(63, 125, 255, 0.05), rgba(5, 16, 34, 0.65)), var(--panel-bg-strong);
}

.standings-controls {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 10px;
    margin-bottom: 14px;
}

.standings-controls select {
    min-height: 40px;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: rgba(2, 6, 23, 0.78);
    color: var(--text);
    padding: 0 10px;
}

.full-panel-view { flex: 1; min-height: 0; }

@media (max-width: 1100px) {
    .content-grid,
    .workspace-grid {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(280px, 1fr) minmax(280px, 1fr);
    }

    .fixtures-panel,
    .analysis-panel {
        min-height: 280px;
    }

    .fixture-compact-main {
        grid-template-columns: 40px minmax(0, 1fr) 44px minmax(0, 1fr) 64px 40px auto;
    }

    .fixture-col-conf {
        display: none;
    }

    .fixture-league-line {
        grid-template-columns: 64px minmax(72px, 120px) minmax(0, 1fr);
    }
}

@media (max-width: 900px) {
    html,
    body {
        height: auto;
        overflow: auto;
    }

    .playnaptic-app {
        grid-template-columns: 1fr;
        height: auto;
        min-height: 100vh;
        overflow: visible;
    }

    .main-column {
        height: auto;
        overflow: visible;
    }

    .sidebar,
    .sidebar-card {
        height: auto;
        max-height: none;
    }

    .route-content,
    .route-content:not(:has(.content-grid)) {
        overflow: visible;
    }

    .content-grid,
    .workspace-grid {
        flex: none;
        overflow: visible;
    }

    .analysis-panel {
        position: static;
    }

    .ax-fav-leagues,
    .sidebar-scroll.ax-favorites-list { max-height: 210px; }

    .ax-section-countries .ax-country-list,
    .sidebar-scroll.ax-country-list-scroll { min-height: 200px; }

    .top-header { grid-template-columns: 1fr; text-align: center; }
    .site-nav, .top-header-right { justify-content: center; display: flex; }
    .terminal-clock { text-align: center; }
    .feature-cards, .grid-2, .grid-3, .grid-4, .grid-5, .weekly-boost-grid, .standings-controls { grid-template-columns: 1fr; }
    .reference-prediction-hero, .audit-hero-card { grid-template-columns: 1fr; text-align: center; }
    .audit-reason-row { grid-template-columns: 1fr; gap: 6px; }
}

@media (max-width: 480px) {
    .playnaptic-app { padding: 8px; gap: 8px; }
    .site-nav a { flex: 1 1 calc(50% - 8px); text-align: center; }
    .fixture-match { grid-template-columns: 1fr; text-align: center; }
    .team-name.away { text-align: center; }
}

/* Electron parity — compact board rows */
body.density-compact .content-grid { gap: 10px; }

.sidebar-league-empty,
.ax-fav-leagues .muted {
    padding: 8px;
    font-size: 12px;
}

.compact-fixture-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 50px;
    margin-bottom: 4px;
    padding: 5px 7px;
    border-radius: 7px;
    background:
        linear-gradient(
            90deg,
            rgba(10, 40, 80, 0.32),
            rgba(6, 24, 52, 0.24),
            rgba(10, 40, 80, 0.28)
        ),
        rgba(2, 12, 28, 0.26);
    border: 1px solid rgba(120, 210, 240, 0.30);
    box-shadow: var(--card-neon-edge), inset 0 1px 0 rgba(0, 0, 0, 0.18);
    cursor: pointer;
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.compact-fixture-card:hover {
    transform: translateY(-1px);
    background:
        linear-gradient(
            90deg,
            rgba(12, 60, 100, 0.34),
            rgba(12, 60, 100, 0.30),
            rgba(12, 60, 100, 0.34)
        ),
        rgba(2, 12, 28, 0.30);
    border-color: rgba(120, 210, 240, 0.36);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24);
}

.compact-fixture-card.active {
    background:
        linear-gradient(
            90deg,
            rgba(12, 60, 100, 0.34),
            rgba(12, 60, 100, 0.30),
            rgba(12, 60, 100, 0.34)
        ),
        rgba(2, 12, 28, 0.30);
    border-color: rgba(120, 210, 240, 0.38);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}

.compact-fixture-card.is-live-fixture {
    border-left: 3px solid rgba(255, 56, 92, 0.88);
    border-color: rgba(255, 56, 92, 0.42);
    box-shadow: inset 3px 0 12px rgba(255, 56, 92, 0.08);
}

.fixture-league-line {
    display: grid;
    grid-template-columns: 72px minmax(88px, 140px) minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 18px;
    margin-bottom: 4px;
}

.fixture-live-meta {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 72px;
    max-width: 72px;
    flex-shrink: 0;
}

.fixture-live-meta--idle {
    opacity: 0.72;
}

.fixture-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--red);
    box-shadow: 0 0 8px rgba(255, 56, 92, 0.7);
    flex-shrink: 0;
}

.fixture-live-minute {
    font-size: 10px;
    font-weight: 900;
    color: #fecaca;
    line-height: 1;
    white-space: nowrap;
}

.fixture-live-label {
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.06em;
    color: var(--red);
    border: 1px solid rgba(255, 56, 92, 0.45);
    border-radius: 999px;
    padding: 1px 4px;
    line-height: 1.2;
    white-space: nowrap;
}

.fixture-league-line .league-badge {
    max-width: 140px;
    min-width: 0;
    min-height: 16px;
    padding: 0 6px;
    font-size: 9px;
    line-height: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.fixture-league-line .fixture-meta {
    color: rgba(247, 252, 255, 0.72);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.fixture-compact-main {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 48px minmax(0, 1fr) 72px 44px auto;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    width: 100%;
}

.fixture-col-time {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-width: 44px;
    max-width: 44px;
    text-align: center;
    overflow: visible;
}

.compact-fixture-card.is-live-fixture .fixture-col-time,
.compact-fixture-card.is-ft-fixture .fixture-col-time {
    min-width: 52px;
    max-width: 72px;
}

.fixture-col-time .status-badge {
    font-size: 8px;
    min-height: 14px;
    padding: 0 4px;
    line-height: 1.1;
    max-width: 100%;
}

.fixture-col-time-primary {
    font-size: 10px;
    font-weight: 900;
    color: rgba(247, 252, 255, 0.84);
    line-height: 1;
    white-space: nowrap;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.fixture-col-time .fixture-result-badge {
    font-size: 8px;
    min-height: 14px;
    padding: 0 4px;
}

.compact-fixture-card.is-live-fixture .fixture-compact-main,
.compact-fixture-card.is-ft-fixture .fixture-compact-main {
    grid-template-columns: 64px minmax(0, 1fr) 48px minmax(0, 1fr) 72px 44px auto;
}

.compact-fixture-card.is-weekly-value .fixture-compact-main {
    grid-template-columns: 56px minmax(0, 1fr) 48px minmax(0, 1fr) 108px 44px auto;
}

.compact-fixture-card.is-weekly-value.is-live-fixture .fixture-compact-main,
.compact-fixture-card.is-weekly-value.is-ft-fixture .fixture-compact-main {
    grid-template-columns: 64px minmax(0, 1fr) 48px minmax(0, 1fr) 108px 44px auto;
}

.compact-fixture-card.is-weekly-value .fixture-col-time {
    min-width: 56px;
    max-width: 56px;
    gap: 1px;
}

.fixture-col-time-date,
.fixture-col-time-kickoff {
    display: block;
    width: 100%;
    max-width: 100%;
    font-size: 8px;
    font-weight: 800;
    line-height: 1.15;
    color: rgba(247, 252, 255, 0.68);
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    text-align: center;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.compact-fixture-card.is-weekly-value .fixture-col-time-primary {
    font-size: 9px;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    max-width: 100%;
}

.compact-fixture-card.is-weekly-value .fixture-pick-stack,
.compact-fixture-card.is-weekly-value .fixture-col-pick {
    min-width: 108px;
    max-width: 108px;
}

.compact-fixture-card.is-weekly-value .fixture-pick-pill {
    width: 108px;
    max-width: 108px;
    min-height: 22px;
    height: auto;
    padding: 3px 4px;
    font-size: 9px;
    letter-spacing: -0.02em;
    line-height: 1.15;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
}

.fixture-live-period {
    font-size: 9px;
    font-weight: 800;
    color: rgba(255, 210, 122, 0.95);
    letter-spacing: 0.03em;
}

.compact-fixture-card.is-live-fixture .fixture-live-meta {
    gap: 4px;
}

.fixture-value-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    margin-top: 4px;
    padding: 0 4px 2px;
}

.fixture-value-edge {
    font-size: 9px;
    font-weight: 800;
    color: #8ef0b8;
    letter-spacing: 0.02em;
}

.weekly-value-primary-meta .fixture-value-edge {
    display: inline-block;
    margin-right: 6px;
}

.fixture-value-label.is-tier-ev-plus { color: #8ef0b8; border-color: rgba(142, 240, 184, 0.45); }
.fixture-value-label.is-tier-ev { color: #9fd4ff; border-color: rgba(159, 212, 255, 0.45); }
.fixture-value-label.is-tier-ev-edge { color: #ffd27a; border-color: rgba(255, 210, 122, 0.45); }

.fixture-col-pick,
.fixture-pick-stack {
    min-width: 72px;
    max-width: 72px;
}

.fixture-pick-stack {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    min-height: 28px;
}

.fixture-compact-main .fixture-card-odds {
    display: block;
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    color: rgba(150, 240, 200, 0.9);
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.fixture-compact-main .fixture-col-conf {
    display: none;
}

.fixture-col-prob,
.fixture-col-conf {
    min-width: 44px;
    max-width: 44px;
    text-align: center;
}

.fixture-col-fav {
    justify-self: center;
}

.compact-fixture-card .team-name {
    font-size: 11px;
    line-height: 1.1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 700;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.fixture-time-status,
.fixture-probability,
.fixture-confidence {
    color: rgba(247, 252, 255, 0.84);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}
}

.fixture-team-cell {
    align-items: center;
    display: flex;
    gap: 5px;
    min-width: 0;
}

.fixture-team-cell.away {
    flex-direction: row-reverse;
}

.fixture-team-logo {
    flex: 0 0 18px;
    height: 18px;
    object-fit: contain;
    width: 18px;
}

.fixture-team-logo.fallback {
    display: inline-block;
    border: 1px solid var(--border-blue);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(63, 125, 255, 0.24), rgba(5, 16, 34, 0.48));
}

.compact-fixture-card .team-name {
    font-size: 11px;
    line-height: 1.1;
    min-width: 0;
}

.compact-fixture-card .fixture-score {
    min-height: 22px;
    padding: 3px 0;
    width: 46px;
    border-radius: 6px;
    font-size: 12px;
    line-height: 1;
    justify-self: center;
}

.compact-fixture-card .fixture-favorite-btn {
    align-items: center;
    background: rgba(0, 10, 20, 0.16);
    border: 1px solid rgba(111, 250, 255, 0.36);
    border-radius: 999px;
    color: rgba(247, 252, 255, 0.8);
    display: inline-flex;
    font-size: 13px;
    height: 18px;
    justify-content: center;
    min-width: 22px;
    padding: 0;
    cursor: pointer;
}

.compact-fixture-card .fixture-favorite-btn.active {
    color: #8dff42;
    border-color: rgba(34, 255, 122, 0.72);
    box-shadow: 0 0 14px rgba(34, 255, 122, 0.22);
}

.compact-fixture-card .status-badge {
    justify-content: center;
    min-height: 18px;
    padding: 0 5px;
    font-size: 9px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.compact-fixture-card .status-badge.live {
    color: #fecaca;
    border-color: rgba(239, 68, 68, 0.45);
    background: rgba(239, 68, 68, 0.14);
    animation: status-live-pulse 1.5s ease-in-out infinite;
}

.compact-fixture-card .status-badge.ft {
    color: #cbd5e1;
    border-color: rgba(148, 163, 184, 0.35);
    background: rgba(148, 163, 184, 0.1);
}

.compact-fixture-card .status-badge.live::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #f472b6;
    box-shadow: 0 0 8px rgba(244, 114, 182, 0.65);
    flex-shrink: 0;
}

.fixture-result-stack {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.fixture-result-status {
    font-size: 8px;
    font-weight: 800;
    color: var(--muted);
}

.compact-fixture-card.is-weekly-value .fixture-pick-stack,
.compact-fixture-card.is-weekly-value .fixture-col-pick {
    min-width: 108px;
    max-width: 108px;
}

.compact-fixture-card .fixture-pick-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 22px;
    padding: 3px 6px;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
    color: #f6fbff;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(12, 28, 48, 0.72);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.compact-fixture-card .fixture-pick-pill.pick-btts { background: linear-gradient(180deg, #155bd8, #062c86); }
.compact-fixture-card .fixture-pick-pill.pick-btts-no { background: linear-gradient(180deg, #1582a9, #064760); }
.compact-fixture-card .fixture-pick-pill.pick-home { background: linear-gradient(180deg, #18a843, #06621f); }
.compact-fixture-card .fixture-pick-pill.pick-away { background: linear-gradient(180deg, #e17a22, #974006); }
.compact-fixture-card .fixture-pick-pill.pick-over,
.compact-fixture-card .fixture-pick-pill.pick-team-goal { background: linear-gradient(180deg, var(--accent-purple), #50159a); }
.compact-fixture-card .fixture-pick-pill.pick-under { background: linear-gradient(180deg, #147cae, #06476d); }
.compact-fixture-card .fixture-pick-pill.pick-double { background: linear-gradient(180deg, var(--accent-blue), #123b9a); }

.match-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    color: #fecaca;
    border: 1px solid rgba(255, 56, 92, 0.45);
    background: rgba(255, 56, 92, 0.14);
    font-size: 10px;
    font-weight: 900;
    box-shadow: 0 0 12px rgba(255, 56, 92, 0.22);
}

.match-live-badge::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--red);
    box-shadow: 0 0 8px rgba(255, 56, 92, 0.65);
}

.ax-welcome-panel {
    min-height: auto;
    display: grid;
    place-items: center;
    padding: 18px;
    width: 100%;
    box-sizing: border-box;
}

.ax-welcome-card {
    width: min(100%, 640px);
    max-width: 100%;
    box-sizing: border-box;
    padding: 28px 24px;
    text-align: center;
    border: 1px solid var(--border-blue-strong);
    border-radius: 16px;
    background: linear-gradient(145deg, rgba(63, 125, 255, 0.06), rgba(155, 53, 255, 0.04)), var(--panel-bg-strong);
}

.ax-welcome-emblem {
    width: 112px !important;
    height: 112px !important;
    margin: 0 auto 18px;
    display: grid;
    place-items: center;
    border-radius: 24px;
    font-weight: 950;
    color: #031018;
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple));
    object-fit: contain;
    padding: 0 !important;
    box-shadow: 0 0 56px rgba(63, 125, 255, 0.48), 0 22px 46px rgba(2, 6, 23, 0.42);
}

.ax-welcome-title {
    font-size: 22px;
    font-weight: 950;
    color: var(--cyan);
    margin-bottom: 8px;
}

.ax-welcome-subtitle {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 10px;
}

.ax-welcome-body {
    max-width: 520px;
    margin: 0 auto 10px;
    color: rgba(228, 238, 248, 0.88);
    font-size: 13px;
    line-height: 1.55;
}

.ax-welcome-helper {
    margin: 0 auto 18px;
    color: var(--cyan);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.45;
}

.ax-welcome-features {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    text-align: left;
}

.ax-welcome-feature {
    padding: 12px;
    border-radius: 8px;
    border: 1px solid rgba(111, 250, 255, 0.22);
    background: rgba(2, 6, 23, 0.36);
}

.ax-welcome-feature strong {
    display: block;
    color: var(--cyan);
    font-size: 12px;
    margin-bottom: 4px;
}

.ax-welcome-feature small {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.45;
}

.league-row.ax-league-row {
    grid-template-columns: 22px minmax(0, 1fr) auto;
}

@media (max-width: 1100px) {
    .fixture-compact-main {
        grid-template-columns: 38px minmax(0, 1fr) 42px minmax(0, 1fr) 64px 40px 28px;
    }

    .fixture-col-conf {
        display: none;
    }
}

@media (max-width: 900px) {
    .ax-welcome-features { grid-template-columns: 1fr; }

    .home-page {
        padding: 20px 16px 24px;
    }

    .home-cards,
    .home-cards-3 {
        grid-template-columns: 1fr;
    }
}

/* Desktop port: odds-picks + match terminal */
.odds-picks-panel,
.weekly-boost-panel {
  border-radius: var(--radius);
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
  overflow-y: auto;
  padding: 14px;
}

.weekly-boost-header,
.board-premium-header,
.odds-picks-header,
.weekly-boost-section,
.weekly-boost-audit-note {
  background: var(--ax-glass-header) !important;
  border: 1px solid rgba(120, 210, 240, 0.30);
  border-radius: 8px;
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.weekly-boost-header,
.board-premium-header,
.odds-picks-header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 14px;
  flex-shrink: 0;
}

.board-premium-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.board-premium-shell > .content-grid {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.board-premium-header-copy {
  min-width: 0;
}

.board-premium-header h2,
.weekly-boost-header h2,
.odds-picks-header h2 {
  color: #ffffff;
  font-weight: 950;
  margin: 0;
  letter-spacing: 0;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.board-premium-subtitle,
.weekly-boost-subtitle {
  color: rgba(247,252,255,.82);
  font-size: 12px;
  line-height: 1.45;
  margin: 0;
  max-width: 720px;
}

.board-premium-subtitle--lead {
  margin-top: 6px;
  font-weight: 850;
}

.board-premium-subtitle--body {
  margin-top: 4px;
}

.board-premium-header-meta,
.weekly-boost-week-meta {
  display: grid;
  gap: 4px;
  text-align: right;
  font-size: 11px;
  color: rgba(247,252,255,.72);
  flex-shrink: 0;
}

.board-premium-header-meta strong,
.weekly-boost-week-meta strong {
  color: var(--cyan);
  font-size: 13px;
}

.weekly-boost-audit-note {
  padding: 10px 12px;
  color: rgba(247,252,255,.86);
  font-size: 12px;
  font-weight: 800;
}

.weekly-boost-section {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.weekly-boost-section-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}

.weekly-boost-section-head h3 {
  color: #ffffff;
  font-weight: 950;
  margin: 0;
}

.weekly-boost-section-head span {
  color: rgba(247,252,255,.76);
  font-size: 11px;
}

.weekly-boost-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.weekly-boost-metric {
  background: rgba(0, 10, 20, 0.12);
  border: 1px solid rgba(111,250,255,.35);
  border-radius: 7px;
  display: grid;
  gap: 4px;
  padding: 8px 10px;
}

.weekly-boost-metric span {
  color: rgba(247,252,255,.72);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.weekly-boost-metric strong {
  color: #ffffff;
  font-size: 16px;
}

.weekly-boost-selections {
  display: grid;
  gap: 6px;
}

.weekly-boost-empty,
.weekly-boost-loading {
  color: rgba(247,252,255,.82);
  font-size: 13px;
  padding: 18px 14px;
  text-align: center;
}

@media (max-width: 900px) {
  .weekly-boost-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .weekly-boost-header,
  .board-premium-header,
  .odds-picks-header {
    flex-direction: column;
    align-items: stretch;
  }

  .weekly-boost-week-meta,
  .board-premium-header-meta {
    text-align: left;
  }
}

.odds-picks-section {
  background:
    linear-gradient(135deg, rgba(33,244,255,.055), rgba(34,255,122,.03)),
    rgba(0, 10, 20, 0.08) !important;
  border: 1px solid rgba(111,250,255,.52);
  border-radius: 8px;
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.odds-picks-header {
  align-items: center;
}

.odds-picks-section h3 {
  color: #ffffff;
  font-weight: 950;
  letter-spacing: 0;
  text-shadow: 0 1px 2px rgba(0,0,0,.78), 0 0 10px rgba(33,244,255,.18);
}

.odds-picks-header span,
.odds-picks-empty {
  color: rgba(247,252,255,.82);
  font-size: 12px;
  font-weight: 850;
}

.odds-picks-section {
  display: grid;
  gap: 8px;
  padding: 12px;
}

.odds-picks-grid {
  display: grid;
  gap: 6px;
}

.odds-pick-row {
  align-items: center;
  background: rgba(0, 10, 20, 0.12) !important;
  border: 1px solid rgba(111,250,255,.42);
  border-radius: 7px;
  color: #ffffff;
  cursor: pointer;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) minmax(74px, auto) minmax(58px, auto);
  min-height: 34px;
  padding: 7px 9px;
  text-align: left;
}

.odds-pick-row:hover {
  border-color: rgba(34,255,122,.72);
  box-shadow: 0 0 16px rgba(34,255,122,.16);
}

.odds-pick-teams,
.odds-pick-market,
.odds-pick-metric {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.odds-pick-market {
  color: #8dff42;
  font-weight: 950;
  text-align: center;
}

.odds-pick-metric {
  color: #21f4ff;
  font-weight: 950;
  text-align: right;
}

.odds-picks-top-btn {
  border-color: rgba(34,255,122,.7) !important;
}

.odds-picks-panel {
  padding: 16px !important;
  overflow-y: auto !important;
}

.odds-picks-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
}

.odds-picks-section {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-bottom: 14px !important;
  padding: 12px !important;
}

.odds-picks-section-head {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

.odds-picks-section-head h3,
.odds-picks-section h3 {
  margin: 0 !important;
  color: rgba(235,248,255,.96) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.odds-picks-section-head span {
  color: rgba(210,230,245,.72) !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
}

.odds-picks-singles {
  display: grid !important;
  gap: 8px !important;
}

.odds-pick-row {
  display: grid !important;
  grid-template-columns: 28px minmax(72px, .55fr) minmax(170px, 1.3fr) minmax(130px, .9fr) 94px 76px 76px 62px 82px minmax(110px, .7fr) !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 48px !important;
  padding: 8px 10px !important;
  text-align: left !important;
}

.odds-pick-status {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  flex-wrap: wrap;
}

.odds-pick-row.is-ft-fixture .odds-pick-status .status-badge.ft,
.odds-pick-row.is-live-fixture .odds-pick-status .status-badge.live,
.odds-pick-status .fixture-result-badge {
  font-size: 8px;
  min-height: 14px;
  padding: 0 4px;
  line-height: 1.1;
}

.odds-pick-minute,
.odds-pick-period,
.odds-pick-kickoff {
  font-size: 10px;
  font-weight: 800;
  color: rgba(210, 230, 245, 0.86);
}

.odds-pick-teams,
.odds-pick-league,
.odds-pick-metric,
.odds-pick-risk,
.odds-pick-data,
.odds-pick-odds {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 11px !important;
}

.odds-pick-teams {
  color: rgba(240,248,255,.96) !important;
  font-weight: 700 !important;
}

.odds-pick-league,
.odds-pick-data {
  color: rgba(210,230,245,.76) !important;
}

.odds-pick-odds {
  justify-self: end !important;
  color: rgba(235,248,255,.92) !important;
  font-weight: 700 !important;
}

.odds-accumulator-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px 14px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(70,165,255,.24) !important;
  border-radius: 10px !important;
  background: rgba(4,14,30,.036) !important;
}

.odds-accumulator-card span {
  color: rgba(210,230,245,.76) !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
}

.odds-accumulator-card strong {
  grid-row: span 2 !important;
  color: rgba(240,248,255,.98) !important;
  font-size: 20px !important;
  font-weight: 850 !important;
}

.odds-accumulator-card small {
  color: rgba(210,230,245,.74) !important;
  font-size: 11px !important;
}

.odds-accumulator-card.unavailable strong {
  font-size: 13px !important;
}

@media (max-width: 1320px) {
  .fixture-compact-main {
    grid-template-columns: 44px minmax(88px, 1fr) 40px minmax(88px, 1fr) 90px 48px 56px !important;
    gap: 6px !important;
  }

  .odds-pick-row {
    grid-template-columns: minmax(150px, 1fr) 90px 82px 60px 60px !important;
  }

  .odds-pick-league,
  .odds-pick-risk,
  .odds-pick-data {
    display: none !important;
  }
}

.match-terminal-stack {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.match-terminal-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(132px, auto);
    align-items: stretch;
    gap: 14px;
    padding: 14px;
    border-radius: var(--radius);
    border: 1px solid var(--terminal-glass-border);
    background: var(--ax-glass-terminal);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.match-identity {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.match-meta-line {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.match-meta-line span:not(.match-live-badge) {
    max-width: 100%;
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.56);
    border: 1px solid rgba(148, 163, 184, 0.12);
}

.match-live-badge {
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fecaca;
    background: rgba(239, 68, 68, 0.14);
    border: 1px solid rgba(239, 68, 68, 0.36);
    box-shadow: 0 0 16px rgba(239, 68, 68, 0.12);
}

.match-scoreboard {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(92px, auto) minmax(0, 1fr);
    align-items: center;
    gap: 12px;
}

.match-team {
    min-width: 0;
    display: flex;
    align-items: center;
    color: var(--text);
    font-size: 18px;
    font-weight: 950;
    line-height: 1.15;
}

.match-team span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.match-team.away {
    justify-content: flex-end;
    text-align: right;
}

.match-score-core {
    min-width: 92px;
    display: grid;
    place-items: center;
    gap: 3px;
    padding: 9px 12px;
    border-radius: var(--radius);
    background: rgba(2, 6, 23, 0.66);
    border: 1px solid rgba(34, 211, 238, 0.22);
    box-shadow: inset 0 0 20px rgba(34, 211, 238, 0.04);
}

.match-score-core strong {
    color: var(--cyan);
    font-size: 20px;
    font-weight: 950;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.match-score-core span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.match-terminal-header .analysis-actions {
    align-self: center;
    justify-content: flex-end;
}

.match-header-actions .action-btn {
    min-height: 34px;
    padding: 0 12px;
    font-size: 11px;
    white-space: nowrap;
}

.terminal-section {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 13px;
    border-radius: var(--radius);
    border: 1px solid var(--glass-border);
    background: var(--ax-glass-terminal);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.terminal-section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(160, 176, 198, 0.14);
}

.terminal-section-title {
    color: var(--text);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.terminal-section-subtitle {
    max-width: 58%;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    line-height: 1.35;
    text-align: right;
}

.terminal-section-body {
    min-width: 0;
    display: grid;
    gap: 12px;
}

.terminal-section .primary-analysis-card {
    margin: 0;
}

.terminal-section.hidden {
    display: none !important;
}

.analysis-grid,
.probability-grid,
.profile-grid,
.matchup-grid {
    display: grid;
    gap: 10px;
}

.analysis-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 12px;
}

.probability-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 12px;
}

.profile-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.matchup-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.analysis-box,
.profile-card,
.secondary-card,
.reason-card {
    background: rgba(2, 6, 23, 0.42);
    border: 1px solid rgba(148, 163, 184, 0.13);
    border-radius: var(--radius);
    padding: 12px;
}

.analysis-value {
    color: var(--text);
    font-size: 18px;
    font-weight: 900;
}

.primary-analysis-card {
    margin: 12px 0;
    padding: 16px;
    border-radius: var(--radius);
    border: 1px solid rgba(34, 211, 238, 0.32);
    background: linear-gradient(135deg, rgba(34, 211, 238, 0.14), rgba(139, 92, 246, 0.11));
}

.primary-terminal-card {
    display: grid;
    gap: 14px;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(34, 211, 238, 0.13), rgba(139, 92, 246, 0.075)),
        rgba(2, 6, 23, 0.52);
    box-shadow: inset 0 0 28px rgba(34, 211, 238, 0.045);
}

.primary-terminal-head {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.primary-terminal-pick {
    min-width: 0;
}

.primary-analysis-card .analysis-value {
    font-size: 26px;
    color: var(--cyan);
}

.primary-terminal-card .analysis-value {
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.primary-terminal-badges {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    flex-wrap: wrap;
}

.primary-risk-badge,
.primary-result-badge {
    min-height: 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 9px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border: 1px solid rgba(148, 163, 184, 0.16);
    background: rgba(15, 23, 42, 0.58);
}

.primary-risk-badge.safe {
    color: var(--green);
    border-color: rgba(34, 197, 94, 0.34);
    background: rgba(34, 197, 94, 0.10);
}

.primary-risk-badge.warning {
    color: var(--amber);
    border-color: rgba(245, 158, 11, 0.34);
    background: rgba(245, 158, 11, 0.10);
}

.primary-risk-badge.danger {
    color: #fecaca;
    border-color: rgba(239, 68, 68, 0.38);
    background: rgba(239, 68, 68, 0.11);
}

.primary-result-badge {
    color: var(--cyan);
    border-color: rgba(34, 211, 238, 0.28);
    background: rgba(34, 211, 238, 0.08);
}

.primary-terminal-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.primary-terminal-metrics div {
    min-width: 0;
    display: grid;
    gap: 4px;
    padding: 11px 12px;
    border-radius: var(--radius);
    background: rgba(15, 23, 42, 0.55);
    border: 1px solid rgba(148, 163, 184, 0.11);
}

.primary-terminal-metrics span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.primary-terminal-metrics b {
    min-width: 0;
    color: var(--text);
    font-size: 15px;
    font-weight: 950;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.primary-selection-reason {
    color: rgba(226, 232, 240, 0.86);
    line-height: 1.45;
    padding: 10px 11px;
    border-radius: var(--radius);
    background: rgba(2, 6, 23, 0.36);
    border: 1px solid rgba(148, 163, 184, 0.10);
    font-size: 12px;
}

.pick-explainability-card {
    margin-top: 10px;
    padding: 10px 11px;
    border-radius: var(--radius);
    background: rgba(2, 6, 23, 0.42);
    border: 1px solid rgba(78, 210, 255, 0.22);
    display: grid;
    gap: 8px;
}

.pick-explainability-card--no-bet {
    border-color: rgba(255, 154, 174, 0.35);
}

.pick-explainability-title {
    color: var(--cyan);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.pick-explainability-list {
    margin: 0;
    padding-left: 18px;
    color: rgba(226, 232, 240, 0.9);
    font-size: 12px;
    line-height: 1.45;
    display: grid;
    gap: 6px;
}

.pick-explainability-rejected-list {
    display: grid;
    gap: 8px;
}

.pick-explainability-rejected-row {
    padding: 8px 10px;
    border-radius: calc(var(--radius) - 2px);
    background: rgba(0, 10, 20, 0.28);
    border: 1px solid rgba(111, 250, 255, 0.18);
    display: grid;
    gap: 5px;
}

.pick-explainability-rejected-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    color: #ffffff;
    font-size: 12px;
}

.pick-explainability-rejected-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    color: rgba(226, 232, 240, 0.78);
    font-size: 11px;
}

.pick-explainability-rejected-reason {
    color: rgba(247, 252, 255, 0.88);
    font-size: 11px;
    line-height: 1.4;
}

.section-title {
    margin: 16px 0 10px;
    color: var(--text);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.section-title.tight {
    margin-top: 12px;
}

.secondary-picks {
    display: grid;
    gap: 8px;
}

.analysis-terminal-tab-stack {
    display: grid;
    gap: 8px;
    margin: 12px 0 14px;
    padding: 10px 4px 12px;
    position: sticky;
    top: 0;
    z-index: 4;
    background: var(--ax-glass-header);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    border-bottom: 1px solid rgba(148, 163, 184, 0.10);
}

.analysis-terminal-tabs {
    position: relative;
    top: auto;
    z-index: 1;
    gap: 9px;
    margin: 0;
    padding: 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
    scrollbar-color: rgba(42, 218, 242, 0.39) rgba(5, 12, 26, 0.28);
    scrollbar-width: thin;
}

.analysis-terminal-tabs::-webkit-scrollbar {
    height: 6px;
}

.analysis-terminal-tabs::-webkit-scrollbar-track {
    background: rgba(5, 12, 26, 0.28);
    border-radius: 999px;
}

.analysis-terminal-tabs::-webkit-scrollbar-thumb {
    background: rgba(42, 218, 242, 0.42);
    border-radius: 999px;
}

.analysis-terminal-tabs .bet-tab {
    min-height: 36px;
    padding: 9px 14px;
    white-space: nowrap;
    font-size: 11px;
    scroll-snap-align: start;
}

.analysis-market-pane {
    display: grid;
    gap: 10px;
}

.analysis-market-pane.hidden {
    display: none !important;
}

/* PATCH 4A: legacy summary removed — Analysis tab is deep-dive only, so drop the
   redundant top gap above its first (and only) Market Details section. */
.analysis-market-pane[data-analysis-pane="Analysis"] > .terminal-section:first-child {
    margin-top: 0;
}

.top-picks-list {
    display: grid;
    gap: 11px;
}

.top-pick-card {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
    padding: 13px;
    border-radius: var(--radius);
    border: 1px solid rgba(34, 211, 238, 0.20);
    background:
        linear-gradient(135deg, rgba(34, 211, 238, 0.078), rgba(139, 92, 246, 0.052)),
        rgba(2, 6, 23, 0.46);
}

.top-pick-rank {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #031018;
    background: linear-gradient(135deg, var(--cyan), #7dd3fc);
    font-size: 13px;
    font-weight: 950;
    box-shadow: 0 0 18px rgba(34, 211, 238, 0.14);
}

.top-pick-body {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.top-pick-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.top-pick-market {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.top-pick-market span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.top-pick-market strong {
    color: var(--text);
    font-size: 15px;
    line-height: 1.18;
    overflow-wrap: anywhere;
}

.top-pick-badges {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: wrap;
}

.top-pick-data-badge {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border-radius: 999px;
    color: var(--cyan);
    background: rgba(34, 211, 238, 0.08);
    border: 1px solid rgba(34, 211, 238, 0.22);
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.top-pick-metrics,
.market-detail-grid,
.terminal-metric-grid {
    display: grid;
    gap: 7px;
}

.market-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 8px;
}

.top-pick-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.top-pick-metrics div {
    min-width: 0;
    display: grid;
    gap: 3px;
    padding: 9px 10px;
    border-radius: var(--radius);
    background: rgba(15, 23, 42, 0.55);
    border: 1px solid rgba(148, 163, 184, 0.10);
}

.top-pick-metrics span {
    color: var(--muted);
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.top-pick-metrics b {
    min-width: 0;
    color: var(--text);
    font-size: 14px;
    font-weight: 950;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.terminal-metric-row {
    min-width: 0;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 12px;
    border-radius: var(--radius);
    background: rgba(15, 23, 42, 0.55);
    border: 1px solid rgba(148, 163, 184, 0.10);
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.terminal-metric-row strong {
    color: var(--text);
    text-align: right;
    overflow-wrap: anywhere;
}

.top-pick-reason,
.top-pick-supporting,
.market-detail-card p {
    font-size: 12px;
}

.top-pick-reason,
.top-pick-supporting {
    margin: 0;
    color: rgba(226, 232, 240, 0.84);
    line-height: 1.45;
    padding: 9px 10px;
    border-radius: var(--radius);
    background: rgba(2, 6, 23, 0.34);
    border: 1px solid rgba(148, 163, 184, 0.09);
}

.top-pick-supporting {
    color: var(--muted);
}

.stats-panel-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    width: 100%;
    min-width: 0;
}

.analysis-market-pane[data-analysis-pane="Stats"] {
    max-height: none;
    overflow: visible;
    padding: 4px 2px 12px;
    scrollbar-width: auto;
}

.analysis-terminal-tab-stack + .analysis-market-pane {
    margin-top: 0;
}

.analysis-market-pane[data-analysis-pane="Stats"]::-webkit-scrollbar {
    width: 9px;
}

.analysis-market-pane[data-analysis-pane="Stats"]::-webkit-scrollbar-track {
    background: rgba(2, 6, 23, 0.28);
    border-radius: 999px;
}

.analysis-market-pane[data-analysis-pane="Stats"]::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(34, 211, 238, 0.52), rgba(139, 92, 246, 0.36));
    border: 2px solid rgba(2, 6, 23, 0.42);
    border-radius: 999px;
}

.stats-section-card {
    min-width: 0;
    padding: 13px;
    border-radius: var(--radius);
    border: 1px solid rgba(34, 211, 238, 0.16);
    background:
        linear-gradient(135deg, rgba(34, 211, 238, 0.065), rgba(139, 92, 246, 0.045)),
        rgba(2, 6, 23, 0.42);
}

.stats-section-title {
    margin-bottom: 10px;
    color: var(--cyan);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.stats-team-stack {
    display: grid;
    gap: 9px;
}

.stats-team-stack.expanded {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.stats-team-block {
    padding: 12px;
    border-radius: var(--radius);
    background:
        linear-gradient(135deg, rgba(34, 211, 238, 0.06), rgba(139, 92, 246, 0.035)),
        rgba(15, 23, 42, 0.54);
    border: 1px solid rgba(148, 163, 184, 0.12);
}

.stats-team-title {
    margin-bottom: 8px;
    color: #ffffff !important;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.terminal-section-core .terminal-section-body {
    gap: 10px;
}

.terminal-section-core .stats-section-card {
    background:
        linear-gradient(135deg, rgba(34, 211, 238, 0.055), rgba(139, 92, 246, 0.035)),
        rgba(2, 6, 23, 0.36);
}

.intelligence-grid strong {
    display: block;
    margin-top: 5px;
    color: var(--text);
}

.intelligence-warnings {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
}

.intelligence-warnings strong {
    padding: 6px 8px;
    border-radius: var(--radius);
    color: var(--amber);
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.22);
    font-size: 12px;
}

.bet-tracker-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
}

.bet-tabs,
.bet-tracker-actions,
.bet-card-actions,
.dock-actions,
.funds-modal-actions,
.bet-modal-actions,
.analysis-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.bet-tab,
.bet-action-btn {
    background: rgba(15, 23, 42, 0.74);
    border: 1px solid var(--line);
    color: var(--muted);
    padding: 9px 12px;
    font-weight: 900;
}

.bet-tab.active {
    color: #031018;
    background: var(--cyan);
}

.odds-picks-layout {
    display: grid;
    grid-template-columns: minmax(196px, 220px) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    min-height: 0;
}

.odds-picks-tabs {
    display: flex;
    flex-direction: column;
    gap: 6px;
    position: sticky;
    top: 0;
    min-width: 0;
    overflow: visible;
}

.odds-picks-tab {
    width: 100%;
    text-align: left;
    justify-content: flex-start;
    align-items: stretch;
    white-space: normal;
    height: auto;
    min-height: 52px;
    padding: 10px 12px;
    overflow: visible;
}

.odds-picks-tab.filter-pill {
    white-space: normal;
    align-items: stretch;
}

.odds-picks-tab-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    width: 100%;
    min-width: 0;
    line-height: 1.25;
    text-align: left;
}

.odds-picks-tab-copy strong {
    display: block;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.04em;
    line-height: 1.2;
    word-break: break-word;
}

.odds-picks-tab-copy small {
    display: block;
    font-size: 10px;
    font-weight: 700;
    opacity: 0.85;
    line-height: 1.2;
    word-break: break-word;
}

.odds-picks-tab-panes {
    min-width: 0;
    min-height: 0;
}

.odds-picks-tab-pane.hidden {
    display: none !important;
}

.odds-picks-diagnostics {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    color: var(--muted);
    font-size: 11px;
}

.odds-picks-empty {
    color: var(--muted);
    font-size: 12px;
    padding: 8px 0;
}

.match-terminal-stack {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.match-identity {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.match-kickoff-time {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.match-live-badge {
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    color: #fecaca;
    background: rgba(239, 68, 68, 0.14);
    border: 1px solid rgba(239, 68, 68, 0.36);
}

.match-status-pill {
    color: var(--muted);
    font-size: 10px;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.top-picks-list {
    display: grid;
    gap: 10px;
}

.top-pick-card,
.profile-card,
.reason-card,
.ai-match-analysis-card,
.reference-mini-card,
.reference-form-card {
    padding: 12px;
    border-radius: var(--radius);
    border: 1px solid rgba(111, 250, 255, 0.30);
    background: rgba(2, 6, 23, 0.36);
}

.profile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

@media (max-width: 1100px) {
    .odds-picks-layout {
        grid-template-columns: 1fr;
    }

    .odds-picks-tabs {
        flex-direction: row;
        flex-wrap: wrap;
        position: static;
    }

    .odds-picks-tab {
        flex: 1 1 168px;
        max-width: 100%;
    }
}

/* Odds 2-5 board shell */
.odds-picks-board {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    gap: 12px;
}

.route-content:has(.odds-picks-board) {
    overflow: hidden;
}

.odds-picks-panel {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    display: flex;
    flex-direction: column;
}

.odds-picks-layout {
    flex: 1;
    min-height: 0;
    overflow: hidden;
    align-items: stretch;
    grid-template-columns: minmax(196px, 220px) minmax(0, 1fr);
}

.odds-picks-tab-panes {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 4px;
}

.odds-picks-tab.active {
    border-color: rgba(34, 255, 122, 0.72) !important;
    background: rgba(34, 255, 122, 0.12) !important;
    color: #fff !important;
}

.weekly-boost-board {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    gap: 12px;
}

.route-content:has(.weekly-boost-board) {
    overflow: hidden;
}

.weekly-boost-board .weekly-boost-panel {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.fixture-value-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 4px 12px 8px 88px;
  font-size: 11px;
  color: var(--text-muted, #9aa3b2);
}

.weekly-value-primary-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 8px;
  font-size: 12px;
  color: var(--text-muted, #9aa3b2);
}

.fixture-value-odds {
  font-weight: 600;
  color: var(--text-primary, #e8edf5);
}

.fixture-value-label {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
  max-width: 100%;
  overflow: visible;
}

.fixture-value-label.is-best-value {
  background: rgba(56, 189, 120, 0.16);
  color: #6ee7a8;
}

.fixture-value-label.is-safe-fallback {
  background: rgba(96, 165, 250, 0.16);
  color: #93c5fd;
}

.fixture-value-label.is-pending-odds {
  background: rgba(148, 163, 184, 0.16);
  color: #cbd5e1;
}

.weekly-value-safe-bet-card {
  margin: 8px 0 12px;
}

.weekly-boost-expanded-label {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.odds-picks-section {
    margin-bottom: 0 !important;
}

.odds-pick-total {
    display: none !important;
}

/* Analysis terminal — desktop compact reference */
.reference-card-title {
    color: rgba(235, 248, 255, 0.95);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.ai-match-analysis-card,
.reference-form-card,
.reference-mini-card {
    border: 1px solid rgba(70, 165, 255, 0.30);
    border-radius: 10px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.012), rgba(35, 120, 220, 0.015)),
        rgba(4, 14, 30, 0.036);
}

.ai-match-analysis-card,
.reference-form-card {
    padding: 10px;
    margin-top: 8px;
}

.ai-checklist {
    display: grid;
    gap: 6px;
}

.ai-check-row {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: start;
    gap: 7px;
    color: rgba(235, 245, 255, 0.92);
    font-size: 11px;
    line-height: 1.35;
}

.ai-check-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    color: rgba(8, 26, 20, 0.98);
    background: rgba(58, 220, 142, 0.88);
    font-size: 10px;
    font-weight: 900;
}

.reference-mini-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 8px;
}

.reference-mini-card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-height: 64px;
    padding: 9px;
}

.reference-mini-card.wide {
    grid-column: span 1;
}

.reference-mini-card span {
    color: rgba(210, 230, 245, 0.78);
    font-size: 8.5px;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.reference-mini-card strong {
    color: rgba(240, 248, 255, 0.98);
    font-size: 14px;
    font-weight: 800;
}

.reference-mini-card small {
    color: rgba(210, 230, 245, 0.70);
    font-size: 9px;
}

.result-prob-mini-bars {
    display: grid;
    gap: 4px;
}

.result-prob-mini-row {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) 36px;
    align-items: center;
    gap: 6px;
    font-size: 9px;
}

.result-prob-mini-track {
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.result-prob-mini-track b {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(70, 165, 255, 0.84), rgba(80, 210, 170, 0.70));
}

.reference-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.reference-form-grid > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
    padding: 6px 8px;
    border: 1px solid rgba(70, 165, 255, 0.18);
    border-radius: 8px;
}

.reference-form-grid > div > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 700;
}

.terminal-summary-compact {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.odds-intelligence-card {
    padding: 10px 12px;
    border: 1px solid rgba(70, 165, 255, 0.22);
    border-radius: 8px;
    background: rgba(4, 14, 30, 0.34);
}

.odds-intelligence-grid {
    margin-top: 6px;
}

.odds-intelligence-warning,
.market-odds-warning {
    margin: 8px 0 0;
    padding: 6px 8px;
    border-radius: 6px;
    border: 1px solid rgba(255, 176, 64, 0.35);
    background: rgba(255, 176, 64, 0.08);
    color: #ffc96a;
    font-size: 10px;
    line-height: 1.35;
}

.odds-breakdown-api {
    color: #7ee787;
}

.odds-breakdown-muted {
    color: rgba(180, 198, 220, 0.72);
}

.odds-breakdown-model {
    color: #9ecbff;
}

.odds-breakdown-fair {
    color: #c4b5fd;
}

.odds-breakdown-source-api {
    color: #7ee787;
    font-size: 11px;
}

.odds-breakdown-source-estimated {
    color: #ffc96a;
    font-size: 10px;
    line-height: 1.25;
}

.best-value-pick-card {
    padding: 10px 12px;
    border: 1px solid rgba(126, 231, 135, 0.24);
    border-radius: 8px;
    background: rgba(6, 24, 18, 0.36);
}

.best-value-pick-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}

.best-value-shadow-badge {
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid rgba(126, 231, 135, 0.35);
    background: rgba(126, 231, 135, 0.08);
    color: #9be7a8;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.best-value-pick-market {
    margin: 8px 0 6px;
    font-size: 14px;
    font-weight: 900;
}

.best-value-pick-grid {
    margin-top: 4px;
}

.best-value-edge,
.best-value-ev-real {
    color: #7ee787;
}

.best-value-ev-estimate {
    color: #ffc96a;
}

.best-value-estimate-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 5px;
    border-radius: 4px;
    background: rgba(255, 176, 64, 0.12);
    color: #ffc96a;
    font-size: 9px;
    font-weight: 700;
    vertical-align: middle;
}

.best-value-no-real-odds {
    color: #ffc96a;
    font-size: 10px;
    line-height: 1.3;
}

.best-value-selector-source {
    color: #9ecbff;
    font-size: 10px;
}

.best-value-warning {
    margin-top: 8px;
}

.value-opportunities-panel {
    display: grid;
    gap: 12px;
}

.value-opportunities-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    font-size: 11px;
    color: rgba(180, 198, 220, 0.88);
}

.value-opportunities-stats strong {
    color: #9ecbff;
}

.value-opportunities-empty {
    padding: 18px 12px;
    color: rgba(180, 198, 220, 0.78);
    font-size: 12px;
}

.value-opportunities-table-wrap {
    display: grid;
    gap: 6px;
    overflow-x: auto;
}

.value-opportunities-head,
.value-opportunity-row {
    display: grid;
    grid-template-columns: 44px minmax(140px, 1.4fr) 92px 100px 120px 58px 58px 72px 72px 110px;
    align-items: center;
    gap: 8px;
    min-width: 980px;
}

.value-opportunities-notice {
    margin: 2px 0 8px;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255, 196, 92, 0.32);
    background: rgba(60, 44, 12, 0.32);
    color: rgba(246, 224, 170, 0.92);
    font-size: 11.5px;
    line-height: 1.45;
}

.value-opportunities-head {
    padding: 0 8px 4px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(158, 203, 255, 0.72);
}

.value-opportunity-row {
    min-height: 44px;
    padding: 8px;
    border: 1px solid rgba(70, 165, 255, 0.18);
    border-radius: 8px;
    background: rgba(4, 14, 30, 0.34);
    color: inherit;
    text-align: left;
    cursor: pointer;
    font-size: 11px;
}

.value-opportunity-row.is-api {
    border-color: rgba(126, 231, 135, 0.22);
}

.value-opportunity-row.is-estimate {
    border-color: rgba(255, 176, 64, 0.24);
}

.value-opportunity-row:hover {
    border-color: rgba(126, 231, 135, 0.42);
    background: rgba(8, 24, 40, 0.52);
}

.value-opportunity-rank {
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, #7ee787, #34d399);
    color: #031018;
    font-size: 10px;
    font-weight: 900;
}

.value-opportunity-match {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.value-opportunity-match strong,
.value-opportunity-market {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.value-opportunity-match small {
    color: rgba(180, 198, 220, 0.72);
    font-size: 10px;
}

.value-opportunity-probability {
    font-weight: 800;
    color: #9ecbff;
}

.terminal-compact-block {
    margin-top: 4px;
}

.top-picks-compact-list {
    display: grid;
    gap: 4px;
}

.top-pick-compact-row {
    display: grid;
    grid-template-columns: 22px minmax(0, 1.2fr) 64px 64px 58px 48px;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    padding: 5px 8px;
    border: 1px solid rgba(70, 165, 255, 0.20);
    border-radius: 7px;
    background: rgba(4, 14, 30, 0.30);
    font-size: 10px;
}

.top-pick-compact-rank {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    color: #031018;
    background: linear-gradient(135deg, var(--cyan), #7dd3fc);
    font-size: 10px;
    font-weight: 950;
}

.top-pick-compact-market {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
}

.top-pick-compact-metric {
    color: var(--cyan);
    font-weight: 800;
    text-align: right;
}

.top-pick-compact-odds {
    text-align: right;
    font-weight: 800;
}

.top-picks-compact-empty,
.market-details-empty {
    color: var(--muted);
    font-size: 11px;
    padding: 6px 0;
}

.market-details-table-wrap {
    margin-top: 6px;
}

.market-details-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 10px;
}

.market-details-table th,
.market-details-table td {
    padding: 5px 6px;
    border-bottom: 1px solid rgba(70, 165, 255, 0.14);
    text-align: left;
}

.market-details-table th {
    color: rgba(210, 230, 245, 0.76);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.market-details-market {
    font-weight: 800;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.analysis-primary-tabs,
.analysis-secondary-tabs {
    display: flex;
    align-items: center;
    gap: 5px;
    width: 100%;
}

.analysis-secondary-tabs {
    position: relative;
    top: auto;
    z-index: 1;
    flex-wrap: wrap;
    margin: 0;
    padding: 5px;
    border: 1px solid rgba(82, 176, 255, 0.26);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.014), rgba(42, 132, 226, 0.018)),
        rgba(6, 18, 36, 0.060);
}

.analysis-primary-tabs .bet-tab,
.analysis-secondary-tabs .bet-tab {
    min-height: 26px;
    height: 26px;
    padding: 0 9px;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

.match-assistant-card {
    display: grid;
    gap: 9px;
    margin-top: 12px;
    padding: 12px;
    border: 1px solid rgba(34, 211, 238, 0.18);
    border-radius: 12px;
    background:
        linear-gradient(135deg, rgba(34, 211, 238, 0.045), rgba(15, 23, 42, 0.18)),
        rgba(2, 6, 23, 0.46);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
}

.match-assistant-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.match-assistant-voice-controls {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.match-assistant-voice-controls button {
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid rgba(34, 211, 238, 0.20);
    border-radius: 999px;
    color: var(--muted);
    background: rgba(15, 23, 42, 0.70);
    font-size: 9px;
    font-weight: 900;
    cursor: pointer;
}

.match-assistant-voice-controls button:hover,
.match-assistant-voice-controls button.active {
    color: #031018;
    border-color: rgba(34, 211, 238, 0.62);
    background: linear-gradient(135deg, var(--cyan), #67e8f9);
}

.match-assistant-title {
    color: var(--text);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.match-assistant-subtitle,
.match-assistant-helper,
.match-assistant-safe-note {
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.35;
}

.match-assistant-helper {
    margin-top: 3px;
    color: var(--ax-chrome-accent);
}

.match-assistant-chat {
    display: grid;
    gap: 7px;
    max-height: 180px;
    overflow-y: auto;
    padding: 8px;
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 10px;
    background: rgba(2, 6, 23, 0.36);
}

.match-assistant-message {
    max-width: 92%;
    padding: 8px 10px;
    border-radius: 10px;
    color: var(--text);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.45;
}

.match-assistant-message.assistant {
    justify-self: start;
    border: 1px solid rgba(34, 211, 238, 0.16);
    background: rgba(34, 211, 238, 0.07);
}

.match-assistant-message.user {
    justify-self: end;
    border: 1px solid rgba(167, 139, 250, 0.20);
    background: rgba(79, 70, 229, 0.16);
}

.match-assistant-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.match-assistant-chip {
    min-height: 25px;
    padding: 0 9px;
    border: 1px solid rgba(34, 211, 238, 0.20);
    border-radius: 999px;
    color: var(--muted);
    background: rgba(15, 23, 42, 0.62);
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
}

.match-assistant-chip:hover {
    color: var(--text);
    border-color: rgba(34, 211, 238, 0.42);
    background: rgba(34, 211, 238, 0.10);
}

.match-assistant-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}

.match-assistant-form input {
    min-height: 34px;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 9px;
    color: var(--text);
    background: rgba(2, 6, 23, 0.72);
    padding: 0 10px;
    font-size: 11px;
    font-weight: 700;
}

.match-assistant-form button {
    min-height: 34px;
    border: 1px solid rgba(34, 211, 238, 0.34);
    border-radius: 9px;
    color: #031018;
    background: linear-gradient(135deg, var(--cyan), #67e8f9);
    padding: 0 13px;
    font-size: 11px;
    font-weight: 950;
    cursor: pointer;
}

.match-assistant-empty {
    margin-top: 14px;
    padding: 10px 12px;
    border: 1px solid rgba(34, 211, 238, 0.18);
    border-radius: 10px;
    color: var(--muted);
    background: rgba(2, 6, 23, 0.32);
    font-size: 12px;
    font-weight: 800;
}

.analysis-container {
    font-size: 11px;
    line-height: 1.35;
    padding: 10px;
}

.analysis-container .match-terminal-header {
    margin-bottom: 8px;
    padding: 10px;
}

.analysis-container .match-team {
    font-size: 13px;
}

.analysis-container .match-score-core strong {
    font-size: 15px;
}

.analysis-container .primary-prediction-text {
    font-size: 16px !important;
}

.analysis-container .reference-prediction-number b {
    font-size: 15px;
}

.analysis-container .terminal-section {
    padding: 9px;
    gap: 8px;
    margin-top: 8px;
}

.analysis-container .terminal-section-title {
    font-size: 10px;
}

.analysis-container .terminal-section-subtitle {
    font-size: 9px;
}

body.density-compact .analysis-container {
    font-size: 10.5px;
    padding: 8px;
}

body.density-compact .match-terminal-stack {
    gap: 10px;
}

body.density-compact .match-terminal-header {
    padding: 8px;
    gap: 8px;
}

body.density-compact .match-team {
    font-size: 12px;
}

body.density-compact .match-score-core strong {
    font-size: 14px;
}

body.density-compact .reference-primary-card {
    padding: 8px;
}

body.density-compact .reference-prediction-hero {
    gap: 8px;
    margin-bottom: 6px;
}

body.density-compact .reference-prediction-number b {
    font-size: 14px;
}

body.density-compact .primary-prediction-text {
    font-size: 14px !important;
}

body.density-compact .primary-terminal-badges {
    gap: 5px;
    margin-bottom: 6px;
}

body.density-compact .primary-risk-badge,
body.density-compact .primary-result-badge,
body.density-compact .primary-data-badge {
    min-height: 20px;
    padding: 0 7px;
    font-size: 9px;
}

body.density-compact .analysis-terminal-tabs {
    margin: 8px -2px 10px;
    padding: 8px 2px 9px;
}

body.density-compact .analysis-terminal-tabs .bet-tab {
    min-height: 26px;
    padding: 0 9px;
    font-size: 9.5px;
}

body.density-compact .reference-mini-card {
    min-height: 58px;
    padding: 7px;
}

body.density-compact .reference-mini-card strong {
    font-size: 13px;
}

body.density-compact .top-pick-compact-row {
    min-height: 26px;
    padding: 4px 6px;
    font-size: 9.5px;
}

@media (max-width: 1100px) {
    .reference-mini-card-grid {
        grid-template-columns: 1fr;
    }

    .top-pick-compact-row {
        grid-template-columns: 20px minmax(0, 1fr) 56px 56px;
    }

    .top-pick-compact-risk,
    .top-pick-compact-odds {
        display: none;
    }
}

/* Visual Theme Patch V5 — Retro Football Terminal (web/styles.css) */
#app,
.app-shell,
.playnaptic-app,
.dashboard-shell,
.dashboard-layout {
    position: relative;
    z-index: 2;
    background: transparent !important;
}

.main-panel,
.main-column,
.board-panel,
.route-content,
.dashboard-stack,
.content-grid,
.workspace-grid,
.match-terminal-stack,
.section-stack,
.board-premium-shell {
    position: relative;
    z-index: 2;
    background: transparent !important;
}

.glass-panel {
    background: var(--ax-glass-panel);
}

.sidebar,
.sidebar-shell,
.sidebar.glass-panel,
.app-sidebar,
.dashboard-sidebar {
    background: var(--ax-glass-strong);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.fixtures-panel,
.board-panel,
.analysis-panel,
.terminal-panel,
.match-terminal,
.league-hub-grid .league-hub-panel {
    background: var(--ax-glass-panel);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.match-terminal-header {
    background: var(--ax-glass-terminal);
    border-bottom: 1px solid var(--glass-border);
}

.top-header.glass-panel,
.board-filters,
.ax-date-switcher-wrap {
    background: var(--ax-glass-header);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.special-board-panel.fixtures-panel,
.odds-picks-panel.glass-panel,
.weekly-boost-panel.glass-panel {
    background: var(--ax-glass-panel);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.board-premium-header,
.odds-picks-header,
.weekly-boost-header {
    background: var(--ax-glass-header) !important;
    border: 1px solid rgba(120, 210, 240, 0.30) !important;
    box-shadow: var(--glass-shadow) !important;
}

.analysis-panel {
    box-shadow: var(--glass-shadow);
}

.match-terminal-stack {
    background: transparent;
}

.primary-analysis-card,
.reference-primary-card,
.stats-section-card,
.ai-match-analysis-card {
    background: var(--ax-glass-card);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.ax-fav-leagues .ax-fav-league-row,
.ax-country-row,
.ax-continent-row {
    background: rgba(2, 12, 28, 0.22);
    border-color: rgba(120, 210, 240, 0.22);
}

.ax-fav-leagues .ax-fav-league-row:hover,
.ax-country-row:hover,
.ax-continent-row:hover {
    background: rgba(8, 35, 70, 0.28);
    border-color: rgba(120, 210, 240, 0.30);
}

.weekly-boost-header,
.weekly-boost-section,
.weekly-boost-audit-note {
    background: var(--ax-glass-header) !important;
    border: 1px solid rgba(120, 210, 240, 0.30) !important;
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.home-how-to,
.feature-card,
.home-action-card {
    background: var(--ax-glass-panel);
    border-color: var(--glass-border);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}

.fixture-group-header {
    background:
        linear-gradient(
            90deg,
            rgba(20, 85, 120, 0.35),
            rgba(8, 35, 70, 0.24)
        );
    box-shadow: var(--glass-shadow);
}

.panel-header {
    background: transparent;
}

.compact-fixture-card,
.fixture-card,
.odds-pick-row,
.top-pick-compact-row {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

@media (prefers-reduced-transparency: reduce) {
    .glass-panel,
    .glass-card,
    .fixtures-panel,
    .analysis-panel,
    .match-terminal-header,
    .terminal-section {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background: rgba(2, 12, 28, 0.92);
    }

    body::before {
        opacity: 0.72;
        filter: none;
    }

    body::after {
        background:
            linear-gradient(
                180deg,
                transparent 0%,
                rgba(0, 8, 18, 0.20) 55%,
                rgba(0, 8, 18, 0.34) 100%
            ),
            linear-gradient(
                180deg,
                rgba(0, 8, 22, 0.42),
                rgba(0, 10, 28, 0.32) 45%,
                rgba(0, 8, 18, 0.48)
            );
    }
}

/* Stadium visibility debug — console: document.body.classList.add("ax-show-stadium-debug") */
body.ax-show-stadium-debug::before {
    opacity: 1 !important;
    filter: brightness(1.8) contrast(1.5) saturate(1.4) !important;
}

body.ax-show-stadium-debug::after {
    opacity: 0 !important;
}

body.ax-show-stadium-debug #app,
body.ax-show-stadium-debug .app-shell,
body.ax-show-stadium-debug .playnaptic-app,
body.ax-show-stadium-debug .dashboard-shell,
body.ax-show-stadium-debug .dashboard-layout,
body.ax-show-stadium-debug .main-column,
body.ax-show-stadium-debug .main-content,
body.ax-show-stadium-debug .route-content,
body.ax-show-stadium-debug .board-shell,
body.ax-show-stadium-debug .terminal-shell {
    background: transparent !important;
}

body.ax-show-stadium-debug .glass-panel,
body.ax-show-stadium-debug .glass,
body.ax-show-stadium-debug .panel,
body.ax-show-stadium-debug .sidebar,
body.ax-show-stadium-debug .board-panel,
body.ax-show-stadium-debug .match-terminal,
body.ax-show-stadium-debug .terminal-panel,
body.ax-show-stadium-debug .fixtures-panel,
body.ax-show-stadium-debug .analysis-panel {
    background-color: rgba(3, 10, 24, 0.15) !important;
}

/* Ultra-test — console: document.body.classList.add("ax-stadium-only") */
body.ax-stadium-only * {
    background: transparent !important;
    box-shadow: none !important;
}

body.ax-stadium-only::before {
    opacity: 1 !important;
    filter: brightness(2) contrast(2) saturate(1.6) !important;
}

body.ax-stadium-only::after {
    display: none !important;
}

/* Ultra-glass test — console: document.body.classList.add("ax-ultra-glass") */
body.ax-ultra-glass {
    --ax-glass-panel: rgba(5, 10, 24, 0.025);
    --ax-glass-header: rgba(5, 10, 24, 0.02);
    --ax-glass-terminal: rgba(5, 10, 24, 0.025);
    --ax-glass-strong: rgba(5, 10, 24, 0.04);
    --ax-glass-card: rgba(5, 10, 24, 0.12);
    --glass-blur: 0px;
    --glass-saturate: 100%;
}

/* Strong stadium mode — console: document.body.classList.add("ax-stadium-strong") */
body.ax-stadium-strong {
    --ax-glass-strong: rgba(5, 10, 24, 0.04);
    --ax-glass-panel: rgba(5, 10, 24, 0.03);
    --ax-glass-header: rgba(5, 10, 24, 0.025);
    --ax-glass-terminal: rgba(5, 10, 24, 0.03);
    --ax-glass-card: rgba(5, 10, 24, 0.14);
    --stadium-overlay-top: rgba(3, 10, 24, 0.02);
    --stadium-overlay-bottom: rgba(3, 10, 24, 0.04);
    --stadium-overlay: rgba(3, 10, 24, 0.03);
    --glass-blur: 2px;
    --glass-saturate: 100%;
}

body.ax-stadium-strong::before {
    opacity: 1 !important;
    filter: brightness(0.85) contrast(1.12) saturate(0.80) !important;
}

body.ax-stadium-strong::after {
    opacity: 0.72 !important;
}

body.ax-stadium-strong #app,
body.ax-stadium-strong .app-shell,
body.ax-stadium-strong .playnaptic-app,
body.ax-stadium-strong .dashboard-shell,
body.ax-stadium-strong .dashboard-layout,
body.ax-stadium-strong .main-column,
body.ax-stadium-strong .main-content,
body.ax-stadium-strong .route-content,
body.ax-stadium-strong .dashboard-stack,
body.ax-stadium-strong .content-grid,
body.ax-stadium-strong .workspace-grid,
body.ax-stadium-strong .match-terminal-stack,
body.ax-stadium-strong .section-stack,
body.ax-stadium-strong .board-premium-shell {
    background: transparent !important;
}

body.ax-stadium-strong .sidebar,
body.ax-stadium-strong .sidebar-shell,
body.ax-stadium-strong .glass-panel,
body.ax-stadium-strong .fixtures-panel,
body.ax-stadium-strong .analysis-panel,
body.ax-stadium-strong .board-panel,
body.ax-stadium-strong .terminal-panel,
body.ax-stadium-strong .match-terminal,
body.ax-stadium-strong .top-header.glass-panel,
body.ax-stadium-strong .board-filters,
body.ax-stadium-strong .ax-date-switcher-wrap {
    background: var(--ax-glass-panel) !important;
}

body.ax-stadium-strong .sidebar,
body.ax-stadium-strong .sidebar-shell {
    background: var(--ax-glass-strong) !important;
}

body.ax-stadium-strong .board-premium-header,
body.ax-stadium-strong .odds-picks-header,
body.ax-stadium-strong .weekly-boost-header {
    background: rgba(5, 10, 24, 0.025) !important;
}

body.ax-stadium-strong .ax-fav-leagues .ax-fav-league-row,
body.ax-stadium-strong .ax-country-row,
body.ax-stadium-strong .ax-continent-row {
    background: rgba(5, 10, 24, 0.12) !important;
}

/* ALPHALEX Theme V8/V9 — readable copy on cinematic stadium */
/* ALPHALEX readability chrome pass - brighter edges without lifting content panels */
.playnaptic-app {
    filter: drop-shadow(0 0 18px rgba(72, 232, 255, 0.035));
}

.glass-panel,
.sidebar,
.sidebar-card,
.sidebar.sidebar-shell,
.top-header.glass-panel,
.panel-inner,
.fixtures-panel,
.analysis-panel,
.weekly-boost-header,
.board-premium-header,
.odds-picks-header,
.weekly-boost-section,
.weekly-boost-audit-note,
.league-hub-header,
.glass-card {
    border-color: var(--ax-edge-line-soft);
    box-shadow:
        var(--glass-shadow),
        inset 0 1px 0 var(--ax-frame-highlight);
}

.top-header.glass-panel,
.board-premium-header,
.weekly-boost-header,
.odds-picks-header,
.league-hub-header {
    border-color: var(--ax-edge-line);
    box-shadow:
        var(--glass-shadow),
        inset 0 1px 0 rgba(255, 255, 255, 0.13),
        0 0 0 1px rgba(72, 232, 255, 0.045),
        0 0 22px rgba(72, 232, 255, 0.055);
}

.panel-header,
.terminal-section-header,
.analysis-terminal-tab-stack {
    border-color: var(--ax-edge-line-soft);
}

.panel-header {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.terminal-section,
.match-terminal-header,
.analysis-container .match-terminal-header,
.analysis-container .terminal-section {
    border-color: var(--ax-edge-line);
    box-shadow:
        var(--glass-shadow),
        inset 0 1px 0 var(--ax-frame-highlight),
        0 0 20px rgba(72, 232, 255, 0.045);
}

.analysis-terminal-tab-stack {
    box-shadow:
        0 8px 20px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.analysis-primary-tabs,
.analysis-secondary-tabs,
.bet-tabs {
    border-color: var(--ax-edge-line-soft);
}

.analysis-secondary-tabs,
.analysis-market-subtab-row .analysis-secondary-tabs {
    border-color: rgba(176, 232, 255, 0.30);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        0 0 14px rgba(72, 232, 255, 0.035);
}

.bet-tab,
.site-nav a,
.filter-pill,
.filter-pill-secondary {
    border-color: var(--ax-edge-line-soft);
}

.bet-tab:hover,
.bet-tab.active,
.site-nav a:hover,
.site-nav a.active,
.filter-pill:hover,
.filter-pill.active,
.filter-pill-secondary:hover,
.filter-pill-secondary.active {
    border-color: var(--ax-edge-line-strong);
}

.fixture-card,
.compact-fixture-card,
.secondary-card,
.market-detail-card,
.top-pick-card,
.analysis-box,
.profile-card,
.reason-card,
.primary-terminal-metrics div,
.terminal-metric-row,
.top-pick-metrics div,
.last5-match-row {
    border-color: rgba(176, 232, 255, 0.18);
    box-shadow:
        var(--card-neon-edge),
        inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.fixture-card:hover,
.fixture-card.active,
.compact-fixture-card:hover,
.compact-fixture-card.active {
    border-color: rgba(153, 236, 255, 0.40);
    box-shadow:
        0 12px 32px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 0 18px rgba(72, 232, 255, 0.055);
}

.market-details-table th,
.market-details-table td {
    border-bottom-color: rgba(176, 232, 255, 0.18);
}

.page-title,
.panel-header,
.ax-section-title,
.board-premium-header h2,
.weekly-boost-header h2,
.odds-picks-header h2,
.home-section-title,
.terminal-section-title,
.feature-card h3,
.home-info-card h3,
.home-action-card h3,
.match-terminal-kicker,
.empty-kicker,
.performance-board-title,
.landing-hero h1,
.home-hero-title {
    font-weight: 700;
}

.page-title,
.panel-header,
.ax-section-title,
.board-premium-header h2,
.weekly-boost-header h2,
.odds-picks-header h2,
.home-section-title,
.terminal-section-title,
.feature-card h3,
.home-info-card h3,
.home-action-card h3,
.match-terminal-kicker,
.empty-kicker,
.performance-board-title {
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.feature-card p,
.home-info-card p,
.home-action-card p,
.home-hero-lead,
.home-disclaimer,
.home-steps li,
.landing-hero .lead,
.landing-hero .disclaimer,
.board-premium-subtitle,
.board-premium-subtitle--lead,
.board-premium-subtitle--body,
.board-premium-header p,
.weekly-boost-subtitle,
.terminal-section-subtitle,
.terminal-section-body > p,
.terminal-section-body .muted,
.empty-analysis,
.empty-analysis p,
.ax-ai-placeholder p,
.ax-ai-placeholder-hint,
.sidebar-placeholder,
.sidebar-placeholder p,
.ax-welcome-subtitle,
.terminal-helper-card,
.terminal-helper-card p,
.analysis-placeholder-card,
.analysis-placeholder-card p,
.home-card p,
.league-hub-placeholder {
    color: rgba(238, 243, 248, 0.94);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
}

.home-hero-lead,
.home-steps li,
.home-info-card p,
.home-action-card p,
.home-disclaimer,
.landing-hero .lead,
.landing-hero .disclaimer,
.feature-card p,
.board-premium-subtitle,
.board-premium-subtitle--lead,
.board-premium-subtitle--body,
.board-premium-header p,
.weekly-boost-subtitle,
.terminal-section-subtitle,
.empty-analysis p,
.ax-ai-placeholder-hint,
.sidebar-placeholder p,
.ax-welcome-subtitle,
.terminal-section-body > p,
.terminal-section-body .muted,
.terminal-helper-card p,
.analysis-placeholder-card p,
.home-card p {
    background: rgba(0, 0, 0, 0.16);
    border-radius: 8px;
    padding: 2px 6px;
}

.terminal-section-subtitle,
.board-premium-subtitle,
.board-premium-subtitle--lead,
.board-premium-subtitle--body,
.home-hero-lead,
.home-disclaimer,
.landing-hero .lead,
.landing-hero .disclaimer {
    display: inline-block;
    max-width: 100%;
}

.filter-pill:not(.active),
.filter-pill:not(.active) small,
.filter-pill-secondary:not(.active),
.bet-tab:not(.active),
.odds-picks-tab.filter-pill:not(.active),
.odds-picks-tab.filter-pill:not(.active) .odds-picks-tab-copy strong,
.odds-picks-tab.filter-pill:not(.active) .odds-picks-tab-copy small {
    font-weight: 800;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
}

/* Stats Terminal V1 — compact panel/table styling */
.team-form-standings-panel {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.standings-context-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.standings-mode-tabs {
    display: inline-flex;
    gap: 6px;
}

.standings-mode-tab {
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    background: rgba(2, 6, 23, 0.42);
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
}

.standings-mode-tab.active {
    color: #fff;
    border-color: rgba(34, 211, 238, 0.42);
    background: rgba(34, 211, 238, 0.12);
}

.standings-context-table-wrap {
    overflow: auto;
    border-radius: var(--radius);
    border: 1px solid rgba(148, 163, 184, 0.1);
}

.standings-context-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

.standings-context-table th,
.standings-context-table td {
    padding: 7px 8px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.08);
    white-space: nowrap;
}

.standings-context-table th {
    color: var(--cyan);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: rgba(2, 6, 23, 0.5);
}

.standings-context-team {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 120px;
    white-space: normal;
}

.standings-context-team .standings-team-logo {
    width: 16px;
    height: 16px;
    object-fit: contain;
    flex: 0 0 auto;
}

.standings-context-table tr.standings-highlight-home-team {
    background: rgba(34, 211, 238, 0.08);
}

.standings-context-table tr.standings-highlight-away-team {
    background: rgba(139, 92, 246, 0.08);
}

.standings-wdl-cell {
    display: flex;
    gap: 4px;
}

.standings-form-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 900;
}

.standings-form-chip.win {
    background: rgba(34, 197, 94, 0.18);
    color: #86efac;
}

.standings-form-chip.draw {
    background: rgba(148, 163, 184, 0.16);
    color: #cbd5e1;
}

.standings-form-chip.loss {
    background: rgba(248, 113, 113, 0.16);
    color: #fca5a5;
}

.half-goals-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
}

.half-goals-card {
    padding: 10px;
    border-radius: var(--radius);
    border: 1px solid rgba(148, 163, 184, 0.12);
    background: rgba(15, 23, 42, 0.48);
}

.half-goals-label {
    display: block;
    margin-bottom: 4px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.half-goals-value {
    display: block;
    color: #fff;
    font-size: 18px;
    line-height: 1.1;
}

.half-goals-sub {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 10px;
}

.half-goals-team-split {
    display: grid;
    gap: 10px;
}

.half-goals-team-block {
    min-width: 0;
}

.stats-metric-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 8px;
}

.stats-metric-item {
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.1);
    background: rgba(2, 6, 23, 0.34);
}

.stats-metric-item span {
    display: block;
    margin-bottom: 3px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.stats-metric-item strong {
    color: #fff;
    font-size: 14px;
}

.odds-analysis-panel {
    display: grid;
    gap: 12px;
}

.odds-analysis-subtabs {
    flex-wrap: wrap;
    gap: 6px;
}

.odds-analysis-subpanes {
    min-width: 0;
}

.last5-panel {
    width: 100%;
}

.last5-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.last5-team-column {
    min-width: 0;
    display: grid;
    gap: 10px;
}

.last5-team-head {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
}

.last5-fh-summary {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-size: 12px;
    color: var(--muted);
}

.last5-fh-chip {
    padding: 2px 8px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 11px;
}

.last5-match-list {
    display: grid;
    gap: 8px;
}

.last5-match-row {
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.12);
    background: rgba(2, 6, 23, 0.34);
}

.last5-match-meta {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
    font-size: 11px;
    color: var(--muted);
}

.last5-match-body {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 8px;
    align-items: center;
    font-size: 12px;
}

.last5-match-team:last-child {
    text-align: right;
}

.last5-match-score {
    font-weight: 700;
    white-space: nowrap;
}

.last5-match-foot {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
}

.last5-result-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
}

.last5-ht-score {
    font-size: 11px;
    color: var(--muted);
}

.last5-result-win,
.last5-result-badge.last5-result-win,
.last5-fh-chip.last5-result-win {
    color: #4ade80;
}

.last5-result-draw,
.last5-result-badge.last5-result-draw,
.last5-fh-chip.last5-result-draw {
    color: #facc15;
}

.last5-result-loss,
.last5-result-badge.last5-result-loss,
.last5-fh-chip.last5-result-loss {
    color: #f87171;
}

.last5-match-row.last5-result-win .last5-match-score {
    color: #4ade80;
}

.last5-match-row.last5-result-draw .last5-match-score {
    color: #facc15;
}

.last5-match-row.last5-result-loss .last5-match-score {
    color: #f87171;
}

.last5-empty-note {
    font-size: 12px;
    color: var(--muted);
}

@media (max-width: 900px) {
    .last5-columns {
        grid-template-columns: 1fr;
    }
}

/* ALPHALEX Typography Readability V1 - hierarchy and crisp text only */
.team-name,
.compact-fixture-card .team-name,
.match-team,
.match-team span {
    color: rgba(246, 251, 255, 0.96);
    font-weight: 800;
    text-shadow: none;
}

.compact-fixture-card .team-name {
    font-weight: 780;
}

.fixture-league-line .fixture-meta,
.fixture-col-time-date,
.fixture-col-time-kickoff,
.fixture-result-status,
.match-meta-line,
.panel-meta,
.fixture-meta,
.analysis-label,
.terminal-section-subtitle {
    color: rgba(178, 194, 210, 0.72);
    font-weight: 760;
    text-shadow: none;
}

.fixture-col-time-primary,
.fixture-time-status,
.fixture-probability,
.fixture-confidence,
.primary-pick,
.match-score-core strong {
    color: rgba(246, 251, 255, 0.92);
    text-shadow: none;
}

.fixture-probability,
.fixture-confidence,
.fixture-col-prob,
.fixture-col-conf {
    font-variant-numeric: tabular-nums;
}

.league-badge,
.status-badge,
.fixture-league-line .league-badge {
    color: rgba(188, 204, 220, 0.76);
    font-weight: 780;
    text-shadow: none;
}

.ax-section-title {
    color: rgba(224, 238, 248, 0.90);
    font-weight: 850;
    letter-spacing: 0.075em;
    text-shadow: none;
}

.ax-fav-row .league-name,
.ax-league-row .league-name,
.ax-country-row .league-name {
    color: rgba(236, 246, 252, 0.92);
    font-weight: 760;
}

.ax-country-row {
    color: rgba(232, 244, 250, 0.90);
    font-weight: 820;
}

.ax-count,
.ax-country-row .ax-count,
.ax-league-row .ax-count,
.ax-fav-row .ax-count,
.ax-continent-badge {
    color: rgba(170, 188, 206, 0.68);
    font-weight: 680;
}

.ax-count.muted {
    color: rgba(150, 166, 184, 0.56);
}

.page-title,
.panel-header,
.match-terminal-kicker,
.terminal-section-title,
.empty-kicker,
.performance-board-title,
.board-premium-header h2,
.weekly-boost-header h2,
.odds-picks-header h2 {
    color: rgba(244, 249, 253, 0.96);
    font-weight: 820;
    text-shadow: none;
}

.panel-header {
    letter-spacing: 0.015em;
}

.terminal-section-title,
.match-terminal-kicker,
.empty-kicker {
    letter-spacing: 0.075em;
}

.empty-analysis,
.empty-analysis p,
.sidebar-placeholder,
.sidebar-placeholder p,
.terminal-section-body > p,
.terminal-section-body .muted {
    text-shadow: none;
}

/* ALPHALEX Theme V2 Readability - darker glass behind text-heavy zones */
.fixtures-panel,
.analysis-panel {
    background: rgba(4, 12, 26, 0.58);
}

.panel-body,
.analysis-container {
    background: rgba(3, 9, 20, 0.34);
}

.fixture-card,
.compact-fixture-card {
    background:
        linear-gradient(
            90deg,
            rgba(7, 28, 56, 0.42),
            rgba(5, 18, 40, 0.38),
            rgba(7, 28, 56, 0.42)
        ),
        rgba(2, 8, 20, 0.72);
    border-color: rgba(132, 218, 246, 0.28);
}

.fixture-card:hover,
.fixture-card.active,
.compact-fixture-card:hover,
.compact-fixture-card.active {
    background:
        linear-gradient(
            90deg,
            rgba(9, 38, 72, 0.48),
            rgba(6, 24, 50, 0.44),
            rgba(9, 38, 72, 0.48)
        ),
        rgba(2, 8, 20, 0.78);
    border-color: rgba(132, 218, 246, 0.34);
}

.ax-continent-row,
.ax-country-row,
.ax-league-row,
.ax-fav-row {
    background: rgba(4, 14, 29, 0.76);
    border-color: rgba(132, 218, 246, 0.18);
}

.ax-continent-block.is-open > .ax-continent-row,
.ax-country-row.active,
.ax-fav-row.active,
.ax-league-row.active,
.ax-country-row:hover,
.ax-league-row:hover,
.ax-fav-row:hover {
    background: rgba(5, 20, 38, 0.82);
    border-color: rgba(132, 218, 246, 0.28);
}

.ax-country-leagues {
    background: rgba(2, 8, 18, 0.74);
    border-color: rgba(132, 218, 246, 0.16);
}

.analysis-box,
.profile-card,
.secondary-card,
.reason-card,
.market-detail-card,
.top-pick-card,
.primary-terminal-card,
.primary-terminal-metrics div,
.terminal-metric-row,
.top-pick-metrics div,
.primary-selection-reason,
.pick-explainability-card,
.last5-match-row {
    background: rgba(2, 8, 20, 0.70);
    border-color: rgba(160, 176, 198, 0.15);
}

.terminal-section,
.match-terminal-header,
.analysis-container .match-terminal-header,
.analysis-container .terminal-section {
    background: rgba(3, 10, 22, 0.76);
}

.empty-analysis,
.sidebar-placeholder {
    background: rgba(2, 8, 20, 0.72);
    border-color: rgba(132, 218, 246, 0.18);
}

.team-name,
.compact-fixture-card .team-name,
.match-team,
.match-team span {
    color: rgba(250, 253, 255, 0.98);
    font-weight: 840;
}

.ax-fav-row .league-name,
.ax-league-row .league-name,
.ax-country-row .league-name {
    color: rgba(244, 250, 255, 0.96);
    font-weight: 800;
}

.fixture-league-line .fixture-meta,
.fixture-col-time-date,
.fixture-col-time-kickoff,
.match-meta-line,
.panel-meta,
.fixture-meta,
.analysis-label {
    color: rgba(178, 194, 210, 0.74);
}

.ax-count,
.ax-country-row .ax-count,
.ax-league-row .ax-count,
.ax-fav-row .ax-count,
.ax-continent-badge {
    color: rgba(160, 178, 196, 0.62);
}

/* =========================================================
   UI SPRINT A — Premium SaaS theme (token + chrome overrides)
   Pure presentation: deep navy flat surfaces, reduced neon/glow,
   official logo, top-nav redesign, persistent 3-pane terminal.
   Elite purple reserved for Elite features only.
   ========================================================= */
:root {
    /* Deep navy surfaces — semi-transparent so the stadium reads behind panels */
    --bg-main: #0a1222;
    --stadium-image-opacity: 0.15;

    --ax-glass-strong: rgba(16, 24, 43, 0.80);
    --ax-glass-panel: rgba(14, 21, 39, 0.66);
    --ax-glass-header: rgba(16, 24, 43, 0.78);
    --ax-glass-terminal: rgba(13, 20, 38, 0.60);
    --ax-glass-card: rgba(19, 28, 49, 0.58);
    --panel-bg: var(--ax-glass-panel);
    --panel-bg-strong: var(--ax-glass-strong);

    /* Clean, subtle borders (reduced neon) */
    --border-blue: rgba(122, 152, 192, 0.16);
    --border-blue-strong: rgba(132, 170, 212, 0.26);
    --line: var(--border-blue);
    --line-strong: var(--border-blue-strong);
    --glass-border: rgba(122, 152, 192, 0.16);
    --card-glass-border: rgba(122, 152, 192, 0.14);
    --terminal-glass-border: rgba(122, 152, 192, 0.20);

    /* Tone down glow/edge lighting */
    --ax-edge-line: rgba(132, 170, 212, 0.12);
    --ax-edge-line-soft: rgba(132, 170, 212, 0.07);
    --ax-edge-line-strong: rgba(140, 180, 220, 0.18);
    --ax-corner-glow: rgba(72, 232, 255, 0);
    --ax-frame-highlight: rgba(255, 255, 255, 0.035);
    --card-neon-edge: 0 6px 22px rgba(0, 0, 0, 0.30);
    --glass-blur: 9px;

    /* Accent kept (electric blue); purple stays Elite-only */
    --accent-cyan: #45d6ff;
    --accent-blue: #4f86ff;
    --cyan: var(--accent-cyan);

    --radius: 12px;
    --shadow: 0 18px 44px rgba(0, 0, 0, 0.38);
}

body {
    font-family: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
    letter-spacing: 0.1px;
}

/* Premium depth — subtle stadium lights + vignette (no neon bloom) */
body::after {
    background:
        radial-gradient(120% 78% at 50% 0%, rgba(70, 120, 170, 0.12), transparent 56%),
        radial-gradient(90% 60% at 50% 108%, rgba(40, 70, 110, 0.10), transparent 60%),
        linear-gradient(180deg, rgba(8, 14, 28, 0.30), rgba(6, 11, 24, 0.58)) !important;
}

/* ---- Official logo in sidebar brand ---- */
.brand-v2 {
    gap: 10px;
    align-items: center;
}
.brand-logo-img {
    width: 72px !important;
    height: 72px !important;
    border-radius: 18px;
    object-fit: contain;
    padding: 0 !important;
    box-shadow: 0 0 42px rgba(63, 125, 255, 0.46), 0 14px 32px rgba(0, 0, 0, 0.42);
    flex: 0 0 auto;
}
.brand-v2 .brand-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.15;
}
.brand-v2 .brand-title {
    font-weight: 800;
    letter-spacing: 2px;
    font-size: 18px;
}
.brand-v2 .brand-subtitle {
    color: rgba(150, 170, 192, 0.78);
    text-transform: uppercase;
    letter-spacing: 1.6px;
    font-size: 9.5px;
    font-weight: 600;
}
/* Use the logo for the empty-terminal emblem */
.ax-welcome-emblem {
    background-image: url("./assets/branding/alphalex_logo.png");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    color: transparent !important;
}

/* ---- Top navigation redesign ---- */
.top-header-v2 {
    background: var(--ax-glass-header);
    border-bottom: 1px solid var(--border-blue);
    box-shadow: 0 1px 0 var(--ax-frame-highlight);
    padding: 12px 22px;
    gap: 18px;
}
.top-header-v2 .eyebrow {
    color: rgba(150, 170, 192, 0.66);
    text-transform: uppercase;
    letter-spacing: 1.6px;
    font-size: 10.5px;
}
.top-header-v2 .page-title {
    font-weight: 700;
    letter-spacing: 0.2px;
}
.top-header-v2 .site-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px;
    padding: 4px;
    border-radius: 12px;
    background: rgba(10, 16, 30, 0.55);
    border: 1px solid var(--border-blue);
}
.top-header-v2 .site-nav a { display: inline-flex; align-items: center; }
.top-header-v2 .site-nav a {
    padding: 7px 14px;
    border-radius: 9px;
    color: rgba(176, 194, 212, 0.78);
    font-size: 13px;
    font-weight: 600;
    transition: background 0.15s ease, color 0.15s ease;
}
.top-header-v2 .site-nav a:hover {
    background: rgba(79, 134, 255, 0.10);
    color: var(--text);
}
.top-header-v2 .site-nav a.active,
.top-header-v2 .site-nav a[aria-current="page"] {
    background: linear-gradient(180deg, rgba(79, 134, 255, 0.22), rgba(69, 214, 255, 0.14));
    color: #eaf4ff;
    box-shadow: inset 0 0 0 1px rgba(122, 170, 212, 0.30);
}

/* PATCH UI-S2: placeholder nav items rendered as <button> match the nav links */
.site-nav .site-nav-link {
    border: 0;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
}
.top-header-v2 .site-nav .site-nav-link {
    padding: 7px 14px;
    border-radius: 9px;
    color: rgba(176, 194, 212, 0.78);
    font-size: 13px;
    font-weight: 600;
    transition: background 0.15s ease, color 0.15s ease;
}
.top-header-v2 .site-nav .site-nav-link:hover {
    background: rgba(79, 134, 255, 0.10);
    color: var(--text);
}
.site-nav-link.is-pulsing {
    animation: axElitePulse 0.6s ease;
}

/* PATCH UI-S2: Pro upgrade action moved from the sidebar to the top-right header */
.ax-pro-upgrade-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(255, 209, 102, 0.42);
    background: linear-gradient(135deg, #ffd166, #ffb02e);
    color: #2a1d00;
    font-weight: 850;
    font-size: 12px;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 0 16px rgba(255, 176, 46, 0.32);
}
.ax-pro-upgrade-btn:hover { filter: brightness(1.06); }
.ax-pro-upgrade-btn.is-pulsing { animation: axElitePulse 0.6s ease; }
.ax-pro-crown { font-size: 14px; line-height: 1; }
@media (max-width: 920px) {
    .ax-pro-upgrade-text { display: none; }
    .ax-pro-upgrade-btn { padding: 8px 10px; }
}

/* ---- 3-pane desktop layout polish + persistent terminal ---- */
.content-grid {
    gap: 16px;
}
.fixtures-panel,
.analysis-panel {
    background: var(--ax-glass-panel);
    border: 1px solid var(--border-blue);
    border-radius: var(--radius);
    box-shadow: var(--card-neon-edge);
    -webkit-backdrop-filter: blur(var(--glass-blur));
    backdrop-filter: blur(var(--glass-blur));
}
/* Right Match Terminal: more transparent so the stadium reads behind it */
.analysis-panel {
    position: sticky;
    top: 12px;
    align-self: start;
    max-height: calc(100vh - 150px);
    overflow: auto;
    background: var(--ax-glass-terminal);
}
.analysis-panel .analysis-container {
    background: transparent;
}
.fixtures-panel .panel-header,
.analysis-panel .panel-header {
    border-bottom: 1px solid var(--border-blue);
    padding: 12px 16px;
    font-weight: 650;
    letter-spacing: 0.3px;
}

/* ---- Fixture rows: flat premium, clean selected/hover ---- */
.compact-fixture-card {
    border: 1px solid transparent;
    border-radius: 10px;
    transition: background 0.14s ease, border-color 0.14s ease;
    box-shadow: none;
}
.compact-fixture-card:hover {
    background: rgba(79, 134, 255, 0.07);
}
.compact-fixture-card.active {
    background: rgba(79, 134, 255, 0.12);
    border-color: rgba(122, 170, 212, 0.42);
    box-shadow: inset 0 0 0 1px rgba(122, 170, 212, 0.22);
}

/* ---- Sidebar premium flat ---- */
.sidebar-shell {
    background: var(--ax-glass-strong);
    border-right: 1px solid var(--border-blue);
}

/* ---- Elite purple scoping: reserve for Elite/upgrade surfaces only ---- */
.ax-elite-plan,
.elite-plan,
[data-elite],
.upgrade-card {
    --accent-blue: var(--accent-purple);
    border-color: rgba(155, 53, 255, 0.40);
}

/* =========================================================
   UI SPRINT B — Premium analysis visuals (Match Terminal)
   Frontend-only; renders from existing analysis fields.
   ========================================================= */
.sb-intel-panel {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 12px 0 6px;
}
.sb-card-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: rgba(160, 182, 205, 0.78);
    margin-bottom: 8px;
}
.sb-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 14px;
}
@media (max-width: 1080px) {
    .sb-hero { grid-template-columns: 1fr; }
}

/* Primary Pick card */
.sb-pp-card {
    background: linear-gradient(165deg, rgba(28, 44, 78, 0.55), rgba(14, 22, 41, 0.55));
    border: 1px solid rgba(122, 170, 212, 0.26);
    border-radius: 14px;
    padding: 16px 18px;
    box-shadow: 0 8px 26px rgba(0, 0, 0, 0.32);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.sb-pp-card.is-nobet { opacity: 0.85; }
.sb-pp-top { display: flex; align-items: center; justify-content: space-between; }
.sb-pp-label {
    font-size: 11px; font-weight: 700; letter-spacing: 1.4px;
    text-transform: uppercase; color: rgba(160, 182, 205, 0.78);
}
.sb-pp-pick {
    font-size: 26px; font-weight: 800; letter-spacing: 0.3px; color: #eef5ff; line-height: 1.05;
}
.sb-pp-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.sb-pp-metric {
    background: rgba(8, 14, 28, 0.45);
    border: 1px solid var(--border-blue);
    border-radius: 10px; padding: 9px 6px; text-align: center;
}
.sb-pp-metric span { display: block; font-size: 17px; font-weight: 750; color: #eaf3ff; }
.sb-pp-metric label { font-size: 9.5px; text-transform: uppercase; letter-spacing: 0.8px; color: rgba(150, 170, 192, 0.74); }
.sb-pp-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sb-pp-source {
    font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 999px;
}
.sb-pp-source.real { color: #6df0c2; background: rgba(57, 255, 136, 0.12); border: 1px solid rgba(57, 255, 136, 0.30); }
.sb-pp-source.model { color: rgba(176, 194, 212, 0.85); background: rgba(120, 150, 190, 0.10); border: 1px solid var(--border-blue); }

.sb-risk-badge { font-size: 10.5px; font-weight: 700; padding: 3px 9px; border-radius: 999px; }
.sb-risk-badge.safe { color: #6df0c2; background: rgba(57, 255, 136, 0.12); border: 1px solid rgba(57, 255, 136, 0.30); }
.sb-risk-badge.warning { color: #ffd479; background: rgba(255, 209, 102, 0.12); border: 1px solid rgba(255, 209, 102, 0.30); }
.sb-risk-badge.danger { color: #ff8aa2; background: rgba(255, 56, 92, 0.12); border: 1px solid rgba(255, 56, 92, 0.32); }

.sb-result-badge { font-size: 10.5px; font-weight: 750; padding: 3px 10px; border-radius: 999px; letter-spacing: 0.6px; }
.sb-result-badge.won { color: #6df0c2; background: rgba(57, 255, 136, 0.14); }
.sb-result-badge.lost { color: #ff8aa2; background: rgba(255, 56, 92, 0.14); }
.sb-result-badge.push { color: #ffd479; background: rgba(255, 209, 102, 0.14); }
.sb-result-badge.pending { color: rgba(176, 194, 212, 0.8); background: rgba(120, 150, 190, 0.10); }

/* Radar card */
.sb-radar-card {
    background: rgba(12, 19, 36, 0.50);
    border: 1px solid var(--border-blue);
    border-radius: 14px; padding: 14px 12px 10px;
    display: flex; flex-direction: column; align-items: center;
}
.sb-radar-svg { width: 100%; max-width: 240px; height: auto; }
.sb-radar-ring { fill: none; stroke: rgba(122, 170, 212, 0.16); stroke-width: 1; }
.sb-radar-spoke { stroke: rgba(122, 170, 212, 0.14); stroke-width: 1; }
.sb-radar-data { fill: rgba(79, 134, 255, 0.26); stroke: var(--accent-cyan); stroke-width: 1.6; }
.sb-radar-label { fill: rgba(180, 198, 216, 0.82); font-size: 8.5px; font-weight: 600; }
.sb-radar-note { font-size: 9px; color: rgba(150, 170, 192, 0.6); margin-top: 4px; }

/* Value Edge */
.sb-value-card {
    background: rgba(12, 19, 36, 0.50);
    border: 1px solid var(--border-blue);
    border-radius: 12px; padding: 14px 16px;
}
.sb-value-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.sb-value-col { text-align: center; background: rgba(8, 14, 28, 0.40); border-radius: 9px; padding: 9px 4px; }
.sb-value-col span { display: block; font-size: 17px; font-weight: 750; color: #eaf3ff; }
.sb-value-col label { font-size: 9.5px; text-transform: uppercase; letter-spacing: 0.7px; color: rgba(150, 170, 192, 0.74); }
.sb-value-col.pos span { color: #6df0c2; }
.sb-value-col.neg span { color: #ff8aa2; }
.sb-value-modelonly { color: rgba(176, 194, 212, 0.75); font-size: 13px; padding: 6px 0; }

/* Alternative markets */
.sb-section { display: block; }
.sb-alt-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 1080px) { .sb-alt-grid { grid-template-columns: 1fr; } }
.sb-alt-card {
    background: rgba(12, 19, 36, 0.50);
    border: 1px solid var(--border-blue);
    border-radius: 11px; padding: 11px 12px;
}
.sb-alt-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.sb-alt-market { font-weight: 700; color: #eaf3ff; font-size: 13.5px; }
.sb-alt-odds { font-weight: 750; color: var(--accent-cyan); font-size: 13px; }
.sb-alt-bars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.sb-alt-stat { text-align: center; }
.sb-alt-stat label { display: block; font-size: 9px; text-transform: uppercase; letter-spacing: 0.6px; color: rgba(150, 170, 192, 0.7); }
.sb-alt-stat span { font-size: 13px; font-weight: 700; color: #e6eefb; }
.sb-alt-stat span.real { color: #6df0c2; }
.sb-alt-stat span.model { color: rgba(176, 194, 212, 0.8); }
.sb-alt-stat span.pos { color: #6df0c2; }
.sb-alt-stat span.neg { color: #ff8aa2; }
.sb-alt-reason { margin-top: 7px; font-size: 11px; color: rgba(160, 180, 200, 0.7); }
.sb-alt-empty { font-size: 12px; color: rgba(160, 180, 200, 0.75); padding: 6px 2px; }

/* Match Intelligence */
.sb-intel-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 1080px) { .sb-intel-grid { grid-template-columns: 1fr; } }
.sb-intel-card {
    background: rgba(12, 19, 36, 0.50);
    border: 1px solid var(--border-blue);
    border-radius: 11px; padding: 11px 13px;
}
.sb-intel-t { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: rgba(150, 170, 192, 0.7); margin-bottom: 5px; }
.sb-intel-v { font-size: 12.5px; color: #dce7f5; line-height: 1.4; }

/* PATCH 1B — CSS-ONLY PREMIUM POLISH */
/* Append-only. Every selector is scoped under .playnaptic-app so it cannot leak
   globally and wins on specificity + source order without !important. No token
   overrides, no body/pseudo-element edits, no layout/display/position/z-index
   changes, nothing hidden. Panel backgrounds stay clearly opaque-enough so the
   UI can never read as "unstyled". Delete this block to fully revert. */

/* Darker navy cyber backdrop behind the panels (stadium still faintly shows). */
.playnaptic-app {
    background:
        radial-gradient(120% 90% at 50% -10%, rgba(40, 140, 200, 0.10), transparent 48%),
        linear-gradient(180deg, rgba(3, 10, 24, 0.42), rgba(2, 7, 18, 0.58));
}

/* Premium left sidebar: deeper glass + cyan edge. */
.playnaptic-app .sidebar {
    background: linear-gradient(180deg, rgba(9, 22, 44, 0.62), rgba(5, 13, 30, 0.58));
    border: 1px solid rgba(96, 206, 240, 0.30);
    box-shadow: 0 20px 46px rgba(0, 0, 0, 0.40), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

/* Sharper top header: glass + cyan hairline underline. */
.playnaptic-app .top-header {
    background: linear-gradient(180deg, rgba(8, 20, 42, 0.60), rgba(5, 13, 30, 0.52));
    border: 1px solid rgba(96, 206, 240, 0.26);
    border-bottom-color: rgba(72, 220, 255, 0.40);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.34);
}

/* Board filter bar: premium glass (rendered container is .ax-date-switcher-wrap). */
.playnaptic-app .ax-date-switcher-wrap {
    background: linear-gradient(180deg, rgba(8, 20, 42, 0.56), rgba(5, 13, 30, 0.48));
    border: 1px solid rgba(96, 206, 240, 0.26);
}
.playnaptic-app .ax-date-chip.active {
    box-shadow: 0 0 24px rgba(72, 220, 255, 0.34), inset 0 0 0 1px rgba(255, 255, 255, 0.10);
}

/* Active nav / odds tab. */
.playnaptic-app .nav-btn.active {
    border-color: rgba(72, 220, 255, 0.55);
    box-shadow: 0 0 18px rgba(72, 220, 255, 0.20);
}

/* Cleaner match board rows + cyan active state. */
.playnaptic-app .fixture-card {
    border: 1px solid rgba(104, 198, 232, 0.26);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.playnaptic-app .fixture-card:hover {
    border-color: rgba(96, 222, 252, 0.42);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.34);
}
.playnaptic-app .fixture-card.active {
    border-color: rgba(96, 226, 252, 0.58);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.36), 0 0 0 1px rgba(72, 220, 255, 0.22);
}

/* Right Match Terminal: stronger hierarchy. */
.playnaptic-app .match-terminal-header {
    background: linear-gradient(165deg, rgba(13, 28, 54, 0.64), rgba(7, 16, 34, 0.58));
    border: 1px solid rgba(96, 214, 248, 0.40);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.36);
}

/* Premium Primary Pick card. */
.playnaptic-app .sb-pp-card {
    border: 1px solid rgba(72, 220, 255, 0.40);
    box-shadow: 0 0 0 1px rgba(72, 220, 255, 0.12), 0 16px 36px rgba(0, 0, 0, 0.38);
}
.playnaptic-app .primary-analysis-card {
    border: 1px solid rgba(72, 220, 255, 0.36);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.32);
}

/* Odds-pick rows: cleaner edges + cyan hover. */
.playnaptic-app .odds-pick-row {
    border: 1px solid rgba(104, 198, 232, 0.22);
}
.playnaptic-app .odds-pick-row:hover {
    border-color: rgba(96, 222, 252, 0.40);
    background: rgba(16, 44, 76, 0.42);
}
/* END PATCH 1B */

/* PATCH 2 — MATCH TERMINAL PREMIUM SECTIONS */
/* Append-only. Styles only the new terminal sections, all scoped under the
   existing .ax-terminal-premium panel so nothing leaks. Reuses existing tokens;
   no layout/position/z-index changes elsewhere. Delete this block to revert. */
.ax-terminal-premium {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* 3 — Why This Pick */
.ax-terminal-premium .ax-why-section {
    background: rgba(12, 19, 36, 0.50);
    border: 1px solid var(--border-blue);
    border-radius: 12px;
    padding: 13px 15px;
}
.ax-terminal-premium .ax-why-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.ax-terminal-premium .ax-why-item {
    display: grid;
    grid-template-columns: 14px minmax(0, 1fr);
    align-items: start;
    gap: 9px;
    font-size: 12.5px;
    line-height: 1.45;
    color: #dce7f5;
}
.ax-terminal-premium .ax-why-dot {
    margin-top: 6px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent-cyan);
    box-shadow: 0 0 10px rgba(72, 220, 255, 0.55);
}

/* 4 — Value Edge horizontal bars + market options */
.ax-terminal-premium .ax-value-section {
    background: rgba(12, 19, 36, 0.50);
    border: 1px solid var(--border-blue);
    border-radius: 12px;
    padding: 13px 15px;
}
.ax-terminal-premium .ax-vbars {
    display: grid;
    gap: 9px;
    margin-bottom: 10px;
}
.ax-terminal-premium .ax-vbar-row {
    display: grid;
    grid-template-columns: 116px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 10px;
}
.ax-terminal-premium .ax-vbar-label {
    font-size: 11px;
    font-weight: 700;
    color: rgba(176, 196, 216, 0.82);
}
.ax-terminal-premium .ax-vbar-track {
    height: 8px;
    border-radius: 999px;
    background: rgba(8, 16, 32, 0.70);
    border: 1px solid rgba(96, 206, 240, 0.18);
    overflow: hidden;
}
.ax-terminal-premium .ax-vbar-fill {
    display: block;
    height: 100%;
    border-radius: 999px;
    transition: width 0.35s ease;
}
.ax-terminal-premium .ax-vbar-fill.model {
    background: linear-gradient(90deg, rgba(72, 220, 255, 0.55), rgba(72, 220, 255, 0.95));
}
.ax-terminal-premium .ax-vbar-fill.market {
    background: linear-gradient(90deg, rgba(155, 122, 255, 0.50), rgba(155, 122, 255, 0.90));
}
.ax-terminal-premium .ax-vbar-val {
    font-size: 12px;
    font-weight: 800;
    text-align: right;
    color: #eaf3ff;
}
.ax-terminal-premium .ax-value-foot {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    font-size: 12px;
    font-weight: 800;
}
.ax-terminal-premium .ax-value-odds {
    color: rgba(200, 216, 232, 0.86);
}
.ax-terminal-premium .ax-value-edge.pos { color: #6df0c2; }
.ax-terminal-premium .ax-value-edge.neg { color: #ff8aa2; }
.ax-terminal-premium .ax-market-options {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 11px;
}
.ax-terminal-premium .ax-market-chip {
    font-size: 11px;
    font-weight: 700;
    color: #d4e3f5;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(8, 16, 32, 0.55);
    border: 1px solid rgba(96, 206, 240, 0.22);
}
.ax-terminal-premium .ax-market-chip.is-real {
    border-color: rgba(57, 255, 136, 0.40);
    color: #cfeede;
}
.ax-terminal-premium .ax-market-chip b { color: #ffffff; }

/* 5 — Match DNA */
.ax-terminal-premium .ax-dna-section {
    background: rgba(12, 19, 36, 0.50);
    border: 1px solid var(--border-blue);
    border-radius: 12px;
    padding: 13px 15px 8px;
}
.ax-terminal-premium .ax-dna-section .sb-radar-card {
    background: transparent;
    border: 0;
    padding: 4px 0 0;
}

/* 6 — AI Match Story */
.ax-terminal-premium .ax-story-section {
    background: linear-gradient(165deg, rgba(16, 26, 50, 0.58), rgba(10, 16, 34, 0.52));
    border: 1px solid rgba(96, 214, 248, 0.30);
    border-radius: 12px;
    padding: 13px 15px;
}
.ax-terminal-premium .ax-story-text {
    margin: 0;
    font-size: 12.8px;
    line-height: 1.6;
    color: #dfe9f7;
}
/* END PATCH 2 */

/* PATCH 3 — TERMINAL COMPRESSION & HERO REDESIGN */
/* Append-only. Layout-only: a hero header, a hero primary-pick card, the four
   mid sections collapsed into a responsive 2-col grid, and a compact alt-markets
   row. Selectors scoped under .analysis-container / .ax-terminal-premium so they
   win on source order without !important and never leak. No new markup beyond the
   .ax-terminal-grid wrapper; nothing hidden/removed. Delete this block to revert. */

/* 1 — HERO MATCH HEADER (dominant; league/kickoff moved underneath) */
.analysis-container .match-terminal-header {
    grid-template-columns: minmax(0, 1fr);
    padding: 16px 18px;
    margin-bottom: 14px;
    background: linear-gradient(165deg, rgba(14, 30, 56, 0.66), rgba(7, 16, 34, 0.60));
    border-color: rgba(112, 222, 252, 0.42);
}
.analysis-container .match-identity {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.analysis-container .match-scoreboard { order: 1; }
.analysis-container .match-meta-shell {
    order: 2;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
}
.analysis-container .match-team { font-size: 19px; line-height: 1.1; }
.analysis-container .match-score-core {
    min-width: 108px;
    padding: 10px 16px;
    border-color: rgba(72, 220, 255, 0.34);
}
.analysis-container .match-score-core strong { font-size: 30px; }
.analysis-container .match-kickoff-time {
    font-size: 12px;
    font-weight: 800;
    color: var(--muted);
}

/* 2 — PRIMARY PICK HERO CARD (largest card, full width under header) */
.ax-terminal-premium { gap: 12px; }
.ax-terminal-premium .sb-pp-card { padding: 18px 18px 16px; }
.ax-terminal-premium .sb-pp-pick { font-size: 26px; line-height: 1.1; }
.ax-terminal-premium .sb-pp-metric span { font-size: 18px; }

/* 3 — TERMINAL GRID: 2x2 on desktop, stack on mobile */
.ax-terminal-premium .ax-terminal-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}
.ax-terminal-premium .ax-terminal-grid > .sb-section {
    margin: 0;
    height: 100%;
}
/* keep the value bars legible inside the narrower grid cell */
.ax-terminal-premium .ax-terminal-grid .ax-vbar-row {
    grid-template-columns: 82px minmax(0, 1fr) 36px;
    gap: 8px;
}
.ax-terminal-premium .ax-terminal-grid .ax-vbar-label { font-size: 10.5px; }
/* keep Match DNA compact so it isn't the tallest cell */
.ax-terminal-premium .ax-terminal-grid .sb-radar-svg { max-width: 190px; }
.ax-terminal-premium .ax-terminal-grid .ax-dna-section { padding: 12px 12px 6px; }
@media (max-width: 760px) {
    .ax-terminal-premium .ax-terminal-grid { grid-template-columns: 1fr; }
}

/* 4 — ALTERNATIVE MARKETS: compact horizontal row below the grid */
.ax-terminal-premium .sb-alt-grid {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 8px;
}
.ax-terminal-premium .sb-alt-card { padding: 9px 11px; }
.ax-terminal-premium .sb-alt-bars { gap: 4px; }

/* 5/6 — supplementary intel + tighter rhythm to reduce overall scroll */
.ax-terminal-premium .ax-why-section,
.ax-terminal-premium .ax-value-section,
.ax-terminal-premium .ax-story-section { padding: 12px 14px; }
.ax-terminal-premium .sb-intel-grid { gap: 8px; }
/* END PATCH 3 */

/* ===== PATCH T1 — MATCH DNA PREMIUM TARGET (green/cyan radar + derived scores) =====
   Append-only, frontend display only. Scores are derived in app.js from existing
   analysis fields; nothing here touches data/formulas. Delete this block to revert. */
.ax-dna-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
.ax-dna-overall-badge {
    display: flex;
    align-items: baseline;
    gap: 6px;
    padding: 3px 10px;
    border-radius: 999px;
    background: rgba(57, 255, 176, 0.10);
    border: 1px solid rgba(57, 255, 176, 0.32);
}
.ax-dna-overall-badge strong {
    font-size: 15px;
    font-weight: 850;
    color: #9dffe0;
    text-shadow: 0 0 10px rgba(57, 255, 176, 0.45);
}
.ax-dna-overall-badge span {
    font-size: 8.5px;
    font-weight: 800;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: rgba(157, 255, 224, 0.78);
}

/* Layout driven by container queries below (responds to the card width, not the
   viewport). Default = narrowest: radar on top, then left metrics, then right. */
.ax-dna-grid {
    display: grid;
    gap: 10px 12px;
    align-items: center;
    min-width: 0;
    grid-template-columns: 1fr;
    grid-template-areas:
        "radar"
        "left"
        "right";
}
.ax-dna-col-left { grid-area: left; }
.ax-dna-col-right { grid-area: right; }
.ax-dna-radar-wrap { grid-area: radar; }
.ax-dna-col {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.ax-dna-radar-wrap {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    overflow: hidden;
}
.ax-dna-svg {
    width: 100%;
    max-width: 280px;
    height: auto;
    overflow: visible;
    filter: drop-shadow(0 0 10px rgba(45, 236, 196, 0.22));
}
.ax-dna-ring { fill: none; stroke: rgba(86, 196, 224, 0.16); stroke-width: 1; }
.ax-dna-ring:last-of-type { stroke: rgba(86, 196, 224, 0.30); }
.ax-dna-spoke { stroke: rgba(86, 196, 224, 0.18); stroke-width: 1; }
.ax-dna-data {
    fill: url(#axDnaFill);
    stroke: #39ffb0;
    stroke-width: 1.8;
    stroke-linejoin: round;
    filter: drop-shadow(0 0 6px rgba(57, 255, 176, 0.55));
}
.ax-dna-dot { fill: #9dffe0; stroke: #0a1422; stroke-width: 0.6; }
.ax-dna-axis-label {
    fill: rgba(196, 224, 240, 0.88);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.4px;
}

.ax-dna-overall {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1;
    pointer-events: none;
}
.ax-dna-overall-value {
    font-size: 26px;
    font-weight: 850;
    color: #eafff6;
    text-shadow: 0 0 12px rgba(57, 255, 176, 0.55);
}
.ax-dna-overall-label {
    font-size: 8.5px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: rgba(157, 255, 224, 0.85);
    margin-top: 2px;
}

.ax-dna-metric {
    background: rgba(8, 16, 30, 0.46);
    border: 1px solid rgba(86, 196, 224, 0.18);
    border-radius: 9px;
    padding: 7px 9px;
    min-width: 0;
    overflow: hidden;
}
.ax-dna-metric-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px;
    min-width: 0;
}
.ax-dna-metric-label {
    font-size: 9.5px;
    font-weight: 750;
    letter-spacing: 0.3px;
    line-height: 1.25;
    text-transform: uppercase;
    color: rgba(198, 216, 232, 0.86);
    flex: 1 1 auto;
    min-width: 0;
    /* horizontal text; wrap only at spaces, never letter-by-letter */
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
}
.ax-dna-metric-value {
    font-size: 14px;
    font-weight: 800;
    color: #eafff6;
    flex: 0 0 auto;
    text-align: right;
}
.ax-dna-metric.is-est .ax-dna-metric-value { color: rgba(157, 255, 224, 0.92); }
.ax-dna-metric-track {
    margin-top: 5px;
    height: 4px;
    border-radius: 999px;
    background: rgba(86, 196, 224, 0.14);
    overflow: hidden;
}
.ax-dna-metric-track > span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #22d3ee, #39ffb0);
    box-shadow: 0 0 6px rgba(57, 255, 176, 0.5);
}
.ax-dna-note {
    margin-top: 8px;
    font-size: 9px;
    color: rgba(150, 170, 192, 0.58);
    text-align: center;
}

/* END PATCH T1 */

/* ===== PATCH T1C — MATCH DNA TARGET LAYOUT (metrics | radar | metrics) ===== */
/* The DNA card establishes a query container, so the layout reacts to the card's
   own width even though it sits inside a half-width terminal grid cell. Clip is
   kept so nothing bleeds into the neighbouring AI Match Story cell. */
.ax-dna-section {
    overflow: hidden;
    container-type: inline-size;
}
.ax-dna-grid > * { min-width: 0; }
.ax-dna-axis-label { font-size: 7.5px; }

/* Roomy enough: place left & right metric columns either side of a dominant radar. */
@container (min-width: 540px) {
    .ax-dna-grid {
        grid-template-columns: minmax(0, 1fr) minmax(200px, 1.7fr) minmax(0, 1fr);
        grid-template-areas: "left radar right";
        align-items: center;
        column-gap: 14px;
    }
}
/* Mid width: radar on top, left & right metric columns side by side beneath it. */
@container (min-width: 360px) and (max-width: 539.98px) {
    .ax-dna-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "radar radar"
            "left  right";
        align-items: start;
    }
}
/* Narrowest keeps the base stacked layout: radar / left / right (see PATCH T1). */
/* END PATCH T1C */

/* ===== PATCH 4A5 — PREDICTED SCORE (Full Analysis tab only) ===== */
.ax-pscore-card { display: flex; flex-direction: column; gap: 10px; }
.ax-pscore-main {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 10px;
}
.ax-pscore-team {
    font-size: 12.5px;
    font-weight: 700;
    color: #eaf3ff;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ax-pscore-main .ax-pscore-team:first-child { text-align: right; }
.ax-pscore-main .ax-pscore-team:last-child { text-align: left; }
.ax-pscore-value {
    font-size: 28px;
    font-weight: 850;
    letter-spacing: 1px;
    color: #9dffe0;
    text-shadow: 0 0 12px rgba(57, 255, 176, 0.45);
    padding: 2px 14px;
    border-radius: 10px;
    background: rgba(57, 255, 176, 0.08);
    border: 1px solid rgba(57, 255, 176, 0.28);
    white-space: nowrap;
}
.ax-pscore-xg {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}
.ax-pscore-xg-cell {
    text-align: center;
    background: rgba(8, 14, 28, 0.40);
    border: 1px solid rgba(86, 196, 224, 0.16);
    border-radius: 9px;
    padding: 7px 4px;
}
.ax-pscore-xg-cell span {
    display: block;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: rgba(150, 170, 192, 0.74);
}
.ax-pscore-xg-cell b { font-size: 15px; font-weight: 800; color: #eaf3ff; }
.ax-pscore-context {
    margin: 0;
    font-size: 11.5px;
    line-height: 1.5;
    color: rgba(206, 220, 236, 0.82);
}
/* END PATCH 4A5 */

/* ===== PATCH UI-S1 — PREMIUM LEFT SIDEBAR ===== */
/* Overview nav menu */
.ax-nav-menu {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 6px 0 8px;
    flex-shrink: 0;
}
.ax-nav-label {
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
    padding: 0 2px 2px;
}
.ax-nav-item {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 0 11px;
    border-radius: var(--radius);
    border: 1px solid transparent;
    background: rgba(15, 23, 42, 0.42);
    color: var(--muted);
    font-weight: 800;
    font-size: 13px;
    cursor: pointer;
    text-align: left;
}
.ax-nav-item:hover,
.ax-nav-item.is-active {
    color: var(--text);
    border-color: rgba(34, 211, 238, 0.34);
    background: rgba(34, 211, 238, 0.08);
}
.ax-nav-item .ax-nav-ic {
    width: 18px;
    text-align: center;
    font-size: 13px;
    color: var(--cyan);
    flex-shrink: 0;
}
.ax-nav-item .ax-nav-text {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ax-nav-menu .live-command { margin: 0; }
.ax-nav-badge {
    margin-left: auto;
    flex-shrink: 0;
    min-width: 24px;
    padding: 2px 8px;
    border-radius: 999px;
    text-align: center;
    font-size: 11px;
    font-weight: 800;
    background: rgba(34, 211, 238, 0.14);
    color: #bdf3ff;
}
.ax-badge-new {
    background: rgba(57, 255, 176, 0.16);
    color: #9dffe0;
    letter-spacing: 0.06em;
}

/* Leagues heading + league filter */
.ax-leagues-heading { padding-top: 2px; }
.ax-league-search { margin: 2px 0 6px; flex-shrink: 0; }
.ax-league-search input {
    width: 100%;
    min-height: 34px;
    padding: 0 11px;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: rgba(2, 6, 23, 0.38);
    color: var(--text);
    font-size: 12.5px;
}
.ax-league-search input::placeholder { color: var(--muted); }
.ax-continent-block.is-search-hidden,
.ax-country-block.is-search-hidden { display: none; }

/* Elite Plan / Upgrade card — compact so the region list keeps comfortable room */
.ax-elite-card {
    flex-shrink: 0;
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 11px;
    border-radius: calc(var(--radius) + 2px);
    border: 1px solid rgba(255, 209, 102, 0.34);
    background: linear-gradient(160deg, rgba(58, 46, 16, 0.55), rgba(20, 16, 8, 0.5));
}
.ax-elite-crown {
    font-size: 20px;
    color: #ffd166;
    text-shadow: 0 0 12px rgba(255, 209, 102, 0.5);
    flex-shrink: 0;
}
.ax-elite-copy { flex: 1 1 auto; min-width: 0; }
.ax-elite-title {
    font-size: 11.5px;
    font-weight: 900;
    letter-spacing: 0.08em;
    color: #ffe6a3;
}
.ax-elite-sub {
    font-size: 10.5px;
    color: rgba(226, 220, 200, 0.78);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ax-elite-btn {
    flex-shrink: 0;
    padding: 6px 12px;
    border-radius: 999px;
    border: 0;
    font-weight: 850;
    font-size: 11.5px;
    cursor: pointer;
    color: #2a1d00;
    background: linear-gradient(90deg, #ffd166, #ffb02e);
    box-shadow: 0 0 14px rgba(255, 176, 46, 0.35);
}
.ax-elite-btn:hover { filter: brightness(1.06); }
.ax-elite-card.is-pulsing { animation: axElitePulse 0.6s ease; }
@keyframes axElitePulse {
    0% { box-shadow: 0 0 0 0 rgba(255, 209, 102, 0.0); }
    40% { box-shadow: 0 0 0 4px rgba(255, 209, 102, 0.28); }
    100% { box-shadow: 0 0 0 0 rgba(255, 209, 102, 0.0); }
}

/* Footer status */
.ax-sidebar-status {
    flex-shrink: 0;
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 11px;
    color: var(--muted);
}
.ax-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #39ffb0;
    box-shadow: 0 0 10px rgba(57, 255, 176, 0.7);
    flex-shrink: 0;
}
.ax-status-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

@media (max-width: 920px) {
    .ax-nav-menu { gap: 3px; }
    .ax-nav-item { min-height: 34px; font-size: 12px; }
}
/* END PATCH UI-S1 */

/* ===== PATCH UI-S3 — My Matches / Alerts, toasts, alert modal ===== */
.nav-feature-badge {
    display: inline-block;
    margin-left: 6px;
    min-width: 16px;
    padding: 1px 5px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.4;
    text-align: center;
    background: rgba(34, 211, 238, 0.18);
    color: #bdf3ff;
}
.nav-feature-badge[hidden] { display: none; }

/* Feature pages */
.feature-page {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px 20px;
}
.feature-page-head h2 {
    margin: 0 0 4px;
    font-size: 20px;
    font-weight: 900;
}
.feature-page-head p {
    margin: 0;
    color: var(--muted);
    font-size: 12.5px;
}
.feature-notice {
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(255, 196, 92, 0.32);
    background: rgba(60, 44, 12, 0.32);
    color: rgba(246, 224, 170, 0.92);
    font-size: 11.5px;
    line-height: 1.45;
}
.feature-notice--scope {
    border-color: rgba(96, 206, 240, 0.28);
    background: rgba(10, 28, 48, 0.42);
    color: rgba(198, 222, 244, 0.88);
}
.alerts-voice-home-link {
    margin: 0;
    font-size: 12px;
    color: var(--muted);
    line-height: 1.5;
}
.alerts-voice-home-link a {
    color: var(--cyan);
    font-weight: 700;
    text-decoration: none;
}
.alerts-voice-home-link a:hover { text-decoration: underline; }
.home-voice-section { margin-bottom: 22px; }
.home-voice-card { display: flex; flex-direction: column; }
.voice-commands-page .np-voice-help-card { margin-bottom: 4px; }
.voice-commands-back { padding-top: 4px; }
.feature-empty {
    padding: 28px 16px;
    border-radius: 12px;
    border: 1px dashed rgba(122, 170, 212, 0.32);
    background: rgba(4, 14, 30, 0.34);
    color: var(--muted);
    font-size: 13px;
    text-align: center;
}
.feature-card-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.feature-match-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(70, 165, 255, 0.18);
    background: rgba(4, 14, 30, 0.34);
}
.feature-match-open {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
}
.feature-match-teams { font-weight: 800; font-size: 13.5px; }
.feature-match-meta { color: var(--muted); font-size: 11px; }
.alert-chip-row { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.alert-chip {
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    background: rgba(255, 209, 102, 0.14);
    color: #ffe1a3;
}
.feature-match-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.feature-remove-btn {
    padding: 6px 10px;
    border-radius: 8px;
    border: 1px solid rgba(255, 120, 120, 0.34);
    background: rgba(40, 12, 12, 0.4);
    color: #ffb4b4;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}
.feature-remove-btn:hover { background: rgba(80, 20, 20, 0.55); }
.feature-match-info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.feature-match-row.alerts-row { align-items: flex-start; }
.alert-status { font-size: 11px; color: var(--muted); margin-top: 2px; }
.feature-action-btn {
    padding: 6px 11px;
    border-radius: 8px;
    border: 1px solid var(--line);
    background: rgba(15, 23, 42, 0.6);
    color: var(--text);
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
    white-space: nowrap;
}
.feature-action-btn:hover { border-color: rgba(122, 170, 212, 0.5); }
.feature-action-btn.is-active {
    border-color: rgba(255, 209, 102, 0.5);
    color: #ffe1a3;
    background: rgba(255, 209, 102, 0.1);
}
.feature-match-actions { flex-wrap: wrap; }

/* PATCH PREDICTION-PERFORMANCE-V1 — clean 3-KPI accuracy view (scoped). */
.predperf-kpi-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.predperf-kpi-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px 18px 20px;
    border-radius: 14px;
    border: 1px solid var(--card-glass-border);
    background: var(--card-glass-bg);
    box-shadow: var(--card-neon-edge);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}
.predperf-kpi-card.is-accent {
    border-color: rgba(72, 232, 255, 0.4);
    background:
        radial-gradient(140% 160% at 50% 0%, rgba(72, 232, 255, 0.1), transparent 60%),
        var(--card-glass-bg);
}
.predperf-kpi-label {
    font-size: 11.5px;
    font-weight: 800;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.predperf-kpi-value {
    font-size: 28px;
    font-weight: 900;
    color: var(--text);
}
.predperf-kpi-card.is-accent .predperf-kpi-value { color: var(--accent-cyan); }
.predperf-day-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.predperf-day-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    border-radius: 14px;
    border: 1px solid var(--glass-border);
    background: var(--ax-glass-strong);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
}
.predperf-day-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}
.predperf-day-title { font-size: 14px; font-weight: 900; color: var(--text); }
.predperf-day-date { font-size: 11px; color: var(--muted); }
.predperf-day-metrics { display: flex; flex-direction: column; gap: 8px; }
.predperf-day-metric {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(122, 170, 212, 0.12);
}
.predperf-day-metric:last-child { border-bottom: 0; padding-bottom: 0; }
.predperf-metric-label { font-size: 11.5px; color: var(--muted); }
.predperf-metric-value { font-size: 14px; font-weight: 800; color: var(--text); }
.predperf-note {
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid rgba(122, 170, 212, 0.22);
    background: rgba(4, 14, 30, 0.34);
    color: var(--muted);
    font-size: 11.5px;
}
.predperf-empty {
    padding: 22px 16px;
    border-radius: 12px;
    border: 1px dashed rgba(122, 170, 212, 0.32);
    background: rgba(4, 14, 30, 0.34);
    color: var(--muted);
    font-size: 13px;
    text-align: center;
}
@media (max-width: 720px) {
    .predperf-kpi-grid,
    .predperf-day-grid { grid-template-columns: 1fr; }
}

/* PATCH BUGFIX-3 — hide the duplicate large header title on the Prediction
   Performance page (the view renders its own title/subtitle), and make the top nav
   tabs smaller and more solid so they no longer collide with the header. Scoped to
   the v2 header; no global theme tokens changed. */
body.route-prediction-performance .top-header .page-title { display: none; }
.top-header-v2 .site-nav {
    background: rgba(8, 14, 26, 0.82);
}
.top-header-v2 .site-nav a,
.top-header-v2 .site-nav .site-nav-link {
    padding: 6px 11px;
    font-size: 12px;
    background: rgba(13, 22, 40, 0.72);
}
.top-header-v2 .site-nav a:hover,
.top-header-v2 .site-nav .site-nav-link:hover {
    background: rgba(79, 134, 255, 0.16);
}

/* Toasts */
.playnaptic-toast-host {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 12000;
    display: flex;
    flex-direction: column;
    gap: 8px;
    pointer-events: none;
}
.playnaptic-toast {
    min-width: 220px;
    max-width: 340px;
    padding: 11px 14px;
    border-radius: 10px;
    border: 1px solid rgba(34, 211, 238, 0.34);
    background: rgba(8, 20, 36, 0.96);
    color: #eaf4ff;
    font-size: 12.5px;
    font-weight: 700;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5);
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}
.playnaptic-toast.is-visible { opacity: 1; transform: translateY(0); }

/* Alert modal */
.playnaptic-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 12500;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(2, 6, 16, 0.62);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}
.playnaptic-modal-overlay.is-open { display: flex; }
.playnaptic-modal {
    width: min(440px, 100%);
    max-height: 88vh;
    overflow-y: auto;
    padding: 18px;
    border-radius: 14px;
    border: 1px solid var(--line-strong);
    background: var(--bg-main);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.6);
}
.playnaptic-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.playnaptic-modal-head h3 { margin: 0; font-size: 16px; font-weight: 900; }
.playnaptic-modal-close {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    border: 1px solid var(--line);
    background: rgba(2, 6, 23, 0.5);
    color: var(--text);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}
.playnaptic-modal-match { margin-top: 6px; font-weight: 800; font-size: 13.5px; color: #cfe6ff; }
.playnaptic-modal-intro { margin: 6px 0 10px; color: var(--muted); font-size: 12px; }
.alert-type-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 12px;
}
.alert-type-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 9px;
    border-radius: 8px;
    border: 1px solid var(--line);
    background: rgba(4, 14, 30, 0.34);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}
.alert-type-option input { accent-color: var(--cyan); cursor: pointer; }
.playnaptic-modal-note {
    margin: 12px 0;
    padding: 9px 11px;
    border-radius: 8px;
    background: rgba(60, 44, 12, 0.28);
    color: rgba(246, 224, 170, 0.9);
    font-size: 10.5px;
    line-height: 1.4;
}
.playnaptic-modal-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.playnaptic-modal-btn {
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: rgba(15, 23, 42, 0.6);
    color: var(--text);
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}
.playnaptic-modal-btn.primary {
    border: 0;
    color: #031018;
    background: linear-gradient(135deg, var(--cyan), #67e8f9);
}
.playnaptic-modal-btn.ghost:hover { border-color: var(--line-strong); }
@media (max-width: 560px) {
    .alert-type-grid { grid-template-columns: 1fr; }
}
/* END PATCH UI-S3 */

/* PATCH UI-S4A: Home page Upgrade to Pro button */
.home-upgrade-btn {
    border: 1px solid rgba(255, 209, 102, 0.5);
    background: linear-gradient(135deg, #ffd166, #ffb02e);
    color: #2a1d00;
    font-weight: 850;
    cursor: pointer;
}
.home-upgrade-btn:hover { filter: brightness(1.06); }
.home-upgrade-btn.is-pulsing { animation: axElitePulse 0.6s ease; }
/* END PATCH UI-S4A */

/* PATCH HOME-DOCS-1: User Guide / Terms document viewer */
.home-info-card--link {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    transition: border-color 0.15s ease, transform 0.15s ease;
}
.home-info-card--link:hover {
    border-color: rgba(34, 211, 238, 0.5);
    transform: translateY(-2px);
}
.home-card-cta {
    margin-top: auto;
    padding-top: 10px;
    font-size: 12px;
    font-weight: 800;
    color: var(--cyan);
}

.home-doc-page { gap: 16px; }
.home-doc-head {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}
.home-doc-back { flex-shrink: 0; }
.home-doc-title {
    margin: 0;
    font-size: clamp(20px, 2.6vw, 26px);
    font-weight: 900;
}
.home-doc-layout {
    display: grid;
    grid-template-columns: minmax(200px, 260px) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    min-height: 0;
}
.home-doc-toc {
    position: sticky;
    top: 12px;
    padding: 14px;
    border-radius: var(--radius);
    max-height: calc(100vh - 200px);
    overflow-y: auto;
    scrollbar-width: thin;
}
.home-doc-toc-title {
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
    margin-bottom: 8px;
}
.home-doc-toc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.home-doc-toc-link {
    display: flex;
    align-items: baseline;
    gap: 8px;
    width: 100%;
    text-align: left;
    border: 0;
    background: transparent;
    color: var(--muted);
    font-size: 12.5px;
    font-weight: 600;
    padding: 6px 8px;
    border-radius: 8px;
    cursor: pointer;
    line-height: 1.3;
}
.home-doc-toc-link:hover { background: rgba(34, 211, 238, 0.08); color: var(--text); }
.home-doc-toc-link.is-active { background: rgba(34, 211, 238, 0.14); color: var(--text); }
.home-doc-toc-num { color: var(--cyan); font-weight: 800; flex-shrink: 0; min-width: 18px; }

.home-doc-body {
    padding: 22px 24px;
    border-radius: var(--radius);
    max-height: calc(100vh - 200px);
    overflow-y: auto;
    scrollbar-width: thin;
}
.home-doc-section { padding: 10px 0 18px; }
.home-doc-section + .home-doc-section { border-top: 1px solid rgba(90, 115, 140, 0.18); }
.home-doc-h2 {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin: 4px 0 10px;
    font-size: 17px;
    font-weight: 900;
    color: var(--text);
}
.home-doc-sec-num {
    color: #031018;
    background: linear-gradient(135deg, var(--cyan), #67e8f9);
    border-radius: 7px;
    font-size: 12px;
    font-weight: 900;
    padding: 2px 8px;
    flex-shrink: 0;
}
.home-doc-p {
    margin: 0 0 10px;
    font-size: 13.5px;
    line-height: 1.6;
    color: rgba(214, 226, 240, 0.92);
}
.home-doc-callout {
    margin: 10px 0 4px;
    padding: 11px 13px;
    border-radius: 10px;
    border: 1px solid rgba(255, 196, 92, 0.34);
    background: rgba(60, 44, 12, 0.32);
    color: rgba(246, 224, 170, 0.94);
    font-size: 12.5px;
    line-height: 1.5;
    font-weight: 600;
}

@media (max-width: 900px) {
    .home-doc-layout { grid-template-columns: 1fr; }
    .home-doc-toc { position: static; max-height: none; }
    .home-doc-body { max-height: none; }
}
/* END PATCH HOME-DOCS-1 */

/* MOBILE RESPONSIVE V1: layout-only safety for Playnaptic board + terminal. */
html,
body {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

.mobile-view-analysis-btn {
    display: none;
}

.mobile-analysis-back {
    display: none;
}

#mobile-analysis-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    width: 100vw;
    height: 100vh;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    background: #07101f;
    color: var(--text);
    opacity: 0;
    transform: translateY(10px);
    touch-action: pan-y;
}

body.mobile-analysis-modal-open {
    overflow: hidden;
    overscroll-behavior: none;
}

body.mobile-analysis-modal-open #mobile-analysis-overlay {
    display: block;
    animation: mobileAnalysisIn 160ms ease-out forwards;
}

#mobile-analysis-overlay .mobile-analysis-overlay-header {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 56px;
    padding: calc(8px + env(safe-area-inset-top, 0px)) calc(12px + env(safe-area-inset-right, 0px)) 8px calc(12px + env(safe-area-inset-left, 0px));
    background: #07101f;
    border-bottom: 1px solid rgba(72, 232, 255, 0.24);
}

#mobile-analysis-overlay .mobile-analysis-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 9px 12px;
    border: 1px solid rgba(72, 232, 255, 0.42);
    border-radius: 8px;
    background: rgba(72, 232, 255, 0.12);
    color: var(--text);
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

#mobile-analysis-overlay .mobile-analysis-overlay-body {
    width: 100%;
    min-height: calc(100vh - 58px);
    padding: 10px calc(10px + env(safe-area-inset-right, 0px)) calc(18px + env(safe-area-inset-bottom, 0px)) calc(10px + env(safe-area-inset-left, 0px));
    overflow: visible;
    background: #07101f;
}

#mobile-analysis-overlay .analysis-terminal-tabs {
    position: sticky;
    top: calc(56px + env(safe-area-inset-top, 0px));
    z-index: 1;
    background: #07101f;
}

#mobile-analysis-overlay .analysis-terminal-tabs .bet-tab,
#mobile-analysis-overlay .analysis-primary-tabs .bet-tab,
#mobile-analysis-overlay .analysis-secondary-tabs .bet-tab {
    min-height: 40px;
    padding: 9px 11px;
}

#mobile-analysis-overlay .match-terminal-stack {
    gap: 10px;
}

#mobile-analysis-overlay .match-terminal-header,
#mobile-analysis-overlay .terminal-section,
#mobile-analysis-overlay .primary-analysis-card,
#mobile-analysis-overlay .primary-terminal-card,
#mobile-analysis-overlay .ax-terminal-premium,
#mobile-analysis-overlay .ax-terminal-premium .sb-section {
    border-radius: 8px;
}

#mobile-analysis-overlay .terminal-section {
    margin-top: 10px;
}

@keyframes mobileAnalysisIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.mobile-analysis-modal-open #mobile-analysis-overlay {
        animation: none;
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 900px) {
    html,
    body {
        min-width: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }

    body {
        min-height: 100vh;
    }

    .playnaptic-app {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        max-width: 100vw;
        min-height: 100vh;
        height: auto;
        padding: 10px;
        gap: 10px;
        overflow: visible;
    }

    .sidebar,
    .sidebar-card,
    .sidebar.sidebar-shell {
        width: 100%;
        max-width: 100%;
        height: auto;
        max-height: 38vh;
        min-height: 0;
        padding: 12px;
        overflow: hidden;
    }

    .ax-sidebar-leagues,
    .ax-sidebar-leagues.ax-sidebar {
        overflow: hidden;
    }

    .ax-fav-leagues,
    .sidebar-scroll,
    .sidebar-scroll.ax-country-list-scroll {
        max-height: 18vh;
        min-height: 0;
        overflow-y: auto;
    }

    .main-column,
    .route-content,
    .dashboard-stack,
    .section-stack,
    .board-premium-shell {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .route-content,
    .route-content:has(.audit-page),
    .route-content:has(.special-board-stack),
    .route-content:not(:has(.content-grid)):not(:has(.audit-page)):not(:has(.special-board-stack)) {
        overflow: visible;
    }

    .top-header,
    .top-header-v2 {
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        max-width: 100%;
        padding: 12px;
        gap: 10px;
        text-align: left;
    }

    .top-header-left,
    .site-nav,
    .top-header-right {
        width: 100%;
        min-width: 0;
    }

    .top-header-v2 .site-nav,
    .site-nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        justify-content: stretch;
        gap: 6px;
        overflow: visible;
    }

    .top-header-v2 .site-nav a,
    .top-header-v2 .site-nav .site-nav-link,
    .site-nav a,
    .site-nav .site-nav-link {
        width: 100%;
        min-width: 0;
        justify-content: center;
        padding: 8px 6px;
        text-align: center;
        white-space: normal;
        overflow-wrap: anywhere;
        line-height: 1.15;
    }

    .top-header-right {
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 8px;
    }

    .settings-menu,
    .terminal-clock,
    .ax-pro-upgrade-btn,
    .voice-control {
        max-width: 100%;
        min-width: 0;
    }

    .terminal-clock {
        text-align: left;
        flex: 1 1 120px;
    }

    .settings-menu-panel {
        left: 8px !important;
        right: 8px !important;
        width: auto;
        max-width: calc(100vw - 16px);
    }

    .board-filters,
    .ax-date-switcher-wrap,
    .board-premium-header,
    .weekly-boost-header,
    .odds-picks-header {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .ax-date-switcher {
        max-width: 100%;
        overflow-x: auto;
    }

    .ax-board-specials {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
    }

    .content-grid,
    .workspace-grid,
    .league-hub-grid,
    .odds-picks-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto;
        min-height: 0;
        overflow: visible;
        align-items: stretch;
    }

    .fixtures-panel,
    .analysis-panel,
    .terminal-panel,
    .match-terminal,
    .special-board-panel {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto;
        min-height: 0;
        max-height: none;
        overflow: visible;
    }

    .analysis-panel {
        position: static;
        top: auto;
        align-self: stretch;
        order: 2;
    }

    .panel-body,
    .fixtures-scroll,
    .analysis-container {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .fixture-group-header,
    .fixture-league-line {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .fixture-league-line {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
    }

    .fixture-league-line .league-badge,
    .fixture-league-line .fixture-meta {
        max-width: 100%;
    }

    .compact-fixture-card,
    .fixture-card,
    .odds-pick-row,
    .top-pick-card {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .fixture-compact-main,
    .compact-fixture-card.is-live-fixture .fixture-compact-main,
    .compact-fixture-card.is-ft-fixture .fixture-compact-main,
    .compact-fixture-card.is-weekly-value .fixture-compact-main,
    .compact-fixture-card.is-weekly-value.is-live-fixture .fixture-compact-main,
    .compact-fixture-card.is-weekly-value.is-ft-fixture .fixture-compact-main {
        grid-template-columns: minmax(42px, auto) minmax(0, 1fr) 44px minmax(0, 1fr);
        gap: 5px;
    }

    .fixture-col-pick,
    .fixture-col-prob,
    .fixture-col-conf,
    .fixture-col-fav,
    .fixture-col-actions {
        grid-column: auto;
    }

    .fixture-col-pick {
        grid-column: 1 / -1;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        justify-self: stretch;
    }

    .fixture-col-prob,
    .fixture-col-conf {
        max-width: none;
        min-width: 0;
    }

    .compact-fixture-card .fixture-pick-pill,
    .compact-fixture-card.is-weekly-value .fixture-pick-pill {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 24px;
        height: auto;
        white-space: normal !important;
        overflow-wrap: anywhere;
        text-overflow: clip;
    }

    .fixture-value-meta,
    .fixture-value-odds,
    .fixture-value-edge,
    .fixture-value-label {
        max-width: 100%;
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .fixture-team-cell,
    .match-team,
    .match-team span {
        min-width: 0;
        max-width: 100%;
    }

    .compact-fixture-card .team-name,
    .match-team,
    .match-team span {
        white-space: normal;
        overflow-wrap: anywhere;
        text-overflow: clip;
    }

    .fixture-team-logo {
        flex-basis: 16px;
        width: 16px;
        height: 16px;
    }

    .match-terminal-header,
    .terminal-section,
    .primary-analysis-card,
    .primary-terminal-card,
    .ai-match-analysis-card,
    .ax-terminal-premium,
    .ax-terminal-premium .sb-section {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .match-scoreboard,
    .primary-terminal-head,
    .top-pick-head,
    .terminal-metric-row {
        min-width: 0;
    }

    .analysis-terminal-tab-stack {
        position: static;
        width: 100%;
        max-width: 100%;
    }

    .analysis-terminal-tabs,
    .analysis-primary-tabs,
    .analysis-secondary-tabs {
        max-width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    .analysis-grid,
    .matchup-grid,
    .market-detail-grid,
    .top-pick-metrics,
    .terminal-metric-grid,
    .primary-terminal-metrics,
    .sb-hero,
    .sb-pp-metrics,
    .sb-intel-grid,
    .ax-terminal-premium .ax-terminal-grid,
    .ax-terminal-premium .sb-alt-grid,
    .best-value-pick-grid,
    .odds-intelligence-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .playnaptic-app {
        padding: 8px;
        gap: 8px;
    }

    .content-grid > .analysis-panel {
        display: none;
    }

    .compact-fixture-card {
        min-height: 56px;
    }

    .compact-fixture-card,
    .fixture-group-header,
    .fixture-league-line {
        scroll-margin-top: 10px;
    }

    .sidebar,
    .sidebar-card,
    .sidebar.sidebar-shell {
        max-height: 34vh;
        padding: 10px;
    }

    .brand-v2,
    .brand {
        gap: 8px;
        min-width: 0;
    }

    .brand-logo-img,
    .brand-logo {
        width: 36px;
        height: 36px;
        flex: 0 0 36px;
    }

    .brand-title {
        font-size: 15px;
        overflow-wrap: anywhere;
    }

    .brand-subtitle,
    .eyebrow {
        font-size: 9px;
    }

    .page-title {
        font-size: 20px;
    }

    .top-header-v2 .site-nav,
    .site-nav {
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 6px;
        scroll-snap-type: x proximity;
    }

    .top-header-v2 .site-nav a,
    .top-header-v2 .site-nav .site-nav-link,
    .site-nav a,
    .site-nav .site-nav-link {
        flex: 0 0 auto;
        width: auto;
        max-width: 150px;
        min-height: 34px;
        padding: 8px 10px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        scroll-snap-align: start;
    }

    .top-header-right {
        align-items: stretch;
    }

    .voice-control {
        flex: 1 1 100%;
    }

    .terminal-clock {
        flex: 1 1 100%;
    }

    .board-premium-header,
    .weekly-boost-header,
    .odds-picks-header,
    .panel-header {
        padding: 10px 12px;
        gap: 8px;
        flex-wrap: wrap;
    }

    .panel-body,
    .fixtures-scroll {
        padding: 10px;
    }

    .fixture-compact-main,
    .compact-fixture-card.is-live-fixture .fixture-compact-main,
    .compact-fixture-card.is-ft-fixture .fixture-compact-main,
    .compact-fixture-card.is-weekly-value .fixture-compact-main,
    .compact-fixture-card.is-weekly-value.is-live-fixture .fixture-compact-main,
    .compact-fixture-card.is-weekly-value.is-ft-fixture .fixture-compact-main {
        grid-template-columns: minmax(40px, auto) minmax(0, 1fr) 42px minmax(0, 1fr);
    }

    .fixture-col-prob {
        grid-column: 1 / span 2;
        justify-self: start;
        max-width: 100%;
    }

    .fixture-col-conf {
        display: inline-flex;
        grid-column: 3 / -1;
        justify-self: end;
        max-width: 100%;
    }

    .fixture-col-actions,
    .fixture-col-fav {
        grid-column: 1 / -1;
        justify-self: end;
        display: inline-flex;
        flex-wrap: wrap;
        gap: 6px;
        max-width: 100%;
    }

    .fixture-probability,
    .fixture-confidence {
        white-space: normal;
        overflow-wrap: anywhere;
        line-height: 1.15;
    }

    .fixture-col-pick {
        justify-self: start;
        width: auto;
        max-width: 220px;
    }

    .compact-fixture-card .fixture-pick-pill,
    .compact-fixture-card.is-weekly-value .fixture-pick-pill {
        width: auto !important;
        min-width: 0;
        max-width: min(220px, 100%) !important;
        min-height: 38px;
        max-height: 44px;
        padding: 8px 12px;
        justify-content: center;
        white-space: nowrap !important;
        overflow: hidden;
        text-overflow: ellipsis;
        overflow-wrap: normal;
    }

    .fixture-col-prob,
    .fixture-col-conf {
        display: inline-flex;
        align-items: center;
        min-height: 30px;
        max-width: 100%;
    }

    .fixture-probability,
    .fixture-confidence {
        justify-content: center;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .mobile-view-analysis-btn {
        display: none;
        width: 100%;
        min-height: 34px;
        margin-top: 8px;
        border: 1px solid rgba(72, 232, 255, 0.42);
        border-radius: 8px;
        background: rgba(72, 232, 255, 0.12);
        color: var(--text);
        font-size: 12px;
        font-weight: 900;
        letter-spacing: 0.02em;
        cursor: pointer;
    }

    .compact-fixture-card.active .mobile-view-analysis-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .match-scoreboard {
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
        text-align: center;
    }

    .match-team,
    .match-team.away {
        text-align: center;
    }

    .top-pick-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .top-pick-rank {
        width: 28px;
        height: 28px;
    }

    .top-pick-head,
    .primary-terminal-head,
    .terminal-metric-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .terminal-metric-row strong {
        text-align: left;
    }
}

@media (max-width: 420px) {
    .playnaptic-app {
        padding: 6px;
    }

    .sidebar,
    .sidebar-card,
    .sidebar.sidebar-shell {
        max-height: 30vh;
        padding: 8px;
    }

    .top-header,
    .top-header-v2,
    .board-filters,
    .ax-date-switcher-wrap {
        border-radius: 8px;
        padding: 8px;
    }

    .top-header-v2 .site-nav a,
    .top-header-v2 .site-nav .site-nav-link,
    .site-nav a,
    .site-nav .site-nav-link {
        max-width: 132px;
        font-size: 11px;
    }

    .ax-pro-upgrade-btn,
    .settings-menu-toggle,
    .voice-control-btn {
        min-height: 34px;
        padding: 7px 9px;
    }

    .fixture-compact-main,
    .compact-fixture-card.is-live-fixture .fixture-compact-main,
    .compact-fixture-card.is-ft-fixture .fixture-compact-main,
    .compact-fixture-card.is-weekly-value .fixture-compact-main,
    .compact-fixture-card.is-weekly-value.is-live-fixture .fixture-compact-main,
    .compact-fixture-card.is-weekly-value.is-ft-fixture .fixture-compact-main {
        grid-template-columns: 38px minmax(0, 1fr) 38px minmax(0, 1fr);
        gap: 4px;
    }

    .fixture-col-time,
    .compact-fixture-card.is-live-fixture .fixture-col-time,
    .compact-fixture-card.is-ft-fixture .fixture-col-time,
    .compact-fixture-card.is-weekly-value .fixture-col-time {
        min-width: 38px;
        max-width: 44px;
    }

    .compact-fixture-card .fixture-score {
        width: 38px;
        font-size: 11px;
    }

    .fixture-team-logo {
        display: none;
    }

    .compact-fixture-card .team-name {
        font-size: 10.5px;
    }

    .fixture-time-status,
    .fixture-probability,
    .fixture-confidence {
        font-size: 9px;
    }

    .fixture-col-prob,
    .fixture-col-conf {
        grid-column: 1 / -1;
        justify-self: stretch;
        text-align: center;
    }

    .match-terminal-header,
    .terminal-section,
    .primary-analysis-card,
    .primary-terminal-card,
    .ai-match-analysis-card,
    .top-pick-card {
        padding: 10px;
    }
}

/* Mobile Board Compact UX */
.mobile-board-nav {
    display: none;
}

.fixture-mobile-main {
    display: none;
}

@media (max-width: 640px) {
    body,
    .playnaptic-app {
        padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px));
    }

    body.mobile-analysis-modal-open,
    body.mobile-analysis-modal-open .playnaptic-app {
        padding-bottom: 0;
    }

    .mobile-board-nav {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9000;
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 4px;
        padding: 8px 6px calc(8px + env(safe-area-inset-bottom, 0px));
        background:
            linear-gradient(180deg, rgba(8,18,34,.96), rgba(4,10,20,.99)),
            #07101f;
        border-top: 1px solid rgba(65,255,175,.18);
        box-shadow: 0 -14px 34px rgba(0,0,0,.42);
    }

    body.mobile-analysis-modal-open .mobile-board-nav {
        display: none;
    }

    .mobile-board-nav-item {
        min-width: 0;
        min-height: 44px;
        padding: 6px 3px;
        border: 1px solid rgba(120,245,205,.14);
        border-radius: 8px;
        background: rgba(9,25,42,.78);
        color: rgba(198,226,242,.78);
        font: 800 9.5px/1.1 Inter, system-ui, sans-serif;
        letter-spacing: 0;
        text-align: center;
        cursor: pointer;
        touch-action: manipulation;
    }

    .mobile-board-nav-item span {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mobile-board-nav-item.active {
        border-color: rgba(45,255,150,.52);
        background:
            linear-gradient(180deg, rgba(32,255,145,.20), rgba(18,110,85,.14)),
            rgba(8,32,32,.94);
        color: rgba(230,255,244,.98);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 0 14px rgba(30,255,150,.14);
    }

    .fixtures-board,
    .fixtures-scroll,
    .fixtures-container,
    .fixture-group-list,
    #boardFixtureList {
        padding-bottom: calc(82px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .fixture-group-block {
        gap: 12px !important;
        margin-bottom: 14px !important;
    }

    .fixture-group-header {
        margin-bottom: 4px !important;
    }

    .fixture-group-list {
        gap: 2px !important;
    }

    .fixture-group-list .compact-fixture-card:not(:last-child) {
        padding-bottom: 0 !important;
    }

    .compact-fixture-card {
        min-height: 74px !important;
        margin-bottom: 2px !important;
        padding: 6px 7px !important;
        border-radius: 7px !important;
    }

    .fixture-league-line {
        display: none !important;
    }

    .compact-fixture-card .league-badge,
    .compact-fixture-card .fixture-meta {
        max-height: 11px !important;
        font-size: 7.8px !important;
        line-height: 1 !important;
    }

    .fixture-compact-main,
    .compact-fixture-card.is-live-fixture .fixture-compact-main,
    .compact-fixture-card.is-ft-fixture .fixture-compact-main,
    .compact-fixture-card.is-weekly-value .fixture-compact-main,
    .compact-fixture-card.is-weekly-value.is-live-fixture .fixture-compact-main,
    .compact-fixture-card.is-weekly-value.is-ft-fixture .fixture-compact-main {
        display: none !important;
    }

    .fixture-mobile-main {
        display: grid !important;
        grid-template-columns: 34px minmax(0, 1fr) 38px 70px 24px !important;
        grid-template-rows: 23px 23px !important;
        column-gap: 6px !important;
        row-gap: 1px !important;
        min-height: 47px !important;
        align-items: center !important;
        overflow: hidden !important;
    }

    .fixture-mobile-status-col,
    .fixture-mobile-teams-col,
    .fixture-mobile-score-col,
    .fixture-mobile-prediction-col,
    .fixture-mobile-actions-col {
        min-width: 0 !important;
    }

    .fixture-mobile-status-col {
        display: grid !important;
        grid-template-rows: 16px 16px !important;
        align-content: center !important;
        justify-items: center !important;
        gap: 1px !important;
    }

    .fixture-mobile-teams-col {
        display: grid !important;
        grid-template-rows: 23px 23px !important;
        align-items: center !important;
        overflow: hidden !important;
    }

    .fixture-mobile-score-col {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 47px !important;
    }

    .fixture-mobile-prediction-col {
        display: grid !important;
        grid-template-rows: 27px 18px !important;
        align-content: center !important;
        justify-items: end !important;
        gap: 1px !important;
    }

    .fixture-mobile-metrics-row {
        display: grid !important;
        grid-template-rows: 14px 13px !important;
        grid-template-columns: 70px !important;
        justify-items: end !important;
        gap: 0 !important;
        min-width: 0 !important;
    }

    .fixture-mobile-actions-col {
        display: inline-grid !important;
        grid-template-rows: 24px 24px !important;
        align-content: center !important;
        justify-items: center !important;
        gap: 2px !important;
        width: 24px !important;
        min-width: 24px !important;
        min-height: 50px !important;
    }

    .fixture-mobile-actions-col .fixture-favorite-btn,
    .fixture-mobile-actions-col .fixture-mymatch-btn,
    .fixture-mobile-actions-col .fixture-alert-btn {
        width: 24px !important;
        min-width: 24px !important;
        height: 24px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .fixture-team-cell {
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    .fixture-team-cell.home {
        grid-area: home !important;
    }

    .fixture-team-cell.away {
        grid-area: away !important;
    }

    .fixture-team-logo,
    .compact-fixture-card .fixture-team-logo,
    .fixture-team-logo.fallback {
        display: inline-flex !important;
        width: 22px !important;
        min-width: 22px !important;
        height: 22px !important;
        flex: 0 0 22px !important;
        object-fit: contain !important;
    }

    .compact-fixture-card .team-name {
        min-width: 0 !important;
        font-size: 10px !important;
        line-height: 1.05 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .fixture-col-time,
    .compact-fixture-card.is-live-fixture .fixture-col-time,
    .compact-fixture-card.is-ft-fixture .fixture-col-time,
    .compact-fixture-card.is-weekly-value .fixture-col-time {
        grid-area: status-top / status-top / status-bottom / status-bottom !important;
        display: grid !important;
        grid-template-rows: 16px 16px !important;
        gap: 2px !important;
        min-width: 30px !important;
        max-width: 30px !important;
        color: rgba(255,255,255,.96) !important;
    }

    .compact-fixture-card .status-badge,
    .compact-fixture-card .fixture-time-status,
    .fixture-col-time .status-badge {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 30px !important;
        min-width: 30px !important;
        min-height: 16px !important;
        height: 16px !important;
        padding: 1px 3px !important;
        border-radius: 5px !important;
        color: rgba(255,255,255,.98) !important;
        font-size: 10px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        text-shadow: 0 1px 2px rgba(0,0,0,.74) !important;
    }

    .compact-fixture-card .fixture-score {
        grid-area: score !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 38px !important;
        min-width: 38px !important;
        height: 28px !important;
        padding: 0 !important;
        border-radius: 8px !important;
        background: linear-gradient(180deg, rgba(245,255,255,.16), rgba(110,210,235,.12)), rgba(8,28,52,.72) !important;
        border-color: rgba(180,245,255,.34) !important;
        font-size: 10.5px !important;
    }

    .compact-fixture-card .fixture-pick-pill,
    .compact-fixture-card.is-weekly-value .fixture-pick-pill {
        grid-area: pick !important;
        justify-self: end !important;
        width: 70px !important;
        min-width: 70px !important;
        max-width: 70px !important;
        min-height: 18px !important;
        height: 18px !important;
        padding: 2px 5px !important;
        border-radius: 6px !important;
        font-size: 8.2px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .fixture-probability,
    .fixture-confidence,
    .fixture-col-prob,
    .fixture-col-conf {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        justify-self: end !important;
        min-width: 0 !important;
        width: 70px !important;
        min-height: 13px !important;
        height: 13px !important;
        padding: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        font-size: 9.5px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        text-align: right !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .fixture-probability,
    .fixture-col-prob {
        grid-area: prob !important;
    }

    .fixture-confidence,
    .fixture-col-conf {
        grid-area: conf !important;
        font-size: 8.5px !important;
        font-weight: 800 !important;
        color: rgba(220, 238, 255, .74) !important;
    }

    .fixture-mobile-main .fixture-team-cell,
    .fixture-mobile-main .status-badge,
    .fixture-mobile-main .fixture-result-badge,
    .fixture-mobile-main .fixture-status-empty,
    .fixture-mobile-main .fixture-score,
    .fixture-mobile-main .fixture-pick-pill,
    .fixture-mobile-main .fixture-probability,
    .fixture-mobile-main .fixture-confidence,
    .fixture-mobile-main .fixture-mobile-actions-col {
        grid-area: auto !important;
    }

    .fixture-actions,
    .fixture-col-actions {
        display: none !important;
        justify-content: flex-end !important;
        min-width: 0 !important;
    }

    .fixture-compact-main .status-badge,
    .compact-fixture-card .status-badge,
    .compact-fixture-card .fixture-result-badge {
        min-width: 30px !important;
        width: 30px !important;
        min-height: 16px !important;
        height: 16px !important;
        padding: 1px 3px !important;
        border-radius: 5px !important;
        color: rgba(255,255,255,.98) !important;
        font-size: 10px !important;
    }

    .compact-fixture-card .fixture-result-badge {
        width: 34px !important;
        min-width: 34px !important;
        font-size: 9px !important;
    }

    .compact-fixture-card .status-badge.live {
        background: linear-gradient(180deg, rgba(255,92,100,1), rgba(185,24,48,.98)) !important;
        border-color: rgba(255,180,185,.82) !important;
        color: #fff !important;
    }

    .compact-fixture-card .status-badge.ft,
    .compact-fixture-card .status-badge.status-finished {
        background: linear-gradient(180deg, rgba(235,245,255,.22), rgba(120,145,170,.18)) !important;
        border-color: rgba(225,240,255,.42) !important;
        color: #fff !important;
    }

    .compact-fixture-card .fixture-result-badge.won {
        background: linear-gradient(180deg, rgba(40,220,105,.98), rgba(8,125,48,.96)) !important;
        border-color: rgba(120,255,175,.72) !important;
    }

    .compact-fixture-card .fixture-result-badge.lost {
        background: linear-gradient(180deg, rgba(255,70,105,.98), rgba(165,18,48,.96)) !important;
        border-color: rgba(255,145,165,.74) !important;
    }

}

/* Mobile fixture card grid rebuild - final cascade owner */
@media (max-width: 640px) {
    .fixture-group-list {
        gap: 1px !important;
    }

    .fixture-group-list .compact-fixture-card:not(:last-child) {
        margin-bottom: 1px !important;
    }

    .compact-fixture-card {
        min-height: 68px !important;
        height: 72px !important;
        padding: 5px 6px !important;
        overflow: hidden !important;
    }

    .fixture-mobile-main {
        display: grid !important;
        grid-template-columns: 32px minmax(0, 1fr) 44px 72px !important;
        grid-template-rows: 20px 20px 20px !important;
        grid-template-areas:
            "status teams score info"
            "status teams score info"
            ".      .     score info" !important;
        column-gap: 5px !important;
        row-gap: 1px !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 62px !important;
        max-height: 62px !important;
        overflow: hidden !important;
    }

    .fixture-mobile-status-col {
        grid-area: status !important;
        display: grid !important;
        grid-template-rows: 18px 18px !important;
        align-content: center !important;
        justify-items: center !important;
        gap: 2px !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    .fixture-mobile-teams-col {
        grid-area: teams !important;
        display: grid !important;
        grid-template-rows: 20px 20px !important;
        align-content: center !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    .fixture-mobile-score-col {
        grid-area: score !important;
        display: grid !important;
        place-items: center !important;
        width: 44px !important;
        min-width: 44px !important;
        height: 62px !important;
        overflow: hidden !important;
    }

    .fixture-mobile-prediction-col {
        grid-area: info !important;
        display: grid !important;
        grid-template-rows: 20px 20px 20px !important;
        grid-template-areas:
            "prob"
            "conf"
            "pick" !important;
        align-items: center !important;
        justify-items: end !important;
        width: 72px !important;
        min-width: 72px !important;
        overflow: hidden !important;
    }

    .fixture-mobile-metrics-row {
        display: contents !important;
    }

    .fixture-mobile-main .fixture-mobile-actions-col {
        display: none !important;
    }

    .fixture-mobile-main .fixture-team-cell,
    .fixture-mobile-main .status-badge,
    .fixture-mobile-main .fixture-result-badge,
    .fixture-mobile-main .fixture-status-empty,
    .fixture-mobile-main .fixture-score,
    .fixture-mobile-main .fixture-pick-pill,
    .fixture-mobile-main .fixture-probability,
    .fixture-mobile-main .fixture-confidence {
        grid-area: initial !important;
    }

    .fixture-mobile-main .fixture-team-cell.home {
        grid-row: 1 !important;
    }

    .fixture-mobile-main .fixture-team-cell.away {
        grid-row: 2 !important;
    }

    .fixture-mobile-main .fixture-team-cell {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 5px !important;
        min-width: 0 !important;
        width: 100% !important;
        overflow: hidden !important;
    }

    .fixture-mobile-main .fixture-team-logo,
    .fixture-mobile-main .fixture-team-logo.fallback {
        width: 18px !important;
        min-width: 18px !important;
        height: 18px !important;
        flex: 0 0 18px !important;
    }

    .fixture-mobile-main .team-name {
        min-width: 0 !important;
        max-width: 100% !important;
        font-size: 10.5px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .fixture-mobile-main .fixture-score {
        grid-area: initial !important;
        width: 44px !important;
        min-width: 44px !important;
        height: 24px !important;
        padding: 0 !important;
        font-size: 11px !important;
        line-height: 1 !important;
        text-align: center !important;
    }

    .fixture-mobile-main .fixture-probability {
        grid-area: prob !important;
    }

    .fixture-mobile-main .fixture-confidence {
        grid-area: conf !important;
    }

    .fixture-mobile-main .fixture-pick-pill {
        grid-area: pick !important;
    }

    .fixture-mobile-main .fixture-probability,
    .fixture-mobile-main .fixture-confidence {
        display: block !important;
        width: 72px !important;
        min-width: 72px !important;
        height: 20px !important;
        font-size: 9px !important;
        line-height: 20px !important;
        text-align: right !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .fixture-mobile-main .fixture-pick-pill,
    .compact-fixture-card.is-weekly-value .fixture-mobile-main .fixture-pick-pill {
        width: 72px !important;
        min-width: 72px !important;
        max-width: 72px !important;
        height: 18px !important;
        min-height: 18px !important;
        padding: 1px 4px !important;
        font-size: 8px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

/* ============================================================================
   PLAYNAPTIC Mobile Layout V1 — final cascade owner (frontend-only).
   Desktop (>=641px) is intentionally untouched by every rule in this section.
   ============================================================================ */

/* "Yesterday" date chip is mobile-only; hide it on tablet/desktop so the
   existing desktop date switcher renders exactly as before. */
@media (min-width: 641px) {
    .ax-date-chip-yesterday {
        display: none !important;
    }

    /* Leagues lives in the desktop sidebar; the mobile header trigger + drawer
       chrome must never render on desktop. */
    .mobile-leagues-header-btn,
    .mobile-leagues-backdrop {
        display: none !important;
    }
}

@media (max-width: 640px) {
    /* Clean coming-soon state for the Yesterday board (no fetch is made). */
    .empty-state.board-coming-soon {
        padding: 32px 16px !important;
        text-align: center;
        font-weight: 700;
        letter-spacing: .04em;
        text-transform: uppercase;
        color: rgba(198, 226, 242, .72) !important;
    }


    /* --- Continuous compact list: BetMines-style tight league-group rhythm.
       The real between-group gap came from the parent .fixtures-scroll gap (4px),
       NOT margin-bottom — collapse both so total spacing is ~1-2px. --- */
    .fixtures-scroll,
    #boardFixtureList {
        gap: 1px !important;
    }

    .fixture-group-block {
        gap: 2px !important;
        margin-bottom: 1px !important;
        padding: 0 !important;
        padding-bottom: 0 !important;
        min-height: 0 !important;
    }

    /* League header: smaller text + tighter vertical padding, minimal gap to
       the first fixture below. */
    .fixture-group-header {
        margin-bottom: 1px !important;
        padding-top: 3px !important;
        padding-bottom: 3px !important;
        font-size: 10px !important;
        gap: 6px !important;
    }

    /* ROOT-CAUSE FIX: the rule at ~9696 applies padding-bottom: 82px to EVERY
       .fixture-group-list (not just the scroll container), creating a huge blank
       area after each league's last card. Collapse it here; the 82px bottom-nav
       clearance is kept on #boardFixtureList itself (the actual scroll container),
       which this rule does not touch. */
    .fixture-group-list {
        gap: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
        min-height: 0 !important;
    }

    .fixture-group-list .compact-fixture-card:not(:last-child) {
        margin-bottom: 1px !important;
    }

    /* --- Fixture card: Playnaptic compact, target height 58-68px --- */
    .compact-fixture-card {
        min-height: 58px !important;
        height: 62px !important;
        padding: 3px 7px !important;
    }

    .fixture-mobile-main {
        grid-template-rows: 18px 18px 18px !important;
        min-height: 54px !important;
        max-height: 54px !important;
    }

    .fixture-mobile-status-col {
        grid-template-rows: 16px 16px !important;
    }

    /* --- Lighter mobile status: PLAIN TEXT ONLY, no pill/background/border ---
       Scoped under .compact-fixture-card .fixture-mobile-status-col (specificity
       0,4,0+) so it outranks the per-variant gradient pills (.compact-fixture-card
       .status-badge.live etc. = 0,3,0). Desktop (.fixture-compact-main /
       .fixture-col-time pills) is never matched, so it stays unchanged. */
    .compact-fixture-card .fixture-mobile-status-col .status-badge,
    .compact-fixture-card .fixture-mobile-status-col .status-badge.live,
    .compact-fixture-card .fixture-mobile-status-col .status-badge.ft,
    .compact-fixture-card .fixture-mobile-status-col .status-badge.status-finished,
    .compact-fixture-card .fixture-mobile-status-col .status-badge.won,
    .compact-fixture-card .fixture-mobile-status-col .status-badge.lost,
    .compact-fixture-card .fixture-mobile-status-col .fixture-time-status,
    .compact-fixture-card .fixture-mobile-status-col .fixture-result-badge,
    .compact-fixture-card .fixture-mobile-status-col .fixture-result-badge.won,
    .compact-fixture-card .fixture-mobile-status-col .fixture-result-badge.lost {
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 0 !important;
        background: none !important;
        background-color: transparent !important;
        background-image: none !important;
        border: 0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        text-shadow: none !important;
        animation: none !important;
        line-height: 16px !important;
    }

    /* Kill the pink live dot + glow (.compact-fixture-card .status-badge.live::before). */
    .compact-fixture-card .fixture-mobile-status-col .status-badge.live::before,
    .compact-fixture-card .fixture-mobile-status-col .status-badge.live::after {
        content: none !important;
        display: none !important;
        background: none !important;
        box-shadow: none !important;
    }

    /* Live minute (top row) — plain white text. */
    .compact-fixture-card .fixture-mobile-status-col .status-badge.live {
        color: #ffffff !important;
        font-weight: 700 !important;
        font-size: 10px !important;
    }

    /* "LIVE" word (bottom row) — plain green text. */
    .compact-fixture-card .fixture-mobile-status-col .status-badge.live:last-child {
        color: rgba(45, 230, 140, .96) !important;
        font-weight: 800 !important;
        font-size: 9.5px !important;
    }

    /* FT — plain compact light-grey/white text. */
    .compact-fixture-card .fixture-mobile-status-col .status-badge.ft,
    .compact-fixture-card .fixture-mobile-status-col .status-badge.status-finished {
        color: rgba(226, 238, 250, .82) !important;
        font-weight: 700 !important;
        font-size: 10px !important;
    }

    /* WON — plain green, smaller. */
    .compact-fixture-card .fixture-mobile-status-col .fixture-result-badge.won,
    .compact-fixture-card .fixture-mobile-status-col .status-badge.won {
        color: rgba(70, 230, 130, .96) !important;
        font-size: 8px !important;
        font-weight: 800 !important;
        letter-spacing: .02em !important;
        line-height: 14px !important;
    }

    /* LOST — plain red, smaller. */
    .compact-fixture-card .fixture-mobile-status-col .fixture-result-badge.lost,
    .compact-fixture-card .fixture-mobile-status-col .status-badge.lost {
        color: rgba(255, 90, 110, .96) !important;
        font-size: 8px !important;
        font-weight: 800 !important;
        letter-spacing: .02em !important;
        line-height: 14px !important;
    }

    .fixture-mobile-teams-col {
        grid-template-rows: 18px 18px !important;
    }

    .fixture-mobile-score-col {
        height: 54px !important;
    }

    /* Right column order: probability (top) -> prediction pill -> odds. */
    .fixture-mobile-prediction-col {
        grid-template-rows: 18px 18px 18px !important;
        grid-template-areas:
            "prob"
            "pick"
            "odds" !important;
    }

    /* --- Team names: cleaner, lighter, no glow for readability --- */
    .fixture-mobile-main .team-name,
    .compact-fixture-card .fixture-mobile-main .team-name {
        font-weight: 500 !important;
        font-size: 9.7px !important;
        line-height: 18px !important;
        color: rgba(223, 233, 244, .9) !important;
        text-shadow: none !important;
    }

    /* Confidence is never shown on the mobile fixture card. */
    .fixture-mobile-main .fixture-confidence,
    .fixture-mobile-main .fixture-col-conf {
        display: none !important;
    }

    /* Probability sits on top of the right column — slightly smaller and softer. */
    .fixture-mobile-main .fixture-probability {
        grid-area: prob !important;
        height: 18px !important;
        line-height: 18px !important;
        font-size: 8.5px !important;
        font-weight: 800 !important;
        color: rgba(220, 235, 250, .78) !important;
    }

    /* Score pill — slightly narrower and lower (shorter). */
    .fixture-mobile-main .fixture-score {
        width: 40px !important;
        min-width: 40px !important;
        height: 22px !important;
        font-size: 10px !important;
    }

    /* Real bookmaker odds (when available) render small, below the pill. */
    .fixture-mobile-main .fixture-mobile-odds {
        grid-area: odds !important;
        display: block !important;
        width: 72px !important;
        min-width: 72px !important;
        height: 18px !important;
        font: 700 8.5px/18px Inter, system-ui, sans-serif !important;
        text-align: right !important;
        color: rgba(150, 240, 200, .9) !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* Prediction pill — directly under probability, Playnaptic capsule. */
    .fixture-mobile-main .fixture-pick-pill,
    .compact-fixture-card.is-weekly-value .fixture-mobile-main .fixture-pick-pill {
        grid-area: pick !important;
        height: 18px !important;
        min-height: 18px !important;
        border-radius: 999px !important;
        padding: 1px 9px !important;
        font-size: 8.2px !important;
        letter-spacing: .02em !important;
    }

    /* --- Leagues drawer: the existing sidebar becomes an off-canvas drawer.
       Reuses the live sidebar DOM (saved leagues / Explore by Region / Countries /
       Leagues) so no data is duplicated. --- */
    .sidebar.sidebar-shell,
    .sidebar,
    .sidebar-card {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        width: min(86vw, 360px) !important;
        max-width: 360px !important;
        height: 100vh !important;
        max-height: 100vh !important;
        margin: 0 !important;
        border-radius: 0 16px 16px 0 !important;
        transform: translateX(-104%);
        transition: transform .28s ease;
        z-index: 9500 !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    body.mobile-leagues-open .sidebar.sidebar-shell,
    body.mobile-leagues-open .sidebar {
        transform: translateX(0) !important;
        box-shadow: 18px 0 48px rgba(0, 0, 0, .55) !important;
    }

    .ax-sidebar-leagues {
        max-height: none !important;
    }

    .mobile-leagues-backdrop {
        position: fixed;
        inset: 0;
        z-index: 9400;
        background: rgba(2, 8, 18, .62);
        opacity: 0;
        pointer-events: none;
        transition: opacity .24s ease;
    }

    body.mobile-leagues-open .mobile-leagues-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    /* Compact mobile-only Leagues trigger inside the Fixtures/Meciuri header
       (order: Leagues · Refresh · count). The floating button was removed. */
    .mobile-leagues-header-btn {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        min-height: 30px;
        padding: 5px 10px !important;
        border: 1px solid rgba(65, 255, 175, .34) !important;
        border-radius: 999px !important;
        background:
            linear-gradient(180deg, rgba(18, 60, 48, .92), rgba(8, 30, 26, .96)),
            rgba(7, 16, 31, .9) !important;
        color: rgba(224, 255, 242, .96) !important;
        font: 800 11px/1 Inter, system-ui, sans-serif !important;
        letter-spacing: .02em !important;
        touch-action: manipulation;
    }
}

/* ============================================================
   PLAYNAPTIC Responsive Repair V2
   - Desktop: full top nav, 2-row so pills never overlap title/controls.
   - Mobile/tablet (<=1024px): one nav system — top pill nav + header gear
     hidden; bottom nav primary; "More" bottom sheet for the rest + Settings.
   - Full Analysis / market tabs wrap instead of overflowing.
   - Terminal/analysis panels stay inside the viewport; landscape stays
     controlled instead of stretching.
   Additive only — overrides earlier rules via source order / specificity.
   ============================================================ */

/* Global horizontal-overflow safety */
html, body { max-width: 100%; overflow-x: hidden; }

/* ---------- Desktop/tablet-wide Header V3 (>=1025px): 2-row, premium ----------
   Row 1: title/context (left)  +  Voice/Settings/Clock/Upgrade (right).
   Row 2: full-width centered navigation band; pills wrap cleanly, never share
   the title/controls row. High specificity (.playnaptic-app .top-header.top-header-v2)
   so no earlier or server rule can force it back to a single cramped row. */
@media (min-width: 1025px) {
    .playnaptic-app .top-header.top-header-v2 {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "title controls"
            "nav   nav";
        align-items: center;
        row-gap: 18px;
        column-gap: 24px;
        padding: 20px 28px;
    }
    .playnaptic-app .top-header-v2 .top-header-left {
        grid-area: title;
        min-width: 0;
    }
    .playnaptic-app .top-header-v2 .top-header-right {
        grid-area: controls;
        min-width: 0;
        justify-self: end;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 12px;
    }
    /* Row 2: dedicated full-width navigation band, clearly separated from the
       title/controls row above by a hairline divider + generous spacing. */
    .playnaptic-app .top-header-v2 .site-nav {
        grid-area: nav;
        justify-self: stretch;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
        min-width: 0;
        max-width: 100%;
        margin-top: 4px;
        padding: 12px 16px;
        border-radius: 14px;
        border: 1px solid rgba(96, 206, 240, 0.16);
        border-top: 1px solid rgba(96, 206, 240, 0.30);
        background: linear-gradient(180deg, rgba(12, 20, 38, 0.55), rgba(8, 14, 28, 0.40));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
    }
    /* Refined, less-dominant pills so the nav reads as a calm band, not a
       cluster fighting the title. */
    .playnaptic-app .top-header-v2 .site-nav a,
    .playnaptic-app .top-header-v2 .site-nav .site-nav-link {
        white-space: nowrap;
        font-size: 12.5px;
        padding: 7px 13px;
    }
}

/* ---------- Mobile/tablet (<=1024px): single nav system ---------- */
@media (max-width: 1024px) {
    /* Hide the crowded top pill nav and the duplicate header settings gear */
    .top-header-v2 .site-nav,
    .site-nav { display: none !important; }
    .settings-menu { display: none !important; }

    /* Header collapses to title + a COMPACT controls cluster. The voice block
       is a wide desktop-only affordance; on mobile it swallowed ~310px and
       forced the title to wrap to 3 lines, so it is hidden here. Upgrade text
       and clock are compacted so the title always has room on one/two lines. */
    .top-header,
    .top-header-v2 {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas: "title controls";
        gap: 10px;
    }
    .top-header-v2 .top-header-left { grid-area: title; min-width: 0; }
    .top-header-v2 .top-header-right {
        grid-area: controls;
        min-width: 0;
        justify-self: end;
        flex-wrap: nowrap;
        gap: 8px;
    }
    .voice-control { display: none !important; }
    .top-header-v2 .page-title { font-size: clamp(17px, 5vw, 22px); }
    .top-header-v2 .eyebrow { font-size: 9.5px; }
    .terminal-clock { font-size: 11px; line-height: 1.15; }
    .ax-pro-upgrade-btn { padding: 7px 10px; }
    .ax-pro-upgrade-text { display: none; }

    /* Bottom nav = primary navigation across mobile AND tablet */
    .mobile-board-nav {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9000;
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 4px;
        padding: 8px 6px calc(8px + env(safe-area-inset-bottom, 0px));
        background:
            linear-gradient(180deg, rgba(8,18,34,.96), rgba(4,10,20,.99)),
            #07101f;
        border-top: 1px solid rgba(65,255,175,.18);
        box-shadow: 0 -14px 34px rgba(0,0,0,.42);
    }
    .mobile-board-nav-item {
        min-width: 0;
        min-height: 44px;
        padding: 6px 3px;
        border: 1px solid rgba(120,245,205,.14);
        border-radius: 8px;
        background: rgba(9,25,42,.78);
        color: rgba(198,226,242,.78);
        font: 800 9.5px/1.1 Inter, system-ui, sans-serif;
        letter-spacing: 0;
        text-align: center;
        cursor: pointer;
        touch-action: manipulation;
    }
    .mobile-board-nav-item span {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .mobile-board-nav-item.active {
        border-color: rgba(45,255,150,.52);
        background:
            linear-gradient(180deg, rgba(32,255,145,.20), rgba(18,110,85,.14)),
            rgba(8,32,32,.94);
        color: rgba(230,255,244,.98);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 0 14px rgba(30,255,150,.14);
    }

    /* Clearance so fixed bottom nav never covers content, across the range */
    body,
    .playnaptic-app { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
    body.mobile-analysis-modal-open,
    body.mobile-analysis-modal-open .playnaptic-app { padding-bottom: 0; }
    body.mobile-analysis-modal-open .mobile-board-nav { display: none; }

    /* ---- More bottom sheet ---- */
    .mobile-more-backdrop {
        position: fixed;
        inset: 0;
        z-index: 9400;
        background: rgba(2, 8, 18, 0.55);
        opacity: 0;
        transition: opacity .18s ease;
    }
    .mobile-more-backdrop.is-open { opacity: 1; }

    .mobile-more-sheet {
        position: fixed;
        left: 0;
        right: 0;
        bottom: calc(76px + env(safe-area-inset-bottom, 0px));
        z-index: 9500;
        max-height: 60vh;
        overflow-y: auto;
        padding: 10px 14px calc(14px + env(safe-area-inset-bottom, 0px));
        background:
            linear-gradient(180deg, rgba(10,22,40,.98), rgba(5,12,24,.99)),
            #07101f;
        border-top: 1px solid rgba(65,255,175,.20);
        border-radius: 16px 16px 0 0;
        box-shadow: 0 -20px 44px rgba(0,0,0,.5);
        transform: translateY(12px);
        opacity: 0;
        transition: transform .2s ease, opacity .2s ease;
    }
    .mobile-more-sheet.is-open { transform: translateY(0); opacity: 1; }
    .mobile-more-grabber {
        width: 40px;
        height: 4px;
        margin: 2px auto 10px;
        border-radius: 999px;
        background: rgba(150,180,210,.35);
    }
    .mobile-more-title {
        margin: 0 0 10px;
        font: 800 12px/1 Inter, system-ui, sans-serif;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: rgba(180,205,228,.7);
    }
    .mobile-more-list { display: grid; gap: 8px; }
    .mobile-more-item {
        display: flex;
        align-items: center;
        width: 100%;
        min-height: 48px;
        padding: 12px 14px;
        border: 1px solid rgba(120,245,205,.14);
        border-radius: 12px;
        background: rgba(9,25,42,.78);
        color: rgba(214,232,246,.92);
        font: 700 14px/1.2 Inter, system-ui, sans-serif;
        text-align: left;
        cursor: pointer;
        touch-action: manipulation;
    }
    .mobile-more-item.active {
        border-color: rgba(45,255,150,.5);
        background:
            linear-gradient(180deg, rgba(32,255,145,.18), rgba(18,110,85,.12)),
            rgba(8,32,32,.94);
        color: rgba(230,255,244,.98);
    }

    /* Settings menu shown as a mobile bottom sheet (single entry via More).
       openSettingsMenu() sets inline positioning; override it here. */
    #settingsMenuPanel:not([hidden]) {
        position: fixed !important;
        left: 12px !important;
        right: 12px !important;
        bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
        top: auto !important;
        width: auto !important;
        max-width: 420px;
        margin: 0 auto !important;
        max-height: 70vh !important;
        transform: none !important;
        z-index: 9600 !important;
    }
}

/* Sheets never render on desktop even if left open during a resize */
@media (min-width: 1025px) {
    .mobile-more-backdrop,
    .mobile-more-sheet { display: none !important; }
}
.mobile-more-backdrop[hidden],
.mobile-more-sheet[hidden] { display: none !important; }

/* ---------- Full Analysis / market tabs (#3): wrap, no overflow ---------- */
@media (max-width: 640px) {
    .analysis-terminal-tabs {
        flex-wrap: wrap !important;
        overflow-x: visible !important;
    }
    .analysis-terminal-tabs .bet-tab {
        flex: 1 1 auto;
        min-width: 0;
        white-space: normal;
    }
}
@media (max-width: 480px) {
    .analysis-terminal-tabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
    }
    .analysis-terminal-tabs .bet-tab { width: 100%; }
}

/* ---------- Terminal / analysis containment + landscape (#4) ---------- */
@media (max-width: 1024px) {
    .route-content,
    .main-column,
    .ax-terminal-premium,
    .analysis-panel,
    .analysis-market-pane,
    .match-assistant-card {
        min-width: 0;
        max-width: 100%;
        overflow-x: hidden;
    }
}
@media (max-width: 1024px) and (orientation: landscape) {
    .ax-analysis-top-row,
    .ax-analysis-under-row,
    .ax-main-insight-row {
        grid-template-columns: 1fr !important;
    }
    .route-content {
        max-width: 900px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* ============================================================
   PLAYNAPTIC UI V4 — header + navigation system (self-contained).
   New DOM (.pn-header / .pn-nav / .pn-more-menu) replaces the old
   .top-header markup, so this is a clean system, not more overrides.
   ============================================================ */

/* Legacy settings gear is never shown — Settings/Language/Odds live in More. */
.settings-menu { display: none !important; }

/* ---- Header shell ---- */
.pn-header {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px 26px;
    border-radius: var(--radius, 16px);
    background: var(--ax-glass-header, rgba(8, 16, 32, 0.60));
    border: 1px solid rgba(96, 206, 240, 0.20);
    border-bottom-color: rgba(72, 220, 255, 0.34);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.34);
}
.pn-header-primary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-width: 0;
}
.pn-identity { display: flex; align-items: center; gap: 14px; min-width: 0; }
.pn-identity-text { min-width: 0; }
.pn-identity-name {
    font-size: 15px; font-weight: 800; letter-spacing: 2.5px;
    color: #eaf4ff; line-height: 1.1;
}
.pn-identity-sub {
    font-size: 11px; font-weight: 600; letter-spacing: .4px;
    color: rgba(150, 178, 205, 0.72); margin-top: 2px;
}
.pn-daychip {
    padding: 6px 12px; border-radius: 999px;
    border: 1px solid rgba(96, 206, 240, 0.22); background: rgba(10, 18, 34, 0.50);
    font-size: 12px; font-weight: 700; color: rgba(198, 222, 244, 0.90); white-space: nowrap;
}
.pn-menu-btn {
    display: none; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 12px;
    border: 1px solid rgba(96, 206, 240, 0.24); background: rgba(10, 18, 34, 0.55);
    color: #dbeeff; font-size: 17px; cursor: pointer;
}
.pn-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; min-width: 0; }
.pn-icon-btn {
    position: relative; display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 12px;
    border: 1px solid rgba(96, 206, 240, 0.24); background: rgba(10, 18, 34, 0.55);
    color: #dbeeff; font-size: 16px; cursor: pointer;
}
.pn-notif-btn { display: none; }        /* desktop: alerts live in More; bell is mobile-only */
.pn-notif-badge { position: absolute; top: 3px; right: 3px; }
.pn-profile-btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 14px; border-radius: 999px;
    border: 1px solid rgba(96, 206, 240, 0.28); background: rgba(10, 18, 34, 0.55);
    color: #dbeeff; font-size: 13px; font-weight: 700; text-decoration: none; white-space: nowrap;
}
.pn-profile-btn:hover { border-color: rgba(72, 220, 255, 0.5); }

/* ---- Row 2: primary navigation band ---- */
.pn-nav {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px;
    padding: 10px 14px; border-radius: 14px;
    border: 1px solid rgba(96, 206, 240, 0.16);
    border-top: 1px solid rgba(96, 206, 240, 0.28);
    background: linear-gradient(180deg, rgba(12, 20, 38, 0.55), rgba(8, 14, 28, 0.40));
}
.pn-nav a,
.pn-more-btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 16px; border-radius: 10px; border: 1px solid transparent; background: transparent;
    color: rgba(190, 208, 226, 0.82); font-size: 13px; font-weight: 600;
    text-decoration: none; white-space: nowrap; cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.pn-nav a:hover,
.pn-more-btn:hover { background: rgba(79, 134, 255, 0.10); color: #eaf4ff; }
.pn-nav a.active,
.pn-more-btn.active {
    background: linear-gradient(180deg, rgba(79, 134, 255, 0.22), rgba(69, 214, 255, 0.14));
    color: #eaf4ff; box-shadow: inset 0 0 0 1px rgba(122, 170, 212, 0.30);
}
.pn-more-caret { font-size: 10px; opacity: .8; }

/* ---- Shared More menu (desktop dropdown + mobile bottom sheet) ---- */
.pn-more-backdrop {
    position: fixed; inset: 0; z-index: 9400;
    background: rgba(2, 8, 18, 0.50); opacity: 0; transition: opacity .16s ease;
}
.pn-more-backdrop.is-open { opacity: 1; }
.pn-more-menu {
    position: fixed; z-index: 9500;
    display: flex; flex-direction: column; gap: 14px;
    max-height: 70vh; overflow-y: auto; padding: 14px;
    border: 1px solid rgba(96, 206, 240, 0.22); border-radius: 16px;
    background: linear-gradient(180deg, rgba(12, 22, 42, 0.99), rgba(6, 12, 24, 0.99)), #07101f;
    box-shadow: 0 26px 60px rgba(0, 0, 0, 0.55);
    opacity: 0; transform: translateY(-6px);
    transition: opacity .16s ease, transform .16s ease;
}
.pn-more-menu.is-open { opacity: 1; transform: translateY(0); }
.pn-more-menu.is-desktop { max-width: 320px; }
.pn-more-grabber { display: none; }
.pn-more-section { display: flex; flex-direction: column; gap: 8px; }
.pn-more-heading {
    font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
    color: rgba(150, 178, 205, 0.66);
}
.pn-more-list { display: flex; flex-direction: column; gap: 4px; }
.pn-more-item {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    width: 100%; padding: 10px 12px; border: 1px solid transparent; border-radius: 10px;
    background: transparent; color: rgba(206, 224, 242, 0.90);
    font-size: 13.5px; font-weight: 600; text-align: left; cursor: pointer;
}
.pn-more-item:hover { background: rgba(79, 134, 255, 0.10); color: #eaf4ff; }
.pn-more-item.active {
    background: linear-gradient(180deg, rgba(79, 134, 255, 0.20), rgba(69, 214, 255, 0.12));
    color: #eaf4ff; box-shadow: inset 0 0 0 1px rgba(122, 170, 212, 0.28);
}
.pn-more-options { display: flex; flex-wrap: wrap; gap: 6px; }
.pn-more-option {
    padding: 7px 12px; border-radius: 999px;
    border: 1px solid rgba(96, 206, 240, 0.24); background: rgba(10, 18, 34, 0.50);
    color: rgba(198, 222, 244, 0.85); font-size: 12px; font-weight: 700; cursor: pointer;
}
.pn-more-option.is-active {
    border-color: rgba(72, 220, 255, 0.6);
    background: linear-gradient(135deg, rgba(34, 211, 238, 0.90), rgba(103, 232, 249, 0.85));
    color: #04121a;
}
/* Performance already sits in the desktop nav -> hide it in the desktop More list. */
@media (min-width: 1025px) {
    .pn-more-menu.is-desktop .pn-more-perf { display: none; }
}

/* ---- Mobile / tablet (<=1024px): one nav system ---- */
@media (max-width: 1024px) {
    .pn-header { padding: 12px 14px; gap: 10px; }
    .pn-nav { display: none; }                 /* NO top navigation */
    .pn-notif-btn { display: inline-flex; }     /* notifications bell */
    /* Mobile header = hamburger + Playnaptic + notifications + profile ONLY. */
    .voice-control,
    .terminal-clock,
    .pn-daychip,
    .pn-identity-sub,
    .pn-upgrade-btn { display: none !important; }
    .pn-identity-name { font-size: 15px; letter-spacing: 1.5px; }
    .pn-actions { gap: 8px; }
    .pn-profile-btn { padding: 8px 12px; }

    /* 5-item bottom nav (Matches / Live / Top Picks / Elite / More). */
    .mobile-board-nav { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }

    /* More as a bottom sheet sitting above the fixed bottom nav. */
    .pn-more-menu {
        left: 0 !important; right: 0 !important; top: auto !important;
        bottom: calc(76px + env(safe-area-inset-bottom, 0px));
        width: auto !important; max-width: none; max-height: 62vh;
        border-radius: 18px 18px 0 0; transform: translateY(14px);
    }
    .pn-more-menu.is-open { transform: translateY(0); }
    .pn-more-grabber {
        display: block; width: 40px; height: 4px; margin: 0 auto 4px;
        border-radius: 999px; background: rgba(150, 180, 210, 0.35);
    }

    /* Analysis containment — nothing escapes the viewport width. */
    .ax-terminal-premium,
    .analysis-panel,
    [class*="ax-analysis"],
    [class*="ax-market"] {
        min-width: 0 !important; max-width: 100% !important;
    }
    .ax-terminal-premium { overflow-x: hidden; }
}

/* Hamburger opens the off-canvas leagues drawer, which only exists on phones
   (<=640px). On tablets (641-1024px) the sidebar is inline, so no hamburger. */
@media (max-width: 640px) {
    .pn-menu-btn { display: inline-flex; }
}

/* ============================================================
   PLAYNAPTIC UI V4.1 — mobile/tablet polish (desktop untouched).
   ============================================================ */

/* (1) Portrait mobile/tablet: bring back a compact date (left) and clock (right).
   They live in separate flex zones (.pn-identity vs .pn-actions) so they can
   never overlap. Portrait only — landscape stays minimal, desktop untouched. */
@media (max-width: 1024px) and (orientation: portrait) {
    .pn-header-primary { flex-wrap: nowrap; align-items: center; }
    /* Brand stays visible; the date sits on a compact second line under it, so it
       never steals horizontal room from PLAYNAPTIC. Hamburger spans both rows. */
    .pn-identity {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas: "menu name" "menu day";
        align-items: center; column-gap: 8px; row-gap: 1px; min-width: 0;
    }
    .pn-menu-btn { grid-area: menu; }
    .pn-identity-text { grid-area: name; min-width: 0; }
    .pn-identity-name { font-size: 13px; letter-spacing: 1px; white-space: nowrap; }
    .pn-daychip {
        grid-area: day; justify-self: start;
        display: inline-flex !important; align-items: center;
        padding: 3px 8px; font-size: 10px; letter-spacing: 0; white-space: nowrap;
    }
    /* Override old top-header rules that forced .terminal-clock to flex 1 1 100%. */
    .pn-actions .terminal-clock {
        display: block !important;
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
        font-size: 11px; line-height: 1; text-align: right;
        color: rgba(198, 222, 244, 0.90); font-variant-numeric: tabular-nums;
    }
    .pn-actions { gap: 8px; flex-shrink: 0; }
    .pn-profile-btn { padding: 7px 10px; font-size: 12px; }
    .pn-icon-btn { width: 36px; height: 36px; }
}

/* (2) Full Analysis tabs on phones. */
@media (max-width: 640px) {
    /* Primary tabs (Analysis / Full Analysis / Stats / H2H) — compact single row. */
    .analysis-primary-tabs {
        display: flex !important; flex-wrap: wrap; gap: 4px !important; overflow: visible !important;
    }
    .analysis-primary-tabs .bet-tab,
    .analysis-primary-tabs .analysis-market-tab {
        flex: 1 1 auto; min-width: 0; white-space: nowrap;
        height: auto !important; min-height: 30px !important;
        padding: 6px 8px !important; font-size: 10.5px !important;
    }
    /* Full Analysis internal sub-tabs: hidden unless primary tab is Full Analysis. */
    .analysis-market-subtab-row.hidden {
        display: none !important;
    }
    /* Secondary market tabs (1X2 / Double Chance / Goals / BTTS / ...) — compact
       2-column grid, text wraps, never overflows horizontally. */
    .analysis-secondary-tabs,
    .analysis-market-subtab-row:not(.hidden),
    .odds-analysis-subtabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
        overflow-x: hidden !important;
    }
    .analysis-secondary-tabs .bet-tab,
    .analysis-market-subtab-row .bet-tab,
    .odds-analysis-subtabs .bet-tab,
    .analysis-secondary-tabs .analysis-market-tab {
        width: 100%; min-width: 0; white-space: normal !important; text-align: center;
        height: auto !important; min-height: 32px; line-height: 1.15;
        padding: 6px 8px !important; font-size: 10.5px !important;
    }
}

/* (3) Match detail / analysis containment on mobile+tablet — nothing escapes the
   viewport width; wide children are clipped rather than pushing the page. */
@media (max-width: 1024px) {
    .ax-terminal-premium,
    .match-terminal,
    .analysis-panel,
    .analysis-market-pane,
    [data-analysis-pane],
    .match-assistant-card,
    .fixture-topline,
    .primary-terminal-badges {
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }
}

/* (5) Landscape mobile/tablet: constrain the analysis/prediction card to a
   controlled, centered max-width instead of stretching full screen. */
@media (max-width: 1024px) and (orientation: landscape) {
    .ax-terminal-premium,
    .match-terminal,
    .analysis-panel,
    .analysis-market-pane,
    [data-analysis-pane] {
        max-width: 620px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* ============================================================
   PLAYNAPTIC UI V4.2 — phone header rebuild (<=640px).
   Real-device screenshots showed the desktop-style header still crowding
   on phones (voice block, floating crown, clock colliding with the date).
   On phones the top bar is stripped to: hamburger + [PLAYNAPTIC / small date]
   on the left, and a small live clock on the right. Everything else (voice,
   upgrade, notifications, profile) is removed — the bottom nav handles all
   navigation. Placed LAST so it wins over the tablet/portrait rules above.
   ============================================================ */
@media (max-width: 640px) {
    /* Remove everything that caused the crowding / overlap. */
    .pn-header .voice-control,
    .pn-header .pn-upgrade-btn,
    .pn-header .pn-notif-btn,
    .pn-header .pn-profile-btn,
    .pn-header .pn-identity-sub,
    .pn-header #navMyMatchesBadge,
    .pn-header .settings-menu {
        display: none !important;
    }

    .pn-header { padding: 10px 12px !important; gap: 6px !important; }
    .pn-header-primary { align-items: center; gap: 10px; flex-wrap: nowrap; }

    /* Left: hamburger + [PLAYNAPTIC / compact date]. Hamburger spans both rows. */
    .pn-header .pn-identity {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas: "menu name" "menu day";
        column-gap: 8px; row-gap: 0; align-items: center; min-width: 0;
    }
    .pn-header .pn-menu-btn { grid-area: menu; width: 36px; height: 36px; }
    .pn-header .pn-identity-text { grid-area: name; min-width: 0; }
    .pn-header .pn-identity-name {
        font-size: 14px !important; letter-spacing: 1px; white-space: nowrap;
    }
    .pn-header .pn-daychip {
        grid-area: day !important; justify-self: start;
        display: inline-flex !important; align-items: center;
        padding: 0 !important; margin: 0 !important; border: 0 !important;
        background: transparent !important; box-shadow: none !important;
        font-size: 10.5px !important; font-weight: 600 !important;
        color: rgba(160, 185, 210, 0.85) !important; white-space: nowrap;
    }

    /* Right: only the small live clock. */
    .pn-header .pn-actions {
        display: flex !important; align-items: center; justify-content: flex-end;
        gap: 0 !important; flex: 0 0 auto; min-width: 0;
    }
    .pn-header .pn-actions .terminal-clock {
        display: block !important; flex: 0 0 auto !important;
        width: auto !important; max-width: none !important;
        font-size: 11px !important; line-height: 1; text-align: right;
        color: rgba(198, 222, 244, 0.90) !important; font-variant-numeric: tabular-nums;
    }
}

/* ============================================================
   PLAYNAPTIC UI V4.3 — professional mobile/tablet system.
   Authoritative <=1024px layer: consolidated compact header,
   Leagues moved off-page into an off-canvas drawer (opened from
   More -> Leagues), profile icon, 6-item bottom nav.
   ============================================================ */
@media (max-width: 1024px) {
    /* ---- Header: [PLAYNAPTIC / small date] left, clock + profile icon right. ---- */
    .pn-header .voice-control,
    .pn-header .pn-upgrade-btn,
    .pn-header .pn-notif-btn,
    .pn-header .pn-identity-sub,
    .pn-header .pn-menu-btn,
    .pn-header .settings-menu,
    .pn-header #navMyMatchesBadge { display: none !important; }

    .pn-header { padding: 10px 14px !important; gap: 8px !important; }
    .pn-header-primary { align-items: center; gap: 10px; flex-wrap: nowrap; }

    .pn-header .pn-identity {
        display: flex !important; flex-direction: column; align-items: flex-start;
        gap: 0; min-width: 0;
    }
    .pn-header .pn-identity-text { min-width: 0; }
    .pn-header .pn-identity-name {
        font-size: 15px !important; letter-spacing: 1px; white-space: nowrap;
    }
    .pn-header .pn-daychip {
        display: inline-flex !important; padding: 0 !important; margin: 1px 0 0 !important;
        border: 0 !important; background: transparent !important; box-shadow: none !important;
        font-size: 10.5px !important; font-weight: 600 !important;
        color: rgba(160, 185, 210, 0.85) !important; white-space: nowrap;
    }
    .pn-header .pn-actions {
        display: flex !important; align-items: center; justify-content: flex-end;
        gap: 12px !important; flex: 0 0 auto; min-width: 0;
    }
    .pn-header .pn-actions .terminal-clock {
        display: block !important; flex: 0 0 auto !important; width: auto !important;
        max-width: none !important; font-size: 12px !important; line-height: 1; text-align: right;
        color: rgba(198, 222, 244, 0.90) !important; font-variant-numeric: tabular-nums;
    }
    /* Profile becomes a compact icon button -> opens #/login (account page). */
    .pn-header .pn-profile-btn {
        display: inline-flex !important; align-items: center; justify-content: center;
        width: 38px; height: 38px; padding: 0 !important; border-radius: 999px;
        font-size: 0 !important; overflow: hidden; flex: 0 0 auto;
    }
    .pn-header .pn-profile-btn::before { content: "\1F464"; font-size: 18px; line-height: 1; }
    .pn-header .pn-profile-btn.is-authed { border-color: rgba(45, 255, 150, 0.55) !important; }

    /* ---- Desktop sidebar removed from the page flow; it becomes an off-canvas
       Leagues filter drawer (Favorites / Explore by region / searchable list). ---- */
    .playnaptic-app { grid-template-columns: minmax(0, 1fr) !important; }
    .sidebar,
    .sidebar.sidebar-shell {
        position: fixed !important; top: 0 !important; left: 0 !important; bottom: 0 !important;
        width: min(88vw, 380px) !important; max-width: 380px !important;
        height: 100vh !important; max-height: 100vh !important; margin: 0 !important;
        border-radius: 0 16px 16px 0 !important;
        transform: translateX(-104%); transition: transform .28s ease;
        z-index: 9600 !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch;
    }
    body.mobile-leagues-open .sidebar,
    body.mobile-leagues-open .sidebar.sidebar-shell {
        transform: translateX(0) !important; box-shadow: 18px 0 48px rgba(0, 0, 0, 0.55) !important;
    }
    .mobile-leagues-backdrop {
        position: fixed; inset: 0; z-index: 9550;
        background: rgba(2, 8, 18, 0.62); opacity: 0; pointer-events: none; transition: opacity .24s ease;
    }
    body.mobile-leagues-open .mobile-leagues-backdrop { opacity: 1; pointer-events: auto; }
    .mobile-leagues-close {
        display: inline-flex; align-items: center; justify-content: center;
        width: 34px; height: 34px; margin: 8px 8px 0 auto;
        border-radius: 999px; border: 1px solid rgba(120, 245, 205, 0.24);
        background: rgba(9, 25, 42, 0.9); color: #dbeeff; font-size: 15px; cursor: pointer;
    }

    /* ---- 6-item bottom nav. ---- */
    .mobile-board-nav { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
}

/* The Leagues close button only exists on mobile/tablet. */
@media (min-width: 1025px) { .mobile-leagues-close { display: none !important; } }

/* Fully remove the More menu when closed (its display:flex was overriding the
   [hidden] attribute, leaving an invisible layer that could intercept taps). */
.pn-more-menu[hidden] { display: none !important; }

/* ============================================================
   PLAYNAPTIC Mobile Leagues Selector V2 (<=1024px).
   Native full-screen league filter. The desktop sidebar is removed
   from the page; its Favorites + regions/countries/leagues block is
   moved into this sheet on open (see setMobileLeaguesDrawerOpen).
   Desktop (>=1025px) is untouched.
   ============================================================ */
@media (max-width: 1024px) {
    /* Desktop sidebar fully out of the mobile layout (content lives in the sheet). */
    .sidebar,
    .sidebar.sidebar-shell { display: none !important; }
    .playnaptic-app { grid-template-columns: minmax(0, 1fr) !important; }

    .mobile-league-backdrop {
        position: fixed; inset: 0; z-index: 9700;
        background: rgba(2, 8, 18, 0.66); opacity: 0; transition: opacity .2s ease;
    }
    .mobile-league-backdrop.is-open { opacity: 1; }

    .mobile-league-selector {
        position: fixed; z-index: 9750;
        left: 0; right: 0; bottom: 0;
        top: max(20px, env(safe-area-inset-top, 0px));
        display: flex; flex-direction: column; min-height: 0;
        background:
            linear-gradient(180deg, rgba(10, 20, 38, 0.99), rgba(5, 11, 22, 0.99)),
            #07101f;
        border-top: 1px solid rgba(96, 206, 240, 0.28);
        border-radius: 18px 18px 0 0;
        box-shadow: 0 -24px 60px rgba(0, 0, 0, 0.55);
        transform: translateY(16px); opacity: 0;
        transition: transform .22s ease, opacity .22s ease;
    }
    .mobile-league-selector.is-open { transform: translateY(0); opacity: 1; }

    .mls-header {
        flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px;
        padding: 16px 18px 10px; border-bottom: 1px solid rgba(96, 206, 240, 0.14);
    }
    .mls-title { font-size: 18px; font-weight: 800; color: #eaf4ff; letter-spacing: .3px; }
    .mls-subtitle { font-size: 12px; color: rgba(160, 185, 210, 0.75); margin-top: 2px; }
    .mls-close {
        flex: 0 0 auto; width: 38px; height: 38px; border-radius: 999px;
        border: 1px solid rgba(120, 245, 205, 0.24); background: rgba(9, 25, 42, 0.9);
        color: #dbeeff; font-size: 16px; cursor: pointer;
    }
    .mls-search { flex: 0 0 auto; padding: 12px 18px; }
    .mls-search input {
        width: 100%; box-sizing: border-box; padding: 12px 14px; border-radius: 12px;
        border: 1px solid rgba(96, 206, 240, 0.24); background: rgba(8, 16, 30, 0.7);
        color: #eaf4ff; font-size: 14px;
    }
    .mls-body {
        flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
        padding: 6px 14px calc(88px + env(safe-area-inset-bottom, 0px));
    }

    /* Moved content must flow naturally — kill the inner fixed-height scroll areas
       that made the old drawer feel cramped / clipped lower regions. */
    #mobileLeagueBody .ax-sidebar-leagues,
    #mobileLeagueBody .ax-section,
    #mobileLeagueBody .sidebar-scroll,
    #mobileLeagueBody .ax-fav-leagues,
    #mobileLeagueBody .ax-country-list,
    #mobileLeagueBody .ax-sidebar-leagues .ax-sidebar {
        max-height: none !important; height: auto !important; overflow: visible !important;
    }
    #mobileLeagueBody .ax-leagues-heading { display: none; } /* the sheet has its own title */

    /* While searching, force every region/country expanded so matches are visible. */
    #mobileLeagueBody.mls-searching .ax-continent-block,
    #mobileLeagueBody.mls-searching .ax-country-block { }
    #mobileLeagueBody.mls-searching .ax-continent-countries,
    #mobileLeagueBody.mls-searching .ax-country-leagues {
        display: block !important; max-height: none !important; overflow: visible !important;
        grid-template-rows: 1fr !important;
    }
}

/* Selector never renders on desktop; fully hidden when closed. */
@media (min-width: 1025px) {
    .mobile-league-backdrop,
    .mobile-league-selector { display: none !important; }
}
.mobile-league-selector[hidden],
.mobile-league-backdrop[hidden] { display: none !important; }