:root{
                --bg:#000;
                --panel:#0e1b1c;
                --bar:#001613;
                --bar-line:#042a1d;
                --tile:#102921;
                --sep:#17382d;
                --green:#2ad265;
                --text:#fff;
                --muted:#c4d0cb;
                --wrap:1200px;

                --header-bg:#000;
                --drop-bg:#0c1714;
                --drop-border:#1c2c2b;
                --btn-bg:#0c1114;
                --btn-border:#1c2c2b;
                --nav-mobile-bg:#050d0a;
                --nav-border:#10201a;
                --popular-top:#010707;
                --below-bg:#020605;
                --features-bg:#0c1c19;
                --features-border:#12392a;
                --footer-bg:#0a1010;
                --foot-bottom-bg:#0b1111;
                --foot-bottom-border:#182422;
                --soc-bg:#1d2a2f;
                --card-bg1:#0d1f1a;
                --card-bg2:#081511;
                --card-border:#1c3a2b;
                --input-bg:#0a1713;
                --input-border:#1e3a2c;
                --placeholder:#5c7469;
                --auth-close-bg:#12251d;
                --text-soft:#e7efec;
                --text-dim:#a9bdb4;
                --text-faint:#6d857a;
                --logo-filter:none;
            }
            body.light{
                --bg:#f4f7f6;
                --panel:#ffffff;
                --bar:#eef3f1;
                --bar-line:#dbe6e1;
                --tile:#eef4f2;
                --sep:#dde7e2;
                --text:#0b1210;
                --muted:#4b5a55;

                --header-bg:#ffffff;
                --drop-bg:#ffffff;
                --drop-border:#dde7e2;
                --btn-bg:#f2f5f4;
                --btn-border:#d7e0dc;
                --nav-mobile-bg:#ffffff;
                --nav-border:#e6ede9;
                --popular-top:#ffffff;
                --below-bg:#eef3f1;
                --features-bg:#ffffff;
                --features-border:#dde7e2;
                --footer-bg:#eef2f0;
                --foot-bottom-bg:#e6ece9;
                --foot-bottom-border:#d7e0dc;
                --soc-bg:#e3ece8;
                --card-bg1:#ffffff;
                --card-bg2:#f2f6f4;
                --card-border:#dde7e2;
                --input-bg:#f5f7f6;
                --input-border:#d7e0dc;
                --placeholder:#8a9994;
                --auth-close-bg:#eef3f1;
                --text-soft:#182420;
                --text-dim:#5c6d67;
                --text-faint:#8a9994;
                --logo-filter:invert(1);
            }
            body.light{
                background:var(--bg)
            }
            body.light .header{
                box-shadow:0 1px 0 var(--drop-border)
            }
            body.light .cats,body.light .features,body.light .auth-card,body.light .nav-drop{
                box-shadow:0 8px 20px rgba(20,40,32,.06)
            }
            *{
                box-sizing:border-box;
                margin:0;
                padding:0
            }
            html{
                background:var(--bg)
            }
            body{
                background:var(--bg);
                color:var(--text);
                font-family:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
                font-size:14px;
                line-height:1.35;
                -webkit-font-smoothing:antialiased;
                transition:background .2s,color .2s
            }
            a{
                color:inherit;
                text-decoration:none
            }
            img{
                display:block;
                max-width:100%
            }
            button{
                font-family:inherit;
                cursor:pointer;
                border:0;
                background:none;
                color:inherit
            }
            .wrap{
                max-width:var(--wrap);
                margin:0 auto
            }

            /* ---------- Header ---------- */
            .header{
                height:66px;
                background:var(--header-bg);
                transition:background .2s
            }
            .header .wrap{
                height:100%;
                display:flex;
                align-items:center;
                padding:0 3.9%
            }
            .logo{
                display:block;
                width:102px;
                height:50px;
                flex:none
            }
            .logo img{
                width:100%;
                height:100%;
                object-fit:contain;
                filter:var(--logo-filter)
            }
            .nav{
                display:flex;
                align-items:center;
                gap:clamp(14px,2.4vw,28px);
                margin-left:clamp(24px,7vw,99px);
                font-size:12.5px;
                font-weight:500
            }
            .nav-item{
                position:relative
            }
            .nav a,.nav button{
                display:flex;
                align-items:center;
                gap:8px;
                white-space:nowrap;
                font-size:12.5px;
                font-weight:500;
                color:var(--text);
                height:66px
            }
            .nav svg{
                width:14px;
                height:14px;
                transition:transform .15s
            }
            .nav-item.open > button svg,.nav-item.open > a svg{
                transform:rotate(180deg)
            }
            .nav-drop{
                position:absolute;
                left:0;
                top:100%;
                margin-top:-1px;
                min-width:170px;
                background:var(--drop-bg);
                border:1px solid var(--drop-border);
                border-radius:10px;
                padding:8px;
                box-shadow:0 12px 28px rgba(0,0,0,.45);
                opacity:0;
                visibility:hidden;
                transform:translateY(6px);
                transition:opacity .15s,transform .15s;
                z-index:50
            }
            .nav-item.open .nav-drop{
                opacity:1;
                visibility:visible;
                transform:translateY(0)
            }
            .nav-drop a{
                display:block;
                height:auto;
                padding:9px 12px;
                border-radius:7px;
                font-size:12px;
                font-weight:500;
                color:var(--text-soft)
            }
            .nav-drop a:hover{
                background:var(--tile);
                color:var(--green)
            }
            .header-right{
                margin-left:auto;
                display:flex;
                align-items:center
            }
            .btn-login{
                height:32px;
                width:68px;
                border:1px solid var(--btn-border);
                border-radius:10px;
                background:var(--btn-bg);
                color:var(--text);
                font-size:12.5px;
                font-weight:500;
                display:flex;
                align-items:center;
                justify-content:center
            }
            .btn-signup{
                height:32px;
                width:76px;
                margin-left:12px;
                border-radius:10px;
                background:var(--green);
                color:#04150b;
                font-size:12.5px;
                font-weight:600;
                display:flex;
                align-items:center;
                justify-content:center
            }
            .theme{
                display:flex;
                align-items:center;
                gap:8px;
                margin-left:25px;
                font-size:12px;
                font-weight:500;
                color:var(--text)
            }
            .switch{
                width:44px;
                height:22px;
                border-radius:12px;
                background:#000900;
                border:1.5px solid var(--green);
                position:relative;
                flex:none
            }
            .switch::after{
                content:"";
                position:absolute;
                right:1px;
                top:1px;
                width:17px;
                height:17px;
                border-radius:50%;
                background:#fff;
                transition:.2s
            }
            .light .switch::after{
                right:auto;
                left:1px
            }
            .nav-toggle{
                display:none;
                width:34px;
                height:34px;
                align-items:center;
                justify-content:center;
                border-radius:8px;
                background:var(--btn-bg);
                border:1px solid var(--btn-border);
                color:var(--text);
                margin-left:10px;
                flex:none
            }
            .nav-toggle svg{
                width:16px;
                height:16px
            }

            /* ---------- Hero ---------- */
            .hero{
                padding:2px 2.5% 0
            }
            .hero-grid{
                display:grid;
                grid-template-columns:414fr 530fr;
                gap:29px;
                align-items:start
            }
            .hero-left{
                position:relative;
                aspect-ratio:414/300;
                height:auto
            }
            .carousel{
                position:relative;
                overflow:hidden
            }
            .track{
                display:flex;
                transition:transform .5s ease
            }
            .slide{
                flex:0 0 100%
            }
            .slide img{
                width:100%;
                height:auto;
                display:block
            }
            .arrow{
                position:absolute;
                top:50%;
                transform:translateY(-50%);
                width:28px;
                height:36px;
                display:flex;
                align-items:center;
                justify-content:center;
                color:#7d8a86;
                z-index:3
            }
            .arrow svg{
                width:16px;
                height:26px
            }
            .hero-left .arrow.prev{
                left:0
            }
            .hero-left .arrow.next{
                right:0
            }
            .hero-left .arrow{
                top:29.7%
            }
            .hero-left .car-wrap{
                position:absolute;
                left:5.31%;
                right:7.25%;
                top:0.67%
            }
            .hero-left .car-wrap .carousel{
                position:relative;
                left:0;
                width:100%;
                border-radius:0
            }
            /* Draw timer: one self-contained framed widget (nav arrows + label +
               digits all live inside the same glowing border) sized to sit clear
               of the jackpot artwork above and the card edge below. */
            .countdown{
                position:absolute;
                left:5.31%;
                right:7.25%;
                top:64%;
                bottom:4.5%;
                display:flex;
                flex-direction:column;
                align-items:center;
                justify-content:center;
                gap:2px;
                padding:3px 8px 5px;
                border-radius:16px;
                border:1.5px solid var(--green);
                background:radial-gradient(120% 160% at 50% 0%,#0a2015 0%,#040d07 65%);
                box-shadow:0 0 0 1px rgba(42,210,101,.18),0 0 10px 1px rgba(42,210,101,.3);
                animation:cdGlow 2.6s ease-in-out infinite;
                z-index:4
            }
            @keyframes cdGlow{
                0%,100%{box-shadow:0 0 0 1px rgba(42,210,101,.18),0 0 8px 1px rgba(42,210,101,.25)}
                50%{box-shadow:0 0 0 1px rgba(42,210,101,.35),0 0 16px 3px rgba(42,210,101,.55)}
            }
            .cd-label{
                background:#fff;
                color:#000;
                font-weight:700;
                font-size:clamp(8.5px,2vw,12px);
                letter-spacing:.2px;
                border-radius:8px;
                padding:0 10px;
                height:16px;
                line-height:16px;
                white-space:nowrap;
                max-width:100%;
                overflow:hidden;
                text-overflow:ellipsis;
                flex:none
            }
            .cd-box{
                display:flex;
                align-items:center;
                justify-content:center;
                border:2px solid #3f9a3a;
                border-radius:18px;
                background:#040d07;
                padding:5px clamp(4px,1.6vw,12px) 4px;
                width:100%;
                flex:none
            }
            .cd-cell{
                text-align:center;
                width:clamp(30px,9vw,52px)
            }
            .cd-cell b{
                display:block;
                font-size:clamp(13px,3.6vw,24px);
                font-weight:500;
                line-height:1;
                letter-spacing:.5px;
                font-variant-numeric:tabular-nums;
                color:#fff
            }
            .cd-cell small{
                display:block;
                font-size:clamp(6px,1.4vw,9px);
                color:#9aa8a3;
                margin-top:4px;
                letter-spacing:.3px;
                white-space:nowrap
            }
            .cd-colon{
                font-size:clamp(11px,3vw,20px);
                line-height:1;
                color:#fff;
                padding-bottom:9px;
                flex:none
            }
            .cd-nav{
                display:flex;
                align-items:center;
                justify-content:center;
                width:100%;
                height:12px;
                min-height:10px;
                color:#7fa08f;
                background:none;
                border:0;
                padding:0;
                margin:0;
                cursor:pointer;
                flex:none;
                transition:color .15s,opacity .15s
            }
            .cd-nav svg{
                width:22px;
                height:9px
            }
            .cd-nav:hover{
                color:var(--green)
            }
            .cd-nav.disabled{
                opacity:.3;
                cursor:default;
                pointer-events:none;
                color:#7fa08f
            }
            .hero-right{
                position:relative
            }
            .hero-right .carousel{
                border-radius:12px;
                margin-top:4px
            }
            .hero-right .arrow{
                width:34px;
                height:40px;
                color:#e3d9d9
            }
            .hero-right .arrow svg{
                width:22px;
                height:34px;
                filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))
            }
            .hero-right .arrow.prev{
                left:0
            }
            .hero-right .arrow.next{
                right:-3px
            }

            /* ---------- Categories ---------- */
            .cats{
                margin:10px 2.5% 0;
                height:125px;
                background:var(--bar);
                border:1px solid var(--bar-line);
                border-radius:14px;
                display:grid;
                grid-template-columns:152fr 148fr 128fr 131fr 130fr 132fr 153fr;
                overflow:hidden
            }
            .cat{
                position:relative;
                display:block
            }
            .cat + .cat::before{
                content:"";
                position:absolute;
                left:0;
                top:18px;
                height:82px;
                width:1px;
                background:var(--sep)
            }
            .cat img{
                position:absolute;
                left:50%;
                transform:translateX(-50%);
                height:auto;
                max-width:none
            }
            .cat span{
                position:absolute;
                left:0;
                right:0;
                bottom:24px;
                text-align:center;
                font-size:12.5px;
                font-weight:400;
                color:var(--text-soft);
                line-height:1.2;
                white-space:nowrap;
                display:flex;
                align-items:center;
                justify-content:center;
                gap:9px
            }
            .cat span svg{
                width:7px;
                height:10px
            }
            .cat:hover img{
                filter:brightness(1.15)
            }
            .cat[data-k=lotto-590] img{
                width:90px;
                top:33px;
                left:calc(50% - 3px)
            }
            .cat[data-k=lotto-599] img{
                width:94px;
                top:32px;
                left:calc(50% + 1px)
            }
            .cat[data-k=scratch] img{
                width:42px;
                top:26px;
                left:calc(50% + 0px)
            }
            .cat[data-k=instant] img{
                width:25px;
                top:25px;
                left:calc(50% + 2px)
            }
            .cat[data-k=casino] img{
                width:50px;
                top:24px;
                left:calc(50% + 0px)
            }
            .cat[data-k=virtual] img{
                width:52px;
                top:30px;
                left:calc(50% + 0px)
            }
            .cat[data-k=all-games] img{
                width:27px;
                top:34px;
                left:calc(50% - 4px)
            }
            .cat[data-k=all-games] span{
                gap:8px;
                justify-content:center
            }

            /* ---------- Popular ---------- */
            .popular{
                margin-top:0;
                background:linear-gradient(180deg,var(--popular-top) 0,var(--panel) 30px,var(--panel) 100%);
                padding:0 2.15% 0
            }
            .pop-head{
                display:flex;
                align-items:center;
                justify-content:space-between;
                height:47px;
                padding:0 1.9% 0 1.9%;
                position:relative;
                top:0
            }
            .pop-head h2{
                font-size:20px;
                font-weight:600;
                letter-spacing:-.2px
            }
            .pop-head a{
                font-size:11.5px;
                font-weight:500;
                display:flex;
                align-items:center;
                gap:9px
            }
            .pop-head svg{
                width:15px;
                height:15px
            }
            .games{
                display:grid;
                grid-template-columns:repeat(6,minmax(0,1fr));
                gap:14px 14.6px;
                margin-top:-2px
            }
            .tile{
                display:block;
                background:var(--tile);
                border-radius:10px;
                padding:9px 10px 9px;
                aspect-ratio:150/148;
                position:relative;
                min-width:0;
                overflow:hidden;
                transition:transform .15s
            }
            .tile:hover{
                transform:translateY(-3px)
            }
            .tile img{
                width:100%;
                height:100%;
                object-fit:cover;
                border-radius:6px
            }

            /* ---------- Features ---------- */
            .below{
                background:var(--below-bg);
                padding:11px 2.5% 12px
            }
            .features{
                display:grid;
                grid-template-columns:repeat(4,1fr);
                background:var(--features-bg);
                border:1px solid var(--features-border);
                border-radius:14px;
                height:103px
            }
            .feat{
                display:flex;
                align-items:center;
                padding:0 0 0 19px;
                position:relative;
                gap:14px
            }
            .feat + .feat::before{
                content:"";
                position:absolute;
                left:0;
                top:16px;
                bottom:16px;
                width:1px;
                background:var(--sep)
            }
            .feat img{
                width:60px;
                height:60px;
                object-fit:contain;
                flex:none
            }
            .feat h4{
                font-size:12.5px;
                font-weight:600;
                margin-bottom:6px
            }
            .feat p{
                font-size:11px;
                color:var(--muted);
                line-height:1.55;
                max-width:100px
            }

            /* ---------- App / Refer ---------- */
            .promo{
                display:grid;
                grid-template-columns:1fr 1fr;
                margin-top:12px;
                height:168px;
                position:relative
            }
            .panel{
                position:relative;
                overflow:hidden;
                background:linear-gradient(90deg,#03130f,#082a1c)
            }
            .panel.app{
                border-radius:14px 0 0 14px;
                background:radial-gradient(120% 120% at 20% 40%,#0a3a26 0,#04170f 70%)
            }
            .panel.ref{
                border-radius:0 14px 14px 0;
                background:radial-gradient(90% 120% at 80% 60%,#0f4a24 0,#062a16 70%)
            }
            .panel.app::after{
                content:"";
                position:absolute;
                right:-9px;
                top:50%;
                width:18px;
                height:18px;
                background:#04170f;
                transform:translateY(-50%) rotate(45deg);
                z-index:1;
                display:none
            }
            .app .phone{
                position:absolute;
                left:-8px;
                top:-8px;
                height:186px;
                width:auto;
                -webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);
                mask-image:linear-gradient(90deg,#000 82%,transparent)
            }
            .app .txt{
                position:absolute;
                left:231px;
                top:22px
            }
            .app h3{
                font-size:19px;
                font-weight:600;
                line-height:1.15;
                letter-spacing:-.2px;
                color:#fff
            }
            .app p{
                font-size:11.5px;
                color:#e5ece9;
                margin-top:11px;
                line-height:1.5
            }
            .gplay{
                display:flex;
                align-items:center;
                gap:9px;
                margin-top:14px;
                width:108px;
                height:38px;
                border-radius:8px;
                background:#000;
                border:1px solid #1d2b26;
                padding:0 8px
            }
            .gplay svg{
                width:26px;
                height:28px;
                flex:none
            }
            .gplay small{
                display:block;
                font-size:6.5px;
                letter-spacing:.4px;
                color:#cfd8d4;
                line-height:1
            }
            .gplay b{
                display:block;
                font-size:14px;
                font-weight:600;
                line-height:1.1;
                color:#fff
            }
            .ref h3{
                font-size:16px;
                font-weight:600;
                color:#fff
            }
            .ref .txt{
                position:absolute;
                left:73px;
                top:24px
            }
            .ref .badge{
                position:absolute;
                left:28px;
                top:24px;
                width:38px;
                height:38px;
                border-radius:50%;
                background:#0b3a22;
                border:1px solid #1f6b3d;
                display:flex;
                align-items:center;
                justify-content:center
            }
            .ref .badge img{
                width:22px;
                height:22px;
                object-fit:cover
            }
            .ref p{
                font-size:11px;
                color:#e5ece9;
                margin-top:6px;
                line-height:1.5;
                max-width:140px
            }
            .ref .people{
                position:absolute;
                right:28px;
                bottom:-6px;
                height:112%;
                width:auto;
                max-width:none;
                -webkit-mask-image:linear-gradient(90deg,transparent,#000 28%);
                mask-image:linear-gradient(90deg,transparent,#000 28%)
            }
            .btn-earn{
                position:absolute;
                left:22px;
                top:105px;
                width:136px;
                height:32px;
                border-radius:16px;
                background:var(--green);
                color:#04150b;
                font-size:11px;
                font-weight:600;
                display:flex;
                align-items:center;
                justify-content:center;
                letter-spacing:.2px
            }

            /* ---------- Footer ---------- */
            .footer{
                background:var(--footer-bg)
            }
            .foot-main{
                display:grid;
                grid-template-columns:241fr 158fr 128fr 149fr 322fr;
                height:auto;
                min-height:90px;
                padding:16px 0 16px 2.5%;
                position:relative
            }
            .foot-main > div{
                position:relative
            }
            .resp{
                display:flex;
                align-items:center;
                gap:13px;
                padding:0 0 14px 12px
            }
            .age{
                width:36px;
                height:36px;
                border:1.5px solid var(--green);
                border-radius:50%;
                display:flex;
                align-items:center;
                justify-content:center;
                font-size:13px;
                font-weight:500;
                flex:none
            }
            .resp h5{
                font-size:11.5px;
                font-weight:600
            }
            .resp p{
                font-size:11px;
                color:var(--muted);
                margin-top:8px;
                line-height:1.4
            }
            .fcol{
                padding:3px 0 0 30px
            }
            .fcol.info{
                padding-left:38px
            }
            .fcol.sup{
                padding-left:28px
            }
            .fcol::before{
                content:"";
                position:absolute;
                left:0;
                top:6px;
                bottom:8px;
                width:1px;
                background:var(--sep)
            }
            .fcol h5{
                font-size:11.5px;
                font-weight:600;
                margin-bottom:9px
            }
            .fcol a{
                display:block;
                font-size:11px;
                color:var(--text-soft);
                line-height:1.5;
                margin-bottom:4px
            }
            .pay{
                padding:0 0 0 40px;
                position:relative
            }
            .pay::before{
                content:"";
                position:absolute;
                left:0;
                top:6px;
                bottom:8px;
                width:1px;
                background:var(--sep)
            }
            .pay h5{
                font-size:11.5px;
                font-weight:600
            }
            .pay-logos{
                display:flex;
                align-items:center;
                gap:22px;
                margin-top:5px
            }
            .visa{
                font-weight:800;
                font-style:italic;
                font-size:19px;
                letter-spacing:-.5px
            }
            .mc{
                width:36px;
                height:24px;
                position:relative
            }
            .mc i{
                position:absolute;
                top:0;
                width:24px;
                height:24px;
                border-radius:50%
            }
            .mc i:first-child{
                left:0;
                background:#eb001b
            }
            .mc i:last-child{
                left:12px;
                background:#f79e1b;
                mix-blend-mode:normal;
                opacity:.95
            }
            .verve{
                height:24px;
                width:auto
            }
            .follow{
                display:flex;
                align-items:center;
                gap:14px;
                margin-top:14px
            }
            .follow h5{
                font-size:11.5px;
                font-weight:600;
                margin-right:10px
            }
            .soc{
                width:20px;
                height:20px;
                border-radius:50%;
                background:var(--soc-bg);
                color:var(--text);
                display:flex;
                align-items:center;
                justify-content:center
            }
            .soc svg{
                width:10px;
                height:10px
            }
            .seal{
                position:absolute;
                right:26px;
                bottom:2px;
                width:46px;
                height:56px;
                object-fit:cover;
                border-radius:6px
            }
            .foot-bottom{
                border-top:1px solid var(--foot-bottom-border);
                height:auto;
                min-height:22px;
                display:grid;
                grid-template-columns:31.8% auto;
                align-items:center;
                font-size:10.5px;
                color:var(--text-soft);
                padding:5px 0 5px 6.15%;
                background:var(--foot-bottom-bg)
            }

            /* ---------- Auth Modal ---------- */
            .auth-overlay{
                position:fixed;
                inset:0;
                background:rgba(2,6,5,.72);
                backdrop-filter:blur(3px);
                display:flex;
                align-items:center;
                justify-content:center;
                z-index:200;
                opacity:0;
                visibility:hidden;
                transition:opacity .2s
            }
            .auth-overlay.show{
                opacity:1;
                visibility:visible
            }
            .auth-card{
                width:410px;
                max-width:92vw;
                background:linear-gradient(180deg,var(--card-bg1),var(--card-bg2));
                border:1px solid var(--card-border);
                border-radius:18px;
                padding:26px 26px 24px;
                position:relative;
                box-shadow:0 30px 60px rgba(0,0,0,.5);
                transform:translateY(14px) scale(.98);
                transition:transform .2s;
                max-height:90vh;
                overflow-y:auto
            }
            .auth-overlay.show .auth-card{
                transform:translateY(0) scale(1)
            }
            .auth-close{
                position:absolute;
                right:14px;
                top:14px;
                width:28px;
                height:28px;
                border-radius:50%;
                background:var(--auth-close-bg);
                display:flex;
                align-items:center;
                justify-content:center;
                color:var(--text-soft)
            }
            .auth-close svg{
                width:13px;
                height:13px
            }
            .auth-logo{
                display:flex;
                align-items:center;
                justify-content:center;
                margin-bottom:14px
            }
            .auth-logo img{
                height:34px;
                width:auto;
                filter:var(--logo-filter)
            }
            .auth-tabs{
                display:flex;
                background:var(--input-bg);
                border:1px solid var(--card-border);
                border-radius:11px;
                padding:3px;
                margin-bottom:20px
            }
            .auth-tab{
                flex:1;
                text-align:center;
                padding:9px 0;
                font-size:12.5px;
                font-weight:600;
                border-radius:8px;
                color:var(--text-dim);
                cursor:pointer;
                transition:.15s
            }
            .auth-tab.active{
                background:var(--green);
                color:#04150b
            }
            .auth-title{
                font-size:17px;
                font-weight:600;
                text-align:center;
                margin-bottom:4px;
                color:var(--text)
            }
            .auth-sub{
                font-size:11.5px;
                color:var(--text-dim);
                text-align:center;
                margin-bottom:18px
            }
            .auth-field{
                margin-bottom:13px
            }
            .auth-field label{
                display:block;
                font-size:11px;
                font-weight:500;
                color:var(--text-soft);
                margin-bottom:6px
            }
            .auth-field input{
                width:100%;
                height:40px;
                border-radius:9px;
                background:var(--input-bg);
                border:1px solid var(--input-border);
                color:var(--text);
                padding:0 13px;
                font-size:12.5px;
                font-family:inherit;
                outline:none;
                transition:border-color .15s
            }
            .auth-field input:focus{
                border-color:var(--green)
            }
            .auth-field input::placeholder{
                color:var(--placeholder)
            }
            .auth-row{
                display:flex;
                align-items:center;
                justify-content:space-between;
                margin:2px 0 16px;
                font-size:11px;
                color:var(--text-dim)
            }
            .auth-check{
                display:flex;
                align-items:center;
                gap:7px
            }
            .auth-check input{
                width:14px;
                height:14px;
                accent-color:var(--green)
            }
            .auth-row a{
                color:var(--green);
                font-weight:500
            }
            .auth-submit{
                width:100%;
                height:42px;
                border-radius:10px;
                background:var(--green);
                color:#04150b;
                font-size:13px;
                font-weight:600;
                letter-spacing:.2px
            }
            .auth-submit:hover{
                filter:brightness(1.06)
            }
            .auth-switch{
                text-align:center;
                font-size:11.5px;
                color:var(--text-dim);
                margin-top:16px
            }
            .auth-switch a{
                color:var(--green);
                font-weight:600
            }
            .auth-note{
                font-size:10px;
                color:var(--text-faint);
                text-align:center;
                margin-top:12px;
                line-height:1.5
            }
            .auth-pane{
                display:none
            }
            .auth-pane.active{
                display:block
            }
            .auth-error{
                display:none;
                background:#3a1414;
                border:1px solid #6b2323;
                color:#ffb4b4;
                font-size:11px;
                border-radius:8px;
                padding:8px 11px;
                margin-bottom:14px
            }
            .auth-error.show{
                display:block
            }

            @media (max-width:1023px){
                .header .wrap{
                    padding:0 4%
                }
                .theme span:not(.switch){
                    display:none
                }
                .theme{
                    margin-left:12px;
                    gap:0
                }
                .nav-toggle{
                    display:flex
                }
                .nav{
                    position:fixed;
                    left:0;
                    right:0;
                    top:66px;
                    bottom:0;
                    background:var(--nav-mobile-bg);
                    flex-direction:column;
                    align-items:stretch;
                    gap:0;
                    padding:10px 5% 90px;
                    overflow-y:auto;
                    transform:translateX(-100%);
                    transition:transform .25s ease;
                    z-index:150;
                    margin-left:0;
                    visibility:hidden
                }
                .nav.mobile-open{
                    transform:translateX(0);
                    visibility:visible
                }
                .nav-item{
                    width:100%
                }
                .nav a,.nav button{
                    width:100%;
                    justify-content:space-between;
                    height:52px;
                    border-bottom:1px solid var(--nav-border);
                    font-size:14px
                }
                .nav-drop{
                    position:static;
                    opacity:1;
                    visibility:visible;
                    transform:none;
                    box-shadow:none;
                    border:0;
                    background:var(--below-bg);
                    margin:0;
                    padding:2px 6px;
                    display:none;
                    border-radius:0
                }
                .nav-item.open .nav-drop{
                    display:block
                }
                .nav-drop a{
                    height:auto;
                    border-bottom:0;
                    padding:12px
                }
                .hero-grid{
                    grid-template-columns:1fr;
                    gap:12px
                }
                /* Draw timer: the frame tracks the carousel (good), but the carousel
                   is now full viewport width on mobile instead of ~44% of a desktop
                   row, so the vw-based clamp()s below scale the digits too small for
                   that much bigger frame. Scale the inner timer elements up to match. */
                .countdown{
                    padding:6px 14px 8px;
                    gap:4px
                }
                .cd-label{
                    font-size:clamp(11px,3.4vw,15px);
                    height:22px;
                    line-height:22px;
                    padding:0 14px
                }
                .cd-box{
                    padding:8px clamp(8px,2.6vw,18px) 7px
                }
                .cd-cell{
                    width:clamp(44px,13vw,72px)
                }
                .cd-cell b{
                    font-size:clamp(20px,6.5vw,34px)
                }
                .cd-cell small{
                    font-size:clamp(9px,2.4vw,12px)
                }
                .cd-colon{
                    font-size:clamp(16px,4.5vw,28px);
                    padding-bottom:11px
                }
                .cd-nav{
                    height:18px;
                    min-height:16px
                }
                .cd-nav svg{
                    width:30px;
                    height:13px
                }
                .cats{
                    grid-template-columns:repeat(4,1fr);
                    height:auto;
                    grid-auto-rows:125px
                }
                .games{
                    grid-template-columns:repeat(3,minmax(0,1fr))
                }
                .below{
                    padding-top:28px
                }
                .features{
                    grid-template-columns:1fr 1fr;
                    height:auto;
                    margin-top:6px
                }
                .feat{
                    padding:14px 12px
                }
                .promo{
                    grid-template-columns:1fr;
                    height:auto
                }
                .panel{
                    height:180px;
                    border-radius:14px !important;
                    margin-bottom:10px
                }
                .foot-main{
                    grid-template-columns:1fr 1fr;
                    height:auto;
                    gap:14px 24px;
                    padding:14px
                }
                .pay{
                    grid-column:1 / -1;
                    padding-left:0
                }
                .pay::before{
                    display:none
                }
                .seal{
                    position:static;
                    margin:14px 0 0;
                    display:block
                }
                .foot-bottom{
                    grid-template-columns:1fr;
                    height:auto;
                    padding:8px;
                    gap:4px
                }
            }
            
            
   