/* SlotBuilder Test Player - extracted from index.php <style> block */
        *{box-sizing:border-box}
        body{font-family:'Inter',system-ui,-apple-system,sans-serif;background:#070a12;color:#fff;margin:0}
        ::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#0a0d16}
        ::-webkit-scrollbar-thumb{background:#4c1d95;border-radius:3px}
        .scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}

        /* Animations */
        @keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
        @keyframes fadeIn{from{opacity:0}to{opacity:1}}
        @keyframes slideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
        @keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
        @keyframes balancePop{0%{transform:scale(1)}50%{transform:scale(1.12)}100%{transform:scale(1)}}
        @keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
        @keyframes pulse-ring{0%{transform:scale(.8);opacity:1}100%{transform:scale(2.2);opacity:0}}
        .anim-fade-up{animation:fadeUp .5s ease-out both}
        .anim-fade-in{animation:fadeIn .3s ease-out both}
        .balance-pop{animation:balancePop .35s ease-out}
        .shimmer{background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.04) 50%,rgba(255,255,255,0) 100%);background-size:200% 100%;animation:shimmer 2s infinite}

        /* Glass */
        .glass{background:rgba(255,255,255,.03);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.06)}

        /* Game cards */
        .game-card{transition:all .3s cubic-bezier(.4,0,.2,1);border:1px solid rgba(255,255,255,.04);position:relative;overflow:hidden}
        .game-card:hover{transform:translateY(-6px) scale(1.02);border-color:rgba(234,179,8,.25);box-shadow:0 20px 40px rgba(0,0,0,.4),0 0 30px rgba(234,179,8,.08)}
        .game-card:focus-within{border-color:rgba(234,179,8,.4);box-shadow:0 0 0 2px rgba(234,179,8,.2)}

        /* Category pills */
        .cat-pill{transition:all .2s ease;border:1px solid rgba(255,255,255,.08);cursor:pointer;user-select:none;white-space:nowrap;flex-shrink:0}
        .cat-pill:hover{border-color:rgba(234,179,8,.3);background:rgba(234,179,8,.05)}
        .cat-pill.active{background:linear-gradient(135deg,#ca8a04,#eab308);color:#000;border-color:transparent;font-weight:600}
        .cat-count{font-size:9px;opacity:.6;margin-left:2px}
        .cat-pill.active .cat-count{opacity:.7}

        /* Custom select */
        .player-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23a78bfa' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;background-size:10px;padding-right:24px}

        /* Toast */
        .toast-wrap{position:fixed;top:20px;right:20px;z-index:10000;display:flex;flex-direction:column;gap:8px;pointer-events:none}
        .toast{padding:12px 20px;border-radius:12px;font-size:13px;font-weight:500;animation:slideDown .3s ease-out;transition:all .3s;display:flex;align-items:center;gap:8px;min-width:260px;max-width:360px;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px rgba(0,0,0,.4);pointer-events:auto}
        .toast-success{background:rgba(16,185,129,.9)}.toast-error{background:rgba(239,68,68,.9)}
        .toast-info{background:rgba(59,130,246,.9)}.toast-warning{background:rgba(245,158,11,.9)}
        .toast.out{opacity:0;transform:translateX(80px)}

        /* Sidebar */
        .sidebar{transition:transform .3s cubic-bezier(.4,0,.2,1)}.sidebar.shut{transform:translateX(100%)}

        /* Input */
        .in{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);color:#fff;transition:all .2s}
        .in:focus{border-color:#eab308;box-shadow:0 0 0 3px rgba(234,179,8,.15);outline:none}
        .in::placeholder{color:rgba(255,255,255,.25)}

        /* Hero */
        .hero-bg{background:linear-gradient(135deg,#0c0f1a 0%,#1a0e2e 40%,#0f172a 70%,#0c0f1a 100%)}
        .hero-glow{position:absolute;width:500px;height:500px;border-radius:50%;filter:blur(120px);opacity:.15;pointer-events:none}

        /* Btn gold */
        .btn-gold{background:linear-gradient(135deg,#ca8a04,#eab308);color:#000;font-weight:700;transition:all .2s;-webkit-tap-highlight-color:transparent}
        .btn-gold:hover{box-shadow:0 4px 20px rgba(234,179,8,.35);transform:translateY(-1px)}
        .btn-gold:active{transform:scale(.97)}
        .btn-gold:disabled{opacity:.5;pointer-events:none}

        /* Game frame */
        .game-frame{width:100%;height:80vh;height:80dvh;min-height:400px;border:none;border-radius:12px;background:#070a12}
        @media(max-width:639px){.game-frame{height:calc(100vh - 56px);height:calc(100dvh - 56px);min-height:280px;border-radius:8px}}
        @media(max-width:639px) and (orientation:landscape){.game-frame{height:100vh;height:100dvh;min-height:unset;border-radius:0}}

        /* Iframe loading overlay */
        .iframe-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#070a12;z-index:5;transition:opacity .4s}
        .iframe-loading.loaded{opacity:0;pointer-events:none}

        /* Footer */
        .footer-link{color:rgba(255,255,255,.3);transition:color .2s}.footer-link:hover{color:rgba(255,255,255,.6)}

        /* Card shine sweep */
        .game-card::before{content:'';position:absolute;top:0;left:-75%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);transform:skewX(-25deg);transition:left .6s ease;z-index:8;pointer-events:none}
        .game-card:hover::before{left:125%}

        /* Cover image in card */
        .game-card img[onerror]{z-index:1}

        /* Card action buttons */
        .card-actions{opacity:0;transform:translateY(8px);transition:all .25s ease;z-index:30}
        .game-card:hover .card-actions{opacity:1;transform:translateY(0)}
        @media(hover:none){.card-actions{opacity:1;transform:translateY(0)}}
        .card-btn{backdrop-filter:blur(8px);transition:all .15s ease;border:1px solid rgba(255,255,255,.15);-webkit-tap-highlight-color:transparent;touch-action:manipulation}
        .card-btn:hover{transform:scale(1.05)}
        .card-btn:active{transform:scale(.95)}
        .card-btn-gold{background:rgba(234,179,8,.85);color:#000;border-color:rgba(234,179,8,.5)}
        .card-btn-gold:hover{background:rgba(234,179,8,1);box-shadow:0 0 20px rgba(234,179,8,.3)}
        .card-btn-glass{background:rgba(255,255,255,.1);color:#fff}
        .card-btn-glass:hover{background:rgba(255,255,255,.2)}

        /* Badges */
        .badge-hot{background:linear-gradient(135deg,#ef4444,#f97316);font-size:9px;font-weight:800;padding:2px 6px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px;color:#fff;position:absolute;top:8px;left:8px;z-index:10}
        .badge-new{background:linear-gradient(135deg,#10b981,#06b6d4);font-size:9px;font-weight:800;padding:2px 6px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px;color:#fff;position:absolute;top:8px;left:8px;z-index:10}
        .badge-recent{background:linear-gradient(135deg,#8b5cf6,#a78bfa);font-size:9px;font-weight:800;padding:2px 6px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px;color:#fff;position:absolute;top:8px;left:8px;z-index:10}

        /* Promo ticker */
        @keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
        .ticker-track{display:flex;animation:marquee 30s linear infinite;width:max-content}
        .ticker-track:hover{animation-play-state:paused}

        /* Neon border on header */
        header::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(234,179,8,.2),rgba(139,92,246,.2),transparent)}

        /* Stats counter */
        @keyframes countUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
        .stat-item{animation:countUp .5s ease-out both}

        /* ── Mobile Responsive ──────────────────────────────── */
        @media(max-width:639px){
            body{-webkit-tap-highlight-color:transparent;overscroll-behavior:none}
            header .max-w-7xl{padding-left:12px;padding-right:12px;height:52px}
            .ticker-wrap{display:none}
            .hero-bg .max-w-7xl{padding-top:1.25rem;padding-bottom:1.25rem}
            .hero-bg h2{font-size:1.35rem;line-height:1.3}
            .hero-bg .stat-item{padding:8px 12px}
            .hero-bg .stat-item p:first-child{font-size:1.1rem}
            .hero-bg .stat-item p:last-child{font-size:8px}
            .player-select{min-width:110px;font-size:12px;padding:6px 28px 6px 8px}
            #balance-chip{padding:4px 8px;gap:4px}
            #balance-chip .text-sm{font-size:12px}
            #lobby-section{padding-left:10px;padding-right:10px;padding-top:10px;padding-bottom:70px}
            #games-grid{gap:8px}
            .game-card .h-36{height:110px}
            .game-card .p-3{padding:6px 8px}
            .game-card .text-sm{font-size:11px}
            .game-card .text-5xl{font-size:2.2rem}
            .toast-wrap{top:8px;right:8px;left:8px}.toast{min-width:unset;font-size:12px;padding:10px 14px}
            footer .max-w-7xl{padding:1.5rem 12px}
            footer .flex-wrap{gap:8px;margin-bottom:1rem;padding-bottom:1rem}
            footer .glass{font-size:10px;padding:4px 8px}
            /* Bigger touch targets on mobile cards */
            .card-actions{gap:6px;padding:4px}
            .card-btn{padding:10px 14px!important;font-size:12px!important;border-radius:10px!important}
        }
        @media(max-width:380px){
            #games-grid{grid-template-columns:1fr 1fr;gap:6px}
            .game-card .h-36{height:100px}
            .game-card .text-5xl{font-size:2rem}
            .hero-bg .flex.gap-4{gap:8px;flex-wrap:wrap;justify-content:center}
            .hero-bg .stat-item{flex:1;min-width:80px}
        }

        /* ── Mobile Game Fullscreen ─────────────────────────── */
        .game-mobile-fs{position:fixed!important;top:0!important;left:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;z-index:9999!important;border-radius:0!important;border:none!important;margin:0!important;padding:0!important;background:#000!important}
        .game-mobile-fs iframe{width:100%!important;height:100%!important;height:100dvh!important;border-radius:0!important;min-height:unset!important}

        /* Floating close btn - auto-hides */
        .mobile-fs-close{position:fixed;top:10px;right:10px;z-index:10001;width:48px;height:48px;border-radius:14px;background:rgba(0,0,0,.65);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:opacity .4s ease, transform .3s ease;box-shadow:0 4px 20px rgba(0,0,0,.5)}
        .mobile-fs-close:active{background:rgba(255,255,255,.15);transform:scale(.88)}
        .mobile-fs-close.auto-hidden{opacity:0;pointer-events:none;transform:translateY(-8px)}

        /* Fullscreen balance overlay */
        .fs-balance-overlay{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);z-index:10001;background:rgba(0,0,0,.6);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:6px 16px;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#fff;transition:opacity .4s ease;box-shadow:0 4px 20px rgba(0,0,0,.4)}
        .fs-balance-overlay.auto-hidden{opacity:0;pointer-events:none}

        /* Mobile Play Fullscreen Button */
        .btn-play-fs{background:linear-gradient(135deg,#10b981,#06b6d4);color:#fff;font-weight:700;transition:all .2s;border:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
        .btn-play-fs:active{transform:scale(.96);opacity:.9}

        /* Safe area padding for notch devices */
        @supports(padding: env(safe-area-inset-top)){
            .game-mobile-fs{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
            .mobile-fs-close{top:calc(10px + env(safe-area-inset-top));right:calc(10px + env(safe-area-inset-right))}
            .fs-balance-overlay{bottom:calc(12px + env(safe-area-inset-bottom))}
            #lobby-section{padding-bottom:calc(70px + env(safe-area-inset-bottom))}
            .mobile-bottom-nav{padding-bottom:env(safe-area-inset-bottom)}
        }

        /* Landscape on mobile */
        @media(max-width:900px) and (orientation:landscape){
            header{display:none}
            .game-frame{height:100vh;height:100dvh;min-height:unset;border-radius:0}
            #game-view{padding:0!important}
            #game-view>div:first-child{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(7,10,18,.85);backdrop-filter:blur(8px);padding:4px 8px;border-bottom:1px solid rgba(255,255,255,.05)}
            #game-wrap{border-radius:0!important;border:none!important}
            .mobile-bottom-nav{display:none!important}
        }
        @media(max-height:500px){
            .game-frame{height:calc(100vh - 48px);min-height:unset}
        }

        /* Sort dropdown */
        .sort-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23a78bfa' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;background-size:10px;padding-right:24px}

        /* Connection error banner */
        .conn-error{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.2);border-radius:12px;padding:12px 16px;color:#fca5a5;font-size:13px;display:flex;align-items:center;gap:8px}

        /* ── Mobile Bottom Navigation ─────────────────────────── */
        .mobile-bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;z-index:55;background:rgba(7,10,18,.95);backdrop-filter:blur(16px);border-top:1px solid rgba(255,255,255,.06);padding:6px 0 4px}
        .mobile-bottom-nav .nav-items{display:flex;justify-content:space-around;align-items:center;max-width:400px;margin:0 auto}
        .mobile-bottom-nav .nav-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 12px;border-radius:10px;color:rgba(255,255,255,.4);font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:all .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
        .mobile-bottom-nav .nav-item:active{transform:scale(.92)}
        .mobile-bottom-nav .nav-item.active{color:#eab308}
        .mobile-bottom-nav .nav-item svg{width:20px;height:20px}
        @media(max-width:639px){.mobile-bottom-nav{display:block}}
        @media(max-width:639px){.game-view-active .mobile-bottom-nav{display:none}}

        /* Standalone PWA mode */
        @media(display-mode: standalone){
            header{padding-top:env(safe-area-inset-top)}
        }

        /* ── Mobile game view toolbar ──────────────────────────── */
        @media(max-width:639px){
            #game-view .flex.items-center.justify-between.mb-2{margin-bottom:4px;padding:0 4px}
            #game-view .flex.items-center.justify-between.mb-2 h2{font-size:13px}
            #game-view .flex.items-center.justify-between.mb-2 p{font-size:9px}
        }

        /* ── SlotBuilder presentation theme (from presentation/Pub.html) ── */
        html{scroll-behavior:smooth}
        body{background-color:#020617}
        .hero-gradient{background:radial-gradient(circle at 20% 20%,#1e3a8a 0%,#020617 50%)}
        .accent-border{border-left:5px solid #f59e0b}
        .text-gradient{background:linear-gradient(to right,#f59e0b,#fbbf24,#f59e0b);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
        .feature-card{transition:all .4s ease;border:1px solid rgba(255,255,255,.05)}
        .feature-card:hover{transform:translateY(-10px);border-color:rgba(245,158,11,.4);background:rgba(255,255,255,.05)}
        .game-card.feature-card:hover{transform:translateY(-6px) scale(1.02);border-color:rgba(234,179,8,.25);box-shadow:0 20px 40px rgba(0,0,0,.4),0 0 30px rgba(234,179,8,.08)}
        #zoomModal{display:none;position:fixed;z-index:9999;padding-top:20px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgba(1,4,18,.98);backdrop-filter:blur(15px)}
        #zoomModalContent{margin:auto;display:block;width:95%;max-width:1600px;border-radius:1.5rem;border:1px solid rgba(255,255,255,.1);box-shadow:0 0 80px rgba(0,0,0,.8)}
        #zoomModalClose{position:absolute;top:20px;right:30px;color:#fff;font-size:50px;font-weight:100;cursor:pointer}
