*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial, sans-serif;
}

body{
    background:#0f172a;
    color:#fff;
}

/* CONTAINER */

.app-container{
    max-width:430px;
    margin:auto;
    min-height:100vh;
    background:#111827;
    padding-bottom:120px;
    position:relative;
    overflow:hidden;
}

/* HEADER */

.top-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px;
}

.site-title{
    display:flex;
    align-items:center;
    gap:12px;
}

.site-logo{
    width:44px;
    height:44px;
    object-fit:contain;
    border-radius:14px;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.10);
}

.site-name{
    font-size:20px;
    font-weight:800;
    letter-spacing:0.2px;
    line-height:1.1;
}

.logo-area h1{
    font-size:28px;
    font-weight:700;
}

.logo-area span{
    font-size:13px;
    color:#94a3b8;
}

.profile-button{
    width:45px;
    height:45px;
    border-radius:50%;
    background:#1e293b;
    display:flex;
    align-items:center;
    justify-content:center;
}

.profile-button i{
    font-size:24px;
}

/* CARD SALDO */

.wallet-card{
    margin:20px;
    padding:25px;
    border-radius:22px;
    background:linear-gradient(135deg, #22c55e00, #22c55e);
    display:flex;
    justify-content:space-between;
    align-items:center;
    box-shadow:0 10px 30px rgba(37,99,235,0.25);
}

.wallet-card p{
    font-size:14px;
    opacity:0.9;
}

.wallet-card h2{
    margin-top:8px;
    font-size:28px;
    font-weight:bold;
}

.wallet-card button{
    border:none;
    background:#fff;
    color:#111827;
    padding:12px 18px;
    border-radius:14px;
    cursor:pointer;
    font-weight:bold;
    display:flex;
    align-items:center;
    gap:8px;
    transition:0.3s;
}

.wallet-card button:hover{
    transform:scale(1.03);
}

/* BANNERS */

.banner-slider{
    padding:0 20px;
}

.banner-item img{
    width:100%;
    border-radius:18px;
    object-fit:cover;
}

/* TIMER */

.timer-card{
    background:
        radial-gradient(circle at 20% 10%, rgba(37,99,235,0.22), transparent 58%),
        rgba(30,41,59,0.72);
    margin:20px;
    padding:25px;
    border-radius:20px;
    text-align:center;
    display:block;
    color:#fff;
    text-decoration:none;
    border:1px solid rgba(148,163,184,0.12);
    box-shadow:0 14px 34px rgba(0,0,0,0.30);
    overflow:hidden;
}

.timer-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.timer-card p{
    color:#94a3b8;
    font-size:14px;
    margin:0;
}

.timer-card h3{
    font-size:36px;
    margin-top:10px;
    font-weight:bold;
}

.timer-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:7px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    letter-spacing:0.2px;
    background:rgba(37,99,235,0.12);
    border:1px solid #22c55e;
    color:#22c55e;
    white-space:nowrap;
}

.timer-sub{
    margin-top:10px;
    font-size:13px;
    color:#94a3b8;
    line-height:1.25;
}

.timer-value{
    letter-spacing:0.5px;
}

.home-top-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
    padding:0 20px;
    margin-bottom:18px;
}

.home-top-actions .timer-card{
    margin:0;
}

.timer-link-card{
    background:linear-gradient(135deg, #111827, #60a5fa);
    box-shadow:0 10px 30px rgba(37,99,235,0.25);
}

.timer-link-card{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.bingo-cta-top{
    display:flex;
    align-items:center;
    gap:14px;
}

.bingo-cta-icon{
    width:50px;
    height:50px;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,0.16);
    border:1px solid rgba(255,255,255,0.14);
}

.bingo-cta-icon i{
    font-size:24px;
}

.bingo-cta-text{
    text-align:left;
}

.bingo-cta-text p{
    color:rgba(255,255,255,0.88);
}

.bingo-cta-text h3{
    margin-top:6px;
}

.bingo-cta-foot{
    margin-top:14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding-top:14px;
    border-top:1px solid rgba(255,255,255,0.16);
    color:#22c55e;
    font-weight:800;
    letter-spacing:0.2px;
}

.bingo-cta-foot i{
    font-size:18px;
}

.timer-link-card p{
    color:rgba(255,255,255,0.9);
}

.timer-link-card h3{
    letter-spacing:1px;
}

@media(max-width:420px){
    .home-top-actions{
        grid-template-columns:1fr;
    }
}

/* GRID */

.games-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
    padding:0 20px;
}

.game-card{
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(circle at 20% 10%, rgba(37,99,235,0.22), transparent 55%),
        radial-gradient(circle at 85% 25%, rgba(14,165,233,0.18), transparent 55%),
        rgba(15,23,42,0.92);
    border-radius:22px;
    padding:22px 18px;
    text-align:center;
    text-decoration:none;
    color:#fff;
    transition:transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    border:1px solid rgba(255,255,255,0.10);
    box-shadow:0 14px 32px rgba(0,0,0,0.35);
}

.game-card::before{
    content:'';
    position:absolute;
    inset:-1px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.0) 55%),
        radial-gradient(circle at 20% 10%, rgba(96,165,250,0.18), transparent 55%);
    opacity:0.9;
    pointer-events:none;
}

.game-card::after{
    content:'';
    position:absolute;
    left:-40px;
    top:-40px;
    width:140px;
    height:140px;
    border-radius:50%;
    background:rgba(37,99,235,0.20);
    filter:blur(18px);
    opacity:0.55;
    pointer-events:none;
}

.game-card:hover{
    transform:translateY(-4px);
    border-color:rgba(96,165,250,0.55);
    box-shadow:0 18px 40px rgba(0,0,0,0.45);
}

.game-card:active{
    transform:translateY(-2px) scale(0.99);
}

.game-card-icon{
    display:flex;
    justify-content:center;
    margin-bottom:14px;
}

.game-card-icon{
    width:64px;
    height:64px;
    margin-left:auto;
    margin-right:auto;
    border-radius:18px;
    align-items:center;
    background:
        radial-gradient(circle at 30% 20%, rgba(255,255,255,0.28), transparent 55%),
        linear-gradient(135deg, rgba(37,99,235,0.95), rgba(14,165,233,0.72));
    border:1px solid rgba(255,255,255,0.18);
    box-shadow:
        0 14px 26px rgba(37,99,235,0.18),
        inset 0 0 0 2px rgba(2,6,23,0.18);
}

.game-card-icon i{
    font-size:30px;
    line-height:1;
    color:#fff;
}

.game-card-icon img{
    width:40px;
    height:40px;
    object-fit:contain;
    display:block;
    filter:drop-shadow(0 10px 18px rgba(0,0,0,0.25));
}

.game-card span{
    display:block;
    font-size:14px;
    font-weight:800;
    letter-spacing:0.6px;
}

.game-card.coming-soon span{
    opacity:0.95;
}

.game-card.coming-soon .game-card-icon{
    background:
        radial-gradient(circle at 30% 20%, rgba(255,255,255,0.24), transparent 55%),
        linear-gradient(135deg, rgba(100,116,139,0.95), rgba(30,41,59,0.92));
    box-shadow:
        0 14px 26px rgba(0,0,0,0.28),
        inset 0 0 0 2px rgba(2,6,23,0.22);
}

.game-card.coming-soon::marker{
    content:'';
}

.game-card.coming-soon .game-card-icon i{
    color:#e2e8f0;
}

.game-card.coming-soon::before{
    opacity:0.75;
}

.game-card.coming-soon::after{
    content:'EM BREVE';
    position:absolute;
    top:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    font-size:10px;
    font-weight:900;
    letter-spacing:1px;
    color:#0b1220;
    background:linear-gradient(135deg, #fde04700, #f59e0b00);
    border:1px solid rgba(2,6,23,0.25);
    box-shadow:0 10px 18px rgba(0,0,0,0.25);
}

.coming-soon-overlay{
    position:fixed;
    inset:0;
    display:none;
    align-items:center;
    justify-content:center;
    padding:18px;
    background:rgba(2,6,23,0.68);
    z-index:9999;
}

.coming-soon-overlay.active{
    display:flex;
}

.coming-soon-modal{
    width:100%;
    max-width:420px;
    border-radius:22px;
    background:rgba(15,23,42,0.96);
    border:1px solid rgba(255,255,255,0.10);
    box-shadow:0 18px 40px rgba(0,0,0,0.55);
    overflow:hidden;
}

.coming-soon-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:14px 14px 12px 14px;
    background:linear-gradient(180deg,#1d4ed8,#0b2a7a);
}

.coming-soon-close{
    width:38px;
    height:38px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,0.18);
    background:rgba(0,0,0,0.18);
    color:#fff;
    cursor:pointer;
}

.coming-soon-body{
    padding:16px 14px 14px 14px;
    color:#e2e8f0;
    font-size:14px;
}

.coming-soon-btn{
    width:calc(100% - 28px);
    margin:0 14px 14px 14px;
    height:50px;
    border:none;
    border-radius:16px;
    background:#2563eb;
    color:#fff;
    font-weight:bold;
    cursor:pointer;
}

/* AÇÕES */

.quick-actions{
    display:flex;
    gap:15px;
    padding:20px;
}

.quick-actions button{
    flex:1;
    height:55px;
    border:none;
    border-radius:16px;
    background:#2563eb;
    color:#fff;
    font-weight:bold;
    cursor:pointer;
    transition:0.3s;
}

.quick-actions button:hover{
    transform:translateY(-2px);
}

/* MENU MOBILE */

.bottom-menu{
    position:fixed;
    bottom:0;
    width:100%;
    max-width:430px;
    background:#0f172a;
    border-top:1px solid #1e293b;
    display:flex;
    justify-content:space-around;
    padding:14px 10px;
    z-index:999;
}

.bottom-menu a{
    text-decoration:none;
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:5px;
    font-size:12px;
    transition:0.3s;
}

.bottom-menu a:hover{
    color:#60a5fa;
}

.bottom-menu i{
    font-size:22px;
}

/* LOGIN / CADASTRO */

.auth-container{
    min-height:calc(var(--vh, 1vh) * 100);
    display:flex;
    justify-content:center;
    align-items:center;
    padding:20px;
    -webkit-text-size-adjust:100%;
}

.auth-card{
    width:100%;
    max-width:420px;
    background:#111827;
    border-radius:24px;
    padding:35px 30px;
    box-shadow:0 10px 40px rgba(0,0,0,0.35);
}

.auth-logo{
    text-align:center;
    margin-bottom:30px;
}

.auth-logo.has-img{
    margin-bottom:26px;
}

.auth-logo-img{
    width:76px;
    height:76px;
    object-fit:contain;
    border-radius:18px;
    margin:0 auto 12px auto;
    display:block;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.10);
    box-shadow:0 14px 34px rgba(0,0,0,0.35);
}

.auth-logo h1{
    font-size:34px;
    margin-bottom:10px;
}

.auth-logo.has-img h1{
    font-size:28px;
    margin-bottom:8px;
}

.auth-logo p{
    color:#94a3b8;
}

/* INPUTS */

.input-group{
    margin-bottom:20px;
}

.input-group label{
    display:block;
    margin-bottom:8px;
    font-size:14px;
    color:#cbd5e1;
}

.input-hint{
    margin-top:-4px;
    margin-bottom:10px;
    font-size:12px;
    line-height:1.35;
    color:#94a3b8;
}

.input-group input{
    width:100%;
    height:55px;
    border:none;
    border-radius:14px;
    background:#1e293b;
    padding:0 15px;
    font-size:16px;
    color:#fff;
    outline:none;
    border:1px solid transparent;
    transition:0.3s;
}

.input-group input:focus{
    border-color:#2563eb;
}

/* BOTÃO AUTH */

.auth-button{
    width:100%;
    height:55px;
    border:none;
    border-radius:14px;
    background:linear-gradient(135deg,#7c3aed,#2563eb);
    color:#fff;
    font-size:16px;
    font-weight:bold;
    cursor:pointer;
    transition:0.3s;
}

.auth-button:hover{
    transform:translateY(-2px);
}

/* LINKS */

.auth-links{
    margin-top:25px;
    text-align:center;
}

.auth-links-row{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    flex-wrap:wrap;
}

.auth-links a{
    color:#60a5fa;
    text-decoration:none;
    font-size:14px;
}

.auth-toast-root{
    position:fixed;
    left:50%;
    top:14px;
    transform:translateX(-50%);
    z-index:99999;
    width:min(420px, calc(100vw - 28px));
    display:flex;
    flex-direction:column;
    gap:10px;
    pointer-events:none;
}

.auth-toast-root .keno-toast{
    pointer-events:auto;
}

.auth-modal-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.58);
    z-index:99998;
    display:none;
    align-items:center;
    justify-content:center;
    padding:18px;
}

.auth-modal-overlay.active{
    display:flex;
}

.auth-modal{
    width:100%;
    max-width:420px;
    background:#0b1220;
    border:1px solid rgba(255,255,255,0.10);
    border-radius:20px;
    padding:18px 16px;
    box-shadow:0 18px 50px rgba(0,0,0,0.45);
}

.auth-modal h3{
    font-size:18px;
    margin-bottom:6px;
}

.auth-modal p{
    color:#94a3b8;
    font-size:13px;
    line-height:1.35;
    margin-bottom:12px;
}

.auth-modal-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    margin-top:12px;
}

.auth-modal-btn{
    border:none;
    border-radius:14px;
    height:44px;
    padding:0 14px;
    font-weight:800;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-decoration:none;
}

.auth-modal-btn.secondary{
    background:rgba(255,255,255,0.08);
    color:#e2e8f0;
}

.auth-modal-btn.primary{
    background:linear-gradient(180deg, rgba(59,130,246,0.95), rgba(37,99,235,0.95));
    color:#fff;
}

/* ALERTAS */

.alert-error{
    background:rgba(239,68,68,0.15);
    border:1px solid rgba(239,68,68,0.3);
    color:#fca5a5;
    padding:15px;
    border-radius:14px;
    margin-bottom:20px;
    text-align:center;
}

/* RESPONSIVO */

@media(max-width:480px){

    .wallet-card{
        flex-direction:column;
        align-items:flex-start;
        gap:20px;
    }

    .wallet-card button{
        width:100%;
        justify-content:center;
    }

}


/* PERFIL */

.profile-card{
    margin:20px;
    background:#1e293b;
    border-radius:24px;
    padding:30px 20px;
    text-align:center;
}

.profile-avatar{
    width:90px;
    height:90px;
    border-radius:50%;
    background:linear-gradient(135deg,#7c3aed,#2563eb);
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:20px;
}

.profile-avatar i{
    font-size:42px;
}

.profile-card h2{
    font-size:24px;
    margin-bottom:8px;
}

.profile-card p{
    color:#94a3b8;
    font-size:14px;
}

.profile-form{
    padding:0 20px 30px;
}

.success-message{
    background:rgba(34,197,94,0.15);
    border:1px solid rgba(34,197,94,0.3);
    color:#86efac;
    padding:15px;
    border-radius:14px;
    margin:0 20px 20px;
    text-align:center;
}

/* CARTEIRA */

.wallet-balance-card{
    margin:20px;
    padding:30px;
    border-radius:24px;
    background:linear-gradient(135deg, #22c55e, #0f172a);
    text-align:center;
}

.wallet-balance-card p{
    font-size:15px;
    opacity:0.9;
}

.wallet-balance-card h2{
    font-size:38px;
    margin-top:12px;
    margin-bottom:25px;
}

.wallet-buttons{
    display:flex;
    gap:15px;
}

.wallet-buttons a{
    flex:1;
    height:50px;
    border-radius:14px;
    background:#fff;
    color:#111827;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-decoration:none;
    font-weight:bold;
    transition:0.3s;
}

.wallet-buttons a:hover{
    transform:translateY(-2px);
}

.transactions-area{
    padding:0 20px 30px;
}

.section-title{
    margin-bottom:20px;
}

.section-title h3{
    font-size:20px;
}

.transaction-card{
    background:#1e293b;
    border-radius:18px;
    padding:18px;
    display:flex;
    align-items:center;
    margin-bottom:15px;
}

.transaction-icon{
    width:50px;
    height:50px;
    border-radius:14px;
    background:#0f172a;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:15px;
}

.transaction-icon i{
    font-size:24px;
}

.transaction-info{
    flex:1;
}

.transaction-info h4{
    margin-bottom:5px;
}

.transaction-info span{
    color:#94a3b8;
    font-size:13px;
}

.transaction-value{
    font-weight:bold;
    font-size:16px;
}

.empty-history{
    background:#1e293b;
    padding:20px;
    border-radius:18px;
    text-align:center;
    color:#94a3b8;
}


/* SELECT */

.custom-select{
    width:100%;
    height:55px;
    border:none;
    border-radius:14px;
    background:#1e293b;
    padding:0 15px;
    color:#fff;
    outline:none;
    border:1px solid transparent;
    transition:0.3s;
}

.custom-select:focus{
    border-color:#2563eb;
}

/* DEPÓSITO */

.deposit-card{
    margin:20px;
    background:rgba(0,0,0,0.35);
    border-radius:24px;
    padding:30px 25px;
    text-align:center;
}

.deposit-icon{
    width:90px;
    height:90px;
    border-radius:50%;
    background:linear-gradient(135deg,#22c55e,#16a34a);
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:20px;
}

.deposit-icon i{
    font-size:42px;
}

.deposit-card h2{
    font-size:28px;
    margin-bottom:10px;
}

.deposit-card p{
    color:#94a3b8;
    margin-bottom:25px;
    line-height:1.5;
}

/* VALORES RÁPIDOS */

.quick-values{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:12px;
    margin-bottom:25px;
}

.quick-values button{
    height:50px;
    border:none;
    border-radius:14px;
    background:#0f172a;
    color:#fff;
    cursor:pointer;
    font-weight:bold;
    transition:0.3s;
}

.quick-values button:hover{
    background:#2563eb;
}

/* PIX GERADO */

.pix-generated{
    margin:20px;
    background:#1e293b;
    border-radius:24px;
    padding:30px 25px;
    text-align:center;
}

.pix-status{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    margin-bottom:25px;
    color:#facc15;
    font-weight:bold;
}

.pix-generated img{
    width:240px;
    border-radius:20px;
    margin-bottom:25px;
    background:#fff;
    padding:15px;
}

.pix-copy textarea{
    width:100%;
    height:120px;
    background:#0f172a;
    border:none;
    border-radius:14px;
    padding:15px;
    color:#fff;
    resize:none;
    margin-bottom:15px;
}

.pix-copy button{
    width:100%;
    height:55px;
    border:none;
    border-radius:14px;
    background:#22c55e;
    color:#fff;
    font-weight:bold;
    cursor:pointer;
    transition:0.3s;
}

.pix-copy button:hover{
    opacity:0.9;
}

.pix-infos{
    margin-top:25px;
    display:flex;
    justify-content:space-between;
    gap:15px;
}

.pix-infos div{
    flex:1;
    background:#0f172a;
    border-radius:16px;
    padding:18px;
}

.pix-infos span{
    display:block;
    color:#94a3b8;
    margin-bottom:8px;
    font-size:14px;
}

.status-pending{
    color:#facc15;
}

/* SUPORTE */

.support-card{
    margin:20px;
    background:#1e293b;
    border-radius:24px;
    padding:35px 25px;
    text-align:center;
}

.support-icon{
    width:100px;
    height:100px;
    border-radius:50%;
    background:linear-gradient(135deg,#22c55e,#16a34a);
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:25px;
}

.support-icon i{
    font-size:48px;
}

.support-card h2{
    font-size:28px;
    margin-bottom:15px;
}

.support-card p{
    color:#94a3b8;
    line-height:1.7;
}

/* AVISOS */

.support-alerts{
    padding:0 20px;
}

.support-alert-item{
    background:#1e293b;
    border-radius:20px;
    padding:20px;
    display:flex;
    gap:18px;
    margin-bottom:15px;
}

.support-alert-item i{
    font-size:28px;
    color:#60a5fa;
}

.support-alert-item h4{
    margin-bottom:8px;
}

.support-alert-item p{
    color:#94a3b8;
    font-size:14px;
    line-height:1.6;
}

/* BOTÃO WHATSAPP */

.support-button-area{
    padding:20px;
}

.support-whatsapp-button{
    width:100%;
    height:60px;
    border-radius:18px;
    background:#22c55e;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    font-size:17px;
    font-weight:bold;
    transition:0.3s;
}

.support-whatsapp-button:hover{
    transform:translateY(-2px);
    opacity:0.95;
}

.support-whatsapp-button i{
    font-size:26px;
}

/* HISTÓRICO */

.history-filters{
    display:flex;
    gap:10px;
    padding:0 20px 20px;
    overflow:auto;
}

.history-filters button{
    border:none;
    background:#1e293b;
    color:#fff;
    padding:12px 18px;
    border-radius:14px;
    cursor:pointer;
    white-space:nowrap;
    transition:0.3s;
}

.history-filters button.active{
    background:#2563eb;
}

.history-list{
    padding:0 20px 30px;
}

.history-card{
    background:#1e293b;
    border-radius:20px;
    padding:18px;
    display:flex;
    align-items:center;
    margin-bottom:15px;
}

.history-icon{
    width:55px;
    height:55px;
    border-radius:16px;
    background:#0f172a;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:15px;
}

.history-icon i{
    font-size:28px;
}

.deposit-icon{
    color:#22c55e;
}

.saque-icon{
    color:#ef4444;
}

.history-info{
    flex:1;
}

.history-info h3{
    font-size:17px;
    margin-bottom:6px;
}

.history-info span{
    color:#94a3b8;
    font-size:13px;
}

.history-value{
    text-align:right;
}

.history-value strong{
    display:block;
    margin-bottom:6px;
}

.status-success{
    color:#22c55e;
}

.status-pending{
    color:#facc15;
}

.status-cancel{
    color:#ef4444;
}

/* VAZIO */

.empty-history{
    background:#1e293b;
    border-radius:22px;
    padding:40px 20px;
    text-align:center;
}

.empty-history i{
    font-size:50px;
    color:#475569;
    margin-bottom:15px;
}

.empty-history p{
    color:#94a3b8;
}

/* LINKS BOTÕES */

.wallet-button-link{
    border:none;
    background:#facc15;
    color:#111827;
    padding:12px 18px;
    border-radius:14px;
    text-decoration:none;
    font-weight:bold;
    display:flex;
    align-items:center;
    gap:8px;
    transition:0.3s;
}

.wallet-button-link:hover{
    transform:scale(1.03);
}

/* TRANSAÇÕES HOME */

.home-transactions{
    padding:20px;
}

.home-transaction-card{
    background:#1e293b;
    border-radius:18px;
    padding:16px;
    display:flex;
    align-items:center;
    margin-bottom:15px;
}

.home-transaction-icon{
    width:50px;
    height:50px;
    border-radius:14px;
    background:#0f172a;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:15px;
}

.home-transaction-icon i{
    font-size:24px;
}

.home-transaction-info{
    flex:1;
}

.home-transaction-info h4{
    margin-bottom:5px;
}

.home-transaction-info span{
    color:#94a3b8;
    font-size:13px;
}

/* QUICK LINKS */

.quick-action-link{
    flex:1;
    height:55px;
    border-radius:16px;
    background:#22c55e;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    font-weight:bold;
    transition:0.3s;
}

.quick-action-link:hover{
    transform:translateY(-2px);
}

/* AFILIADOS */

.affiliate-card{
    margin:20px;
    background:#1e293b;
    border-radius:24px;
    padding:35px 25px;
    text-align:center;
}

.affiliate-icon{
    width:100px;
    height:100px;
    border-radius:50%;
    background:linear-gradient(135deg,#f59e0b,#f97316);
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:25px;
}

.affiliate-icon i{
    font-size:48px;
}

.affiliate-card h2{
    font-size:28px;
    margin-bottom:15px;
}

.affiliate-card p{
    color:#94a3b8;
    line-height:1.7;
}

/* STATS */

.affiliate-stats{
    display:flex;
    gap:15px;
    padding:0 20px 20px;
}

.affiliate-stat-box{
    flex:1;
    background:#1e293b;
    border-radius:20px;
    padding:22px;
    text-align:center;
}

.affiliate-stat-box span{
    display:block;
    color:#94a3b8;
    margin-bottom:10px;
    font-size:14px;
}

.affiliate-stat-box strong{
    font-size:28px;
}

/* LINK */

.affiliate-link-area{
    padding:0 20px 25px;
}

.affiliate-link-area label{
    display:block;
    margin-bottom:10px;
    font-size:14px;
    color:#cbd5e1;
}

.affiliate-link-area textarea{
    width:100%;
    height:110px;
    background:#1e293b;
    border:none;
    border-radius:18px;
    padding:15px;
    color:#fff;
    resize:none;
    margin-bottom:15px;
}

.affiliate-link-area button{
    width:100%;
    height:55px;
    border:none;
    border-radius:16px;
    background:#f59e0b;
    color:#fff;
    font-weight:bold;
    cursor:pointer;
    transition:0.3s;
}

.affiliate-link-area button:hover{
    opacity:0.95;
}

/* LISTA */

.affiliate-users{
    padding:0 20px 30px;
}

.affiliate-user-card{
    background:#1e293b;
    border-radius:18px;
    padding:18px;
    display:flex;
    align-items:center;
    margin-bottom:15px;
}

.affiliate-user-icon{
    width:50px;
    height:50px;
    border-radius:14px;
    background:#0f172a;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:15px;
}

.affiliate-user-icon i{
    font-size:24px;
}

.affiliate-user-info{
    flex:1;
}

.affiliate-user-info h4{
    margin-bottom:5px;
}

.affiliate-user-info span{
    color:#94a3b8;
    font-size:13px;
}

.affiliate-bonus{
    color:#22c55e;
}

/* ADMIN */

.admin-container{
    display:flex;
    min-height:100vh;
    background:
        radial-gradient(circle at 12% 14%, rgba(37,99,235,0.16), transparent 52%),
        radial-gradient(circle at 92% 10%, rgba(14,165,233,0.10), transparent 55%),
        #0b1220;
}

/* SIDEBAR */

.admin-sidebar{
    width:260px;
    background:rgba(17,24,39,0.92);
    padding:22px 18px;
    border-right:1px solid rgba(148,163,184,0.10);
    backdrop-filter:blur(10px);
    display:flex;
    flex-direction:column;
    position:sticky;
    top:0;
    height:100vh;
}

.admin-logo{
    margin-bottom:18px;
}

.admin-logo-img{
    width:54px;
    height:54px;
    object-fit:contain;
    border-radius:14px;
    display:block;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.10);
    margin:0 0 12px 0;
}

.admin-logo-site{
    display:block;
    margin-top:6px;
    color:#94a3b8;
    font-size:13px;
}

.admin-logo-preview{
    margin-top:10px;
    padding:10px;
    border-radius:14px;
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.08);
}

.admin-logo-preview img{
    width:64px;
    height:64px;
    object-fit:contain;
    border-radius:14px;
    display:block;
}

.admin-logo h2{
    font-size:26px;
}

.admin-logo-site{
    letter-spacing:0.2px;
}

/* MENU */

.admin-menu{
    display:flex;
    flex-direction:column;
    gap:12px;
    padding-top:14px;
    border-top:1px solid rgba(148,163,184,0.10);
    flex:1;
}

.admin-menu a{
    height:52px;
    border-radius:14px;
    padding:0 18px;
    display:flex;
    align-items:center;
    gap:12px;
    color:#fff;
    text-decoration:none;
    transition:0.3s;
    border:1px solid transparent;
}

.admin-menu a:hover{
    background:rgba(148,163,184,0.08);
    border-color:rgba(148,163,184,0.12);
}

.admin-menu a.active{
    background:linear-gradient(180deg, rgba(37,99,235,0.95), rgba(29,78,216,0.95));
    border-color:rgba(37,99,235,0.35);
    box-shadow:0 14px 34px rgba(37,99,235,0.18);
}

.admin-menu i{
    font-size:20px;
    width:34px;
    height:34px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,0.20);
    border:1px solid rgba(255,255,255,0.10);
}

.admin-sidebar-footer{
    padding-top:14px;
    border-top:1px solid rgba(148,163,184,0.10);
}

.admin-logout{
    height:52px;
    border-radius:14px;
    padding:0 18px;
    display:flex;
    align-items:center;
    gap:12px;
    color:#fff;
    text-decoration:none;
    transition:0.3s;
    border:1px solid rgba(148,163,184,0.12);
    background:rgba(148,163,184,0.06);
}

.admin-logout:hover{
    background:rgba(239,68,68,0.10);
    border-color:rgba(239,68,68,0.22);
}

.admin-logout i{
    font-size:20px;
    width:34px;
    height:34px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,0.20);
    border:1px solid rgba(255,255,255,0.10);
}

/* CONTENT */

.admin-content{
    flex:1;
    padding:22px;
}

/* TOPBAR */

.admin-topbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:30px;
    padding:16px 18px;
    border-radius:18px;
    background:rgba(30,41,59,0.55);
    border:1px solid rgba(148,163,184,0.12);
    box-shadow:0 16px 40px rgba(0,0,0,0.22);
}

.admin-topbar h1{
    font-size:26px;
    letter-spacing:0.2px;
}

.admin-topbar span{
    color:#94a3b8;
    font-size:13px;
}

/* CARDS */

.admin-cards{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-bottom:30px;
}

.admin-card{
    background:
        radial-gradient(circle at 22% 12%, rgba(37,99,235,0.28), transparent 58%),
        rgba(30,41,59,0.70);
    border-radius:22px;
    padding:18px 18px;
    border:1px solid rgba(148,163,184,0.12);
    box-shadow:0 16px 40px rgba(0,0,0,0.22);
    transition:transform .18s ease, filter .18s ease;
}

.admin-card:hover{
    transform:translateY(-3px);
    filter:brightness(1.03);
}

.admin-card i{
    font-size:34px;
    margin-bottom:20px;
    color:#60a5fa;
}

.admin-card h3{
    font-size:30px;
    margin-bottom:8px;
}

.admin-card p{
    color:#94a3b8;
}

/* WELCOME */

.admin-welcome{
    background:rgba(30,41,59,0.70);
    border-radius:24px;
    padding:35px;
    border:1px solid rgba(148,163,184,0.12);
    box-shadow:0 16px 40px rgba(0,0,0,0.22);
}

.admin-welcome h2{
    font-size:30px;
    margin-bottom:15px;
}

.admin-welcome p{
    color:#94a3b8;
    line-height:1.7;
}

/* RESPONSIVO */

@media(max-width:900px){

    .admin-container{
        flex-direction:column;
    }

    .admin-sidebar{
        width:100%;
        position:relative;
        height:auto;
    }

    .admin-cards{
        grid-template-columns:1fr 1fr;
    }

}

@media(max-width:600px){

    .admin-cards{
        grid-template-columns:1fr;
    }

}


/* TABELAS ADMIN */

.admin-table-area{
    background:rgba(30,41,59,0.70);
    border-radius:24px;
    padding:25px;
    overflow:auto;
    border:1px solid rgba(148,163,184,0.12);
    box-shadow:0 16px 40px rgba(0,0,0,0.22);
}

.admin-table{
    width:100%;
    border-collapse:collapse;
}

.admin-table thead{
    background:rgba(15,23,42,0.9);
}

.admin-table th{
    padding:18px;
    text-align:left;
    font-size:14px;
    color:#94a3b8;
    position:sticky;
    top:0;
    z-index:2;
}

.admin-table td{
    padding:18px;
    border-bottom:1px solid rgba(148,163,184,0.12);
}

.admin-table tr:hover{
    background:rgba(255,255,255,0.02);
}

.admin-table .status-success,
.admin-table .status-pending,
.admin-table .status-cancel{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:6px 10px;
    border-radius:999px;
    font-weight:900;
    font-size:12px;
    letter-spacing:0.2px;
    border:1px solid rgba(255,255,255,0.10);
}

.admin-table .status-success{
    color:#86efac;
    background:rgba(34,197,94,0.12);
    border-color:rgba(34,197,94,0.25);
}

.admin-table .status-pending{
    color:#fde68a;
    background:rgba(245,158,11,0.10);
    border-color:rgba(245,158,11,0.22);
}

.admin-table .status-cancel{
    color:#fca5a5;
    background:rgba(239,68,68,0.10);
    border-color:rgba(239,68,68,0.22);
}

/* BADGES */

.admin-badge{
    background:#dc2626;
    color:#fff;
    padding:6px 12px;
    border-radius:10px;
    font-size:12px;
    font-weight:bold;
}

.user-badge{
    background:#2563eb;
    color:#fff;
    padding:6px 12px;
    border-radius:10px;
    font-size:12px;
    font-weight:bold;
}

/* DELETE */

.delete-btn{
    width:40px;
    height:40px;
    border-radius:12px;
    background:#dc2626;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
}

.delete-btn:hover{
    opacity:0.9;
}

/* AÇÕES TABELA */

.table-actions{
    display:flex;
    gap:10px;
}

.approve-btn{
    width:40px;
    height:40px;
    border-radius:12px;
    background:#22c55e;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
}

.cancel-btn{
    width:40px;
    height:40px;
    border-radius:12px;
    background:#ef4444;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
}

.approve-btn:hover,
.cancel-btn:hover{
    opacity:0.9;
}

/* AFILIADOS ADMIN */

.affiliate-code{
    background:#2563eb;
    color:#fff;
    padding:8px 14px;
    border-radius:12px;
    font-size:13px;
    font-weight:bold;
}

.affiliate-total{
    background:#22c55e;
    color:#fff;
    padding:8px 14px;
    border-radius:12px;
    font-size:13px;
    font-weight:bold;
}

/* FORM ADMIN */

.admin-form-card{
    background:rgba(30,41,59,0.70);
    border-radius:24px;
    padding:25px;
    margin-bottom:30px;
    border:1px solid rgba(148,163,184,0.12);
    box-shadow:0 16px 40px rgba(0,0,0,0.22);
}

.admin-section-heading{
    font-size:18px;
    margin-bottom:14px;
    display:flex;
    align-items:center;
    gap:10px;
}

.admin-subheading{
    font-size:15px;
    margin:0 0 14px;
    color:#e2e8f0;
    letter-spacing:0.2px;
}

.admin-settings-section{
    padding:16px;
    border-radius:18px;
    background:rgba(15,23,42,0.35);
    border:1px solid rgba(148,163,184,0.12);
    margin-bottom:14px;
}

.admin-hint-box{
    padding:16px;
    border-radius:18px;
    background:rgba(37,99,235,0.10);
    border:1px solid rgba(96,165,250,0.25);
    margin-bottom:16px;
}

.admin-hint-title{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:700;
    color:#e2e8f0;
    margin-bottom:10px;
}

.admin-hint-title i{
    color:#60a5fa;
}

.admin-hint-list{
    margin:0;
    padding-left:18px;
    color:#cbd5e1;
    font-size:13px;
    line-height:1.5;
}

.admin-advanced{
    margin:14px 0;
    padding:14px;
    border-radius:18px;
    background:rgba(2,6,23,0.30);
    border:1px solid rgba(148,163,184,0.12);
}

.admin-advanced > summary{
    cursor:pointer;
    font-weight:700;
    color:#e2e8f0;
    list-style:none;
    display:flex;
    align-items:center;
    gap:10px;
}

.admin-advanced > summary::-webkit-details-marker{
    display:none;
}

.admin-advanced[open] > summary{
    margin-bottom:14px;
}

.admin-form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.admin-submit-btn{
    margin-top:20px;
    height:55px;
    border:none;
    border-radius:16px;
    background:linear-gradient(180deg, rgba(37,99,235,0.95), rgba(29,78,216,0.95));
    color:#fff;
    padding:0 25px;
    font-weight:bold;
    cursor:pointer;
    transition:0.3s;
    box-shadow:0 16px 34px rgba(37,99,235,0.18);
}

.admin-submit-btn:hover{
    opacity:0.95;
}

/* BANNERS */

.banner-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.banner-card{
    background:rgba(30,41,59,0.70);
    border-radius:22px;
    overflow:hidden;
    border:1px solid rgba(148,163,184,0.12);
    box-shadow:0 16px 40px rgba(0,0,0,0.22);
}

.banner-card img{
    width:100%;
    height:180px;
    object-fit:cover;
}

.banner-content{
    padding:20px;
}

.banner-content h3{
    margin-bottom:15px;
}

.delete-banner-btn{
    height:45px;
    border-radius:14px;
    background:#dc2626;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    transition:0.2s;
}

.delete-banner-btn:hover{
    opacity:0.95;
    transform:translateY(-1px);
}

/* RESPONSIVO */

@media(max-width:900px){

    .banner-grid{
        grid-template-columns:1fr;
    }

    .admin-form-grid{
        grid-template-columns:1fr;
    }

}

/* CONFIGURAÇÕES */

.admin-settings-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

/* MAINTENANCE */

.maintenance-box{
    margin-top:25px;
    display:flex;
    align-items:center;
    gap:15px;
}

/* SWITCH */

.switch{
    position:relative;
    display:inline-block;
    width:60px;
    height:34px;
}

.switch input{
    opacity:0;
    width:0;
    height:0;
}

.slider{
    position:absolute;
    cursor:pointer;
    inset:0;
    background:#334155;
    transition:0.4s;
    border-radius:34px;
}

.slider:before{
    position:absolute;
    content:"";
    height:26px;
    width:26px;
    left:4px;
    bottom:4px;
    background:white;
    transition:0.4s;
    border-radius:50%;
}

.switch input:checked + .slider{
    background:#22c55e;
}

.switch input:checked + .slider:before{
    transform:translateX(26px);
}

/* RESPONSIVO */

@media(max-width:900px){

    .admin-settings-grid{
        grid-template-columns:1fr;
    }

}

/* KENO */

.game-container{
    max-width:700px;
    margin:auto;
    padding:20px;
}

.game-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:30px;
}

.game-header a{
    color:#fff;
    font-size:24px;
}

.keno-card{
    background:#1e293b;
    border-radius:22px;
    padding:25px;
    margin-bottom:25px;
}

.keno-card h2{
    margin-bottom:10px;
}

.keno-card p{
    color:#94a3b8;
}

.keno-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:12px;
    margin-bottom:25px;
}

.keno-number{
    height:60px;
    border:none;
    border-radius:18px;
    background:#1e293b;
    color:#fff;
    font-size:18px;
    font-weight:bold;
    cursor:pointer;
    transition:0.2s;
}

.keno-number.active{
    background:#2563eb;
    transform:scale(1.05);
}

.keno-bet-box{
    display:flex;
    gap:12px;
}

.keno-bet-box input{
    flex:1;
    height:58px;
    border:none;
    border-radius:18px;
    padding:0 18px;
    background:#1e293b;
    color:#fff;
}

.keno-bet-box button{
    width:180px;
    border:none;
    border-radius:18px;
    background:#22c55e;
    color:#fff;
    font-weight:bold;
    cursor:pointer;
}

/* RESULTADO KENO */

.result-card{
    background:#1e293b;
    border-radius:24px;
    padding:30px;
    text-align:center;
    margin-bottom:25px;
}

.win-title{
    color:#22c55e;
    margin-bottom:15px;
}

.lose-title{
    color:#ef4444;
    margin-bottom:15px;
}

.result-box{
    background:#1e293b;
    border-radius:24px;
    padding:25px;
    margin-bottom:25px;
}

.result-box h2{
    margin-bottom:20px;
}

.result-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:12px;
}

.result-number{
    height:55px;
    border-radius:16px;
    background:#0f172a;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
}

.result-number.active{
    background:#2563eb;
}

.result-number.hit{
    background:#22c55e;
}

.play-again-btn{
    height:60px;
    border-radius:18px;
    background:#2563eb;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
}

body{
    margin:0;
    padding:0;
    font-family:Arial, sans-serif;
    background:#0b1220;
    color:#fff;
}

/* CONTAINER */
.game-container{
    max-width:1100px;
    margin:0 auto;
    padding:25px;
}

/* HEADER */
.game-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:25px;
}

.game-header h1{
    font-size:28px;
    letter-spacing:2px;
}

.game-header span{
    color:#94a3b8;
}

.game-header a{
    color:#fff;
    font-size:22px;
    text-decoration:none;
}

/* MÁQUINA KENO */
.keno-machine{
    position:relative;
    background:linear-gradient(145deg, #0f172a00, #11182700);
    border-radius:30px;
    padding:40px;
    overflow:hidden;
    margin-bottom:30px;
    border:1px solid rgba(255,255,255,0);
}

.machine-glow{
    position:absolute;
    width:340px;
    height:340px;
    background:#2563eb;
    filter:blur(150px);
    opacity:0.18;
    top:-140px;
    right:-140px;
}

.machine-header{
    text-align:center;
    margin-bottom:30px;
}

.machine-header h2{
    font-size:34px;
    margin-bottom:10px;
    letter-spacing:2px;
}

.machine-header p{
    color:#94a3b8;
}

/* ÁREA DE SORTEIO */
.draw-area{
    min-height:180px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:18px;
}

/* BOLAS */
.draw-ball{
    width:72px;
    height:72px;
    border-radius:50%;
    background:linear-gradient(135deg,#2563eb,#60a5fa);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    font-weight:bold;
    color:#fff;
    transform:scale(0) rotate(180deg);
    opacity:0;
    box-shadow:
        0 0 25px rgba(37,99,235,0.5),
        inset 0 0 15px rgba(255,255,255,0.15);
}

.draw-ball.show{
    animation:ballReveal 0.6s ease forwards;
}

@keyframes ballReveal{
    0%{
        transform:scale(0) rotate(180deg);
        opacity:0;
    }
    60%{
        transform:scale(1.2) rotate(-10deg);
        opacity:1;
    }
    100%{
        transform:scale(1) rotate(0deg);
        opacity:1;
    }
}

/* RESULTADO */
.result-card{
    background:#0f172a;
    padding:30px;
    border-radius:25px;
    margin-bottom:20px;
    text-align:center;
    border:1px solid rgba(255,255,255,0.05);
}

.win-title{
    color:#22c55e;
    font-size:34px;
}

.lose-title{
    color:#ef4444;
    font-size:34px;
}

/* STATS */
.result-stats{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin-top:25px;
}

.stat-item{
    background:#111827;
    border-radius:18px;
    padding:20px;
}

.stat-item span{
    display:block;
    color:#94a3b8;
    margin-bottom:8px;
}

.stat-item strong{
    font-size:26px;
}

/* BOX RESULTADOS */
.result-box{
    background:#0f172a;
    border-radius:20px;
    padding:25px;
    margin-bottom:20px;
    border:1px solid rgba(255,255,255,0.05);
}

.result-box h2{
    margin-bottom:15px;
}

/* GRID NUMEROS */
.result-grid{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    justify-content:center;
}

.result-number{
    width:50px;
    height:50px;
    border-radius:50%;
    background:#1e293b;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
}

.result-number.active{
    background:#2563eb;
}

.result-number.hit{
    background:#22c55e;
}

/* BOTÃO */
.play-again-btn{
    display:block;
    text-align:center;
    padding:15px;
    border-radius:12px;
    background:#2563eb;
    color:#fff;
    text-decoration:none;
    font-weight:bold;
    margin-top:20px;
    transition:0.3s;
}

.play-again-btn:hover{
    background:#1d4ed8;
}

/* ANIMAÇÃO */
.fade-in{
    animation:fadeIn 0.6s ease;
}

@keyframes fadeIn{
    from{
        opacity:0;
        transform:translateY(10px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* RESPONSIVO */
@media(max-width:700px){

    .draw-ball{
        width:58px;
        height:58px;
        font-size:18px;
    }

    .result-stats{
        grid-template-columns:1fr;
    }

}

.keno-type-box{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin-bottom:25px;
}

.keno-type{
    background:#1e293b;
    border:1px solid #334155;
    border-radius:20px;
    padding:18px 10px;
    color:#fff;
    cursor:pointer;
    text-align:center;
    transition:0.3s;
}

.keno-type strong{
    display:block;
    font-size:17px;
    margin-bottom:6px;
}

.keno-type span{
    display:block;
    font-size:12px;
    color:#94a3b8;
    margin-bottom:8px;
}

.keno-type small{
    color:#22c55e;
    font-weight:bold;
}

.keno-type.active{
    background:linear-gradient(135deg,#f59e0b,#f97316);
    border-color:#facc15;
    transform:translateY(-3px);
    box-shadow:0 0 25px rgba(249,115,22,0.35);
}

.keno-number,
.draw-ball,
.result-number{
    border-radius:50%;
    background:
        radial-gradient(circle at 30% 25%, #ffffff 0%, #facc15 12%, #f97316 38%, #7c2d12 100%);
    color:#fff;
    box-shadow:
        inset -6px -8px 14px rgba(0,0,0,0.35),
        inset 5px 5px 12px rgba(255,255,255,0.25),
        0 8px 18px rgba(0,0,0,0.35);
    border:2px solid rgba(255,255,255,0.25);
}

.keno-number.active{
    background:
        radial-gradient(circle at 30% 25%, #ffffff 0%, #93c5fd 12%, #2563eb 40%, #1e3a8a 100%);
    transform:scale(1.08);
}

.result-number.hit{
    background:
        radial-gradient(circle at 30% 25%, #ffffff 0%, #86efac 12%, #22c55e 40%, #14532d 100%);
}

/* RODADA KENO */

.keno-round-card{
    background:linear-gradient(135deg,#7c3aed,#2563eb);
    border-radius:24px;
    padding:25px;
    margin-bottom:25px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    box-shadow:0 10px 30px rgba(37,99,235,0.25);
}

.keno-round-card span{
    display:block;
    font-size:13px;
    color:#dbeafe;
    margin-bottom:8px;
}

.keno-round-card h2{
    font-size:28px;
}

.keno-info-box{
    margin-top:20px;
    background:#1e293b;
    border-radius:18px;
    padding:18px;
    display:flex;
    gap:12px;
    color:#94a3b8;
    line-height:1.5;
}

.keno-info-box i{
    color:#60a5fa;
    font-size:22px;
}

/* AGUARDANDO */

.waiting-card{
    background:#1e293b;
    border-radius:30px;
    padding:50px 30px;
    text-align:center;
    margin-top:80px;
}

.waiting-card h1{
    font-size:36px;
    margin-bottom:15px;
}

.waiting-card p{
    color:#94a3b8;
    margin-bottom:25px;
}

.waiting-timer{
    font-size:72px;
    font-weight:bold;
    color:#60a5fa;
}

/* SPINNER */

.waiting-spinner{
    width:90px;
    height:90px;
    border-radius:50%;
    border:8px solid rgba(255,255,255,0.1);
    border-top:8px solid #2563eb;
    margin:auto;
    margin-bottom:30px;
    animation:spin 1s linear infinite;
}

@keyframes spin{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }
}

/* TAMBOR */

.keno-drum{
    width:260px;
    height:260px;
    border-radius:50%;
    margin:0 auto 40px;
    position:relative;
    border:12px solid rgba(255,255,255,0.08);
    animation:rotateDrum 6s linear infinite;
    overflow:hidden;
    background:
        radial-gradient(circle at center,
        #1e293b 0%,
        #0f172a 100%);
}

.drum-center{
    position:absolute;
    inset:0;
}

.drum-ball{
    width:55px;
    height:55px;
    border-radius:50%;
    position:absolute;
    background:
        radial-gradient(circle at 30% 25%,
        #fff 0%,
        #facc15 12%,
        #f97316 38%,
        #7c2d12 100%);
    box-shadow:
        inset -5px -5px 10px rgba(0,0,0,0.3),
        inset 3px 3px 8px rgba(255,255,255,0.2);
}

.drum-ball:nth-child(1){
    top:30px;
    left:50px;
}

.drum-ball:nth-child(2){
    top:120px;
    left:170px;
}

.drum-ball:nth-child(3){
    top:170px;
    left:80px;
}

.drum-ball:nth-child(4){
    top:60px;
    left:160px;
}

.drum-ball:nth-child(5){
    top:180px;
    left:170px;
}

.drum-ball:nth-child(6){
    top:120px;
    left:20px;
}

@keyframes rotateDrum{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }
}


/* HISTÓRICO KENO */

.keno-history-list{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.keno-history-card{
    background:#1e293b;
    border-radius:24px;
    padding:22px;
}

.keno-history-top,
.keno-history-values{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin-bottom:18px;
}

.keno-history-top div,
.keno-history-values div{
    background:#0f172a;
    border-radius:16px;
    padding:15px;
}

.keno-history-top span,
.keno-history-values span{
    display:block;
    color:#94a3b8;
    font-size:13px;
    margin-bottom:7px;
}

.keno-history-top strong,
.keno-history-values strong{
    font-size:16px;
}

.keno-history-numbers{
    margin-top:18px;
}

.keno-history-numbers p{
    color:#94a3b8;
    margin-bottom:10px;
    font-size:14px;
}

.mini-ball-grid{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.mini-ball{
    width:38px;
    height:38px;
    border-radius:50%;
    background:
        radial-gradient(circle at 30% 25%,
        #fff 0%,
        #facc15 12%,
        #f97316 38%,
        #7c2d12 100%);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:bold;
    color:#fff;
    box-shadow:
        inset -4px -5px 8px rgba(0,0,0,0.35),
        inset 3px 3px 6px rgba(255,255,255,0.2);
}

.mini-ball.hit{
    background:
        radial-gradient(circle at 30% 25%,
        #fff 0%,
        #86efac 12%,
        #22c55e 40%,
        #14532d 100%);
}

.mini-ball.sorted{
    background:
        radial-gradient(circle at 30% 25%,
        #fff 0%,
        #93c5fd 12%,
        #2563eb 40%,
        #1e3a8a 100%);
}

.view-result-btn{
    margin-top:20px;
    height:50px;
    border-radius:16px;
    background:#2563eb;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
}

@media(max-width:600px){

    .keno-history-top,
    .keno-history-values{
        grid-template-columns:1fr;
    }
}

/* KENO AO VIVO */

.live-main-card{
    position:relative;
    background:
        linear-gradient(135deg,#1e293b,#0f172a);
    border-radius:30px;
    padding:35px 25px;
    text-align:center;
    margin-bottom:25px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,0.06);
}

.live-pulse{
    width:18px;
    height:18px;
    background:#22c55e;
    border-radius:50%;
    margin:0 auto 18px;
    box-shadow:0 0 0 rgba(34,197,94,0.7);
    animation:livePulse 1.5s infinite;
}

@keyframes livePulse{

    0%{
        box-shadow:0 0 0 0 rgba(34,197,94,0.7);
    }

    70%{
        box-shadow:0 0 0 18px rgba(34,197,94,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(34,197,94,0);
    }
}

.live-main-card h2{
    font-size:32px;
    margin-bottom:8px;
}

.live-main-card p{
    color:#94a3b8;
    margin-bottom:20px;
}

.live-timer{
    font-size:64px;
    font-weight:bold;
    color:#60a5fa;
    margin-bottom:25px;
}

.live-bet-btn{
    height:55px;
    border-radius:18px;
    background:#2563eb;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
}

.live-stats-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
    margin-bottom:25px;
}

.live-stat-card{
    background:#1e293b;
    border-radius:22px;
    padding:22px;
    text-align:center;
}

.live-stat-card span{
    display:block;
    color:#94a3b8;
    margin-bottom:10px;
    font-size:14px;
}

.live-stat-card strong{
    font-size:24px;
}

.live-drum-card{
    background:#1e293b;
    border-radius:26px;
    padding:28px;
    text-align:center;
    margin-bottom:25px;
}

.live-drum-card h2{
    margin-bottom:8px;
}

.live-drum-card p{
    color:#94a3b8;
    margin-bottom:25px;
}

.live-drum{
    margin-bottom:0;
}

.last-results-area{
    margin-bottom:40px;
}

.last-result-card{
    background:#1e293b;
    border-radius:22px;
    padding:20px;
    margin-bottom:15px;
}

.last-result-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:15px;
}

.last-result-top span{
    color:#94a3b8;
    font-size:13px;
}

.last-result-card a{
    margin-top:15px;
    height:45px;
    border-radius:14px;
    background:#0f172a;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
}

@media(max-width:600px){

    .live-stats-grid{
        grid-template-columns:1fr;
    }
}

/* KENO INDEX AJAX */

.keno-balance-card{
    background:#1e293b;
    border-radius:22px;
    padding:22px;
    margin-bottom:20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.keno-balance-card span{
    color:#94a3b8;
    font-size:14px;
}

.keno-balance-card strong{
    font-size:22px;
}

.selected-counter{
    background:#1e293b;
    border-radius:18px;
    padding:18px;
    margin-bottom:18px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.selected-counter span{
    color:#94a3b8;
}

.selected-counter strong{
    color:#60a5fa;
    font-size:20px;
}

.keno-links{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
    margin-top:20px;
}

.keno-links a{
    height:55px;
    border-radius:18px;
    background:#1e293b;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    font-weight:bold;
}

.keno-links a:hover{
    background:#2563eb;
}

.keno-bet-box button:disabled{
    opacity:0.6;
    cursor:not-allowed;
}

/* LINKS KENO */

.keno-links{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
    margin-top:22px;
}

.keno-links a{
    height:55px;
    border-radius:18px;
    background:#1e293b;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    font-weight:bold;
}

.keno-links a:hover{
    background:#2563eb;
}

/* MINI HISTÓRICO KENO */

.keno-mini-history{
    margin-top:22px;
    background:#1e293b;
    border-radius:24px;
    padding:22px;
}

.mini-history-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.mini-history-header h3{
    font-size:20px;
    margin-bottom:4px;
}

.mini-history-header span{
    color:#94a3b8;
    font-size:13px;
}

.mini-history-header a{
    color:#60a5fa;
    text-decoration:none;
    font-size:14px;
    font-weight:bold;
}

.mini-history-item{
    background:#0f172a;
    border-radius:18px;
    padding:16px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:10px;
}

.mini-history-item strong{
    display:block;
    margin-bottom:5px;
}

.mini-history-item span{
    color:#94a3b8;
    font-size:13px;
}

.mini-history-right{
    text-align:right;
}

.mini-history-right small{
    display:block;
    margin-bottom:5px;
    font-weight:bold;
}

.mini-status-win{
    color:#22c55e;
}

.mini-status-lost{
    color:#ef4444;
}

.mini-status-wait{
    color:#facc15;
}

.mini-history-empty{
    background:#0f172a;
    border-radius:18px;
    padding:20px;
    text-align:center;
    color:#94a3b8;
}

/* POPUP KENO */

.keno-popup-overlay{
    position:fixed;
    inset:0;
    background:rgba(2,6,23,0.82);
    backdrop-filter:blur(8px);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:9999;
    padding:20px;
}

.keno-popup-overlay.active{
    display:flex;
}

.keno-popup{
    width:100%;
    max-width:420px;
    background:#1e293b;
    border-radius:30px;
    padding:35px 25px;
    text-align:center;
    box-shadow:0 20px 80px rgba(0,0,0,0.45);
}

.popup-icon{
    width:90px;
    height:90px;
    border-radius:50%;
    background:linear-gradient(135deg,#22c55e,#16a34a);
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 22px;
}

.popup-icon i{
    font-size:46px;
}

.popup-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.popup-actions button,
.popup-actions a{
    height:52px;
    border:none;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
    text-decoration:none;
    cursor:pointer;
}

.popup-actions button{
    background:#0f172a;
    color:#fff;
}

.popup-actions a{
    background:#2563eb;
    color:#fff;
}

/* TRAVA */

.keno-number.locked,
.keno-type.locked{
    opacity:0.55;
    cursor:not-allowed;
}

@media(max-width:500px){

    .popup-actions{
        grid-template-columns:1fr;
    }

    .mini-history-item{
        flex-direction:column;
        align-items:flex-start;
        gap:10px;
    }

    .mini-history-right{
        text-align:left;
    }
}

/* KENO FX */

.fx-pulse{
    animation:fxPulse 0.35s ease;
}

@keyframes fxPulse{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.12);
    }

    100%{
        transform:scale(1);
    }
}

.fx-shake{
    animation:fxShake 0.35s ease;
}

@keyframes fxShake{

    0%,100%{
        transform:translateX(0);
    }

    25%{
        transform:translateX(-5px);
    }

    50%{
        transform:translateX(5px);
    }

    75%{
        transform:translateX(-3px);
    }
}

.fx-glow{
    animation:fxGlow 1.2s ease;
}

@keyframes fxGlow{

    0%{
        box-shadow:0 0 0 rgba(34,197,94,0);
    }

    50%{
        box-shadow:0 0 35px rgba(34,197,94,0.65);
    }

    100%{
        box-shadow:0 0 0 rgba(34,197,94,0);
    }
}

/* RESULTADO KENO PREMIUM */

.result-live-status{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
    margin-bottom:22px;
}

.result-live-status div{
    background:#1e293b;
    border-radius:20px;
    padding:18px;
}

.result-live-status span{
    display:block;
    color:#94a3b8;
    font-size:13px;
    margin-bottom:8px;
}

.result-live-status strong{
    font-size:20px;
    color:#fff;
}

.current-ball-area{
    text-align:center;
    margin-bottom:30px;
}

.current-ball-area span{
    display:block;
    color:#94a3b8;
    font-size:14px;
    margin-bottom:12px;
}

.current-ball{
    width:105px;
    height:105px;
    border-radius:50%;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:36px;
    font-weight:bold;
    color:#fff;
    box-shadow:
        inset -8px -10px 18px rgba(0,0,0,0.35),
        inset 6px 6px 14px rgba(255,255,255,0.25),
        0 0 35px rgba(249,115,22,0.45);
    border:3px solid rgba(255,255,255,0.25);
}

.keno-result-machine #kenoDrum{
    display:none;
}

.keno-track-ball,
.current-ball{
    background:
        radial-gradient(circle at 35% 30%,
            #ffffff 0%,
            #ffffff 33%,
            #e2e8f0 34%,
            #f8fafc 40%,
            #f59e0b 41%,
            #f97316 72%,
            #7c2d12 100%);
}

.keno-track-ball.c0,
.current-ball.c0{
    background:
        radial-gradient(circle at 35% 30%,
            #ffffff 0%,
            #ffffff 33%,
            #e2e8f0 34%,
            #f8fafc 40%,
            #60a5fa 41%,
            #2563eb 72%,
            #1e3a8a 100%);
}

.keno-track-ball.c1,
.current-ball.c1{
    background:
        radial-gradient(circle at 35% 30%,
            #ffffff 0%,
            #ffffff 33%,
            #e2e8f0 34%,
            #f8fafc 40%,
            #86efac 41%,
            #22c55e 72%,
            #14532d 100%);
}

.keno-track-ball.c2,
.current-ball.c2{
    background:
        radial-gradient(circle at 35% 30%,
            #ffffff 0%,
            #ffffff 33%,
            #e2e8f0 34%,
            #f8fafc 40%,
            #fca5a5 41%,
            #ef4444 72%,
            #7f1d1d 100%);
}

.keno-track-ball.c3,
.current-ball.c3{
    background:
        radial-gradient(circle at 35% 30%,
            #ffffff 0%,
            #ffffff 33%,
            #e2e8f0 34%,
            #f8fafc 40%,
            #c4b5fd 41%,
            #7c3aed 72%,
            #3b0764 100%);
}

.keno-track-ball.c4,
.current-ball.c4{
    background:
        radial-gradient(circle at 35% 30%,
            #ffffff 0%,
            #ffffff 33%,
            #e2e8f0 34%,
            #f8fafc 40%,
            #fde68a 41%,
            #f59e0b 72%,
            #7c2d12 100%);
}

.keno-track-ball.c5,
.current-ball.c5{
    background:
        radial-gradient(circle at 35% 30%,
            #ffffff 0%,
            #ffffff 33%,
            #e2e8f0 34%,
            #f8fafc 40%,
            #67e8f9 41%,
            #06b6d4 72%,
            #164e63 100%);
}

.draw-ball.hit-draw{
    background:
        radial-gradient(circle at 30% 25%,
        #fff 0%,
        #86efac 12%,
        #22c55e 40%,
        #14532d 100%);
    box-shadow:
        inset -8px -10px 18px rgba(0,0,0,0.35),
        inset 6px 6px 14px rgba(255,255,255,0.25),
        0 0 35px rgba(34,197,94,0.65);
}

.result-subtitle{
    color:#94a3b8;
    margin-top:-5px;
    margin-bottom:20px;
    line-height:1.6;
}

.result-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    margin-bottom:40px;
}

.result-secondary-btn{
    height:58px;
    border-radius:18px;
    background:#1e293b;
    color:#fff;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
    transition:0.3s;
}

.result-secondary-btn:hover{
    background:#2563eb;
}

.popup-win{
    background:linear-gradient(135deg,#f59e0b,#f97316);
}

.popup-lose{
    background:linear-gradient(135deg,#ef4444,#991b1b);
}

.drum-finished{
    animation:none !important;
    opacity:0.75;
    filter:saturate(0.8);
}

/* MELHORIA DO POPUP */

.keno-popup h2{
    font-size:28px;
    margin-bottom:12px;
}

.keno-popup p{
    color:#94a3b8;
    line-height:1.6;
    margin-bottom:25px;
}

/* RESULT STATS MAIS BONITO */

.result-stats{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
    margin-top:25px;
}

.stat-item{
    background:#0f172a;
    border-radius:18px;
    padding:20px;
    text-align:center;
}

.stat-item span{
    display:block;
    color:#94a3b8;
    font-size:13px;
    margin-bottom:8px;
}

.stat-item strong{
    font-size:22px;
}

/* RESPONSIVO */

@media(max-width:600px){

    .result-live-status{
        grid-template-columns:1fr;
    }

    .result-stats{
        grid-template-columns:1fr;
    }

    .current-ball{
        width:88px;
        height:88px;
        font-size:30px;
    }
}

.keno-prizes-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin-bottom:18px;
}

.keno-prize-card{
    background:linear-gradient(145deg,#0f172a,#111827);
    border-radius:20px;
    padding:18px 14px;
    border:1px solid rgba(255,255,255,0.06);
    text-align:center;
}

.keno-prize-card strong{
    display:block;
    font-size:18px;
    letter-spacing:1px;
    margin-bottom:6px;
}

.keno-prize-card span{
    display:block;
    color:#94a3b8;
    font-size:12px;
    margin-bottom:10px;
}

.keno-prize-card small{
    display:block;
    color:#e2e8f0;
    font-weight:bold;
    font-size:13px;
}

.keno-buy-card{
    background:linear-gradient(135deg,#0f172a,#1e293b);
    border-radius:26px;
    padding:22px;
    border:1px solid rgba(255,255,255,0.06);
    margin-bottom:22px;
}

.keno-buy-top{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:flex-end;
    margin-bottom:16px;
}

.keno-buy-top span{
    display:block;
    color:#94a3b8;
    font-size:12px;
    margin-bottom:6px;
}

.keno-buy-top strong{
    font-size:22px;
}

.keno-buy-total{
    text-align:right;
}

.keno-qty-quick{
    display:grid;
    grid-template-columns:repeat(8,1fr);
    gap:8px;
    margin-bottom:14px;
}

.qty-btn{
    height:42px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,0.10);
    background:#0f172a;
    color:#fff;
    font-weight:bold;
    cursor:pointer;
}

.keno-qty-row{
    display:flex;
    gap:10px;
    align-items:center;
    margin-bottom:14px;
}

.qty-step{
    width:46px;
    height:46px;
    border-radius:14px;
    border:none;
    background:#1e293b;
    color:#fff;
    font-size:22px;
    font-weight:bold;
    cursor:pointer;
}

#qtdInput{
    width:88px;
    height:46px;
    border-radius:14px;
    border:none;
    background:#0f172a;
    color:#fff;
    font-size:18px;
    text-align:center;
}

.keno-qty-label{
    margin-left:auto;
    text-align:right;
}

.keno-qty-label span{
    display:block;
    color:#94a3b8;
    font-size:12px;
    margin-bottom:6px;
}

.keno-qty-label strong{
    font-size:20px;
}

.keno-doar-btn{
    width:100%;
    height:58px;
    border:none;
    border-radius:18px;
    background:linear-gradient(135deg,#22c55e,#16a34a);
    color:#fff;
    font-weight:bold;
    font-size:16px;
    letter-spacing:1px;
    cursor:pointer;
    box-shadow:0 10px 26px rgba(34,197,94,0.22);
}

.keno-doar-btn:disabled{
    opacity:0.6;
    cursor:not-allowed;
}

.keno-my-tickets #minhasCartelasArea{
    margin-top:14px;
    max-height:320px;
    overflow:auto;
    padding-right:4px;
}

.keno-ticket{
    background:#0f172a;
    border-radius:18px;
    padding:16px;
    border:1px solid rgba(255,255,255,0.05);
    margin-bottom:12px;
}

.keno-ticket-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:10px;
    color:#94a3b8;
    font-size:12px;
}

.keno-table-grid{
    display:grid;
    grid-template-columns:repeat(10,1fr);
    gap:8px;
}

.keno-table-number{
    height:38px;
    border-radius:14px;
    background:#1e293b;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
    font-size:13px;
    border:1px solid rgba(255,255,255,0.06);
    transition:0.2s;
}

.keno-table-number.sorted{
    background:
        radial-gradient(circle at 30% 25%, #fff 0%, #93c5fd 12%, #2563eb 40%, #1e3a8a 100%);
    box-shadow:
        inset -4px -5px 8px rgba(0,0,0,0.35),
        inset 3px 3px 6px rgba(255,255,255,0.2);
}

.keno-table-number.last{
    transform:translateY(-2px) scale(1.06);
    box-shadow:
        0 0 0 2px rgba(250,204,21,0.55),
        0 0 22px rgba(249,115,22,0.25),
        inset -4px -5px 8px rgba(0,0,0,0.35),
        inset 3px 3px 6px rgba(255,255,255,0.2);
}

.keno-tickets-list{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:12px;
}

.keno-ticket-result{
    background:#0f172a;
    border-radius:20px;
    padding:16px;
    border:1px solid rgba(255,255,255,0.05);
}

.keno-ticket-result-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:12px;
}

.keno-ticket-badge{
    padding:6px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:bold;
    letter-spacing:1px;
    background:#1e293b;
    border:1px solid rgba(255,255,255,0.08);
}

.keno-ticket-badge.badge-win{
    background:rgba(34,197,94,0.15);
    border-color:rgba(34,197,94,0.25);
    color:#86efac;
}

.keno-ticket-badge.badge-lose{
    opacity:0.85;
}

.keno-ticket-footer{
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin-top:12px;
    color:#94a3b8;
    font-size:13px;
}

.keno-ticket-footer strong{
    color:#fff;
}

@media(max-width:700px){
    .keno-prizes-grid{
        grid-template-columns:1fr;
    }
    .keno-qty-quick{
        grid-template-columns:repeat(4,1fr);
    }
    .keno-table-grid{
        grid-template-columns:repeat(9,1fr);
    }
    .keno-tickets-list{
        grid-template-columns:1fr;
    }
}

.keno-casino-page{
    background:
        radial-gradient(circle at 50% -10%, rgba(37,99,235,0.72), transparent 62%),
        radial-gradient(circle at 12% 18%, rgba(14,165,233,0.40), transparent 58%),
        radial-gradient(circle at 92% 30%, rgba(59,130,246,0.32), transparent 58%),
        #050b1f;
}

.keno-wait-page{
    min-height:100vh;
    min-height:100svh;
}

.keno-casino-page .game-container{
    max-width:420px;
    padding:14px;
}

.keno-wait-page .game-container{
    min-height:100vh;
    min-height:100svh;
    display:flex;
    align-items:center;
    justify-content:center;
}

.keno-wait-page .keno-wait-wrapper{
    width:100%;
}

.keno-wait-page .keno-casino-wrapper{
    margin:0 auto;
}

.keno-wait-page .keno-casino-top{
    padding:12px;
}

.keno-wait-page .keno-wait-card{
    margin-top:12px;
}

.keno-casino-wrapper{
    width:100%;
    border-radius:22px;
    overflow:hidden;
    box-shadow:0 18px 40px rgba(0,0,0,0.45);
    border:1px solid rgba(255,255,255,0.08);
    background:rgba(3,16,52,0.68);
    backdrop-filter:blur(10px);
}

.keno-casino-top{
    background:linear-gradient(180deg,#1d4ed8,#0b2a7a);
    padding:12px 12px 10px 12px;
    border-bottom:1px solid rgba(255,255,255,0.10);
}

.keno-casino-topbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.keno-casino-icon{
    width:38px;
    height:38px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    text-decoration:none;
    background:rgba(0,0,0,0.22);
    border:1px solid rgba(255,255,255,0.12);
}

.keno-casino-title{
    text-align:center;
    flex:1;
}

.keno-casino-title span{
    display:block;
    font-size:12px;
    color:rgba(255,255,255,0.85);
    letter-spacing:0.5px;
}

.keno-casino-title strong{
    display:block;
    font-size:54px;
    line-height:1;
    letter-spacing:2px;
    margin-top:2px;
    text-shadow:0 10px 22px rgba(0,0,0,0.35);
}

.keno-result-title{
    text-align:center;
    flex:1;
}

.keno-result-title span{
    display:block;
    font-size:12px;
    color:rgba(255,255,255,0.85);
    letter-spacing:0.5px;
}

.keno-result-title strong{
    display:block;
    font-size:18px;
    margin-top:4px;
    letter-spacing:0.4px;
    color:#fff;
    text-shadow:0 8px 18px rgba(0,0,0,0.25);
}

.keno-casino-meta{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:10px;
    margin-top:10px;
}

.keno-casino-meta-item{
    background:rgba(0,0,0,0.20);
    border:1px solid rgba(255,255,255,0.10);
    border-radius:14px;
    padding:8px 10px;
    text-align:center;
}

.keno-casino-meta-item span{
    display:block;
    font-size:11px;
    color:rgba(255,255,255,0.75);
    margin-bottom:3px;
}

.keno-casino-meta-item strong{
    font-size:14px;
    letter-spacing:0.3px;
}

.keno-casino-prizes{
    padding:10px 12px 4px 12px;
    background:rgba(2,6,23,0.50);
}

.keno-casino-prize-row{
    display:flex;
    align-items:center;
    gap:10px;
    padding:9px 10px;
    border-radius:16px;
    background:rgba(30,41,59,0.55);
    border:1px solid rgba(255,255,255,0.07);
    margin-bottom:8px;
}

.keno-casino-prize-row span{
    width:86px;
    font-weight:bold;
    letter-spacing:1px;
    font-size:13px;
    color:#e2e8f0;
}

.keno-casino-prize-bar{
    flex:1;
    height:10px;
    border-radius:999px;
    background:linear-gradient(90deg, rgba(255,255,255,0.28), rgba(255,255,255,0.08));
    border:1px solid rgba(255,255,255,0.12);
}

.keno-prize-right{
    width:140px;
    text-align:right;
    display:flex;
    flex-direction:column;
    gap:2px;
}

.keno-prize-right strong{
    font-weight:bold;
    color:#fff;
    line-height:1.1;
}

.keno-prize-mini{
    font-size:10px;
    color:#cbd5e1;
    opacity:0.9;
    line-height:1.1;
}

.keno-casino-jackpot{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin:12px 10px 12px;
    padding:10px 12px;
    border-radius:18px;
    background:linear-gradient(180deg,#1d4ed8,#0b2a7a);
    border:1px solid rgba(255,255,255,0.12);
    position:relative;
}

.keno-casino-jackpot span{
    font-weight:bold;
    letter-spacing:1px;
}

.keno-casino-jackpot strong{
    font-size:16px;
}

.keno-last-badge{
    position:absolute;
    right:-10px;
    top:-10px;
    width:44px;
    height:44px;
    border-radius:50%;
    background:linear-gradient(180deg,#ef4444,#b91c1c);
    border:3px solid rgba(255,255,255,0.85);
    box-shadow:0 10px 22px rgba(0,0,0,0.35);
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
    color:#fff;
    font-size:16px;
    letter-spacing:0.2px;
}

.keno-casino-chips{
    display:grid;
    grid-template-columns:repeat(8,1fr);
    gap:6px;
    padding:0 12px 10px 12px;
}

.keno-chip{
    height:32px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,0.12);
    background:rgba(15,23,42,0.9);
    color:#fff;
    font-weight:bold;
    font-size:12px;
    cursor:pointer;
}

.keno-chip.active{
    background:linear-gradient(135deg,#f59e0b,#f97316);
    border-color:rgba(250,204,21,0.55);
    box-shadow:0 0 18px rgba(249,115,22,0.28);
}

.keno-casino-action{
    padding:0 12px 10px 12px;
}

.keno-qty-btn{
    width:42px;
    height:44px;
    border:none;
    border-radius:14px;
    background:rgba(30,41,59,0.9);
    color:#fff;
    font-size:22px;
    font-weight:bold;
    cursor:pointer;
}

.keno-casino-doar{
    width:100%;
    height:58px;
    border:none;
    border-radius:18px;
    background:linear-gradient(135deg,#22c55e,#16a34a);
    color:#fff;
    font-weight:bold;
    font-size:16px;
    letter-spacing:1px;
    cursor:pointer;
    box-shadow:0 10px 26px rgba(34,197,94,0.22);
}

.keno-casino-doar:disabled{
    opacity:0.65;
    cursor:not-allowed;
}

.keno-casino-bottom{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:10px 12px;
    background:rgba(2,6,23,0.55);
    border-top:1px solid rgba(255,255,255,0.08);
}

.keno-casino-bottom-controls{
    display:flex;
    gap:8px;
}

.keno-casino-bottom-right{
    text-align:right;
    color:#cbd5e1;
    font-size:12px;
}

.keno-casino-bottom-right strong{
    display:block;
    font-size:14px;
    color:#fff;
}

.keno-casino-status{
    padding:10px 12px 2px 12px;
    font-size:12px;
    color:#94a3b8;
}

.keno-casino-details{
    margin:8px 12px 14px 12px;
    border-radius:18px;
    background:rgba(15,23,42,0.65);
    border:1px solid rgba(255,255,255,0.08);
    overflow:hidden;
}

.keno-casino-details summary{
    list-style:none;
    cursor:pointer;
    padding:12px 14px;
    font-weight:bold;
    color:#e2e8f0;
}

.keno-casino-details summary::-webkit-details-marker{
    display:none;
}

.keno-casino-details[open] summary{
    border-bottom:1px solid rgba(255,255,255,0.08);
}

.keno-casino-details #minhasCartelasArea,
.keno-casino-details .keno-mini-history,
.keno-casino-details .keno-links{
    padding:12px 14px;
}

.keno-casino-page .keno-links{
    margin-top:10px;
}

@media(max-width:420px){
    .keno-casino-page .game-container{
        padding:10px;
    }
    .keno-casino-title strong{
        font-size:48px;
    }
    .keno-casino-meta{
        gap:8px;
    }
    .keno-casino-chips{
        grid-template-columns:repeat(4,1fr);
        gap:8px;
    }
    .keno-qty-btn{
        width:40px;
        height:42px;
    }
}

.keno-result-progress{
    display:flex;
    gap:10px;
    align-items:center;
    padding:0 12px 10px 12px;
}

.keno-result-progress-left{
    width:78px;
    background:rgba(15,23,42,0.9);
    border:1px solid rgba(255,255,255,0.12);
    border-radius:16px;
    padding:8px 10px;
    text-align:center;
}

.keno-result-progress-left span{
    display:block;
    font-size:11px;
    color:#94a3b8;
    margin-bottom:3px;
}

.keno-result-progress-left strong{
    font-size:14px;
    letter-spacing:0.5px;
}

.keno-result-progress-bar{
    flex:1;
    height:12px;
    border-radius:999px;
    background:rgba(15,23,42,0.85);
    border:1px solid rgba(255,255,255,0.10);
    overflow:hidden;
}

.keno-result-progress-fill{
    width:0%;
    height:100%;
    background:linear-gradient(90deg,#f59e0b,#f97316,#22c55e);
    border-radius:999px;
    transition:width 0.35s ease;
}

.keno-result-machine{
    margin:0 12px 14px 12px;
    border-radius:22px;
    padding:16px;
}

.keno-result-machine .machine-header{
    margin-bottom:12px;
}

.keno-result-machine .machine-header h2{
    font-size:22px;
    margin-bottom:6px;
    letter-spacing:1px;
}

.keno-result-machine .machine-header p{
    font-size:12px;
    margin:0;
}

.keno-result-layout{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-top:8px;
}

.keno-result-grid{
    flex:1;
    min-width:0;
    border-radius:18px;
    background:rgba(2,6,23,0.35);
    border:1px solid rgba(255,255,255,0.06);
    padding:6px;
    overflow-x:hidden;
    overflow-y:visible;
}

.keno-stage{
    margin-top:0;
}

.keno-stage{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.keno-stage .current-ball{
    width:96px;
    height:96px;
    font-size:36px;
    color:#0b1220;
    text-shadow:none;
    position:relative;
    overflow:hidden;
    opacity:0;
    transform:translateY(6px) scale(0.60);
    filter:blur(0px);
    box-shadow:
        inset -10px -12px 22px rgba(0,0,0,0.35),
        inset 8px 8px 18px rgba(255,255,255,0.22),
        0 14px 34px rgba(0,0,0,0.45);
}

.keno-stage .current-ball::before{
    content:'';
    position:absolute;
    inset:-20px;
    background:
        linear-gradient(120deg,
            rgba(255,255,255,0) 0%,
            rgba(255,255,255,0.40) 18%,
            rgba(255,255,255,0) 36%);
    pointer-events:none;
    opacity:0;
    mix-blend-mode:screen;
}

.keno-stage .current-ball::after{
    content:'';
    position:absolute;
    inset:10px;
    border-radius:50%;
    border:2px solid rgba(255,255,255,0.55);
    box-shadow:inset 0 0 0 3px rgba(2,6,23,0.12);
    pointer-events:none;
    opacity:0.65;
}

.keno-stage .current-ball.show{
    animation:kenoCurrentShow var(--show-dur, 900ms) cubic-bezier(.22,1.0,.24,1) 1;
}

.keno-stage .current-ball.show::before{
    animation:kenoSheen var(--sheen-dur, 1500ms) ease-out 1;
    animation-delay:var(--sheen-delay, 80ms);
}

@keyframes kenoCurrentShow{
    0%{
        opacity:0;
        transform:translateY(10px) scale(0.30);
        filter:brightness(0.95) blur(1.2px)
            drop-shadow(0 0 0 rgba(59,130,246,0.0));
    }
    26%{
        opacity:1;
        transform:translateY(-3px) scale(1.10);
        filter:brightness(1.18) blur(0px)
            drop-shadow(0 10px 18px rgba(59,130,246,0.28));
    }
    62%{
        opacity:1;
        transform:translateY(0px) scale(1.0);
        filter:brightness(1.05) blur(0px)
            drop-shadow(0 6px 14px rgba(59,130,246,0.18));
    }
    100%{
        opacity:0;
        transform:translate(18px, 14px) scale(0.82);
        filter:brightness(1.0) blur(1px)
            drop-shadow(0 0 0 rgba(59,130,246,0.0));
    }
}

@keyframes kenoSheen{
    0%{
        transform:translateX(-120%) rotate(10deg);
        opacity:0.0;
    }
    25%{
        opacity:0.50;
    }
    55%{
        transform:translateX(120%) rotate(10deg);
        opacity:0.10;
    }
    100%{
        transform:translateX(120%) rotate(10deg);
        opacity:0.0;
    }
}

.keno-ball-track{
    position:relative;
    width:170px;
    height:130px;
    margin-top:0;
    overflow:hidden;
    border-radius:18px;
    background:
        linear-gradient(180deg, rgb(15 23 42 / 0%), rgb(2 6 23 / 0%));
    border:1px solid rgb(255 255 255 / 0%);
}

.keno-track-ball{
    position:absolute;
    left:0;
    top:0;
    width:56px;
    height:56px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    font-weight:bold;
    color:#0b1220;
    text-shadow:none;
    background:
        radial-gradient(circle at 30% 25%, #ffffff 0%, #facc15 12%, #f97316 38%, #7c2d12 100%);
    border:2px solid rgba(255,255,255,0.25);
    box-shadow:
        inset -6px -8px 14px rgba(0,0,0,0.35),
        inset 5px 5px 12px rgba(255,255,255,0.25),
        0 10px 20px rgba(0,0,0,0.35);
    transform:
        translateX(var(--x, 0px))
        translateY(var(--y, 0px))
        scale(var(--s, 1));
    opacity:var(--o, 1);
    transition:transform 0.35s ease, opacity 0.35s ease;
    will-change:transform, opacity;
}

.keno-track-ball::after{
    content:'';
    position:absolute;
    inset:8px;
    border-radius:50%;
    background:
        radial-gradient(circle at 30% 25%, rgba(255,255,255,0.65), rgba(255,255,255,0) 55%);
    pointer-events:none;
    mix-blend-mode:screen;
    opacity:0.7;
}

.keno-result-grid .keno-table-grid{
    grid-template-columns:repeat(10, 1fr);
    gap:2px;
    width:100%;
}

.keno-result-grid .keno-table-number{
    height:20px;
    border-radius:6px;
    background:rgba(15,23,42,0.95);
    border:1px solid rgba(255,255,255,0.06);
    font-size:10px;
    font-weight:bold;
    color:rgba(255,255,255,0.50);
}

.keno-result-grid .keno-table-number.sorted{
    background:rgba(2,6,23,0.95);
    color:#22c55e;
    box-shadow:none;
}

.keno-result-grid .keno-table-number.last{
    background:rgba(185,28,28,0.95);
    color:#fff;
    transform:scale(1.02);
    box-shadow:0 0 0 2px rgba(255,255,255,0.25);
}

.keno-track-ball::before{
    content:'';
    position:absolute;
    display:none;
}

.keno-track-ball.hit-draw{
    background:
        radial-gradient(circle at 30% 25%, #ffffff 0%, #86efac 12%, #22c55e 40%, #14532d 100%);
}

.keno-track-ball.enter{
    animation:kenoBallEnter 0.52s cubic-bezier(.22,1.0,.24,1);
}

.keno-track-ball.exit{
    opacity:0;
    transform:
        translateX(var(--x, 0px))
        translateY(calc(var(--y, 0px) + 40px))
        scale(0.35);
}

@keyframes kenoBallEnter{
    0%{
        transform:
            translateX(var(--x, 0px))
            translateY(calc(var(--y, 0px) - 16px))
            scale(1.28);
        opacity:0;
        filter:blur(1px);
    }
    60%{
        transform:
            translateX(var(--x, 0px))
            translateY(var(--y, 0px))
            scale(calc(var(--s, 1) * 1.05));
        opacity:var(--o, 1);
        filter:blur(0px);
    }
    100%{
        transform:
            translateX(var(--x, 0px))
            translateY(var(--y, 0px))
            scale(var(--s, 1));
        opacity:var(--o, 1);
        filter:blur(0px);
    }
}

.keno-tickets-scroll{
    display:flex;
    gap:12px;
    overflow-x:auto;
    padding-bottom:6px;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
}

.keno-ticket-slide{
    flex:0 0 300px;
    scroll-snap-align:start;
    border-radius:16px;
    padding:0;
    background:linear-gradient(180deg,#fde047,#facc15);
    border:2px solid rgba(2,6,23,0.35);
    box-shadow:0 14px 28px rgba(0,0,0,0.35);
    overflow:hidden;
}

.keno-ticket-topbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:8px 10px;
    background:linear-gradient(180deg, rgba(255,255,255,0.40), rgba(255,255,255,0.10));
    border-bottom:2px solid rgba(2,6,23,0.30);
}

.keno-ticket-label{
    font-weight:900;
    font-size:13px;
    letter-spacing:0.4px;
    color:#0b1220;
}

.keno-ticket-pill{
    height:22px;
    padding:0 10px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:900;
    font-size:11px;
    letter-spacing:0.8px;
    color:#0b1220;
    background:rgba(255,255,255,0.55);
    border:1px solid rgba(2,6,23,0.25);
}

.keno-ticket-pill.win{
    color:#fff;
    background:linear-gradient(180deg,#16a34a,#166534);
    border-color:rgba(2,6,23,0.35);
}

.keno-ticket-grid{
    display:grid;
    grid-template-columns:repeat(5, 1fr);
    background:#0b1220;
    gap:2px;
    padding:2px;
}

.keno-ticket-cell{
    height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f8fafc;
    font-weight:900;
    font-size:18px;
    color:#0b1220;
    user-select:none;
}

.keno-ticket-cell.hit{
    background:linear-gradient(180deg,#1d4ed8,#1e3a8a);
    color:#fff;
}

.keno-ticket-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:8px 10px;
    border-top:2px solid rgba(2,6,23,0.30);
    background:linear-gradient(180deg, rgba(255,255,255,0.25), rgba(255,255,255,0.05));
}

.keno-ticket-code{
    font-weight:900;
    font-size:20px;
    letter-spacing:0.6px;
    color:#0b1220;
}

.keno-ticket-wininfo{
    display:flex;
    gap:10px;
    align-items:center;
    font-weight:800;
    font-size:12px;
    color:#0b1220;
    opacity:0.95;
}

@media(max-width:420px){
    .keno-ticket-slide{
        flex-basis:270px;
    }
    .keno-ball-track{
        width:150px;
        height:120px;
    }
    .keno-stage .current-ball{
        width:88px;
        height:88px;
        font-size:34px;
    }
    .keno-prize-right{
        width:120px;
    }
}

#winnersBox{
    margin:0 12px 14px 12px;
    border-radius:22px;
}

.hidden{
    display:none;
}

#winnersBox.hidden{
    display:none;
}

#winnersBox{
    opacity:0;
    transform:translateY(10px);
    transition:opacity 0.45s ease, transform 0.45s ease;
}

#winnersBox.active{
    opacity:1;
    transform:translateY(0);
}

.keno-prize-popup-overlay{
    position:fixed;
    inset:0;
    display:none;
    align-items:flex-start;
    justify-content:center;
    padding:12px 14px;
    z-index:9999;
    background:transparent;
    pointer-events:none;
}

.keno-prize-popup-overlay.active{
    display:flex;
}

.keno-prize-popup{
    width:100%;
    max-width:420px;
    border-radius:22px;
    background:rgba(15,23,42,0.92);
    border:1px solid rgba(255,255,255,0.10);
    box-shadow:0 18px 40px rgba(0,0,0,0.55);
    overflow:hidden;
    transform:translateY(-6px);
    animation:kenoPrizePop 0.28s ease;
    pointer-events:auto;
    position:relative;
}

.keno-prize-popup::before{
    content:'';
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:6px;
    background:rgba(255,255,255,0.12);
}

@keyframes kenoPrizePop{
    0%{
        transform:translateY(-18px) scale(0.98);
        opacity:0;
    }
    100%{
        transform:translateY(-6px) scale(1);
        opacity:1;
    }
}

.keno-prize-popup-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:12px 14px;
    background:rgba(2,6,23,0.60);
    border-bottom:1px solid rgba(255,255,255,0.08);
}

.keno-prize-popup-top strong{
    letter-spacing:1px;
}

.keno-prize-popup-close{
    width:38px;
    height:38px;
    border:none;
    border-radius:12px;
    background:rgba(255,255,255,0.08);
    color:#fff;
    cursor:pointer;
}

.keno-prize-popup-body{
    padding:14px;
}

.keno-prize-popup-winner{
    background:rgba(30,41,59,0.55);
    border:1px solid rgba(255,255,255,0.07);
    border-radius:18px;
    padding:12px;
    margin-bottom:12px;
}

.keno-prize-popup-winner-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:8px;
}

.keno-prize-code{
    min-width:72px;
    text-align:center;
    padding:6px 10px;
    border-radius:14px;
    background:rgba(2,6,23,0.55);
    border:1px solid rgba(255,255,255,0.10);
    font-weight:bold;
    letter-spacing:0.5px;
}

.keno-prize-popup-winner-top strong{
    flex:1;
    text-align:left;
    font-size:14px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.keno-prize-popup-winner-prize{
    text-align:center;
    font-weight:bold;
    font-size:18px;
    letter-spacing:0.5px;
}

.keno-prize-popup-line{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 12px;
    border-radius:16px;
    background:rgba(30,41,59,0.55);
    border:1px solid rgba(255,255,255,0.07);
    margin-bottom:10px;
}

.keno-prize-popup-line span{
    color:#94a3b8;
    font-size:12px;
}

.keno-prize-popup-line strong{
    font-size:13px;
    text-align:right;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    max-width:260px;
}

.keno-prize-popup-nums{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    justify-content:center;
    padding-top:4px;
}

.keno-prize-popup-grid{
    display:grid;
    gap:10px;
    justify-content:center;
    padding-top:0;
    grid-template-columns:repeat(5, 1fr);
}

.keno-popup-num{
    height:44px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
    font-size:14px;
    color:#0b1220;
    background:linear-gradient(180deg,#f1f5f9,#cbd5e1);
    border:1px solid rgba(0,0,0,0.15);
    box-shadow:inset 0 2px 0 rgba(255,255,255,0.55);
}

.keno-popup-num.hit{
    background:linear-gradient(180deg,#86efac,#22c55e);
    color:#052e16;
}

.keno-popup-num.last{
    background:linear-gradient(180deg,#fca5a5,#ef4444);
    color:#450a0a;
}

.keno-live-board{
    margin:0 12px 14px 12px;
    border-radius:22px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
    background:rgba(2,6,23,0.55);
}

.keno-live-board-header{
    display:grid;
    grid-template-columns:1fr 1fr 1fr 0.75fr;
    gap:8px;
    padding:10px;
    background:rgba(30,41,59,0.55);
    border-bottom:1px solid rgba(255,255,255,0.08);
}

.keno-live-hcell span{
    display:block;
    font-size:11px;
    color:#fde68a;
    font-weight:bold;
    letter-spacing:0.6px;
}

.keno-live-hcell strong{
    display:block;
    font-size:14px;
    letter-spacing:0.3px;
}

.keno-live-ordem{
    text-align:right;
}

.keno-live-statusline{
    padding:8px 10px;
    border-bottom:1px solid rgba(255,255,255,0.08);
    background:rgba(2,6,23,0.35);
    text-align:center;
}

.keno-live-statusline strong{
    font-size:13px;
    letter-spacing:0.5px;
}

.keno-live-board-list{
    max-height:230px;
    overflow:auto;
}

.keno-live-row{
    display:grid;
    grid-template-columns:92px 1fr 104px;
    gap:8px;
    padding:8px 10px;
    border-bottom:1px solid rgba(255,255,255,0.06);
    align-items:center;
}

.keno-live-row:last-child{
    border-bottom:none;
}

.keno-live-cell{
    font-size:12px;
}

.keno-live-cell.code{
    font-weight:bold;
    color:#e2e8f0;
}

.keno-live-cell.name{
    font-weight:bold;
    color:#fff;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.keno-live-cell.hits{
    text-align:right;
    color:#86efac;
    font-weight:bold;
    letter-spacing:0.3px;
}

.keno-live-row.winner-row{
    background:rgba(34,197,94,0.10);
}

.keno-winners-overlay{
    position:fixed;
    inset:0;
    display:none;
    align-items:center;
    justify-content:center;
    padding:18px 14px;
    z-index:9998;
    background:rgba(0,0,0,0.55);
}

.keno-winners-overlay.active{
    display:flex;
}

.keno-winners-modal{
    width:100%;
    max-width:520px;
    border-radius:26px;
    overflow:hidden;
    border:3px solid rgba(250,204,21,0.85);
    background:linear-gradient(180deg,#f59e0b,#fbbf24);
    box-shadow:0 22px 55px rgba(0,0,0,0.60);
}

.keno-winners-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:14px 16px;
    background:linear-gradient(180deg,#ffffff,#e2e8f0);
    border-bottom:2px solid rgba(0,0,0,0.12);
}

.keno-winners-header strong{
    font-size:22px;
    letter-spacing:0.6px;
    color:#0b1220;
}

.keno-winners-close{
    width:42px;
    height:42px;
    border:none;
    border-radius:14px;
    background:rgba(2,6,23,0.12);
    color:#0b1220;
    cursor:pointer;
}

.keno-winners-body{
    padding:14px 14px 16px 14px;
    display:flex;
    flex-direction:column;
    gap:14px;
}

.keno-winners-section{
    border-radius:18px;
    padding:12px;
    background:rgba(2,6,23,0.18);
    border:1px solid rgba(0,0,0,0.12);
}

.keno-winners-title{
    text-align:center;
    font-size:26px;
    font-weight:bold;
    letter-spacing:1px;
    color:#0b1220;
    margin-bottom:10px;
}

.keno-winners-card{
    background:linear-gradient(180deg,#1d4ed8,#1e3a8a);
    border-radius:18px;
    padding:12px;
    border:2px solid rgba(255,255,255,0.16);
    color:#fff;
    display:grid;
    grid-template-columns:90px 1fr;
    gap:10px 12px;
    align-items:center;
}

.keno-winners-code{
    grid-column:1 / -1;
    text-align:center;
    font-weight:bold;
    letter-spacing:0.8px;
    font-size:18px;
}

.keno-winners-name{
    grid-column:1 / -1;
    text-align:center;
    font-weight:bold;
    font-size:16px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.keno-winners-amount{
    grid-column:1 / -1;
    text-align:center;
    font-weight:bold;
    font-size:22px;
    letter-spacing:0.6px;
}

.keno-winners-empty{
    text-align:center;
    color:#0b1220;
    font-weight:bold;
    padding:10px 6px;
}

.keno-winners-section.type-quadra .keno-winners-title{
    color:#0b1220;
}

.keno-winners-section.type-quina .keno-winners-title{
    color:#0b1220;
}

.keno-winners-section.type-keno .keno-winners-title{
    color:#0b1220;
}

.keno-prize-popup.type-quadra{
    border-color:rgba(249,115,22,0.32);
}

.keno-prize-popup.type-quina{
    border-color:rgba(37,99,235,0.32);
}

.keno-prize-popup.type-keno{
    border-color:rgba(34,197,94,0.32);
}

.keno-prize-popup.type-quadra::before{
    background:linear-gradient(180deg,#f59e0b,#f97316);
}

.keno-prize-popup.type-quina::before{
    background:linear-gradient(180deg,#60a5fa,#2563eb);
}

.keno-prize-popup.type-keno::before{
    background:linear-gradient(180deg,#86efac,#22c55e);
}

.keno-winners-summary{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin-top:10px;
    margin-bottom:14px;
}

.keno-winner-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 12px;
    border-radius:18px;
    background:rgba(30,41,59,0.55);
    border:1px solid rgba(255,255,255,0.07);
}

.keno-winner-row strong{
    letter-spacing:1px;
}

.keno-winner-row span{
    color:#cbd5e1;
    font-size:12px;
    text-align:right;
}

.keno-winners-block{
    background:rgba(2,6,23,0.45);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:18px;
    padding:12px;
    margin-bottom:10px;
}

.keno-winners-block-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:10px;
}

.keno-winners-block-title span{
    color:#94a3b8;
    font-size:12px;
    text-align:right;
}

.keno-winners-items{
    display:flex;
    flex-direction:column;
    gap:8px;
    max-height:240px;
    overflow:auto;
    padding-right:4px;
}

.keno-winner-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 12px;
    border-radius:16px;
    background:rgba(15,23,42,0.9);
    border:1px solid rgba(255,255,255,0.10);
}

.keno-winner-item.winner-fake{
    opacity:0.78;
}

.keno-winner-name{
    color:#e2e8f0;
    font-weight:bold;
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.keno-winner-prize{
    font-size:13px;
    letter-spacing:0.2px;
}

.keno-winner-empty{
    color:#94a3b8;
    font-size:13px;
    padding:10px 6px;
    text-align:center;
}

.keno-toast-root{
    position:fixed;
    right:14px;
    bottom:14px;
    z-index:99999;
    display:flex;
    flex-direction:column;
    gap:10px;
    width:min(360px, calc(100vw - 28px));
    pointer-events:none;
}

.keno-toast{
    pointer-events:auto;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:12px 12px;
    border-radius:14px;
    background:rgba(2, 6, 23, 0.92);
    border:1px solid rgba(255,255,255,0.12);
    box-shadow:0 16px 36px rgba(0,0,0,0.40);
    transform:translateY(12px);
    opacity:0;
    transition:opacity .18s ease, transform .18s ease;
}

.keno-toast.show{
    transform:translateY(0);
    opacity:1;
}

.keno-toast.success{
    border-color:rgba(34,197,94,0.40);
}

.keno-toast.warn{
    border-color:rgba(245,158,11,0.45);
}

.keno-toast-content{
    flex:1;
    min-width:0;
}

.keno-toast-title{
    display:block;
    color:#e2e8f0;
    font-size:13px;
    font-weight:800;
    letter-spacing:0.2px;
    margin-bottom:4px;
}

.keno-toast-message{
    color:#cbd5e1;
    font-size:13px;
    line-height:1.3;
}

.keno-toast-actions{
    display:flex;
    flex-direction:column;
    gap:8px;
    align-items:flex-end;
}

.keno-toast-close{
    border:none;
    background:rgba(255,255,255,0.08);
    color:#e2e8f0;
    font-weight:700;
    font-size:12px;
    padding:7px 10px;
    border-radius:12px;
    cursor:pointer;
}

.keno-toast-close:hover{
    background:rgba(255,255,255,0.12);
}

.keno-toast-action{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-decoration:none;
    background:linear-gradient(180deg, rgba(59,130,246,0.95), rgba(37,99,235,0.95));
    color:#fff;
    font-weight:800;
    font-size:12px;
    padding:8px 10px;
    border-radius:12px;
    box-shadow:0 10px 24px rgba(37,99,235,0.22);
}

.keno-toast-action:hover{
    filter:brightness(1.06);
}

.keno-wait-wrapper{
    width:100%;
}

.keno-wait-card{
    margin-top:14px;
    margin-left:auto;
    margin-right:auto;
    max-width:520px;
    background:rgba(2, 6, 23, 0.55);
    border:1px solid rgba(255,255,255,0.10);
    border-radius:22px;
    padding:16px 14px;
    box-shadow:0 18px 50px rgba(0,0,0,0.42);
}

.keno-wait-badges{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-bottom:12px;
}

.keno-wait-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:7px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:800;
    color:#e2e8f0;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.10);
}

.keno-wait-badge.warn{
    background:rgba(245,158,11,0.10);
    border-color:rgba(245,158,11,0.30);
    color:#fde68a;
}

.keno-wait-main{
    display:flex;
    align-items:center;
    gap:12px;
}

.keno-wait-spinner{
    width:44px;
    height:44px;
    border-radius:999px;
    border:3px solid rgba(255,255,255,0.10);
    border-top-color:rgba(59,130,246,0.95);
    animation:kenoSpin 1s linear infinite;
    flex:0 0 auto;
}

@keyframes kenoSpin{
    from{ transform:rotate(0deg); }
    to{ transform:rotate(360deg); }
}

.keno-wait-info h1{
    font-size:18px;
    margin:0 0 4px 0;
}

.keno-wait-info p{
    margin:0;
    color:#94a3b8;
    font-size:13px;
    line-height:1.35;
}

.keno-wait-timer{
    margin-top:14px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:10px;
}

.keno-wait-timer span{
    color:#94a3b8;
    font-size:12px;
}

.keno-wait-timer strong{
    font-size:18px;
    letter-spacing:0.6px;
}

.keno-wait-progress{
    margin-top:10px;
    height:10px;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.10);
    border-radius:999px;
    overflow:hidden;
}

.keno-wait-progress-fill{
    height:100%;
    width:35%;
    background:linear-gradient(90deg, rgba(59,130,246,0.95), rgba(37,99,235,0.95));
    border-radius:999px;
    box-shadow:0 10px 24px rgba(37,99,235,0.22);
    animation:kenoWaitBar 1.6s ease-in-out infinite;
}

@keyframes kenoWaitBar{
    0%{ transform:translateX(-40%); opacity:0.75; }
    50%{ transform:translateX(40%); opacity:1; }
    100%{ transform:translateX(120%); opacity:0.78; }
}

.keno-wait-actions{
    margin-top:14px;
    display:flex;
    gap:10px;
}

.keno-wait-btn{
    flex:1;
    height:48px;
    border-radius:16px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:900;
    text-decoration:none;
    font-size:13px;
}

.keno-wait-btn.secondary{
    background:rgba(255,255,255,0.08);
    color:#e2e8f0;
    border:1px solid rgba(255,255,255,0.10);
}

.keno-wait-btn.primary{
    background:linear-gradient(180deg, rgba(59,130,246,0.95), rgba(37,99,235,0.95));
    color:#fff;
    border:1px solid rgba(59,130,246,0.25);
    box-shadow:0 14px 34px rgba(37,99,235,0.18);
}

