
:root{
    --vx-premium-bg:#071421;
    --vx-premium-panel:#0b1c2d;
    --vx-premium-panel-2:#102338;
    --vx-premium-border:rgba(103,232,249,.14);

    --vx-premium-text:#f1f5f9;
    --vx-premium-muted:#94a3b8;

    --vx-premium-cyan:#22d3ee;
    --vx-premium-blue:#0ea5e9;

    --vx-premium-shadow:
        0 18px 50px rgba(0,0,0,.38);

    --vx-premium-glow:
        0 0 0 1px rgba(34,211,238,.14),
        0 18px 50px rgba(0,0,0,.45);
}

html[data-theme="dark"] body{
    background:
        radial-gradient(circle at top left,
            rgba(34,211,238,.10),
            transparent 30%),
        linear-gradient(
            180deg,
            #071421 0%,
            #081726 45%,
            #06131f 100%
        );
}

.js-visionx-page{
    max-width:1680px;
    margin:0 auto;
}

.visionx-card,
.visionx-status-card{
    background:
        linear-gradient(
            180deg,
            rgba(16,35,56,.94),
            rgba(10,24,39,.96)
        );

    border:1px solid var(--vx-premium-border);

    border-radius:20px;

    box-shadow:var(--vx-premium-shadow);

    overflow:hidden;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.visionx-card:hover{
    transform:translateY(-2px);

    border-color:rgba(34,211,238,.34);

    box-shadow:var(--vx-premium-glow);
}

.visionx-card h1,
.visionx-card h2,
.visionx-card h3,
.visionx-card h4{
    color:#f8fafc;
    letter-spacing:-0.02em;
}

.visionx-subtext,
.text-muted{
    color:var(--vx-premium-muted)!important;
}

.btn-primary{
    background:
        linear-gradient(
            135deg,
            #22d3ee,
            #0ea5e9
        );

    border:none;

    color:#03131d;

    font-weight:800;

    border-radius:12px;

    box-shadow:
        0 10px 25px rgba(14,165,233,.35);
}

.visionx-leaderboard-table tbody tr{
    transition:
        transform .15s ease,
        background .15s ease;
}

.visionx-leaderboard-table tbody tr:hover{
    transform:scale(1.01);

    background:
        rgba(34,211,238,.04);
}


/* ===== SPACING CLEANUP ===== */

.js-visionx-page{
    padding-top:18px;
    padding-bottom:40px;
}

.visionx-card,
.visionx-status-card{
    padding:18px;
    margin-bottom:18px;
}

/* SECTION HEADERS */

.visionx-card h1{
    font-size:52px;
    font-weight:800;
    line-height:1.02;
}

.visionx-card h2{
    font-size:34px;
    font-weight:800;
}

.visionx-card h3{
    font-size:24px;
    font-weight:700;
}

.visionx-card h4{
    font-size:18px;
    font-weight:700;
}

/* BODY TEXT */

.visionx-card p,
.visionx-card span,
.visionx-card td{
    line-height:1.45;
}

/* TABLE CLEANUP */

html[data-theme="dark"] .js-visionx-page table{
    border-collapse:collapse!important;
}

html[data-theme="dark"] .js-visionx-page table th{
    font-size:12px;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#94a3b8;
}

html[data-theme="dark"] .js-visionx-page table td{
    padding-top:16px!important;
    padding-bottom:16px!important;
}

/* COMPETITION CARDS */

.visionx-competition-card{
    border-radius:22px;
    overflow:hidden;
}

/* BUTTONS */

html[data-theme="dark"] .js-visionx-page .btn,
html[data-theme="dark"] .js-visionx-page button{
    min-height:44px;
    font-weight:700;
}

/* STATUS BADGES */

.badge{
    border-radius:999px;
    padding:6px 10px;
    font-weight:700;
}

/* PROGRESS */

.progress{
    height:10px;
    border-radius:999px;
    overflow:hidden;
}

/* ARCHIVE CARDS */

.visionx-archive-card{
    min-height:260px;
}

/* LEADERBOARD */

.visionx-leaderboard-table td{
    vertical-align:middle;
}

/* TOP HERO */

.visionx-hero,
.visionx-page-hero{
    padding:36px;
    border-radius:28px;
}


/* ===== PREMIUM LEADERBOARD POLISH ===== */

.visionx-leaderboard-table-wrap{
    border-radius:22px;
    overflow:hidden;
    background:rgba(7,20,33,.55);
    border:1px solid rgba(103,232,249,.10);
}

.visionx-leaderboard-table thead th{
    background:rgba(15,35,56,.92)!important;
    color:#93c5fd!important;
    font-size:11px;
    letter-spacing:.10em;
    text-transform:uppercase;
    border-bottom:1px solid rgba(103,232,249,.14)!important;
}

.visionx-leaderboard-table tbody td{
    background:rgba(8,24,39,.72)!important;
    border-bottom:1px solid rgba(148,163,184,.08)!important;
}

.visionx-rank-pill{
    min-width:54px;
    justify-content:center;
    background:rgba(15,35,56,.92)!important;
    border:1px solid rgba(103,232,249,.18)!important;
    box-shadow:0 8px 22px rgba(0,0,0,.25);
}

.visionx-leaderboard-top-1 td{
    background:
        linear-gradient(90deg, rgba(250,204,21,.13), rgba(8,24,39,.78))!important;
}

.visionx-leaderboard-top-2 td{
    background:
        linear-gradient(90deg, rgba(203,213,225,.12), rgba(8,24,39,.78))!important;
}

.visionx-leaderboard-top-3 td{
    background:
        linear-gradient(90deg, rgba(251,146,60,.12), rgba(8,24,39,.78))!important;
}

.visionx-leaderboard-current-user td{
    background:
        linear-gradient(90deg, rgba(34,211,238,.16), rgba(8,24,39,.82))!important;
    border-top:1px solid rgba(34,211,238,.32)!important;
    border-bottom:1px solid rgba(34,211,238,.32)!important;
}

.visionx-rank-live{
    background:rgba(34,211,238,.12);
    color:#67e8f9;
    border:1px solid rgba(34,211,238,.25);
    border-radius:999px;
    padding:3px 8px;
    font-size:11px;
    font-weight:800;
}

.visionx-pick-badge{
    background:rgba(15,35,56,.85)!important;
    border:1px solid rgba(103,232,249,.14)!important;
    color:#dbeafe!important;
}


/* ===== COMPACT LEADERBOARD ===== */

.visionx-leaderboard-table td{
    padding-top:12px!important;
    padding-bottom:12px!important;
    font-size:14px;
}

.visionx-leaderboard-table th{
    padding-top:12px!important;
    padding-bottom:12px!important;
}

.visionx-leaderboard-table img{
    width:42px!important;
    height:42px!important;
}

.visionx-pick-badge{
    padding:4px 8px!important;
    font-size:11px!important;
}

.visionx-rank-pill{
    min-height:42px;
}

.visionx-leaderboard-table .badge{
    font-size:11px;
}

.visionx-leaderboard-table-wrap{
    backdrop-filter:blur(10px);
}

/* LIVE PULSE */

@keyframes vxPulse{
    0%{
        box-shadow:0 0 0 0 rgba(34,211,238,.55);
    }

    70%{
        box-shadow:0 0 0 10px rgba(34,211,238,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(34,211,238,0);
    }
}

.visionx-live-dot,
.badge-live,
.status-live{
    animation:vxPulse 2s infinite;
}


/* ===== COMPACT TOP DASHBOARD ===== */

.visionx-hero{
    padding:26px!important;
    min-height:auto!important;
}

.visionx-hero h1{
    font-size:38px!important;
    margin-bottom:8px!important;
}

.visionx-hero p{
    font-size:15px!important;
    margin-bottom:0!important;
}

.visionx-card .card-header{
    padding:16px 18px!important;
}

.visionx-card .card-body{
    padding:18px!important;
}

.visionx-status-card .card-body{
    padding:18px!important;
}

.visionx-card .card-header{
    padding:18px 18px 12px!important;
}

.visionx-card .card-header .visionx-section-header{
    margin-bottom:0!important;
}

.visionx-card .card-header .visionx-switchbar{
    margin-top:10px!important;
    margin-bottom:0!important;
}

.visionx-card .card-header .visionx-switchbar button{
    padding:8px 14px!important;
    font-size:13px!important;
}


.visionx-switchbar{
    margin-bottom:18px!important;
}

.visionx-switchbar-item{
    padding:18px 14px!important;
}

.visionx-switchbar-item-title{
    font-size:18px!important;
}

.visionx-switchbar-item-sub{
    font-size:13px!important;
}

.visionx-section-header{
    margin-bottom:14px!important;
}

.visionx-section-title{
    margin-bottom:6px!important;
}

.visionx-section-subtitle{
    margin-bottom:0!important;
}

.visionx-archive-card{
    min-height:220px;
}


/* ===== STICKY SIDEBAR LAYOUT ===== */

@media (min-width: 1200px){

    .visionx-sidebar-card{
        position:sticky;
        top:110px;
        z-index:20;
    }

    .visionx-sidebar-card + .visionx-sidebar-card{
        margin-top:18px;
    }
}

/* SIDEBAR PREMIUM LOOK */

.visionx-sidebar-card{
    border-radius:24px!important;

    background:
        linear-gradient(
            180deg,
            rgba(12,28,45,.96),
            rgba(7,20,33,.98)
        )!important;

    border:1px solid rgba(34,211,238,.14)!important;

    box-shadow:
        0 20px 50px rgba(0,0,0,.32);
}

.visionx-sidebar-card .visionx-value{
    font-weight:700;
}

.visionx-sidebar-card .btn-primary{
    min-height:52px;
    font-size:16px;
    letter-spacing:.01em;
}

/* FEATURED STRIP */

.visionx-featured-action-strip{
    align-items:center!important;
}

/* FEATURED STATS */

.visionx-stat-card{
    border-radius:18px;

    background:
        linear-gradient(
            180deg,
            rgba(15,35,56,.78),
            rgba(8,24,39,.88)
        );

    border:1px solid rgba(103,232,249,.10);

    padding:18px;
}

.visionx-stat-card .visionx-label{
    color:#94a3b8;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.visionx-stat-card .visionx-value{
    font-weight:700;
}


/* ===== LIVE LEADERBOARD EMPHASIS ===== */

.visionx-leaderboard-table tbody tr{
    position:relative;
}

.visionx-leaderboard-table tbody tr:hover{
    transform:translateY(-1px) scale(1.005);

    box-shadow:
        inset 0 0 0 1px rgba(34,211,238,.10);
}

/* TOP PLAYER */

.visionx-leaderboard-table tbody tr:first-child td{
    background:
        linear-gradient(
            90deg,
            rgba(250,204,21,.10),
            rgba(8,24,39,.82)
        )!important;
}

/* CURRENT USER */

.visionx-leaderboard-current-user td{
    position:relative;

    background:
        linear-gradient(
            90deg,
            rgba(34,211,238,.12),
            rgba(8,24,39,.84)
        )!important;
}

/* LIVE RESULT BADGE */

.badge-live,
.status-live{
    box-shadow:
        0 0 18px rgba(34,211,238,.35);
}

/* SCORE COLORS */

.visionx-positive-score{
    box-shadow:
        0 0 16px rgba(34,197,94,.20);
}

.visionx-negative-score{
    box-shadow:
        0 0 16px rgba(239,68,68,.18);
}


/* ===== LIGHT MODE SAFETY OVERRIDES ===== */

html:not([data-theme="dark"]) .js-visionx-page .visionx-card,
html:not([data-theme="dark"]) .js-visionx-page .visionx-status-card,
html:not([data-theme="dark"]) .js-visionx-page .visionx-sidebar-card{
    background:#ffffff!important;
    color:#0f172a!important;
    border:1px solid rgba(15,23,42,.08)!important;
    box-shadow:0 10px 30px rgba(15,23,42,.08)!important;
}

html:not([data-theme="dark"]) .js-visionx-page .visionx-sidebar-card *,
html:not([data-theme="dark"]) .js-visionx-page .visionx-card *,
html:not([data-theme="dark"]) .js-visionx-page .visionx-status-card *{
    color:inherit;
}

html:not([data-theme="dark"]) .js-visionx-page .text-muted,
html:not([data-theme="dark"]) .js-visionx-page .visionx-subtext,
html:not([data-theme="dark"]) .js-visionx-page .visionx-label{
    color:#64748b!important;
}

html:not([data-theme="dark"]) .js-visionx-page .visionx-value,
html:not([data-theme="dark"]) .js-visionx-page .visionx-section-title{
    color:#0f172a!important;
}

html:not([data-theme="dark"]) .js-visionx-page .visionx-leaderboard-table tbody td,
html:not([data-theme="dark"]) .js-visionx-page .visionx-leaderboard-table tbody tr:first-child td,
html:not([data-theme="dark"]) .js-visionx-page .visionx-leaderboard-current-user td{
    background:#ffffff!important;
    color:#0f172a!important;
    border-bottom:1px solid rgba(15,23,42,.08)!important;
}

html:not([data-theme="dark"]) .js-visionx-page .visionx-leaderboard-table thead th{
    background:#f8fafc!important;
    color:#334155!important;
}

html:not([data-theme="dark"]) .js-visionx-page .visionx-leaderboard-table-wrap{
    background:#ffffff!important;
    border:1px solid rgba(15,23,42,.08)!important;
}

html:not([data-theme="dark"]) .js-visionx-page .visionx-stat-card{
    background:#ffffff!important;
    border:1px solid rgba(15,23,42,.08)!important;
}

html:not([data-theme="dark"]) .js-visionx-page .visionx-pick-badge{
    background:#eaf2ff!important;
    color:#1e293b!important;
    border:1px solid rgba(13,110,253,.16)!important;
}


/* ===== LIGHT MODE RANK READABILITY FIX ===== */

html:not([data-theme="dark"]) .js-visionx-page .visionx-rank-pill{
    min-width:86px!important;
    gap:8px;
    background:#ffffff!important;
    color:#0f172a!important;
    border:1px solid rgba(15,23,42,.10)!important;
    box-shadow:0 10px 24px rgba(15,23,42,.10)!important;
}

html:not([data-theme="dark"]) .js-visionx-page .visionx-rank-number{
    color:#0f172a!important;
    font-weight:800;
}

.visionx-featured-round-copy {
    max-width: 720px;
}


.visionx-featured-action-strip{
    margin-bottom:32px!important;
}

.visionx-featured-round-copy{
    font-size:1.05rem;
    line-height:1.7;
    color:#cbd5e1;
}

.visionx-stat-card{
    min-height:118px;
    transition:transform .18s ease,box-shadow .18s ease;
}

.visionx-stat-card:hover{
    transform:translateY(-3px);
    box-shadow:0 18px 36px rgba(0,0,0,.28);
}

.visionx-stat-card .visionx-value{
    font-size:1.35rem;
    font-weight:800;
    margin-top:6px;
}


.visionx-round-progress-fill {
    background: linear-gradient(
        90deg,
        #3b82f6 0%,
        #06b6d4 50%,
        #10b981 100%
    );
}
