/*
 * NOVA PLAY visual system
 * Presentation-only layer. No PHP, form behavior or game logic is changed.
 */
:root {
    --theme-ink: #f7f7fb;
    --theme-muted: #a9aec2;
    --theme-bg: #070817;
    --theme-bg-deep: #0b0b1d;
    --theme-surface: rgba(18, 18, 43, 0.84);
    --theme-surface-solid: #12122b;
    --theme-surface-soft: rgba(33, 27, 67, 0.74);
    --theme-border: rgba(167, 139, 250, 0.2);
    --theme-purple: #8b5cf6;
    --theme-purple-light: #c4b5fd;
    --theme-cyan: #22d3ee;
    --theme-pink: #f472b6;
    --theme-gold: #fbbf24;
    --theme-sports: #f97316;
    --theme-green: #34d399;
    --theme-danger: #fb7185;
    --theme-glow: rgba(139, 92, 246, 0.26);
    --theme-radius: 18px;
}

* {
    scrollbar-color: #4c3c84 #0d0d20;
    scrollbar-width: thin;
}

body {
    background:
        radial-gradient(circle at 8% 0%, rgba(139, 92, 246, 0.18), transparent 28rem),
        radial-gradient(circle at 94% 14%, rgba(34, 211, 238, 0.12), transparent 24rem),
        linear-gradient(145deg, var(--theme-bg) 0%, #0c0d22 52%, var(--theme-bg-deep) 100%) !important;
    color: var(--theme-ink) !important;
    letter-spacing: -0.01em;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: 0.34;
    background-image:
        linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,0.85), transparent 90%);
}

body,
button,
input,
select,
textarea {
    font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

a {
    transition: color 180ms ease, opacity 180ms ease, transform 180ms ease;
}

.navbar {
    background: rgba(8, 8, 24, 0.84) !important;
    border-bottom: 1px solid rgba(196, 181, 253, 0.23) !important;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.24);
    backdrop-filter: blur(20px);
}

.navbar-brand,
.logo {
    background: linear-gradient(110deg, #fbbf24 0%, #f472b6 42%, #a78bfa 75%, #22d3ee 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 0 26px rgba(244, 114, 182, 0.24);
}

.navbar-brand i,
.logo i {
    color: var(--theme-gold) !important;
    -webkit-text-fill-color: var(--theme-gold);
}

.nav-link {
    color: #bfc3d8 !important;
    border-radius: 10px;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
}

.nav-link:hover,
.nav-link.active {
    color: #ffffff !important;
    background: rgba(139, 92, 246, 0.16);
}

.btn-primary,
.btn-register,
.btn-casino {
    background: linear-gradient(115deg, var(--theme-purple), var(--theme-pink)) !important;
    border: 0 !important;
    color: #ffffff !important;
    box-shadow: 0 10px 25px rgba(139, 92, 246, 0.28);
}

.btn-primary:hover,
.btn-register:hover,
.btn-casino:hover {
    color: #ffffff !important;
    filter: brightness(1.1);
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(244, 114, 182, 0.32);
}

.btn-outline-light,
.btn-login {
    border-color: rgba(196, 181, 253, 0.45) !important;
    color: #f4f1ff !important;
    background: rgba(255, 255, 255, 0.035) !important;
}

.btn-outline-light:hover,
.btn-login:hover {
    border-color: var(--theme-cyan) !important;
    background: rgba(34, 211, 238, 0.12) !important;
    color: #ffffff !important;
}

.balance-badge {
    background: linear-gradient(110deg, rgba(52, 211, 153, 0.16), rgba(34, 211, 238, 0.13)) !important;
    border: 1px solid rgba(52, 211, 153, 0.58) !important;
    color: #8ff4cb !important;
    box-shadow: 0 0 24px rgba(52, 211, 153, 0.1);
}

.sidebar {
    background: rgba(9, 9, 28, 0.78) !important;
    border-right-color: rgba(167, 139, 250, 0.16) !important;
    backdrop-filter: blur(16px);
}

.sidebar .sport-item:hover,
.sidebar .sport-item.active {
    color: #ffffff !important;
    background: linear-gradient(90deg, rgba(139, 92, 246, 0.2), transparent) !important;
    border-left-color: var(--theme-pink) !important;
}

.main-content {
    padding-top: 2rem;
}

.card,
.card-match,
.betslip,
.admin-card {
    background: linear-gradient(145deg, rgba(24, 22, 54, 0.92), rgba(13, 14, 35, 0.92)) !important;
    border: 1px solid var(--theme-border) !important;
    border-radius: var(--theme-radius) !important;
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.2);
}

.card-match:hover {
    border-color: rgba(244, 114, 182, 0.62) !important;
    box-shadow: 0 18px 46px rgba(139, 92, 246, 0.2) !important;
}

.form-control,
.form-select,
textarea.form-control {
    background: rgba(7, 8, 25, 0.7) !important;
    border: 1px solid rgba(167, 139, 250, 0.24) !important;
    border-radius: 12px !important;
    color: #ffffff !important;
}

.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
    background: rgba(10, 10, 31, 0.9) !important;
    border-color: var(--theme-cyan) !important;
    box-shadow: 0 0 0 0.22rem rgba(34, 211, 238, 0.16), 0 0 22px rgba(34, 211, 238, 0.08) !important;
}

.form-control::placeholder {
    color: #7f84a0 !important;
}

.odd-btn {
    background: rgba(42, 36, 82, 0.78) !important;
    border-color: rgba(167, 139, 250, 0.25) !important;
}

.odd-btn:hover,
.odd-btn.selected {
    background: linear-gradient(115deg, var(--theme-purple), var(--theme-pink)) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.odd-value,
.section-title i {
    color: var(--theme-cyan) !important;
}

.live-badge {
    background: linear-gradient(110deg, #fb7185, #e11d48) !important;
    border-radius: 999px !important;
    box-shadow: 0 0 16px rgba(251, 113, 133, 0.32);
}

.betslip-header {
    background: linear-gradient(110deg, var(--theme-purple), var(--theme-pink)) !important;
    color: #ffffff !important;
}

.footer {
    background: rgba(8, 8, 24, 0.8) !important;
    border-top-color: rgba(167, 139, 250, 0.18) !important;
}

.footer a:hover {
    color: var(--theme-cyan) !important;
}

.table-dark,
.casino-table {
    --bs-table-bg: rgba(17, 17, 42, 0.66) !important;
    --bs-table-striped-bg: rgba(139, 92, 246, 0.06) !important;
    --bs-table-hover-bg: rgba(34, 211, 238, 0.08) !important;
    --bs-table-border-color: rgba(167, 139, 250, 0.13) !important;
}

.table > :not(caption) > * > * {
    background-color: transparent !important;
}

/* Casino lobby: use the existing hero image as a rich visual skin for every tile. */
.game-card-casino {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background:
        linear-gradient(145deg, rgba(10, 10, 34, 0.3), rgba(10, 10, 28, 0.95)),
        url("../img/casino_hero.jpg") center / cover no-repeat !important;
    border: 1px solid rgba(196, 181, 253, 0.24) !important;
    border-radius: 20px !important;
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24) !important;
    min-height: 188px;
}

.game-card-casino::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(180deg, rgba(139, 92, 246, 0.18), transparent 42%, rgba(6, 7, 22, 0.88));
}

.game-card-casino > div {
    position: relative;
    z-index: 1;
}

.game-card-casino:hover {
    border-color: var(--theme-cyan) !important;
    box-shadow: 0 20px 46px rgba(34, 211, 238, 0.18) !important;
    transform: translateY(-5px) !important;
}

.game-card-casino .game-icon {
    color: var(--theme-gold) !important;
    filter: drop-shadow(0 0 13px rgba(251, 191, 36, 0.35));
}

.game-card-casino .badge-play {
    background: linear-gradient(110deg, var(--theme-cyan), var(--theme-green)) !important;
    color: #07131a !important;
    border-radius: 999px !important;
}

.game-card-casino .badge-soon {
    background: rgba(19, 16, 43, 0.82) !important;
    color: var(--theme-purple-light) !important;
    border-color: rgba(196, 181, 253, 0.25) !important;
    border-radius: 999px !important;
}

/* Public landing page */
.landing-page {
    background:
        radial-gradient(circle at 18% 0%, rgba(139, 92, 246, 0.22), transparent 26rem),
        radial-gradient(circle at 84% 8%, rgba(244, 114, 182, 0.16), transparent 24rem),
        #070817 !important;
}

.landing-page .top-nav {
    background: rgba(8, 8, 24, 0.76) !important;
    border-bottom-color: rgba(196, 181, 253, 0.2) !important;
    backdrop-filter: blur(18px);
}

.landing-page .split-casino {
    background:
        linear-gradient(to top, rgba(5, 5, 20, 0.82), rgba(35, 9, 61, 0.38) 52%, rgba(7, 7, 22, 0.18)),
        url("../img/casino_hero.jpg") center/cover no-repeat !important;
}

.landing-page .split-sports {
    background:
        linear-gradient(to top, rgba(6, 7, 24, 0.82), rgba(26, 12, 36, 0.42) 52%, rgba(7, 7, 22, 0.2)),
        url("../img/copas.jpg") center/cover no-repeat !important;
}

.landing-page .btn-sports {
    background: linear-gradient(110deg, #f59e0b, #f97316) !important;
    color: #1c0d02 !important;
    box-shadow: 0 12px 34px rgba(249, 115, 22, 0.36) !important;
}

.landing-page .btn-casino {
    background: linear-gradient(110deg, var(--theme-purple), var(--theme-pink)) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 34px rgba(244, 114, 182, 0.32) !important;
}

.landing-page .tag-casino {
    background: rgba(244, 114, 182, 0.19) !important;
    color: #f9a8d4 !important;
    border-color: rgba(244, 114, 182, 0.52) !important;
}

.landing-page .tag-sports {
    background: rgba(249, 115, 22, 0.2) !important;
    color: #fed7aa !important;
    border-color: rgba(251, 146, 60, 0.52) !important;
}

.landing-page .casino-card {
    border-color: rgba(196, 181, 253, 0.42) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35) !important;
}

.landing-page .bottom-bar {
    background: rgba(11, 10, 30, 0.84) !important;
    border-top-color: rgba(196, 181, 253, 0.2) !important;
    backdrop-filter: blur(14px);
}

.landing-page .bottom-bar .item .ico {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.25), rgba(34, 211, 238, 0.16)) !important;
    color: var(--theme-cyan) !important;
}

/* Login, registration and account recovery screens */
.auth-page {
    position: relative;
    overflow-x: hidden;
    background:
        linear-gradient(135deg, rgba(7, 8, 24, 0.92), rgba(20, 12, 40, 0.82)),
        url("../img/casino_hero.jpg") center/cover fixed no-repeat !important;
}

.auth-page::after {
    content: "";
    position: fixed;
    width: 26rem;
    height: 26rem;
    right: -9rem;
    top: -8rem;
    border-radius: 50%;
    background: rgba(34, 211, 238, 0.13);
    filter: blur(70px);
    pointer-events: none;
}

.auth-page .login-card,
.auth-page .card {
    background: linear-gradient(145deg, rgba(26, 23, 61, 0.9), rgba(10, 11, 31, 0.92)) !important;
    border: 1px solid rgba(196, 181, 253, 0.26) !important;
    border-radius: 24px !important;
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.5), 0 0 50px rgba(139, 92, 246, 0.12) !important;
    backdrop-filter: blur(18px);
}

.auth-page .btn-login,
.auth-page .btn-primary {
    background: linear-gradient(110deg, var(--theme-purple), var(--theme-pink)) !important;
    color: #ffffff !important;
}

.auth-page .logo {
    font-size: 2.25rem;
}

.auth-page .text-muted,
.auth-page .text-secondary {
    color: #c3c7dc !important;
}

@media (max-width: 768px) {
    .main-content {
        padding: 1rem;
    }

    .game-card-casino {
        min-height: 164px;
    }

    .auth-page .login-card,
    .auth-page .card {
        border-radius: 20px !important;
    }
}

/* Red / white / navy system: final global layer for public, player and admin areas. */
:root {
    --theme-ink: #ffffff;
    --theme-muted: #b7c5d8;
    --theme-bg: #061426;
    --theme-bg-deep: #020b18;
    --theme-surface: rgba(7, 28, 53, 0.92);
    --theme-surface-solid: #08213d;
    --theme-surface-soft: rgba(13, 48, 83, 0.78);
    --theme-border: rgba(255, 255, 255, 0.16);
    --theme-purple: #ed3415;
    --theme-purple-light: #ff9b83;
    --theme-cyan: #ffffff;
    --theme-pink: #ff6a19;
    --theme-gold: #ffd447;
    --theme-sports: #ff3b0a;
    --theme-glow: rgba(255, 59, 10, 0.27);
}

body {
    background:
        radial-gradient(circle at 8% 0%, rgba(255, 59, 10, 0.22), transparent 29rem),
        radial-gradient(circle at 94% 10%, rgba(255, 212, 71, 0.12), transparent 25rem),
        linear-gradient(145deg, #061426 0%, #092747 52%, #020b18 100%) !important;
}

.navbar {
    background: linear-gradient(100deg, #ff3b0a, #e62d0c 62%, #bd2207) !important;
    border-bottom-color: rgba(255,255,255,.25) !important;
}

.navbar-brand,
.logo {
    background: none !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    text-shadow: none;
}

.navbar-brand i,
.logo i,
.section-title i,
.odd-value {
    color: #ffd447 !important;
    -webkit-text-fill-color: #ffd447;
}

.nav-link { color: rgba(255,255,255,.9) !important; }
.nav-link:hover,
.nav-link.active { background: rgba(5, 19, 37, .23); color: #fff !important; }

.btn-primary,
.btn-register,
.btn-casino,
.betslip-header {
    background: linear-gradient(115deg, #ff4a19, #d92708) !important;
    color: #fff !important;
    box-shadow: 0 10px 25px rgba(255, 59, 10, .3) !important;
}

.btn-success { background-color: #159c6a !important; border-color: #159c6a !important; }
.btn-outline-light,
.btn-login { border-color: rgba(255,255,255,.75) !important; color: #fff !important; }

.sidebar {
    background: linear-gradient(180deg, rgba(5, 23, 44, .97), rgba(3, 13, 28, .94)) !important;
    border-right-color: rgba(255,255,255,.13) !important;
}

.sidebar .sport-item:hover,
.sidebar .sport-item.active {
    background: linear-gradient(90deg, rgba(255,59,10,.24), transparent) !important;
    border-left-color: #ff4a19 !important;
}

.card,
.card-match,
.betslip,
.admin-card,
.auth-page .login-card,
.auth-page .card {
    background: linear-gradient(145deg, rgba(10, 42, 76, .94), rgba(3, 18, 36, .95)) !important;
    border-color: rgba(255,255,255,.15) !important;
}

.form-control,
.form-select,
textarea.form-control {
    background: rgba(2, 16, 32, .83) !important;
    border-color: rgba(255,255,255,.2) !important;
}

.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
    border-color: #ff6a19 !important;
    box-shadow: 0 0 0 .22rem rgba(255, 74, 25, .18), 0 0 22px rgba(255, 74, 25, .14) !important;
}

.odd-btn { background: rgba(9, 46, 80, .84) !important; border-color: rgba(255,255,255,.18) !important; }
.odd-btn:hover,
.odd-btn.selected { background: linear-gradient(115deg, #ff4a19, #d92708) !important; }

.game-card-casino {
    border-color: rgba(255, 122, 85, .42) !important;
    background:
        linear-gradient(145deg, rgba(230,45,12,.24), rgba(3,17,33,.94)),
        url("../img/casino_hero.jpg") center / cover no-repeat !important;
}
.game-card-casino::before { background: linear-gradient(180deg, rgba(255, 212, 71, .16), transparent 42%, rgba(3, 13, 28, .92)); }
.game-card-casino:hover { border-color: #ffd447 !important; box-shadow: 0 20px 46px rgba(255, 59, 10, .2) !important; }
.game-card-casino .badge-play { background: linear-gradient(110deg, #ffd447, #ffb300) !important; }

.balance-badge {
    background: rgba(255, 255, 255, .16) !important;
    border-color: rgba(255,255,255,.6) !important;
    color: #fff !important;
}

.wallet-origin-casino { background: rgba(255, 59, 10, .18); color: #ffae96; }
.wallet-origin-apuestas { background: rgba(255, 212, 71, .16); color: #ffe994; }
.wallet-origin-wallet { background: rgba(33, 187, 129, .17); color: #9bf0c8; }
.wallet-demo-notice {
    padding: 1rem 1.1rem;
    border: 1px dashed rgba(255, 212, 71, .52);
    border-radius: 12px;
    background: rgba(255, 212, 71, .09);
    color: #fff2ad;
    font-weight: 700;
}

/* The public entrance moves even before an interaction; sound stays opt-in. */
.entry-orbit {
    position: absolute;
    z-index: 0;
    width: 20rem;
    height: 20rem;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 50%;
    animation: entry-orbit 8s linear infinite;
    pointer-events: none;
}
.entry-orbit::before,
.entry-orbit::after {
    position: absolute;
    display: grid;
    width: 3.1rem;
    height: 3.1rem;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    content: "\f1e3";
    font: var(--fa-font-solid);
    background: #ff3b0a;
    box-shadow: 0 0 24px rgba(255,59,10,.55);
}
.entry-orbit::before { top: -1.55rem; left: calc(50% - 1.55rem); }
.entry-orbit::after { right: -1.55rem; bottom: 2.1rem; content: "\f522"; color: #071426; background: #ffd447; box-shadow: 0 0 24px rgba(255,212,71,.45); }
.entry-shell { isolation: isolate; }
.entry-shell > :not(.entry-orbit) { position: relative; z-index: 1; }
.entry-sound {
    padding: .55rem .8rem;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: transparent;
    font-size: .72rem;
    font-weight: 800;
}
.entry-sound:hover { color: #ffd447; }
@keyframes entry-orbit { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .entry-orbit { animation: none; } }

/* Landing entrance: direct red/orange, white and deep-blue sportsbook identity. */
.landing-page {
    --entry-red: #ff3b0a;
    --entry-red-dark: #c92905;
    --entry-blue: #071426;
    --entry-blue-soft: #102945;
    --entry-yellow: #ffd447;
}

.landing-page .top-nav {
    height: 64px;
    background: linear-gradient(90deg, #ff3b0a 0%, #f13a0b 58%, #d72e05 100%) !important;
    border-bottom: 0;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24);
}

.landing-page .logo {
    background: none !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-size: 1.15rem;
    letter-spacing: 0.02em;
    text-shadow: none;
}

.landing-page .logo i {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

.landing-page .nav-links a {
    color: rgba(255, 255, 255, 0.95) !important;
}

.landing-page .nav-links a:hover {
    color: var(--entry-yellow) !important;
}

.landing-page .btn-login {
    border-color: rgba(255, 255, 255, 0.85) !important;
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

.landing-page .btn-register {
    background: #fff !important;
    color: var(--entry-red) !important;
}

.landing-page .btn-register:hover {
    background: var(--entry-yellow) !important;
    color: var(--entry-blue) !important;
}

.landing-page .split-sports {
    border-right-color: rgba(255, 59, 10, 0.68);
}

.landing-page .split-casino {
    border-left-color: rgba(255, 212, 71, 0.6);
}

.landing-page .btn-sports {
    background: linear-gradient(115deg, #ff4a19, var(--entry-red)) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(255, 59, 10, 0.3);
}

.landing-page .btn-casino {
    background: linear-gradient(115deg, #ffe37a, var(--entry-yellow)) !important;
    color: #131d2d !important;
    box-shadow: 0 12px 26px rgba(255, 212, 71, 0.24);
}

.landing-page .tag-sports {
    background: rgba(255, 59, 10, 0.2) !important;
    border-color: rgba(255, 122, 85, 0.7) !important;
}

.landing-page .tag-casino {
    background: rgba(255, 212, 71, 0.16) !important;
    border-color: rgba(255, 212, 71, 0.65) !important;
    color: #fff1aa !important;
}

.landing-page .bottom-bar {
    background: rgba(4, 13, 26, 0.94) !important;
    border-top-color: rgba(255, 255, 255, 0.14);
}

.landing-page .bottom-bar .item .ico {
    color: var(--entry-yellow) !important;
}

/* Five-second entry moment. It never changes the existing routes or auth flow. */
.entry-screen {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 2rem;
    color: #fff;
    background:
        radial-gradient(circle at 15% 18%, rgba(255, 59, 10, 0.25), transparent 23rem),
        radial-gradient(circle at 86% 80%, rgba(255, 212, 71, 0.12), transparent 25rem),
        linear-gradient(135deg, #071426 0%, #0a1d35 55%, #030914 100%);
    opacity: 1;
    transition: opacity 650ms ease, transform 650ms ease;
    animation: entry-screen-timeout 650ms ease 4.3s forwards;
}

@keyframes entry-screen-timeout {
    to {
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
    }
}

.entry-screen::before,
.entry-screen::after {
    position: absolute;
    content: "";
    pointer-events: none;
}

.entry-screen::before {
    inset: -20%;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 44px 44px;
    transform: perspective(700px) rotateX(58deg) translateY(18%);
    opacity: 0.55;
}

.entry-screen::after {
    width: 24rem;
    height: 24rem;
    right: -8rem;
    top: -10rem;
    border: 1px solid rgba(255, 212, 71, 0.24);
    border-radius: 50%;
    box-shadow: 0 0 0 2rem rgba(255, 212, 71, 0.035), 0 0 0 5rem rgba(255, 212, 71, 0.025);
}

.entry-screen.is-closing {
    opacity: 0;
    transform: scale(1.035);
    pointer-events: none;
}

.entry-shell {
    position: relative;
    z-index: 1;
    width: min(100%, 900px);
    margin: 1rem 0;
    padding: clamp(1.25rem, 4vw, 3rem);
    border: 1px solid rgba(255, 255, 255, 0.17);
    border-radius: 24px;
    background: rgba(4, 13, 27, 0.76);
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.46), inset 0 1px 0 rgba(255, 255, 255, 0.07);
    backdrop-filter: blur(20px);
}

.entry-brand {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 2rem;
    color: #fff;
    font-size: 0.92rem;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.entry-brand-mark {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 8px;
    background: var(--entry-red);
    box-shadow: 0 0 22px rgba(255, 59, 10, 0.42);
}

.entry-kicker {
    color: var(--entry-yellow);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
}

.entry-shell h1 {
    max-width: 650px;
    margin: 0.7rem 0 0.55rem;
    color: #fff;
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: 900;
    letter-spacing: -0.065em;
    line-height: 0.98;
}

.entry-intro-copy {
    margin-bottom: 2rem;
    color: #cbd8e8;
    font-size: 1rem;
}

.entry-choices {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.entry-choice {
    display: flex;
    min-height: 148px;
    align-items: flex-end;
    gap: 0.9rem;
    position: relative;
    overflow: hidden;
    padding: 1.3rem;
    border: 1px solid rgba(255, 255, 255, 0.17);
    border-radius: 16px;
    color: #fff !important;
    text-decoration: none;
    transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.entry-choice::before {
    position: absolute;
    inset: 0;
    content: "";
    opacity: 0.24;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.2), transparent 55%);
}

.entry-choice:hover {
    color: #fff !important;
    transform: translateY(-5px);
}

.entry-choice-sports {
    background:
        radial-gradient(circle at 85% 12%, rgba(255, 111, 75, 0.38), transparent 9rem),
        linear-gradient(135deg, rgba(255, 59, 10, 0.3), rgba(6, 18, 34, 0.9));
    border-color: rgba(255, 93, 57, 0.55);
}

.entry-choice-sports:hover {
    border-color: #ff7452;
    box-shadow: 0 18px 36px rgba(255, 59, 10, 0.2);
}

.entry-choice-casino {
    background:
        radial-gradient(circle at 85% 12%, rgba(255, 212, 71, 0.3), transparent 9rem),
        linear-gradient(135deg, rgba(255, 212, 71, 0.19), rgba(6, 18, 34, 0.9));
    border-color: rgba(255, 212, 71, 0.46);
}

.entry-choice-casino:hover {
    border-color: var(--entry-yellow);
    box-shadow: 0 18px 36px rgba(255, 212, 71, 0.17);
}

.entry-choice-icon {
    position: relative;
    z-index: 1;
    display: grid;
    width: 2.85rem;
    height: 2.85rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.13);
    font-size: 1.1rem;
}

.entry-choice-sports .entry-choice-icon {
    color: #ff9d83;
}

.entry-choice-casino .entry-choice-icon {
    color: var(--entry-yellow);
}

.entry-choice-copy {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.3rem;
}

.entry-choice-copy strong {
    font-size: 1.05rem;
}

.entry-choice-copy small {
    color: #c6d5e6;
    font-size: 0.75rem;
    line-height: 1.35;
}

.entry-choice-arrow {
    position: relative;
    z-index: 1;
    align-self: center;
    margin-left: auto;
    color: rgba(255, 255, 255, 0.82);
}

.entry-footer {
    margin-top: 1.8rem;
}

.entry-progress {
    height: 3px;
    overflow: hidden;
    border-radius: 99px;
    background: rgba(255, 255, 255, 0.14);
}

.entry-progress span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--entry-red), var(--entry-yellow));
    box-shadow: 0 0 14px rgba(255, 212, 71, 0.45);
}

.entry-footer-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 0.85rem;
    color: #9fb2c9;
    font-size: 0.73rem;
}

.entry-footer-row strong {
    color: #fff;
}

.entry-footer-row button {
    padding: 0.55rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 800;
}

.entry-footer-row button:hover {
    border-color: var(--entry-yellow);
    background: var(--entry-yellow);
    color: var(--entry-blue);
}

@media (max-width: 640px) {
    .entry-screen {
        padding: 1rem;
    }

    .entry-shell {
        padding: 1.25rem;
        border-radius: 18px;
    }

    .entry-brand {
        margin-bottom: 1.4rem;
    }

    .entry-shell h1 {
        font-size: 2.25rem;
    }

    .entry-intro-copy {
        margin-bottom: 1.3rem;
        font-size: 0.85rem;
    }

    .entry-choices {
        grid-template-columns: 1fr;
    }

    .entry-choice {
        min-height: 112px;
    }

    .entry-choice-copy strong {
        font-size: 0.95rem;
    }
}

@media (max-height: 700px) {
    .entry-screen {
        align-items: flex-start;
        padding: 0.75rem 1rem;
    }

    .entry-shell {
        margin: 0;
        padding: 1.1rem 1.25rem;
    }

    .entry-brand {
        margin-bottom: 0.9rem;
    }

    .entry-shell h1 {
        margin-top: 0.45rem;
        font-size: clamp(1.8rem, 6vw, 2.7rem);
    }

    .entry-intro-copy {
        margin-bottom: 1rem;
    }

    .entry-choice {
        min-height: 98px;
        padding: 1rem;
    }

    .entry-footer {
        margin-top: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .entry-screen,
    .entry-choice {
        transition: none;
    }
}

/*
 * Wallet premium pass
 * Stronger contrast and clearer sportsbook-style money signals.
 */
:root {
    --theme-lime: #b8f34a;
    --theme-yellow: #ffd84d;
    --theme-red: #ff5368;
    --theme-white: #ffffff;
}

.navbar {
    min-height: 62px;
    padding: 0.7rem 0 !important;
}

.navbar .container-fluid {
    max-width: 1320px;
}

.navbar-brand {
    font-size: 1.15rem !important;
    letter-spacing: 0.01em;
}

.navbar-nav {
    gap: 0.18rem;
}

.navbar .nav-link {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0;
}

.wallet-page {
    max-width: 1240px !important;
    padding-top: 2rem !important;
    padding-bottom: 3rem !important;
}

.wallet-page .wallet-heading {
    min-height: 132px;
    align-items: center;
    padding: 1.7rem 1.9rem;
    border: 1px solid rgba(184, 243, 74, 0.25);
    background:
        linear-gradient(110deg, rgba(13, 25, 42, 0.99), rgba(14, 17, 38, 0.98) 58%, rgba(38, 28, 64, 0.98));
    box-shadow: 0 22px 55px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.wallet-page .wallet-heading::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    content: "";
    background: linear-gradient(180deg, var(--theme-lime), var(--theme-yellow));
}

.wallet-page .eyebrow {
    color: var(--theme-lime);
    font-size: 0.7rem;
    letter-spacing: 0.14em;
}

.wallet-page .section-title {
    margin-top: 0.3rem;
    margin-bottom: 0.45rem;
    color: var(--theme-white);
    font-size: clamp(1.45rem, 2.2vw, 2rem);
    letter-spacing: -0.045em;
}

.wallet-page .section-title i {
    color: var(--theme-lime) !important;
}

.wallet-page .wallet-subtitle {
    color: #d6dced !important;
    font-size: 0.88rem;
}

.wallet-page .wallet-overview {
    --bs-gutter-x: 1.15rem;
    --bs-gutter-y: 1.15rem;
}

.wallet-page .wallet-balance-card,
.wallet-page .wallet-action-card,
.wallet-page .wallet-withdraw-card {
    min-height: 224px;
    padding: 1.65rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 18px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.wallet-page .wallet-balance-card {
    border-color: rgba(184, 243, 74, 0.5);
    background:
        radial-gradient(circle at 86% 10%, rgba(184, 243, 74, 0.19), transparent 10rem),
        linear-gradient(145deg, #172a2b, #0d1824 75%);
}

.wallet-page .wallet-card-label {
    color: #eaffbe;
    font-size: 0.83rem;
    letter-spacing: 0.01em;
}

.wallet-page .wallet-balance-value {
    margin: 0.9rem 0 0.55rem;
    color: var(--theme-lime);
    font-size: clamp(2rem, 4vw, 3rem);
    letter-spacing: -0.06em;
    line-height: 1;
    text-shadow: 0 0 28px rgba(184, 243, 74, 0.22);
}

.wallet-page .wallet-balance-foot {
    color: #dff9a6;
    font-size: 0.8rem;
}

.wallet-page .wallet-action-card {
    border-color: rgba(255, 216, 77, 0.35);
    background:
        radial-gradient(circle at 100% 0%, rgba(255, 216, 77, 0.15), transparent 12rem),
        linear-gradient(145deg, #252337, #111526 78%);
}

.wallet-page .wallet-withdraw-card {
    min-height: auto;
    border-color: rgba(167, 139, 250, 0.28);
    background:
        linear-gradient(120deg, rgba(28, 24, 61, 0.98), rgba(13, 16, 36, 0.98));
}

.wallet-page .wallet-action-heading {
    margin-bottom: 1.45rem;
}

.wallet-page .wallet-action-heading h5,
.wallet-page .wallet-section-heading h5 {
    font-size: 1.08rem;
    letter-spacing: -0.02em;
}

.wallet-page .wallet-action-heading p {
    color: #c8cde0 !important;
}

.wallet-page .wallet-action-icon {
    width: 2.9rem;
    height: 2.9rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.wallet-page .wallet-action-icon-deposit {
    background: rgba(184, 243, 74, 0.14);
    color: var(--theme-lime);
}

.wallet-page .wallet-action-icon-withdraw {
    background: rgba(255, 216, 77, 0.14);
    color: var(--theme-yellow);
}

.wallet-page .form-label {
    margin-bottom: 0.45rem;
    color: #f6f7fb !important;
    font-size: 0.78rem;
    font-weight: 700;
}

.wallet-page .form-text {
    color: #aeb6cc !important;
    font-size: 0.7rem;
}

.wallet-page .input-group-text {
    border-color: rgba(184, 243, 74, 0.35) !important;
    background: rgba(184, 243, 74, 0.12) !important;
    color: var(--theme-lime) !important;
    font-weight: 800;
}

.wallet-page .form-control,
.wallet-page .form-select {
    min-height: 44px;
    border-color: rgba(255, 255, 255, 0.18) !important;
    background: rgba(3, 7, 18, 0.72) !important;
}

.wallet-page .form-control:focus,
.wallet-page .form-select:focus {
    border-color: var(--theme-lime) !important;
    box-shadow: 0 0 0 0.2rem rgba(184, 243, 74, 0.13) !important;
}

.wallet-page .btn-wallet-deposit {
    min-height: 46px;
    background: linear-gradient(115deg, #c8ff5d, var(--theme-lime)) !important;
    color: #142000 !important;
    box-shadow: 0 12px 28px rgba(184, 243, 74, 0.22);
}

.wallet-page .wallet-withdraw-card .btn-success {
    min-height: 44px;
    background: linear-gradient(115deg, #65e58a, #25c96a) !important;
    color: #052313 !important;
    box-shadow: 0 12px 26px rgba(37, 201, 106, 0.23);
}

.wallet-page .wallet-section-heading {
    padding-top: 0.25rem;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.wallet-page .wallet-count {
    border-color: rgba(184, 243, 74, 0.3);
    background: rgba(184, 243, 74, 0.1);
    color: var(--theme-lime);
}

.wallet-page .wallet-table-wrap {
    border: 1px solid rgba(184, 243, 74, 0.22);
    border-radius: 16px;
    background: rgba(5, 9, 20, 0.88);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22);
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.wallet-page .wallet-table {
    min-width: 960px;
}

.wallet-page .wallet-table thead th {
    padding-top: 1rem;
    padding-bottom: 1rem;
    border-bottom-color: rgba(184, 243, 74, 0.32) !important;
    background: linear-gradient(90deg, rgba(184, 243, 74, 0.12), rgba(255, 216, 77, 0.05)) !important;
    color: #f7f9ff !important;
    font-size: 0.7rem;
}

.wallet-page .wallet-table tbody td {
    min-height: 54px;
    padding-top: 0.95rem;
    padding-bottom: 0.95rem;
    border-color: rgba(255, 255, 255, 0.08) !important;
    color: #f3f5fb;
}

.wallet-page .wallet-table tbody tr:hover td {
    background: rgba(184, 243, 74, 0.07) !important;
}

.wallet-page .wallet-origin-casino {
    background: rgba(139, 92, 246, 0.22);
    color: #d7caff;
}

.wallet-page .wallet-origin-apuestas {
    background: rgba(255, 216, 77, 0.16);
    color: #ffe58a;
}

.wallet-page .wallet-origin-wallet {
    background: rgba(184, 243, 74, 0.16);
    color: #dfff9e;
}

.wallet-page .text-success {
    color: var(--theme-lime) !important;
    font-weight: 800;
}

.wallet-page .text-danger {
    color: var(--theme-red) !important;
    font-weight: 800;
}

.wallet-page .badge.bg-success {
    background: rgba(184, 243, 74, 0.2) !important;
    color: #dfff9e !important;
}

.wallet-page .badge.bg-warning {
    background: rgba(255, 216, 77, 0.2) !important;
    color: #ffe58a !important;
}

.wallet-page .badge.bg-danger {
    background: rgba(255, 83, 104, 0.2) !important;
    color: #ff9aaa !important;
}

.wallet-page .alert-warning {
    border-color: rgba(255, 216, 77, 0.35) !important;
    background: rgba(255, 216, 77, 0.1) !important;
    color: #ffe58a !important;
}

@media (max-width: 768px) {
    .wallet-page {
        padding-top: 1rem !important;
    }

    .wallet-page .wallet-heading {
        min-height: 0;
        padding: 1.25rem;
    }

    .wallet-page .wallet-balance-card,
    .wallet-page .wallet-action-card {
        min-height: 0;
    }

    .wallet-page .wallet-balance-value {
        font-size: 2.15rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

/* Modern product polish: quiet structure underneath the color. */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #fbfaff;
    letter-spacing: -0.035em;
}

.section-title,
.section-title-casino {
    letter-spacing: -0.025em;
}

.section-title::after,
.section-title-casino::after {
    content: "";
    display: block;
    width: 3.25rem;
    height: 0.22rem;
    margin-top: 0.55rem;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--theme-cyan), var(--theme-pink));
    box-shadow: 0 0 18px rgba(34, 211, 238, 0.28);
}

.dropdown-menu-dark {
    background: rgba(17, 15, 43, 0.96) !important;
    border: 1px solid rgba(196, 181, 253, 0.2) !important;
    border-radius: 14px !important;
    box-shadow: 0 20px 44px rgba(0, 0, 0, 0.36);
    overflow: hidden;
    padding: 0.45rem;
}

.dropdown-menu-dark .dropdown-item {
    border-radius: 9px;
    color: #e4e1f4 !important;
    padding: 0.62rem 0.8rem;
}

.dropdown-menu-dark .dropdown-item:hover {
    color: #ffffff !important;
    background: rgba(139, 92, 246, 0.2) !important;
}

.alert {
    border: 1px solid rgba(196, 181, 253, 0.2) !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.16);
}

.alert-success {
    background: rgba(52, 211, 153, 0.12) !important;
    color: #a7f3d0 !important;
}

.alert-danger {
    background: rgba(251, 113, 133, 0.12) !important;
    color: #fecdd3 !important;
}

.alert-warning {
    background: rgba(251, 191, 36, 0.12) !important;
    color: #fde68a !important;
}

.badge {
    border-radius: 999px !important;
    padding: 0.42rem 0.7rem !important;
    font-weight: 700 !important;
}

/* Make the two public entry points feel like one intentional product. */
.landing-page .split-hero::before,
.landing-page .split-line {
    width: 2px !important;
    background: linear-gradient(to bottom, var(--theme-cyan), var(--theme-purple), var(--theme-pink)) !important;
    box-shadow: 0 0 18px rgba(167, 139, 250, 0.68) !important;
}

.landing-page .split-side {
    border: 0 !important;
}

.landing-page .split-content {
    max-width: 560px;
    padding: 2rem 1.75rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 26px;
    background: linear-gradient(145deg, rgba(10, 10, 29, 0.46), rgba(10, 10, 29, 0.14));
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.22);
    backdrop-filter: blur(5px);
}

.landing-page .split-content h1 {
    font-size: clamp(2rem, 3.5vw, 3rem);
    letter-spacing: -0.055em;
}

.landing-page a.btn-side,
.landing-page .btn-side {
    min-width: 218px !important;
    padding: 1rem 1.65rem !important;
    border-radius: 14px !important;
    font-size: 1.04rem !important;
    letter-spacing: 0.01em;
}

.landing-page .cups-photo {
    max-width: 300px;
    opacity: 0.96;
}

.landing-page .cups-photo img,
.landing-page .casino-card img {
    transition: transform 300ms ease, filter 300ms ease;
}

.landing-page .cups-photo:hover img {
    transform: scale(1.025);
    filter: saturate(1.12) contrast(1.04);
}

.landing-page .casino-card:hover img {
    transform: scale(1.08);
    filter: saturate(1.18) contrast(1.05);
}

.landing-page .bottom-bar .item {
    font-size: 0.86rem;
    letter-spacing: 0.01em;
}

@media (max-width: 991px) {
    .landing-page .split-content {
        padding: 1.6rem 1.25rem;
        border-radius: 22px;
        background: linear-gradient(145deg, rgba(10, 10, 29, 0.56), rgba(10, 10, 29, 0.22));
    }
}

/*
 * Product color roles
 * Navy/violet = structural confidence, violet = casino, orange = sports CTA,
 * green = money in, red = money out or errors, white = readable content.
 */
.btn-warning,
.btn-sports,
.betslip .btn-primary,
.betslip button[onclick="placeBet()"] {
    background: linear-gradient(115deg, #fb923c, var(--theme-sports)) !important;
    color: #1d0c02 !important;
    border: 0 !important;
    box-shadow: 0 12px 28px rgba(249, 115, 22, 0.28) !important;
}

.btn-warning:hover,
.btn-sports:hover,
.betslip .btn-primary:hover,
.betslip button[onclick="placeBet()"]:hover {
    filter: brightness(1.08);
    box-shadow: 0 16px 32px rgba(249, 115, 22, 0.38) !important;
}

.btn-success {
    background: linear-gradient(115deg, #34d399, #10b981) !important;
    color: #042418 !important;
    border: 0 !important;
}

.text-success {
    color: #6ee7b7 !important;
}

.text-danger {
    color: #fda4af !important;
}

/* Casino lobby: image-led game discovery with a compact product layout. */
.casino-lobby-head {
    position: relative;
    padding: 1.35rem 1.45rem;
    margin-bottom: 1.5rem;
    overflow: hidden;
    border: 1px solid rgba(167, 139, 250, 0.22);
    border-radius: 22px;
    background:
        radial-gradient(circle at 88% 14%, rgba(34, 211, 238, 0.15), transparent 11rem),
        radial-gradient(circle at 22% 125%, rgba(139, 92, 246, 0.28), transparent 16rem),
        linear-gradient(120deg, rgba(22, 20, 56, 0.94), rgba(10, 12, 33, 0.9));
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2);
}

.casino-lobby-head::after {
    content: "";
    position: absolute;
    inset: auto -8% -90% auto;
    width: 20rem;
    height: 20rem;
    border: 1px solid rgba(196, 181, 253, 0.16);
    border-radius: 50%;
}

.casino-lobby-head .balance-badge {
    position: relative;
    z-index: 1;
    padding: 0.7rem 0.9rem;
    border-radius: 14px;
}

.casino-lobby-icon {
    display: inline-grid;
    width: 2.25rem;
    height: 2.25rem;
    place-items: center;
    margin-right: 0.6rem;
    border-radius: 11px;
    background: linear-gradient(135deg, var(--theme-purple), var(--theme-pink));
    color: #fff;
    font-size: 1rem;
    vertical-align: middle;
    box-shadow: 0 0 24px rgba(139, 92, 246, 0.3);
}

.casino-games-grid {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 1rem;
}

.game-card-casino {
    min-height: 212px !important;
    border-radius: 18px !important;
    transform: translateZ(0);
}

.game-card-casino::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: 0.8;
    background: linear-gradient(140deg, rgba(3, 5, 24, 0.04), rgba(3, 5, 24, 0.86) 72%);
}

.game-card-casino.game-card-mines {
    background-position: 22% center !important;
}

.game-card-casino.game-card-slots {
    border-color: rgba(251, 191, 36, 0.28) !important;
}

.game-card-casino.game-card-plinko {
    border-color: rgba(34, 211, 238, 0.26) !important;
}

.game-card-content {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    align-items: flex-start;
    padding: 0.2rem;
    text-align: left;
}

.game-card-top {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    margin-bottom: auto;
}

.game-card-casino .game-icon {
    display: grid;
    width: 2.7rem;
    height: 2.7rem;
    margin: 0 !important;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 12px;
    background: rgba(8, 9, 28, 0.54);
    backdrop-filter: blur(8px);
    font-size: 1.12rem !important;
}

.game-category {
    padding: 0.26rem 0.52rem;
    border: 1px solid rgba(196, 181, 253, 0.24);
    border-radius: 999px;
    background: rgba(9, 10, 30, 0.56);
    color: #d8d4fe;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.game-card-casino h5 {
    margin-top: 1.35rem;
    font-size: 1.1rem;
}

.game-card-casino .desc {
    margin-bottom: 1rem;
    color: #d0d2df !important;
    font-size: 0.77rem;
    line-height: 1.35;
}

.game-card-casino .badge-play {
    padding: 0.42rem 0.85rem !important;
    color: #06271b !important;
    font-size: 0.72rem !important;
}

.game-card-casino.disabled-game {
    filter: saturate(0.55);
}

/* Shared game-screen frame. Existing game mechanics and canvases are untouched. */
.crash-page h3 span,
.mines-wrap h3 span,
.plinko-page h3 span {
    color: var(--theme-purple) !important;
}

.casino-table th {
    border-bottom-color: rgba(167, 139, 250, 0.35) !important;
}

.crash-page,
.mines-wrap,
.slots-page {
    max-width: 1180px !important;
}

.plinko-page,
.dice-page,
.limbo-page {
    max-width: 560px !important;
}

.crash-page > .d-flex,
.mines-wrap > .d-flex,
.slots-page > .d-flex,
.plinko-page > .d-flex,
.dice-page > .d-flex,
.limbo-page > .d-flex {
    padding: 0.7rem 0.1rem 0.95rem;
}

.crash-page .crash-graph-card,
.crash-page .crash-panel,
.crash-page .history-bar,
.mines-wrap .mines-board,
.mines-wrap .mines-panel,
.game-shell,
.slots-machine {
    border: 1px solid rgba(167, 139, 250, 0.23) !important;
    background:
        radial-gradient(circle at 92% 8%, rgba(34, 211, 238, 0.09), transparent 12rem),
        linear-gradient(145deg, rgba(24, 22, 59, 0.97), rgba(8, 10, 30, 0.97)) !important;
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}

.crash-page .crash-panel,
.mines-wrap .mines-panel,
.game-shell,
.slots-machine {
    position: relative;
    overflow: hidden;
}

.crash-page .crash-panel::before,
.mines-wrap .mines-panel::before,
.game-shell::before,
.slots-machine::before {
    position: absolute;
    top: 0;
    left: 9%;
    right: 9%;
    height: 1px;
    content: "";
    background: linear-gradient(90deg, transparent, rgba(34, 211, 238, 0.75), rgba(196, 181, 253, 0.7), transparent);
}

.crash-page .crash-graph-card,
.mines-wrap .mines-board,
.game-shell,
.slots-machine {
    border-radius: 20px !important;
}

.crash-page .crash-panel,
.mines-wrap .mines-panel {
    border-radius: 20px !important;
}

.crash-page .crash-mult-big {
    color: #c4b5fd !important;
    text-shadow: 0 0 44px rgba(139, 92, 246, 0.62) !important;
}

.limbo-mult-overlay {
    color: #c4b5fd;
    text-shadow: 0 0 44px rgba(139, 92, 246, 0.62);
}

.crash-page .crash-mult-big.crashed {
    color: #fb7185 !important;
    text-shadow: 0 0 40px rgba(251, 113, 133, 0.5) !important;
}

.crash-page .crash-tabs,
.crash-page .quick-bets button,
.mines-wrap .mult-box,
.ctrl-box,
.slots-controls,
.reels-wrap {
    border-color: rgba(167, 139, 250, 0.16) !important;
    background: rgba(4, 6, 23, 0.56) !important;
}

.crash-page .crash-tabs button.active,
.crash-page .quick-bets button.active,
.crash-page .quick-bets button:hover,
.side-btn.active-over {
    background: linear-gradient(115deg, var(--theme-purple), var(--theme-pink)) !important;
    border-color: transparent !important;
    color: #fff !important;
}

.btn-crash-bet,
.btn-mines-start,
.btn-play,
.btn-spin {
    background: linear-gradient(115deg, var(--theme-purple), var(--theme-pink)) !important;
    color: #fff !important;
    box-shadow: 0 12px 25px rgba(139, 92, 246, 0.28) !important;
}

.btn-crash-out,
.btn-mines-cash {
    background: linear-gradient(115deg, #34d399, #10b981) !important;
    color: #03251a !important;
    box-shadow: 0 12px 25px rgba(16, 185, 129, 0.25) !important;
}

.btn-crash-bet:hover,
.btn-mines-start:hover,
.btn-play:hover,
.btn-spin:hover,
.btn-crash-out:hover,
.btn-mines-cash:hover {
    transform: translateY(-1px);
    filter: brightness(1.08);
}

.mines-wrap .mine-cell {
    border: 1px solid rgba(196, 181, 253, 0.12) !important;
    background: linear-gradient(145deg, #292257, #161632) !important;
}

.mines-wrap .mine-cell:not(:disabled):hover {
    border-color: rgba(34, 211, 238, 0.75) !important;
    background: linear-gradient(145deg, #373072, #1d1b43) !important;
    box-shadow: 0 8px 18px rgba(34, 211, 238, 0.17) !important;
}

.mines-wrap .mine-cell.gem {
    background: linear-gradient(145deg, #0d4d43, #0b2f2c) !important;
    box-shadow: inset 0 0 0 2px #34d399, 0 0 18px rgba(52, 211, 153, 0.32) !important;
}

.mines-wrap .mine-cell.mine-hit,
.mines-wrap .mine-cell.mine {
    background: linear-gradient(145deg, #5a1f39, #300f25) !important;
}

.plinko-stage,
.limbo-stage {
    border: 1px solid rgba(167, 139, 250, 0.2) !important;
    background:
        radial-gradient(ellipse at 50% 8%, rgba(139, 92, 246, 0.28), transparent 42%),
        linear-gradient(180deg, #111333, #070918) !important;
}

.dice-page .mult-box {
    border-color: rgba(52, 211, 153, 0.32) !important;
    background: linear-gradient(145deg, rgba(13, 65, 57, 0.64), rgba(5, 32, 31, 0.8)) !important;
}

.dice-page .slider-wrap input[type=range] {
    background: linear-gradient(90deg, #34d399, #a78bfa 48%, #fb7185) !important;
}

.dice-page .slider-wrap input[type=range]::-webkit-slider-thumb {
    background: #a78bfa !important;
    box-shadow: 0 0 14px rgba(167, 139, 250, 0.6) !important;
}

.slots-machine {
    border-color: rgba(251, 191, 36, 0.35) !important;
}

.slots-title,
.slots-machine .win-box .title,
.slots-machine .win-box .amount {
    color: #fde68a !important;
}

.slots-machine .reel {
    border-color: rgba(196, 181, 253, 0.2) !important;
    background: #090a1f !important;
}

.slots-machine .bet-ctrl button {
    border-color: rgba(196, 181, 253, 0.3) !important;
    background: rgba(26, 20, 57, 0.9) !important;
}

.slots-machine .bet-ctrl input {
    border-color: rgba(251, 191, 36, 0.35) !important;
    background: #08091d !important;
    color: #fde68a !important;
}

/* Wallet: a readable ledger instead of a dense raw transaction table. */
.wallet-heading,
.wallet-section-heading,
.wallet-action-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.wallet-heading {
    position: relative;
    padding: 1.4rem 1.5rem;
    margin-bottom: 1.5rem;
    overflow: hidden;
    border: 1px solid rgba(34, 211, 238, 0.17);
    border-radius: 22px;
    background:
        radial-gradient(circle at 92% 0%, rgba(34, 211, 238, 0.16), transparent 11rem),
        linear-gradient(125deg, rgba(19, 21, 59, 0.98), rgba(9, 11, 33, 0.96));
}

.wallet-heading-mark {
    display: grid;
    width: 3.2rem;
    height: 3.2rem;
    place-items: center;
    border: 1px solid rgba(52, 211, 153, 0.3);
    border-radius: 16px;
    background: rgba(52, 211, 153, 0.1);
    color: #6ee7b7;
    font-size: 1.3rem;
    box-shadow: 0 0 26px rgba(52, 211, 153, 0.14);
}

.eyebrow {
    color: #a5b4fc;
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.1em;
}

.wallet-subtitle {
    color: #aeb3ca;
    font-size: 0.9rem;
}

.wallet-balance-card,
.wallet-action-card,
.wallet-withdraw-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(167, 139, 250, 0.2);
    border-radius: 20px;
    padding: 1.45rem;
    background: linear-gradient(145deg, rgba(24, 22, 59, 0.95), rgba(10, 12, 34, 0.94));
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18);
}

.wallet-balance-card {
    background:
        radial-gradient(circle at 100% 0%, rgba(52, 211, 153, 0.24), transparent 8rem),
        linear-gradient(145deg, rgba(21, 54, 60, 0.94), rgba(9, 22, 35, 0.96));
    border-color: rgba(52, 211, 153, 0.32);
}

.wallet-card-label {
    color: #c5f8e1;
    font-size: 0.8rem;
    font-weight: 700;
}

.wallet-balance-value {
    margin: 0.65rem 0;
    color: #fff;
    font-size: clamp(1.7rem, 3vw, 2.45rem);
    font-weight: 900;
    letter-spacing: -0.05em;
}

.wallet-balance-foot {
    color: #9eecc9;
    font-size: 0.76rem;
}

.wallet-status-dot {
    display: inline-block;
    width: 0.42rem;
    height: 0.42rem;
    margin-right: 0.35rem;
    border-radius: 50%;
    background: #34d399;
    box-shadow: 0 0 9px #34d399;
}

.wallet-action-heading {
    justify-content: flex-start;
    gap: 0.85rem;
    margin-bottom: 1.3rem;
}

.wallet-action-heading h5 {
    color: #fff;
    font-weight: 800;
}

.wallet-action-icon {
    display: grid;
    width: 2.7rem;
    height: 2.7rem;
    place-items: center;
    border-radius: 12px;
    font-size: 1rem;
}

.wallet-action-icon-deposit {
    background: rgba(52, 211, 153, 0.14);
    color: #6ee7b7;
}

.wallet-action-icon-withdraw {
    background: rgba(167, 139, 250, 0.15);
    color: #c4b5fd;
}

.btn-wallet-deposit {
    background: linear-gradient(115deg, #34d399, #10b981) !important;
    border: 0 !important;
    color: #042418 !important;
    font-weight: 800 !important;
    box-shadow: 0 12px 26px rgba(16, 185, 129, 0.23);
}

.wallet-section-heading {
    margin: 1.7rem 0 0.85rem;
}

.wallet-section-heading h5 {
    color: #fff;
    font-weight: 800;
}

.wallet-count {
    padding: 0.4rem 0.65rem;
    border: 1px solid rgba(196, 181, 253, 0.18);
    border-radius: 999px;
    background: rgba(139, 92, 246, 0.1);
    color: #c4b5fd;
    font-size: 0.72rem;
    font-weight: 700;
}

.wallet-table-wrap {
    overflow: hidden;
    border: 1px solid rgba(167, 139, 250, 0.17);
    border-radius: 18px;
    background: rgba(10, 11, 30, 0.72);
}

.wallet-table {
    margin: 0 !important;
}

.wallet-table thead th {
    padding: 0.9rem 1rem;
    border-bottom: 1px solid rgba(167, 139, 250, 0.16) !important;
    background: rgba(139, 92, 246, 0.09) !important;
    color: #c8c5df !important;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.wallet-table tbody td {
    padding: 0.85rem 1rem;
    border-color: rgba(167, 139, 250, 0.09) !important;
    color: #ebeafd;
}

.wallet-table tbody tr:hover td {
    background: rgba(139, 92, 246, 0.075) !important;
}

.wallet-origin {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.34rem 0.55rem;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 800;
}

.wallet-origin-casino {
    background: rgba(139, 92, 246, 0.16);
    color: #c4b5fd;
}

.wallet-origin-apuestas {
    background: rgba(249, 115, 22, 0.14);
    color: #fdba74;
}

.wallet-origin-wallet {
    background: rgba(52, 211, 153, 0.13);
    color: #6ee7b7;
}

.wallet-type {
    color: #fff;
    font-weight: 700;
}

.wallet-note {
    max-width: 14rem;
    margin-top: 0.18rem;
    color: #8f95b2;
    font-size: 0.68rem;
}

.wallet-empty-state {
    display: flex;
    min-height: 180px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    border: 1px dashed rgba(167, 139, 250, 0.28);
    border-radius: 18px;
    background: rgba(16, 15, 42, 0.56);
    color: #aeb3ca;
}

.wallet-empty-state i {
    color: #a78bfa;
    font-size: 1.7rem;
}

.wallet-empty-state strong {
    color: #fff;
}

@media (max-width: 768px) {
    .casino-lobby-head,
    .wallet-heading {
        padding: 1.2rem;
        border-radius: 18px;
    }

    .game-card-casino {
        min-height: 196px !important;
    }

    .wallet-heading-mark {
        display: none;
    }

    .wallet-table thead th,
    .wallet-table tbody td {
        padding: 0.72rem;
    }
}

/* NOVA PLAY — clear green and white system. This final layer intentionally
   replaces the older violet/red visual treatments without touching behavior. */
:root {
    --theme-ink: #12352b;
    --theme-muted: #587267;
    --theme-bg: #effaf4;
    --theme-bg-deep: #dff4e7;
    --theme-surface: rgba(255, 255, 255, 0.94);
    --theme-surface-solid: #ffffff;
    --theme-surface-soft: #e7f8ed;
    --theme-border: rgba(18, 101, 62, 0.14);
    --theme-purple: #129a52;
    --theme-purple-light: #73d9a2;
    --theme-cyan: #158f50;
    --theme-pink: #32be70;
    --theme-gold: #f0c84b;
    --theme-sports: #129a52;
    --theme-green: #159c58;
    --theme-glow: rgba(21, 156, 88, 0.18);
}

body {
    background:
        radial-gradient(circle at 7% 0%, rgba(78, 201, 125, 0.2), transparent 30rem),
        radial-gradient(circle at 96% 10%, rgba(240, 200, 75, 0.12), transparent 22rem),
        linear-gradient(145deg, #f8fffa 0%, #e8f8ee 55%, #f5fcf7 100%) !important;
    color: #12352b !important;
}

body::before {
    opacity: 0.48;
    background-image:
        linear-gradient(rgba(21, 117, 70, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(21, 117, 70, 0.055) 1px, transparent 1px);
}

.brand-mark {
    display: inline-block;
    width: 1.8rem;
    height: 1.8rem;
    margin-right: 0.48rem;
    vertical-align: -0.38rem;
    filter: drop-shadow(0 4px 8px rgba(18, 154, 82, 0.18));
}

.navbar,
.landing-page .top-nav {
    background: rgba(255, 255, 255, 0.92) !important;
    border-bottom: 1px solid rgba(18, 101, 62, 0.13) !important;
    box-shadow: 0 8px 24px rgba(16, 75, 46, 0.08) !important;
}

.navbar-brand,
.logo,
.landing-page .logo {
    color: #117a44 !important;
    -webkit-text-fill-color: #117a44 !important;
    font-weight: 900;
}

.navbar-brand i,
.logo i,
.landing-page .logo i,
.section-title i,
.odd-value {
    color: #159c58 !important;
    -webkit-text-fill-color: #159c58;
}

.nav-link,
.landing-page .nav-links a {
    color: #345f4e !important;
    font-weight: 700;
}

.nav-link:hover,
.nav-link.active,
.landing-page .nav-links a:hover {
    color: #08733b !important;
    background: rgba(21, 156, 88, 0.09);
}

.btn-primary,
.btn-register,
.btn-casino,
.btn-sports,
.auth-page .btn-login,
.betslip-header,
.btn-wallet-deposit {
    background: linear-gradient(115deg, #0d8547, #31bc6c) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 24px rgba(16, 146, 76, 0.2) !important;
}

.btn-primary:hover,
.btn-register:hover,
.btn-casino:hover,
.btn-sports:hover,
.auth-page .btn-login:hover,
.btn-wallet-deposit:hover {
    background: linear-gradient(115deg, #08723c, #1aa65b) !important;
    color: #ffffff !important;
}

.btn-outline-light,
.btn-login {
    border-color: rgba(14, 117, 62, 0.34) !important;
    color: #12623a !important;
    background: #ffffff !important;
}

.btn-outline-light:hover,
.btn-login:hover {
    border-color: #159c58 !important;
    color: #08723c !important;
    background: #effaf3 !important;
}

.sidebar {
    background: rgba(248, 255, 250, 0.86) !important;
    border-right-color: rgba(18, 101, 62, 0.12) !important;
}

.sidebar .sport-item,
.sidebar .nav-link,
.list-group-item {
    color: #345f4e !important;
}

.sidebar .sport-item:hover,
.sidebar .sport-item.active {
    color: #08723c !important;
    background: linear-gradient(90deg, rgba(28, 170, 91, 0.14), transparent) !important;
    border-left-color: #159c58 !important;
}

.card,
.card-match,
.betslip,
.admin-card,
.auth-page .login-card,
.auth-page .card,
.wallet-balance-card,
.wallet-action-card,
.wallet-withdraw-card {
    background: rgba(255, 255, 255, 0.95) !important;
    color: #12352b !important;
    border-color: rgba(18, 101, 62, 0.14) !important;
    box-shadow: 0 14px 36px rgba(17, 74, 48, 0.08) !important;
}

.card-match:hover {
    border-color: rgba(21, 156, 88, 0.55) !important;
    box-shadow: 0 18px 40px rgba(21, 156, 88, 0.14) !important;
}

.form-control,
.form-select,
textarea.form-control {
    background: #fbfffc !important;
    border-color: rgba(18, 101, 62, 0.2) !important;
    color: #12352b !important;
}

.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
    background: #ffffff !important;
    border-color: #1ba85d !important;
    color: #12352b !important;
    box-shadow: 0 0 0 0.22rem rgba(27, 168, 93, 0.14) !important;
}

.text-muted,
.text-secondary,
.form-text,
small.text-muted,
.table .text-muted,
p.text-muted,
span.text-muted,
.card p,
.card small,
.admin-card p,
.admin-card small {
    color: #587267 !important;
}

.form-label,
label,
.table-dark td,
.table-dark th {
    color: #284e3f !important;
}

.odd-btn {
    background: #f3fbf6 !important;
    border-color: rgba(18, 101, 62, 0.18) !important;
    color: #12352b !important;
}

.odd-btn:hover,
.odd-btn.selected {
    background: linear-gradient(115deg, #128c4c, #31bc6c) !important;
    color: #ffffff !important;
}

.odd-btn:hover .odd-value,
.odd-btn.selected .odd-value {
    color: #ffffff !important;
}

.table-dark,
.casino-table {
    --bs-table-bg: rgba(255, 255, 255, 0.76) !important;
    --bs-table-striped-bg: rgba(21, 156, 88, 0.045) !important;
    --bs-table-hover-bg: rgba(21, 156, 88, 0.09) !important;
    --bs-table-border-color: rgba(18, 101, 62, 0.11) !important;
}

.game-card-casino {
    background:
        linear-gradient(145deg, rgba(5, 65, 35, 0.28), rgba(4, 35, 22, 0.84)),
        url("../img/casino_hero.jpg") center / cover no-repeat !important;
    border-color: rgba(74, 211, 126, 0.36) !important;
}

.game-card-casino::before {
    background: linear-gradient(180deg, rgba(143, 246, 187, 0.17), transparent 42%, rgba(4, 35, 22, 0.9));
}

.game-card-casino:hover {
    border-color: #87e8ae !important;
    box-shadow: 0 20px 46px rgba(16, 130, 66, 0.24) !important;
}

.game-card-casino .badge-play {
    background: linear-gradient(110deg, #dcf9e6, #8ee8b2) !important;
    color: #0b4b2a !important;
}

.footer,
.landing-page .bottom-bar {
    background: rgba(244, 252, 247, 0.95) !important;
    border-top-color: rgba(18, 101, 62, 0.12) !important;
    color: #587267 !important;
}

.footer h5,
.footer h6,
.wallet-action-heading h5,
.wallet-section-heading h5,
.wallet-balance-value,
.wallet-type,
.wallet-empty-state strong {
    color: #12352b !important;
}

.balance-badge {
    background: #e2f8e9 !important;
    border-color: rgba(19, 145, 75, 0.35) !important;
    color: #08723c !important;
}

.wallet-balance-card {
    background: linear-gradient(135deg, #edfff3, #dff8e9) !important;
}

.wallet-table-wrap,
.wallet-empty-state {
    background: rgba(255, 255, 255, 0.82) !important;
    border-color: rgba(18, 101, 62, 0.15) !important;
}

.wallet-table thead th {
    background: #eaf9ef !important;
    color: #2c5c47 !important;
    border-bottom-color: rgba(18, 101, 62, 0.12) !important;
}

/* Public area keeps photo drama while all UI chrome turns fresh and green. */
.landing-page {
    background:
        radial-gradient(circle at 8% 4%, rgba(96, 214, 143, 0.22), transparent 27rem),
        #f5fcf7 !important;
}

.landing-page .split-sports {
    border-right-color: rgba(82, 216, 133, 0.7);
    background:
        linear-gradient(to top, rgba(4, 41, 24, 0.83), rgba(7, 74, 40, 0.31) 55%, rgba(6, 48, 28, 0.2)),
        url("../img/copas.jpg") center/cover no-repeat !important;
}

.landing-page .split-casino {
    border-left-color: rgba(142, 232, 178, 0.68);
    background:
        linear-gradient(to top, rgba(3, 37, 22, 0.83), rgba(7, 92, 48, 0.31) 55%, rgba(3, 38, 23, 0.2)),
        url("../img/casino_hero.jpg") center/cover no-repeat !important;
}

.landing-page .tag-sports,
.landing-page .tag-casino {
    background: rgba(223, 255, 235, 0.15) !important;
    border-color: rgba(163, 243, 192, 0.64) !important;
    color: #d9ffe7 !important;
}

.landing-page .bottom-bar .item {
    color: #345f4e !important;
}

.landing-page .bottom-bar .item .ico {
    color: #159c58 !important;
    background: #e2f8e9 !important;
}

/* Text-free branded entrance with a larger, richer icon movement. */
.entry-screen {
    background:
        radial-gradient(circle at 50% 50%, rgba(117, 238, 162, 0.25), transparent 12rem),
        radial-gradient(circle at 16% 20%, rgba(240, 200, 75, 0.16), transparent 20rem),
        linear-gradient(135deg, #063b24 0%, #0a6c3e 55%, #0a3d28 100%) !important;
}

.entry-screen::before {
    opacity: 0.34;
    background-size: 52px 52px;
}

.entry-screen::after {
    border-color: rgba(221, 255, 234, 0.28);
    box-shadow: 0 0 0 2rem rgba(210, 255, 227, 0.045), 0 0 0 5rem rgba(210, 255, 227, 0.025);
}

.entry-shell {
    width: min(100%, 650px);
    min-height: min(68vh, 520px);
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 50%;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
}

.entry-logo-core {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    display: grid;
    width: clamp(8rem, 18vw, 11rem);
    height: clamp(8rem, 18vw, 11rem);
    place-items: center;
    border-radius: 50%;
    background: rgba(248, 255, 250, 0.96);
    box-shadow: 0 0 0 15px rgba(229, 255, 238, 0.12), 0 0 80px rgba(159, 255, 194, 0.42);
    transform: translate(-50%, -50%);
    animation: nova-core-pulse 1.7s ease-in-out infinite;
}

.entry-logo-core img {
    width: 78%;
    height: 78%;
}

.entry-shell > .entry-logo-core,
.entry-shell > .entry-icon,
.entry-shell > .entry-progress-icon-only,
.entry-shell > #entry-skip {
    position: absolute;
}

.entry-icon {
    position: absolute;
    z-index: 2;
    display: grid;
    width: clamp(2.8rem, 6vw, 4.2rem);
    height: clamp(2.8rem, 6vw, 4.2rem);
    place-items: center;
    border: 1px solid rgba(236, 255, 242, 0.42);
    border-radius: 50%;
    background: rgba(245, 255, 249, 0.14);
    box-shadow: 0 10px 26px rgba(0, 33, 18, 0.22);
    color: #ffffff;
    font-size: clamp(1rem, 2.2vw, 1.55rem);
    backdrop-filter: blur(8px);
    animation: nova-float 3.2s ease-in-out infinite;
}

.entry-icon-1 { top: 7%; left: 46%; animation-delay: -0.6s; }
.entry-icon-2 { top: 18%; left: 17%; animation-delay: -1.4s; }
.entry-icon-3 { top: 19%; right: 16%; animation-delay: -2.3s; color: #ffe987; }
.entry-icon-4 { top: 44%; left: 4%; animation-delay: -0.2s; color: #ffe987; }
.entry-icon-5 { top: 45%; right: 3%; animation-delay: -1.9s; color: #ffe987; }
.entry-icon-6 { bottom: 13%; left: 16%; animation-delay: -0.9s; }
.entry-icon-7 { bottom: 7%; left: 45%; animation-delay: -2.7s; }
.entry-icon-8 { bottom: 14%; right: 17%; animation-delay: -1.1s; color: #b7ffd0; }
.entry-icon-9 { top: 33%; left: 30%; animation-delay: -2.1s; }

.entry-progress-icon-only {
    position: absolute;
    right: 20%;
    bottom: 3%;
    left: 20%;
    z-index: 4;
    height: 3px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(236, 255, 242, 0.22);
}

.entry-progress-icon-only span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #7ef1a6, #ffffff);
    box-shadow: 0 0 14px rgba(200, 255, 218, 0.78);
}

#entry-skip {
    position: absolute;
    right: 7%;
    bottom: 7%;
    z-index: 5;
    display: grid;
    width: 2.55rem;
    height: 2.55rem;
    place-items: center;
    border: 1px solid rgba(236, 255, 242, 0.42);
    border-radius: 50%;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.12);
    transition: transform 160ms ease, background 160ms ease;
}

#entry-skip:hover {
    background: rgba(255, 255, 255, 0.25);
    transform: translateX(3px);
}

@keyframes nova-float {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50% { transform: translate3d(0, -14px, 0) scale(1.08); }
}

@keyframes nova-core-pulse {
    0%, 100% { transform: translate(-50%, -50%) scale(1); }
    50% { transform: translate(-50%, -50%) scale(1.06); }
}

@media (max-width: 640px) {
    .entry-shell {
        min-height: min(68vh, 410px);
    }

    .entry-icon-2 { left: 7%; }
    .entry-icon-3 { right: 6%; }
    .entry-icon-4 { left: 0; }
    .entry-icon-5 { right: 0; }
    .entry-icon-6 { left: 8%; }
    .entry-icon-8 { right: 8%; }
}

@media (prefers-reduced-motion: reduce) {
    .entry-logo-core,
    .entry-icon {
        animation: none;
    }
}

/* NOVA PLAY — green-first brand frame and orange action accents. This is
   intentionally the final cascade layer so legacy page-local styles cannot
   restore the former dark palette. */
:root {
    --nova-green-950: #073b25;
    --nova-green-900: #0a5d38;
    --nova-green-800: #0d7545;
    --nova-green-700: #129653;
    --nova-green-500: #2fc873;
    --nova-green-200: #b8edc9;
    --nova-green-100: #d9f6e2;
    --nova-green-050: #edfcf2;
    --nova-orange: #f47b20;
    --nova-orange-dark: #c9520f;
    --nova-frame: clamp(14px, 1.8vw, 26px);
}

body {
    background:
        radial-gradient(circle at 8% 0%, rgba(47, 200, 115, 0.24), transparent 30rem),
        radial-gradient(circle at 94% 8%, rgba(244, 123, 32, 0.14), transparent 24rem),
        linear-gradient(145deg, #c9efd6 0%, #e1f8e8 52%, #c5edcf 100%) !important;
    color: var(--nova-green-950) !important;
    border-top: var(--nova-frame) solid var(--nova-orange);
    border-bottom: var(--nova-frame) solid var(--nova-orange);
}

body::before {
    opacity: 0.42;
    background-image:
        linear-gradient(rgba(7, 59, 37, 0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(7, 59, 37, 0.07) 1px, transparent 1px);
}

.navbar,
.landing-page .top-nav {
    background: linear-gradient(105deg, var(--nova-green-950), var(--nova-green-800)) !important;
    border-bottom: 3px solid var(--nova-orange) !important;
    box-shadow: 0 10px 28px rgba(7, 59, 37, 0.2) !important;
}

.navbar-brand,
.navbar-brand:hover,
.landing-page .logo,
.landing-page .logo:hover {
    color: #f4fff7 !important;
    -webkit-text-fill-color: #f4fff7 !important;
}

.nav-link,
.landing-page .nav-links a {
    color: #e2f8e9 !important;
}

.nav-link:hover,
.nav-link.active,
.landing-page .nav-links a:hover {
    color: #ffffff !important;
    background: rgba(244, 123, 32, 0.2) !important;
}

.btn-primary,
.btn-register,
.btn-casino,
.btn-sports,
.auth-page .btn-login,
.betslip-header,
.btn-wallet-deposit,
.btn-crash-bet,
.btn-mines-start,
.btn-play,
.btn-spin {
    background: linear-gradient(115deg, var(--nova-green-800), var(--nova-green-500)) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 10px 24px rgba(7, 93, 56, 0.24) !important;
}

.btn-primary:hover,
.btn-register:hover,
.btn-casino:hover,
.btn-sports:hover,
.auth-page .btn-login:hover,
.btn-wallet-deposit:hover,
.btn-crash-bet:hover,
.btn-mines-start:hover,
.btn-play:hover,
.btn-spin:hover {
    background: linear-gradient(115deg, var(--nova-green-900), var(--nova-green-700)) !important;
    color: #ffffff !important;
}

.btn-outline-light,
.btn-login {
    border-color: var(--nova-orange) !important;
    color: #fff5eb !important;
    background: rgba(244, 123, 32, 0.16) !important;
}

.btn-outline-light:hover,
.btn-login:hover {
    border-color: #ffb169 !important;
    background: rgba(244, 123, 32, 0.3) !important;
    color: #ffffff !important;
}

.sidebar {
    background: linear-gradient(180deg, #d9f4e2, #c2eacd) !important;
    border-right: 1px solid rgba(7, 93, 56, 0.18) !important;
}

.sidebar .sport-item,
.sidebar .nav-link,
.list-group-item {
    color: var(--nova-green-900) !important;
}

.sidebar .sport-item:hover,
.sidebar .sport-item.active {
    color: var(--nova-green-950) !important;
    background: linear-gradient(90deg, rgba(244, 123, 32, 0.24), transparent) !important;
    border-left-color: var(--nova-orange) !important;
}

.card,
.card-match,
.betslip,
.admin-card,
.wallet-balance-card,
.wallet-action-card,
.wallet-withdraw-card {
    background: linear-gradient(145deg, rgba(237, 252, 242, 0.98), rgba(211, 243, 222, 0.97)) !important;
    color: var(--nova-green-950) !important;
    border: 1px solid rgba(7, 93, 56, 0.2) !important;
    box-shadow: 0 14px 36px rgba(7, 93, 56, 0.12) !important;
}

.card-match:hover {
    border-color: rgba(244, 123, 32, 0.72) !important;
    box-shadow: 0 18px 40px rgba(7, 93, 56, 0.18) !important;
}

.form-control,
.form-select,
textarea.form-control {
    background: #edfcf2 !important;
    border-color: rgba(7, 93, 56, 0.26) !important;
    color: var(--nova-green-950) !important;
}

.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
    background: #f6fff8 !important;
    border-color: var(--nova-orange) !important;
    color: var(--nova-green-950) !important;
    box-shadow: 0 0 0 0.22rem rgba(244, 123, 32, 0.18) !important;
}

.form-control::placeholder {
    color: #668477 !important;
}

.text-muted,
.text-secondary,
.form-text,
small.text-muted,
.table .text-muted,
p.text-muted,
span.text-muted,
.card p,
.card small,
.admin-card p,
.admin-card small {
    color: #416b55 !important;
}

.form-label,
label,
.table-dark td,
.table-dark th {
    color: var(--nova-green-900) !important;
}

.balance-badge {
    background: var(--nova-green-100) !important;
    border-color: var(--nova-green-700) !important;
    color: var(--nova-green-950) !important;
}

.game-card-casino {
    background:
        linear-gradient(145deg, rgba(7, 93, 56, 0.35), rgba(3, 48, 28, 0.86)),
        url("../img/casino_hero.jpg") center / cover no-repeat !important;
    border-color: rgba(244, 123, 32, 0.62) !important;
}

.game-card-casino:hover {
    border-color: #ffb169 !important;
    box-shadow: 0 20px 46px rgba(244, 123, 32, 0.25) !important;
}

.game-card-casino h5,
.game-card-casino .desc,
.game-card-casino .game-category {
    color: #f4fff7 !important;
}

.game-card-casino .game-icon {
    color: #ffd28c !important;
}

.game-card-casino .badge-play {
    background: #c9f4d7 !important;
    color: var(--nova-green-950) !important;
}

.game-card-casino .badge-soon {
    background: rgba(244, 123, 32, 0.2) !important;
    color: #ffe0bf !important;
    border-color: rgba(255, 177, 105, 0.5) !important;
}

.footer,
.landing-page .bottom-bar {
    background: linear-gradient(105deg, var(--nova-green-950), var(--nova-green-800)) !important;
    border-top: 3px solid var(--nova-orange) !important;
    color: #dff8e7 !important;
}

.footer h5,
.footer h6,
.footer p,
.footer a,
.footer .small,
.landing-page .bottom-bar .item {
    color: #e8fff0 !important;
}

.footer a:hover {
    color: #ffc184 !important;
}

.landing-page {
    background: #d3f1dc !important;
}

.landing-page .split-sports,
.landing-page .split-casino {
    border-color: rgba(244, 123, 32, 0.72) !important;
}

.landing-page .tag-sports,
.landing-page .tag-casino {
    border-color: rgba(255, 208, 157, 0.78) !important;
    background: rgba(7, 93, 56, 0.5) !important;
    color: #f3fff6 !important;
}

.landing-page .btn-sports {
    background: linear-gradient(115deg, var(--nova-orange), #ffad5a) !important;
    color: #4e2107 !important;
    box-shadow: 0 12px 34px rgba(244, 123, 32, 0.38) !important;
}

.landing-page .btn-casino {
    background: linear-gradient(115deg, var(--nova-green-800), var(--nova-green-500)) !important;
}

.landing-page .bottom-bar .item .ico {
    color: #ffd19a !important;
    background: rgba(244, 123, 32, 0.22) !important;
}

.auth-page {
    background:
        radial-gradient(circle at 12% 8%, rgba(244, 123, 32, 0.2), transparent 20rem),
        linear-gradient(135deg, rgba(7, 93, 56, 0.94), rgba(202, 239, 214, 0.96)),
        url("../img/casino_hero.jpg") center / cover no-repeat !important;
}

.auth-page .login-card,
.auth-page .card {
    background: linear-gradient(145deg, rgba(237, 252, 242, 0.98), rgba(207, 240, 218, 0.98)) !important;
    border: 1px solid rgba(7, 93, 56, 0.24) !important;
    border-left: 9px solid var(--nova-orange) !important;
    border-radius: 22px !important;
    box-shadow: 0 26px 70px rgba(7, 59, 37, 0.28) !important;
}

.auth-page .logo {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 0.9rem 0.5rem 0.8rem;
    border-left: 6px solid var(--nova-orange);
    border-radius: 4px;
    color: var(--nova-green-950) !important;
    -webkit-text-fill-color: var(--nova-green-950) !important;
    background: rgba(244, 123, 32, 0.1) !important;
}

.auth-page .logo .brand-mark {
    width: 2.25rem;
    height: 2.25rem;
}

.auth-page .text-muted,
.auth-page .text-secondary {
    color: var(--nova-green-900) !important;
}

.auth-page .login-back,
.auth-page a.login-back {
    color: var(--nova-green-800) !important;
}

.auth-page .login-back:hover,
.auth-page a.login-back:hover {
    color: var(--nova-orange-dark) !important;
}

.auth-page .alert {
    font-weight: 650;
    line-height: 1.45;
}

.auth-page .alert-success {
    background: #d1fae5 !important;
    border-color: #6ee7b7 !important;
    color: #065f46 !important;
}

.auth-page .alert-danger {
    background: #fee2e2 !important;
    border-color: #fca5a5 !important;
    color: #991b1b !important;
}

.auth-page .alert-warning {
    background: #fef3c7 !important;
    border-color: #fcd34d !important;
    color: #92400e !important;
}

.auth-page .alert-info {
    background: #dbeafe !important;
    border-color: #93c5fd !important;
    color: #1e40af !important;
}

.auth-page .reset-account {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    padding: .8rem .95rem;
    border: 1px solid #9fd9b6;
    border-radius: 12px;
    background: rgba(255, 255, 255, .72);
    color: #123b29;
}

.auth-page .reset-account-label {
    color: #35614a;
    font-size: .72rem;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.auth-page .reset-account strong {
    overflow-wrap: anywhere;
    color: #123b29;
}

.crash-page .crash-graph-card,
.crash-page .crash-panel,
.crash-page .history-bar,
.mines-wrap .mines-board,
.mines-wrap .mines-panel,
.game-shell,
.slots-machine {
    background:
        radial-gradient(circle at 92% 8%, rgba(47, 200, 115, 0.14), transparent 12rem),
        linear-gradient(145deg, #dff7e6, #bfe9cc) !important;
    border-color: rgba(7, 93, 56, 0.24) !important;
    box-shadow: 0 22px 50px rgba(7, 93, 56, 0.16) !important;
}

.crash-page .crash-tabs,
.crash-page .quick-bets button,
.mines-wrap .mult-box,
.ctrl-box,
.slots-controls,
.reels-wrap {
    border-color: rgba(7, 93, 56, 0.18) !important;
    background: rgba(237, 252, 242, 0.76) !important;
}

.crash-page .crash-mult-big,
.limbo-mult-overlay,
.slots-title,
.slots-machine .win-box .title,
.slots-machine .win-box .amount {
    color: var(--nova-green-900) !important;
    text-shadow: 0 0 30px rgba(47, 200, 115, 0.38) !important;
}

.mines-wrap .mine-cell {
    border-color: rgba(7, 93, 56, 0.18) !important;
    background: linear-gradient(145deg, #aee4bd, #7ccc96) !important;
}

.mines-wrap .mine-cell:not(:disabled):hover {
    border-color: var(--nova-orange) !important;
    background: linear-gradient(145deg, #d0f4da, #91dca6) !important;
    box-shadow: 0 8px 18px rgba(244, 123, 32, 0.2) !important;
}

.plinko-stage,
.limbo-stage {
    border-color: rgba(7, 93, 56, 0.22) !important;
    background:
        radial-gradient(ellipse at 50% 8%, rgba(47, 200, 115, 0.28), transparent 42%),
        linear-gradient(180deg, #c9efd5, #8dd3a3) !important;
}

@media (max-width: 640px) {
    body {
        border-top-width: 12px;
        border-bottom-width: 12px;
    }

    .auth-page .login-card,
    .auth-page .card {
        border-left-width: 7px !important;
    }

    .auth-page .logo {
        font-size: 1.85rem;
    }
}

/* Ajuste final solicitado: marco verde, acciones naranjas y navegación más
   visible. Se mantiene como último bloque para vencer los estilos heredados. */
body {
    border-top: 10px solid var(--nova-orange) !important;
    border-bottom: 10px solid var(--nova-orange) !important;
}

.landing-page {
    background:
        radial-gradient(circle at 50% 18%, rgba(47, 200, 115, 0.18), transparent 30rem),
        linear-gradient(145deg, #bde8c9 0%, #e9faed 48%, #b4e2c1 100%) !important;
}

.landing-page .top-nav {
    min-height: 78px;
    background: linear-gradient(105deg, #073b25 0%, #0a5d38 58%, #0d7545 100%) !important;
    border-top: 0 !important;
    border-bottom: 5px solid var(--nova-orange) !important;
}

.landing-page .top-nav .logo {
    font-size: clamp(1.45rem, 2.2vw, 2rem) !important;
    color: #f4fff7 !important;
    -webkit-text-fill-color: #f4fff7 !important;
}

.landing-page .nav-links {
    align-items: center;
    gap: .3rem;
}

.landing-page .nav-links a {
    position: relative;
    margin: 0 !important;
    padding: .72rem .9rem !important;
    border-radius: 10px;
    color: #f2fff5 !important;
    font-size: .9rem !important;
    letter-spacing: .35px;
    transition: transform .2s ease, color .2s ease, background .2s ease !important;
}

.landing-page .nav-links a:hover {
    color: #173d2a !important;
    background: var(--nova-orange) !important;
    transform: translateY(-2px);
}

.landing-page .btn-login,
.landing-page .btn-register {
    position: relative;
    overflow: hidden;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .75rem 1.25rem !important;
    border-radius: 12px !important;
    font-size: 1rem !important;
    letter-spacing: .01em;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease !important;
}

.landing-page .btn-login {
    border: 2px solid var(--nova-orange) !important;
    color: #fff5eb !important;
    background: rgba(244, 123, 32, .16) !important;
}

.landing-page .btn-register,
.landing-page .btn-sports,
.landing-page .btn-casino {
    background: linear-gradient(120deg, #f47b20, #ffae68) !important;
    color: #3f1b08 !important;
    box-shadow: 0 12px 28px rgba(244, 123, 32, .38) !important;
}

.landing-page .btn-login:hover,
.landing-page .btn-register:hover,
.landing-page .btn-sports:hover,
.landing-page .btn-casino:hover {
    color: #173d2a !important;
    background: linear-gradient(120deg, #ff9a4d, #ffc083) !important;
    transform: translateY(-3px) scale(1.025);
    box-shadow: 0 16px 34px rgba(244, 123, 32, .5) !important;
}

.landing-page .split-hero {
    background: #0a5d38;
}

.landing-page .split-sports,
.landing-page .split-casino {
    border-color: var(--nova-orange) !important;
}

.landing-page .split-sports {
    background:
        linear-gradient(135deg, rgba(5, 59, 35, .78), rgba(10, 93, 56, .58)),
        url('https://images.unsplash.com/photo-1522778119026-d647f0596c20?w=1400&q=85') center/cover no-repeat !important;
}

.landing-page .split-casino {
    background:
        linear-gradient(135deg, rgba(5, 59, 35, .68), rgba(10, 93, 56, .4)),
        url('../img/casino_hero.jpg') center/cover no-repeat !important;
}

.landing-page .split-hero::before,
.landing-page .split-line {
    background: var(--nova-orange) !important;
    box-shadow: 0 0 16px rgba(244, 123, 32, .9), 0 0 30px rgba(244, 123, 32, .55) !important;
}

.landing-page .hero-emblem {
    border-color: var(--nova-orange) !important;
    background: rgba(244, 123, 32, .28) !important;
    color: #ffc083 !important;
    animation: novaFloat 3s ease-in-out infinite;
}

.landing-page .hero-emblem.casino-emblem {
    animation-delay: -.9s;
}

.landing-page .tag-sports,
.landing-page .tag-casino {
    background: rgba(244, 123, 32, .24) !important;
    border-color: #ffb16f !important;
    color: #fff5eb !important;
}

.landing-page a.btn-side,
.landing-page .btn-side {
    min-width: 320px !important;
    min-height: 72px;
    padding: 1.15rem 2.5rem !important;
    font-size: clamp(1.25rem, 2vw, 1.65rem) !important;
}

.landing-page .bottom-bar {
    padding: 1.25rem .8rem !important;
    background: linear-gradient(105deg, #073b25, #0d7545) !important;
    border-top: 5px solid var(--nova-orange) !important;
}

.landing-page .bottom-bar .item {
    gap: .8rem;
    color: #f4fff7 !important;
    font-size: clamp(.94rem, 1.45vw, 1.2rem) !important;
}

.landing-page .bottom-bar .item .ico {
    width: 58px !important;
    height: 58px !important;
    border-radius: 16px !important;
    color: #fff0df !important;
    background: linear-gradient(135deg, var(--nova-orange), #ffad5a) !important;
    box-shadow: 0 8px 20px rgba(244, 123, 32, .34);
    font-size: 1.6rem !important;
}

.navbar {
    min-height: 72px;
    background: linear-gradient(105deg, #ff6b00, #e94d00 62%, #c93400) !important;
    border-bottom: 4px solid #ffb347 !important;
}

.navbar .nav-link {
    padding: .65rem .82rem !important;
    border-radius: 10px;
    color: #effff4 !important;
    font-size: .9rem;
    font-weight: 800;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
    color: #9d2d00 !important;
    background: rgba(255, 255, 255, .96) !important;
}

.navbar .btn-outline-light,
.navbar .btn-primary,
.navbar .balance-badge {
    min-height: 42px;
}

.navbar-user-label {
    display: inline-flex;
    align-items: center;
    gap: .42rem;
    min-height: 42px;
    max-width: 150px;
    color: #fff !important;
    font-size: .88rem;
    font-weight: 800;
    white-space: nowrap;
}

.navbar-user-label span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.navbar-user-label i {
    color: #ffd447;
    flex: 0 0 auto;
}

.navbar-logout {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 255, 255, .62);
    border-radius: 10px;
    color: #fff !important;
    background: rgba(111, 14, 11, .25);
    font-size: 1.05rem;
    text-decoration: none !important;
    transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.navbar-logout:hover,
.navbar-logout:focus-visible {
    color: #fff !important;
    background: #c92312;
    border-color: #fff;
    transform: translateY(-1px);
}

.navbar-logout:focus-visible {
    outline: 3px solid rgba(255, 212, 71, .75);
    outline-offset: 2px;
}

@keyframes novaFloat {
    0%, 100% { transform: translateY(0) rotate(-5deg); }
    50% { transform: translateY(-7px) rotate(-2deg); }
}

.hero-emblem.casino-emblem {
    transform: rotate(5deg);
}

@media (max-width: 991px) {
    .landing-page .top-nav {
        min-height: 68px;
    }
    .landing-page .top-nav .container-fluid {
        gap: .4rem;
    }
    .landing-page .btn-login,
    .landing-page .btn-register {
        min-height: 42px;
        padding: .55rem .78rem !important;
        font-size: .82rem !important;
    }
    .landing-page a.btn-side,
    .landing-page .btn-side {
        min-width: 250px !important;
    }
}

@media (max-width: 640px) {
    body {
        border-top-width: 7px !important;
        border-bottom-width: 7px !important;
    }
    .landing-page .top-nav .logo {
        font-size: 1.25rem !important;
    }
    .landing-page .btn-login,
    .landing-page .btn-register {
        min-height: 38px;
        padding: .42rem .6rem !important;
        font-size: .72rem !important;
    }
    .landing-page .hero-emblem {
        width: 74px;
        height: 74px;
        border-radius: 21px;
        font-size: 2.2rem;
    }
    .landing-page .bottom-bar .item {
        flex-direction: column;
        text-align: center;
        gap: .35rem;
        font-size: .78rem !important;
    }
    .landing-page .bottom-bar .item .ico {
        width: 48px !important;
        height: 48px !important;
        font-size: 1.25rem !important;
    }
    .navbar .nav-link {
        font-size: .82rem;
    }
}

/* Premium table scenes: presentation-only layer for the professional catalog games. */
.catalog-game-page {
    max-width: 1180px !important;
}

.catalog-game-page .catalog-game-top {
    margin-bottom: .35rem;
}

.catalog-game-page .catalog-game-top a {
    color: #b9b2dc !important;
    font-size: .72rem !important;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.catalog-game-page .catalog-game-top a:hover {
    color: #fbbf24 !important;
}

.catalog-game-page .catalog-stage {
    min-height: 560px;
    padding: clamp(1.25rem, 2.8vw, 2rem) !important;
    border: 1px solid rgba(167, 139, 250, .33) !important;
    border-radius: 26px !important;
    background:
        radial-gradient(circle at 88% 8%, rgba(34, 211, 238, .15), transparent 18rem),
        radial-gradient(circle at 12% 92%, rgba(139, 92, 246, .18), transparent 20rem),
        linear-gradient(145deg, #151536 0%, #0d102b 58%, #08091e 100%) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .32), inset 0 1px rgba(255, 255, 255, .08) !important;
}

.catalog-game-page .catalog-stage::after {
    width: 420px !important;
    height: 420px !important;
    bottom: -230px !important;
    left: -160px !important;
    border: 1px solid rgba(196, 181, 253, .07) !important;
    box-shadow: 0 0 0 34px rgba(196, 181, 253, .025), 0 0 0 68px rgba(196, 181, 253, .018) !important;
}

.catalog-game-page .catalog-game-kicker {
    position: relative;
    z-index: 1;
    color: #fbbf24 !important;
    letter-spacing: .18em;
    font-size: .64rem !important;
}

.catalog-game-page .catalog-stage h1 {
    position: relative;
    z-index: 1;
    margin-top: .45rem !important;
    color: #fff !important;
    font-size: clamp(1.85rem, 4vw, 3rem) !important;
    letter-spacing: -.055em;
    text-shadow: 0 0 30px rgba(167, 139, 250, .22);
}

.catalog-game-page .catalog-stage-sub {
    position: relative;
    z-index: 1;
    max-width: 680px;
    margin: .62rem 0 1.35rem !important;
    color: #b7b8d0 !important;
    font-size: .82rem !important;
}

.catalog-game-page .catalog-controls {
    border: 1px solid rgba(167, 139, 250, .22) !important;
    border-radius: 22px !important;
    background: linear-gradient(145deg, rgba(24, 22, 59, .96), rgba(10, 11, 34, .98)) !important;
    color: #f7f7fb !important;
    box-shadow: 0 20px 48px rgba(0, 0, 0, .22) !important;
}

.catalog-game-page .catalog-controls-title h2 {
    color: #fff !important;
}

.catalog-game-page .sound-toggle,
.catalog-game-page .game-input,
.catalog-game-page .choice,
.catalog-game-page .number-choice {
    border-color: rgba(167, 139, 250, .28) !important;
    background: rgba(255, 255, 255, .045) !important;
    color: #e9e7f8 !important;
}

.catalog-game-page .sound-toggle:hover,
.catalog-game-page .choice:hover,
.catalog-game-page .choice.is-selected,
.catalog-game-page .number-choice.is-selected {
    border-color: #fbbf24 !important;
    background: rgba(251, 191, 36, .15) !important;
    color: #fff !important;
}

.catalog-game-page .input-label,
.catalog-game-page .blackjack-note,
.catalog-game-page .game-history small {
    color: #aeb0c9 !important;
}

.catalog-game-page .game-input:focus {
    border-color: #22d3ee !important;
    box-shadow: 0 0 0 .18rem rgba(34, 211, 238, .12) !important;
}

.catalog-game-page .catalog-play-button {
    background: linear-gradient(110deg, #8b5cf6, #ec4899) !important;
    color: #fff !important;
    box-shadow: 0 12px 28px rgba(139, 92, 246, .3) !important;
}

.catalog-game-page .catalog-play-button:hover {
    filter: brightness(1.1);
    transform: translateY(-2px);
}

.catalog-game-page .game-potential {
    color: #afb3cc !important;
    background: rgba(52, 211, 153, .08) !important;
}

.catalog-game-page .game-potential strong {
    color: #6ee7b7 !important;
}

.catalog-game-page .history-item {
    color: #b7f5d7 !important;
    background: rgba(52, 211, 153, .1) !important;
}

.catalog-game-page .history-item.lose {
    color: #fecdd3 !important;
    background: rgba(251, 113, 133, .1) !important;
}

.catalog-game-page .game-result {
    min-height: 66px;
    color: #c4c6da !important;
    font-size: .88rem !important;
}

.catalog-game-page .game-result.is-win {
    color: #86efac !important;
}

.catalog-game-page .game-result.is-lose {
    color: #fda4af !important;
}

.game-scene {
    isolation: isolate;
    overflow: hidden !important;
    min-height: 328px !important;
    padding: 1rem 1.2rem 1.15rem !important;
    display: block !important;
    border: 1px solid rgba(196, 181, 253, .22) !important;
    border-radius: 20px !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .055), transparent 34%),
        rgba(5, 6, 24, .52) !important;
    text-align: left !important;
}

.game-scene::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: .35;
    background-image: linear-gradient(115deg, transparent 0 48%, rgba(255, 255, 255, .035) 48.2% 48.5%, transparent 48.8%);
    background-size: 76px 76px;
}

.scene-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
    color: #a5b4fc;
    font-size: .61rem;
    font-weight: 900;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.scene-status {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: #6ee7b7;
    font-size: .56rem;
    letter-spacing: .12em;
}

.scene-status i {
    width: .38rem;
    height: .38rem;
    border-radius: 50%;
    background: #34d399;
    box-shadow: 0 0 12px #34d399;
}

.scene-caption {
    display: block;
    color: #9aa1c2;
    font-size: .55rem;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
}

/* European roulette. */
.game-theme-roulette .game-scene {
    background:
        radial-gradient(circle at 62% 52%, rgba(34, 211, 238, .09), transparent 13rem),
        linear-gradient(140deg, rgba(20, 67, 72, .62), rgba(5, 6, 24, .7) 66%) !important;
}

.roulette-layout {
    display: grid;
    grid-template-columns: minmax(230px, 1fr) minmax(130px, .62fr);
    align-items: center;
    gap: clamp(1rem, 3vw, 2.3rem);
    min-height: 246px;
    margin-top: .35rem;
}

.roulette-wheel-wrap {
    display: grid;
    place-items: center;
}

.roulette-wheel {
    position: relative;
    width: clamp(190px, 28vw, 246px);
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #08101f;
    box-shadow: 0 0 0 8px rgba(196, 181, 253, .08), 0 20px 42px rgba(0, 0, 0, .4), inset 0 0 32px rgba(0, 0, 0, .7);
}

.roulette-wheel-ring {
    position: absolute;
    inset: 9%;
    border-radius: 50%;
    background: repeating-conic-gradient(from 2deg, #0d7a67 0deg 9.73deg, #ae3359 9.73deg 19.46deg, #101931 19.46deg 29.19deg);
    border: 7px solid #c9a45a;
    box-shadow: inset 0 0 0 6px #16233e, inset 0 0 0 12px #c9a45a, 0 0 22px rgba(34, 211, 238, .14);
}

.roulette-wheel-ring::after {
    content: "";
    position: absolute;
    inset: 14%;
    border-radius: 50%;
    border: 1px dashed rgba(255, 255, 255, .3);
}

.roulette-wheel-numbers {
    position: absolute;
    inset: 22%;
    z-index: 2;
    display: grid;
    place-items: center;
    color: rgba(255, 255, 255, .73);
    font-size: .57rem;
    font-weight: 900;
    letter-spacing: .09em;
    line-height: 1.8;
    text-align: center;
    transform: rotate(-12deg);
}

.roulette-wheel-hub {
    position: relative;
    z-index: 3;
    width: 35%;
    aspect-ratio: 1;
    display: grid;
    place-content: center;
    text-align: center;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 25%, #394e75, #11182d 70%);
    border: 2px solid #d9b96a;
    box-shadow: 0 0 0 5px rgba(15, 24, 45, .78), 0 0 24px rgba(251, 191, 36, .18);
}

.roulette-wheel-hub strong {
    color: #fff;
    font-size: clamp(1.4rem, 4vw, 2rem);
    line-height: 1;
}

.roulette-wheel-hub small {
    margin-top: .3rem;
    color: #a9b6d8;
    font-size: .4rem;
    font-weight: 900;
    letter-spacing: .12em;
}

.roulette-ball {
    position: absolute;
    z-index: 4;
    top: 7%;
    left: calc(50% - 5px);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 12px #fff, 0 0 0 2px rgba(255, 255, 255, .24);
}

.roulette-side-readout {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: 1rem;
    border-left: 1px solid rgba(196, 181, 253, .15);
}

.roulette-side-readout strong {
    color: #fbbf24;
    font-size: clamp(1.15rem, 3vw, 1.65rem);
    letter-spacing: -.04em;
}

.roulette-side-note {
    color: #afb5d0;
    font-size: .68rem;
    line-height: 1.45;
}

.roulette-chip-stack {
    position: relative;
    width: 60px;
    height: 32px;
    margin-top: .5rem;
}

.roulette-chip-stack i {
    position: absolute;
    width: 27px;
    height: 27px;
    border: 3px dashed rgba(255, 255, 255, .7);
    border-radius: 50%;
    background: #d84667;
    box-shadow: 0 3px 0 #8b2445;
}

.roulette-chip-stack i:nth-child(1) { left: 0; top: 3px; background: #22d3ee; }
.roulette-chip-stack i:nth-child(2) { left: 16px; top: 0; background: #fbbf24; }
.roulette-chip-stack i:nth-child(3) { left: 32px; top: 4px; background: #8b5cf6; }

.roulette-scene.is-spinning .roulette-chip-stack i {
    animation: rouletteChipToss .7s cubic-bezier(.2, .8, .28, 1) both;
}

.roulette-scene.is-spinning .roulette-chip-stack i:nth-child(2) { animation-delay: 70ms; }
.roulette-scene.is-spinning .roulette-chip-stack i:nth-child(3) { animation-delay: 140ms; }

.roulette-wheel.is-spinning .roulette-wheel-ring {
    animation: rouletteSpin 1.35s cubic-bezier(.15, .8, .25, 1);
}

.roulette-wheel.is-spinning .roulette-ball {
    animation: rouletteBall 1.35s cubic-bezier(.16, .8, .3, 1);
}

@keyframes rouletteSpin {
    from { transform: rotate(0); }
    to { transform: rotate(740deg); }
}

@keyframes rouletteBall {
    0% { transform: translate(0, 0); }
    35% { transform: translate(67px, 20px); }
    68% { transform: translate(-61px, 40px); }
    100% { transform: translate(0, 0); }
}

@keyframes rouletteChipToss {
    0% { opacity: .45; transform: translateY(13px) rotate(-18deg) scale(.8); }
    65% { transform: translateY(-7px) rotate(8deg) scale(1.08); }
    100% { opacity: 1; transform: translateY(0) rotate(0) scale(1); }
}

/* Blackjack felt and dealing areas. */
.game-theme-blackjack .game-scene {
    background:
        radial-gradient(ellipse at 50% 88%, rgba(52, 211, 153, .18), transparent 48%),
        linear-gradient(145deg, rgba(9, 69, 64, .82), rgba(5, 19, 31, .78) 72%) !important;
}

.blackjack-table {
    position: relative;
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: .7rem;
    min-height: 244px;
    padding: .8rem 0 0 !important;
}

.blackjack-table::before {
    content: "";
    position: absolute;
    left: 9%;
    right: 9%;
    bottom: 5%;
    height: 52%;
    border: 1px solid rgba(110, 231, 183, .2);
    border-bottom: 0;
    border-radius: 50% 50% 0 0;
    pointer-events: none;
}

.blackjack-table-head {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .8rem;
    color: #b7f5d7;
    font-size: .57rem;
    font-weight: 900;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.blackjack-table-head b {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 1px solid rgba(251, 191, 36, .55);
    border-radius: 50%;
    color: #fbbf24;
    font-size: 1rem;
}

.blackjack-seat {
    position: relative;
    z-index: 1;
    min-width: 0;
    padding: .85rem .55rem !important;
    border: 1px solid rgba(110, 231, 183, .2) !important;
    border-radius: 15px !important;
    background: rgba(3, 25, 32, .44) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, .04);
}

.blackjack-seat-player {
    border-color: rgba(251, 191, 36, .27) !important;
}

.blackjack-seat-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #a9dec0 !important;
    font-size: .62rem !important;
}

.seat-marker {
    color: #8592b4;
    font-size: .46rem;
    letter-spacing: .12em;
}

.blackjack-cards {
    min-height: 83px !important;
    margin-top: .7rem !important;
}

.playing-card {
    width: 49px !important;
    height: 70px !important;
    border: 1px solid rgba(255, 255, 255, .65);
    background: linear-gradient(145deg, #fff, #dfe8f2) !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, .3) !important;
    font-family: Georgia, serif !important;
}

.playing-card.card-red {
    color: #d64c67 !important;
}

.playing-card.card-back {
    color: #c4b5fd !important;
    background:
        repeating-linear-gradient(45deg, #252052 0 5px, #30286d 5px 10px) !important;
    border: 2px solid rgba(196, 181, 253, .7) !important;
}

.blackjack-total {
    color: #f8fafc !important;
    font-size: .73rem !important;
}

/* The same cards are used by Baccarat, with its own table geometry. */
.game-theme-baccarat .game-scene {
    background:
        radial-gradient(circle at 50% 45%, rgba(244, 114, 182, .1), transparent 13rem),
        linear-gradient(145deg, rgba(71, 31, 70, .7), rgba(15, 10, 35, .82) 70%) !important;
}

.baccarat-table {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 74px 1fr;
    align-items: center;
    gap: .65rem;
    min-height: 246px;
    margin-top: .35rem;
}

.baccarat-hand {
    min-width: 0;
    padding: .8rem .5rem;
    border: 1px solid rgba(244, 114, 182, .25);
    border-radius: 15px;
    background: rgba(8, 7, 28, .48);
}

.baccarat-hand[data-hand="banker"] {
    border-color: rgba(34, 211, 238, .25);
}

.baccarat-hand-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #f9a8d4;
    font-size: .59rem;
    font-weight: 900;
    letter-spacing: .12em;
}

.baccarat-hand[data-hand="banker"] .baccarat-hand-title {
    color: #67e8f9;
}

.baccarat-hand-title strong {
    color: #fff;
    font-size: 1rem;
}

.baccarat-cards {
    display: flex;
    justify-content: center;
    gap: .25rem;
    min-height: 79px;
    margin-top: .7rem;
}

.baccarat-cards .playing-card {
    width: 43px !important;
    height: 63px !important;
    font-size: .85rem;
}

.baccarat-seal {
    display: grid;
    place-items: center;
    gap: .32rem;
    color: #fbbf24;
    text-align: center;
}

.baccarat-seal span {
    display: grid;
    width: 53px;
    height: 53px;
    place-items: center;
    border: 1px solid rgba(251, 191, 36, .7);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(251, 191, 36, .24), rgba(251, 191, 36, .03));
    font-size: 1rem;
    font-weight: 900;
    box-shadow: 0 0 25px rgba(251, 191, 36, .12);
}

.baccarat-seal small {
    color: #c5bca0;
    font-size: .42rem;
    font-weight: 900;
    letter-spacing: .12em;
    line-height: 1.35;
}

/* Keno draw chamber and selected-number ribbon. */
.game-theme-keno .game-scene {
    background:
        radial-gradient(circle at 50% 46%, rgba(34, 211, 238, .16), transparent 13rem),
        linear-gradient(145deg, rgba(20, 44, 73, .82), rgba(7, 10, 34, .82) 72%) !important;
}

.keno-draw-stage {
    position: relative;
    display: grid;
    min-height: 206px;
    place-items: center;
    margin-top: .25rem;
}

.keno-orbit {
    position: absolute;
    width: min(260px, 78%);
    aspect-ratio: 1;
    border: 1px dashed rgba(34, 211, 238, .26);
    border-radius: 50%;
    animation: kenoOrbit 18s linear infinite;
}

.keno-orbit::before,
.keno-orbit::after {
    content: "";
    position: absolute;
    inset: 12%;
    border: 1px solid rgba(139, 92, 246, .18);
    border-radius: 50%;
}

.keno-orbit::after {
    inset: 25%;
    border-color: rgba(251, 191, 36, .14);
}

.keno-draw-ball {
    position: absolute;
    display: grid;
    width: 25px;
    height: 25px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 50%;
    background: linear-gradient(145deg, #22d3ee, #2563eb);
    color: #fff;
    font-size: .62rem;
    font-weight: 900;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .3), 0 0 12px rgba(34, 211, 238, .25);
}

.keno-draw-ball:nth-child(1) { left: 47%; top: -12px; }
.keno-draw-ball:nth-child(2) { right: 16%; top: 7%; }
.keno-draw-ball:nth-child(3) { right: -9px; top: 43%; }
.keno-draw-ball:nth-child(4) { right: 16%; bottom: 7%; }
.keno-draw-ball:nth-child(5) { left: 47%; bottom: -12px; }
.keno-draw-ball:nth-child(6) { left: 16%; bottom: 7%; }
.keno-draw-ball:nth-child(7) { left: -9px; top: 43%; }
.keno-draw-ball:nth-child(8) { left: 16%; top: 7%; }
.keno-draw-ball:nth-child(9) { left: 30%; top: 4%; }
.keno-draw-ball:nth-child(10) { right: 30%; bottom: 4%; }

.keno-drum {
    position: relative;
    z-index: 2;
    display: grid;
    width: 116px;
    height: 116px;
    place-content: center;
    border: 1px solid rgba(34, 211, 238, .7);
    border-radius: 50%;
    background: radial-gradient(circle at 35% 25%, #243d75, #0d1231 67%);
    text-align: center;
    box-shadow: 0 0 0 8px rgba(34, 211, 238, .06), 0 0 42px rgba(34, 211, 238, .18);
}

.keno-drum-ring {
    position: absolute;
    inset: 10px;
    border: 1px solid rgba(251, 191, 36, .35);
    border-radius: 50%;
}

.keno-drum strong {
    color: #fff;
    font-size: 2rem;
    line-height: 1;
}

.keno-drum small {
    margin-top: .35rem;
    color: #8de9fa;
    font-size: .43rem;
    font-weight: 900;
    letter-spacing: .18em;
}

.keno-picks {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
    padding: .55rem .65rem;
    border-top: 1px solid rgba(196, 181, 253, .13);
}

.keno-picks > span {
    color: #aeb8d5;
    font-size: .52rem;
    font-weight: 900;
    letter-spacing: .12em;
}

.keno-picks > div {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .28rem;
}

.keno-picks i {
    color: #8e96b5;
    font-size: .62rem;
    font-style: normal;
}

.keno-pick-chip,
.result-chip {
    display: inline-grid;
    min-width: 25px;
    height: 25px;
    place-items: center;
    border: 1px solid rgba(34, 211, 238, .4);
    border-radius: 50%;
    color: #dffbff;
    background: rgba(34, 211, 238, .13);
    font-size: .61rem;
    font-weight: 900;
}

.game-theme-keno .result-chips {
    gap: .45rem;
    padding: .2rem;
}

.game-theme-keno .result-chip {
    border-color: rgba(251, 191, 36, .52);
    color: #fff1b3;
    background: rgba(251, 191, 36, .14);
}

.keno-scene.is-drawing .keno-orbit {
    animation-duration: 1.1s;
}

.keno-scene.is-drawing .keno-draw-ball {
    animation: kenoBallPulse .55s ease-in-out infinite alternate;
}

.keno-scene.is-drawing .keno-drum {
    animation: kenoDrumPulse .75s ease-in-out infinite alternate;
}

@keyframes kenoOrbit {
    to { transform: rotate(360deg); }
}

@keyframes kenoBallPulse {
    to { transform: scale(1.22); filter: brightness(1.35); }
}

@keyframes kenoDrumPulse {
    to { transform: scale(1.06); box-shadow: 0 0 0 12px rgba(34, 211, 238, .08), 0 0 55px rgba(34, 211, 238, .34); }
}

@keyframes dealCard {
    from { opacity: 0; transform: translateY(-18px) rotate(-7deg) scale(.86); }
    to { opacity: 1; transform: translateY(0) rotate(0) scale(1); }
}

.playing-card {
    animation: dealCard .42s cubic-bezier(.2, .8, .25, 1) both;
    animation-delay: calc(var(--card-index, 0) * 90ms);
}

@media (max-width: 820px) {
    .catalog-game-page .catalog-stage {
        min-height: 520px;
    }
}

@media (max-width: 560px) {
    .catalog-game-page .catalog-stage {
        padding: 1rem !important;
        border-radius: 20px !important;
    }

    .game-scene {
        min-height: 332px !important;
        padding: .85rem !important;
    }

    .roulette-layout {
        grid-template-columns: 1fr;
        gap: .1rem;
        min-height: 250px;
    }

    .roulette-wheel {
        width: 190px;
    }

    .roulette-side-readout {
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: center;
        column-gap: .55rem;
        padding: .55rem .35rem 0;
        border-top: 1px solid rgba(196, 181, 253, .15);
        border-left: 0;
    }

    .roulette-side-readout .roulette-side-note,
    .roulette-chip-stack {
        display: none;
    }

    .blackjack-table {
        gap: .4rem;
    }

    .blackjack-table-head span:last-child {
        display: none;
    }

    .playing-card {
        width: 42px !important;
        height: 62px !important;
        font-size: .82rem;
    }

    .baccarat-table {
        grid-template-columns: 1fr 48px 1fr;
        gap: .25rem;
    }

    .baccarat-seal span {
        width: 42px;
        height: 42px;
        font-size: .8rem;
    }

    .baccarat-seal small {
        font-size: .34rem;
    }

    .baccarat-cards .playing-card {
        width: 34px !important;
        height: 54px !important;
        font-size: .68rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .game-scene *,
    .game-scene::before {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* Corrección final de legibilidad.
   Deliberadamente no incluye selectores de la barra de navegación. */
body {
    background: #f7f8f6 !important;
    color: #17372b !important;
}

body::before {
    opacity: .16;
    background-image:
        linear-gradient(rgba(20, 67, 48, .045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(20, 67, 48, .045) 1px, transparent 1px);
}

.footer,
.landing-page .bottom-bar {
    background: linear-gradient(105deg, #ff6b00, #e94d00 62%, #c93400) !important;
    border-top: 4px solid #ffb347 !important;
    color: #fff !important;
}

.footer h5,
.footer h6,
.footer p,
.footer a,
.footer .small,
.landing-page .bottom-bar .item {
    color: #fff !important;
}

.footer a:hover {
    color: #fff1df !important;
}

.wallet-page {
    color: #17372b !important;
}

.wallet-page .wallet-heading {
    background: linear-gradient(115deg, #10243f, #241b45) !important;
    border-color: rgba(255, 107, 0, .5) !important;
}

.wallet-page .wallet-heading .section-title,
.wallet-page .wallet-heading .wallet-subtitle {
    color: #fff !important;
}

.wallet-page .wallet-heading .eyebrow {
    color: #baf54a !important;
}

.wallet-page .wallet-balance-card,
.wallet-page .wallet-action-card,
.wallet-page .wallet-withdraw-card {
    background: #fff !important;
    border-color: #cbd8d1 !important;
    color: #17372b !important;
    box-shadow: 0 12px 30px rgba(27, 57, 44, .1) !important;
}

.wallet-page .wallet-card-label,
.wallet-page .wallet-balance-value,
.wallet-page .wallet-balance-foot,
.wallet-page .wallet-action-heading h5,
.wallet-page .wallet-section-heading h5,
.wallet-page .wallet-type {
    color: #17372b !important;
    text-shadow: none !important;
}

.wallet-page .wallet-action-heading p,
.wallet-page .form-text,
.wallet-page .text-muted,
.wallet-page .wallet-note {
    color: #52695f !important;
}

.wallet-page .form-label {
    color: #294c3d !important;
}

.wallet-page .form-control,
.wallet-page .form-select {
    background: #fff !important;
    border-color: #91a99e !important;
    color: #17372b !important;
}

.wallet-page .form-control::placeholder {
    color: #687d74 !important;
}

.wallet-page .wallet-table-wrap,
.wallet-page .wallet-empty-state {
    background: #fff !important;
    border-color: #cbd8d1 !important;
}

.wallet-page .wallet-table,
.wallet-page .table-dark {
    --bs-table-bg: #fff !important;
    --bs-table-striped-bg: #f4f7f5 !important;
    --bs-table-hover-bg: #eef5f1 !important;
    --bs-table-border-color: #d7e0dc !important;
    --bs-table-color: #17372b !important;
}

.wallet-page .wallet-table thead th,
.wallet-page .table-dark thead th {
    background: #edf3ef !important;
    color: #244b3a !important;
}

.wallet-page .wallet-table tbody td,
.wallet-page .table-dark tbody td {
    color: #17372b !important;
}

/* Mi panel no debe verse como una pastilla blanca sobre la barra naranja. */
.navbar .nav-link.active {
    background: transparent !important;
    color: #fff !important;
}

/* Acciones del Wallet: mismo verde claro y contraste estable. */
.wallet-page .btn-wallet-deposit,
.wallet-page .wallet-withdraw-card .btn-success {
    background: linear-gradient(115deg, #0d8547, #31bc6c) !important;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(16, 146, 76, .2) !important;
}

body:has(.nova-casino-lobby) {
    background: #0b1322 !important;
}

/* Marco único del sistema: azul profundo en las páginas y naranja en ambas
   franjas. Los acentos verdes siguen reservados para acciones y juegos. */
body {
    background: #0b1322 !important;
    color: #edf3f8 !important;
    border-top-color: #ff6b00 !important;
    border-bottom-color: #ff6b00 !important;
}

body::before {
    opacity: .18;
    background-image:
        linear-gradient(rgba(145, 174, 204, .07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(145, 174, 204, .07) 1px, transparent 1px);
}

.navbar,
.landing-page .top-nav {
    background: linear-gradient(105deg, #ff6b00, #e94d00 62%, #c93400) !important;
    border-bottom: 4px solid #ffb347 !important;
}

.footer,
.landing-page .bottom-bar {
    background: linear-gradient(105deg, #ff6b00, #e94d00 62%, #c93400) !important;
    border-top: 4px solid #ffb347 !important;
    color: #fff !important;
}

.nova-casino-lobby {
    color: #edf3f8;
}

body:has(.wallet-page) {
    background: #0b1322 !important;
}

.wallet-page .wallet-heading,
.wallet-page .wallet-balance-card,
.wallet-page .wallet-action-card,
.wallet-page .wallet-withdraw-card {
    background: #182437 !important;
    border-color: rgba(123, 153, 185, .3) !important;
    color: #edf3f8 !important;
    box-shadow: 0 14px 32px rgba(0, 0, 0, .24) !important;
}

.wallet-page .wallet-heading .section-title,
.wallet-page .wallet-heading .wallet-subtitle,
.wallet-page .wallet-card-label,
.wallet-page .wallet-balance-value,
.wallet-page .wallet-balance-foot,
.wallet-page .wallet-action-heading h5,
.wallet-page .wallet-section-heading h5,
.wallet-page .wallet-type {
    color: #edf3f8 !important;
}

.wallet-page .wallet-heading .wallet-subtitle,
.wallet-page .wallet-action-heading p,
.wallet-page .form-text,
.wallet-page .text-muted,
.wallet-page .wallet-note {
    color: #b8c6d4 !important;
}

.wallet-page .form-label {
    color: #dce6ef !important;
}

.wallet-page .form-control,
.wallet-page .form-select {
    background: #0f1b2c !important;
    border-color: #60758b !important;
    color: #f7fafc !important;
}

.wallet-page .form-control::placeholder {
    color: #a9b8c7 !important;
}

.wallet-page .wallet-table-wrap,
.wallet-page .wallet-empty-state {
    background: #182437 !important;
    border-color: rgba(123, 153, 185, .3) !important;
}

.wallet-page .wallet-table,
.wallet-page .table-dark {
    --bs-table-bg: #182437 !important;
    --bs-table-striped-bg: #1e2c40 !important;
    --bs-table-hover-bg: #26384d !important;
    --bs-table-border-color: rgba(164, 186, 207, .2) !important;
    --bs-table-color: #edf3f8 !important;
}

.wallet-page .wallet-table thead th,
.wallet-page .table-dark thead th {
    background: #213149 !important;
    color: #f3f7fb !important;
}

.wallet-page .wallet-table tbody td,
.wallet-page .table-dark tbody td {
    color: #edf3f8 !important;
}

/* Deportes: tarjetas verdes con contraste estable sobre el fondo azul. */
body:has(.main-content) .card-match {
    background: linear-gradient(135deg, #0e6840, #093d2a) !important;
    border: 1px solid rgba(92, 224, 145, .38) !important;
    color: #f2fff6 !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .2) !important;
}

body:has(.main-content) .card-match .text-muted,
body:has(.main-content) .card-match .small {
    color: #c5e4d0 !important;
}

body:has(.main-content) .card-match .fw-bold {
    color: #f6fff8 !important;
}

body:has(.main-content) .odd-btn {
    background: #e2f5e8 !important;
    border-color: rgba(31, 153, 91, .42) !important;
    color: #0c4d30 !important;
}

body:has(.main-content) .odd-btn .text-muted {
    color: #39705a !important;
}

body:has(.main-content) .betslip {
    background: #182437 !important;
    border-color: rgba(123, 153, 185, .3) !important;
    color: #edf3f8 !important;
}

body:has(.sidebar) .sidebar {
    background: linear-gradient(180deg, #0e6840, #093d2a) !important;
    border-right: 1px solid rgba(92, 224, 145, .35) !important;
    color: #effff5 !important;
}

body:has(.sidebar) .sidebar h6,
body:has(.sidebar) .sidebar .text-muted {
    color: #d5f0df !important;
}

body:has(.sidebar) .sidebar .sport-item {
    color: #e9fff0 !important;
    border-radius: 8px;
}

body:has(.sidebar) .sidebar .sport-item:hover,
body:has(.sidebar) .sidebar .sport-item.active {
    background: rgba(255, 255, 255, .14) !important;
    color: #fff !important;
}

/* Perfil: cabecera verde independiente para que el título nunca se pierda. */
.profile-card {
    background: #182437 !important;
    border-color: rgba(123, 153, 185, .3) !important;
    color: #edf3f8 !important;
}

.profile-card-header {
    padding: 1.25rem;
    border-radius: 12px;
    background: linear-gradient(135deg, #0e6840, #093d2a) !important;
    color: #fff !important;
}

.profile-card-header h2,
.profile-card-header p,
.profile-card-header i {
    color: #fff !important;
}

.profile-card .form-label,
.profile-card h6,
.profile-card .text-muted,
.profile-card small {
    color: #d4e5dc !important;
}

/* Barra principal: todos los accesos comparten altura, alineación y una sola
   línea en escritorio, sin modificar sus destinos ni su comportamiento. */
@media (min-width: 992px) {
    .navbar .navbar-nav {
        flex-wrap: nowrap;
        align-items: center;
    }

    .navbar .nav-item {
        display: flex;
        align-items: center;
    }

    .navbar .nav-link {
        display: inline-flex;
        min-height: 42px;
        align-items: center;
        justify-content: center;
        padding: .55rem .65rem !important;
        line-height: 1.1;
        white-space: nowrap;
    }
}

/* Mis Apuestas: una sola superficie verde para recuperar contraste. */
.mybets-page {
    max-width: 1480px;
}

.mybets-card {
    padding: clamp(1rem, 2vw, 1.75rem);
    border: 1px solid rgba(92, 224, 145, .38);
    border-radius: 16px;
    background: linear-gradient(135deg, #0e6840, #093d2a);
    color: #f3fff7;
    box-shadow: 0 16px 34px rgba(0, 0, 0, .24);
}

.mybets-card .section-title {
    margin-bottom: 1rem;
    color: #fff !important;
}

.mybets-card .section-title i {
    color: #8ef0ae !important;
}

.mybets-table {
    --bs-table-bg: transparent;
    --bs-table-color: #f1fff5;
    --bs-table-border-color: rgba(180, 239, 201, .2);
    margin-bottom: 0;
}

.mybets-table thead th {
    color: #b9f0ca !important;
    border-bottom-color: rgba(180, 239, 201, .34);
    white-space: nowrap;
}

.mybets-table tbody td {
    color: #f1fff5 !important;
    border-bottom-color: rgba(180, 239, 201, .18);
}

.mybets-table tbody tr:hover > * {
    --bs-table-accent-bg: rgba(255, 255, 255, .1);
    color: #fff !important;
}

.mybets-table .text-success,
.mybets-table .text-info {
    color: #9beab2 !important;
}

.mybets-table .text-warning {
    color: #ffd47d !important;
}

.mybets-empty {
    border: 1px solid rgba(180, 239, 201, .2);
    border-radius: 12px;
    background: rgba(3, 37, 24, .28);
}

.mybets-empty i,
.mybets-empty p {
    color: #d8f7e1;
}

/* Confirmación de salida propia de NOVA PLAY; reemplaza el popup nativo. */
body.nova-modal-open {
    overflow: hidden;
}

.nova-modal[hidden] {
    display: none;
}

.nova-modal {
    position: fixed;
    z-index: 2000;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 1rem;
}

.nova-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(3, 9, 19, .78);
    backdrop-filter: blur(5px);
}

.nova-modal-card {
    position: relative;
    width: min(100%, 390px);
    padding: 2rem;
    border: 1px solid rgba(92, 224, 145, .5);
    border-radius: 18px;
    background: linear-gradient(145deg, #1a2940, #0f1b2c);
    color: #eef8f2;
    text-align: center;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .5);
    animation: nova-modal-in .18s ease-out;
}

.nova-modal-icon {
    display: grid;
    width: 3.4rem;
    height: 3.4rem;
    margin: 0 auto 1rem;
    place-items: center;
    border: 1px solid rgba(255, 179, 71, .7);
    border-radius: 50%;
    background: #ff6b00;
    color: #fff;
    font-size: 1.25rem;
}

.nova-modal-card h2 {
    margin: 0 0 .45rem;
    color: #fff;
    font-size: 1.35rem;
}

.nova-modal-card p {
    margin: 0;
    color: #c2d1df;
}

.nova-modal-actions {
    display: flex;
    justify-content: center;
    gap: .7rem;
    margin-top: 1.5rem;
}

.nova-modal-actions button,
.nova-modal-actions a {
    min-width: 110px;
    padding: .65rem 1rem;
    border-radius: 8px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.nova-modal-cancel {
    border: 1px solid rgba(190, 209, 226, .38);
    background: transparent;
    color: #d8e3ed;
}

.nova-modal-confirm {
    border: 1px solid #ff9a4d;
    background: #ff6b00;
    color: #fff !important;
}

.nova-modal-cancel:hover,
.nova-modal-confirm:hover {
    filter: brightness(1.1);
}

@keyframes nova-modal-in {
    from { opacity: 0; transform: translateY(8px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}