/* Forçar tela cheia quando em modo standalone */
        html.pwa-standalone body {
            overflow-x: hidden;
            -webkit-overflow-scrolling: touch;
        }

        /* Esconder elementos de browser quando em modo PWA */
        html.pwa-standalone .browser-only {
            display: none !important;
        }

        /* Adicionar padding safe area para notch/camera */
        html.pwa-standalone {
            padding-top: env(safe-area-inset-top);
            padding-bottom: env(safe-area-inset-bottom);
            padding-left: env(safe-area-inset-left);
            padding-right: env(safe-area-inset-right);
        }

/* --- Next block --- */

/* ========================================
               CORREÇÕES CIRÚRGICAS APLICADAS ✅
               
               ✅ touch-action: auto na sidebar ativa
               ✅ PWA settings preservam sidebar
               ✅ Touch events simplificados (sem touchmove)
               ✅ Scroll livre em todos elementos da sidebar
               ✅ Desktop preservado integralmente
               
               RESULTADO: Mobile com scroll + Desktop funcionando
               ======================================== */
            
            :root {
                --primary-color: #FF6600;
                --secondary-color: #E55A00;
                --accent-color: #FF8533;
                --success-color: #10b981;
                --error-color: #e74c3c;
                --warning-color: #f59e0b;
                --info-color: #3b82f6;
                --light-color: #f3f4f6;
                --dark-color: #1f2937;
                --purple-color: #a855f7;
                --pink-color: #ec4899;
                --gradient-primary: linear-gradient(135deg, #FF6600 0%, #E55A00 100%);
                --gradient-success: linear-gradient(135deg, #10b981 0%, #059669 100%);
                --gradient-warning: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
                --gradient-purple: linear-gradient(135deg, #a855f7 0%, #7c3aed 100%);
                --gradient-dark: linear-gradient(135deg, #1f2937 0%, #111827 100%);
                --premium-color: #ffd700;
                --gradient-premium: linear-gradient(135deg, #ffd700 0%, #ffb700 100%);

                /* Cores do tema escuro (igual à tela de login) */
                --bg-dark: #1a1a2e;
                --bg-darker: #16213e;
                --bg-darkest: #0f0f23;
                --bg-card: rgba(22, 33, 62, 0.95);
                --bg-card-hover: rgba(30, 45, 80, 0.95);
                --text-light: #ffffff;
                --text-muted: rgba(255, 255, 255, 0.7);
                --border-dark: rgba(255, 102, 0, 0.2);
                --border-light: rgba(255, 255, 255, 0.1);
            }

            /* DARK THEME VARIABLES (tema preto) */
            [data-theme="dark"] {
                --primary-color: #FF8533;
                --secondary-color: #FF6600;
                --accent-color: #f87171;
                --success-color: #22c55e;
                --error-color: #FF8533;
                --warning-color: #f59e0b;
                --info-color: #3b82f6;
                --light-color: #ffffff;
                --dark-color: #f9fafb;
                --purple-color: #a855f7;
                --pink-color: #ec4899;
                
                /* Dark theme specific colors - REALLY DARK */
                --bg-primary: #0a0a0a;
                --bg-secondary: #0f0f0f;
                --bg-tertiary: #141414;
                --bg-card: #0d0d0d;
                --bg-hover: #181818;
                --text-primary: #ffffff;
                --text-secondary: #e5e5e5;
                --text-muted: #b3b3b3;
                --border-color: #2a2a2a;
                --border-hover: #3a3a3a;
                
                /* Dark gradients - REALLY DARK */
                --gradient-primary: linear-gradient(135deg, #FF8533 0%, #FF6600 100%);
                --gradient-success: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
                --gradient-warning: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
                --gradient-purple: linear-gradient(135deg, #a855f7 0%, #7c3aed 100%);
                --gradient-dark: linear-gradient(135deg, #0d0d0d 0%, #0a0a0a 100%);
                --gradient-premium: linear-gradient(135deg, #ffd700 0%, #ffb700 100%);
                
                /* Dark theme card and surface colors - REALLY DARK */
                --card-bg: #0d0d0d;
                --card-border: #1f1f1f;
                --sidebar-bg: #0d0d0d;
                --header-bg: #0a0a0a;
                --notification-bg: #0d0d0d;
            }

            * {
                margin: 0;
                padding: 0;
                box-sizing: border-box;
                font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            }

            html {
                overflow-x: hidden;
                max-width: 100vw;
            }

            body {
                background: linear-gradient(135deg, var(--bg-dark) 0%, var(--bg-darker) 50%, var(--bg-darkest) 100%);
                min-height: 100vh;
                color: var(--text-light);
                line-height: 1.5;
                transition: background-color 0.3s ease, color 0.3s ease;
                overflow-x: hidden;
                max-width: 100vw;
            }

            /* DARK THEME STYLES (tema preto) */
            [data-theme="dark"] body {
                background: var(--bg-primary);
                color: var(--text-primary);
            }

            /* Esconder seção premium por padrão */
            .premium-sidebar-section {
                display: none;
            }

            /* Mostrar apenas quando premium está ativo */
            body.premium-active .premium-sidebar-section {
                display: block !important;
            }

            /* SIDEBAR NOVA - SEM INTERFERÊNCIAS DE SCROLL */
            .sidebar {
                position: fixed;
                top: 0;
                left: -300px;
                width: 300px;
                height: 100vh;
                background: var(--bg-card);
                backdrop-filter: blur(20px);
                box-shadow: 2px 0 20px rgba(0, 0, 0, 0.4);
                border-right: 1px solid var(--border-dark);
                transition: left 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
                z-index: 1500;
                display: flex;
                flex-direction: column;
                overflow: hidden; /* Controle manual do scroll */
            }

            /* DARK THEME - SIDEBAR */
            [data-theme="dark"] .sidebar {
                background: var(--sidebar-bg);
                box-shadow: 2px 0 15px rgba(0, 0, 0, 0.5);
                border-right: 1px solid var(--border-color);
            }

            /* DARK THEME - SIDEBAR HEADER */
            [data-theme="dark"] .sidebar-header {
                background: var(--gradient-dark) !important;
                border-bottom-color: var(--border-color);
                color: var(--text-primary);
            }

            [data-theme="dark"] .sidebar-header h2 {
                color: var(--primary-color) !important;
            }

            .sidebar.open {
                left: 0;
            }
            
            /* CONTAINER DE SCROLL DEDICADO */
            .sidebar-content {
                flex: 1;
                overflow-y: auto;
                overflow-x: hidden;
                padding: 0;
                -webkit-overflow-scrolling: touch;
                scroll-behavior: smooth;
            }
            
            /* HEADER FIXO */
            .sidebar-header {
                flex-shrink: 0;
                padding: 20px;
                border-bottom: 1px solid var(--border-dark);
                background: var(--bg-darker);
            }
            
            /* CARD DE BÔNUS REDESENHADO */
            .bonus-card {
                margin-top: 12px;
                padding: 12px;
                background: rgba(16, 185, 129, 0.15);
                border-radius: 10px;
                border: 1px solid rgba(16, 185, 129, 0.3);
                text-align: center;
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
            }

            .bonus-header {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 6px;
                margin-bottom: 8px;
                color: #10b981;
            }

            .bonus-header i {
                color: #10b981;
                font-size: 12px;
            }

            .bonus-header span {
                font-weight: bold;
                font-size: 10px;
                letter-spacing: 0.5px;
            }

            .bonus-content {
                color: var(--text-muted);
                font-size: 9px;
                line-height: 1.4;
            }
            
            .bonus-item {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 4px;
                margin-bottom: 3px;
            }
            
            .bonus-footer {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 4px;
                margin-top: 6px;
                padding-top: 6px;
                border-top: 1px solid rgba(16, 185, 129, 0.2);
                font-size: 8px;
                opacity: 0.9;
            }
            
            .bonus-emoji {
                font-size: 10px;
            }

            /* Notifications Dropdown */
            .notifications-dropdown {
                position: fixed;
                top: 60px;
                right: 10px;
                width: 350px;
                max-width: calc(100vw - 20px);
                background: var(--bg-card);
                color: var(--text-light);
                border-radius: 16px;
                box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
                z-index: 2000;
                transform: translateY(-10px) scale(0.95);
                opacity: 0;
                visibility: hidden;
                transition: all 0.3s ease;
                max-height: 80vh;
                overflow: hidden;
                display: flex;
                flex-direction: column;
                border: 1px solid var(--border-dark);
            }

            /* Desktop positioning - below notifications button */
            @media (min-width: 769px) {
                .notifications-dropdown {
                    top: 75px;
                    left: auto;
                    right: 20px;
                    width: 380px;
                }
            }

            .notifications-dropdown.visible {
                transform: translateY(0) scale(1);
                opacity: 1;
                visibility: visible;
            }

            .notifications-header {
                padding: 16px 20px;
                border-bottom: 1px solid var(--border-dark);
                display: flex;
                justify-content: space-between;
                align-items: center;
                background: var(--bg-darker);
            }

            .notifications-title {
                display: flex;
                align-items: center;
                gap: 8px;
                font-weight: 600;
                font-size: 16px;
                color: var(--text-light);
            }

            .notifications-content {
                flex: 1;
                overflow-y: auto;
                max-height: 400px;
                background: var(--bg-card);
            }

            .notification-item {
                padding: 16px 20px;
                border-bottom: 1px solid var(--border-dark);
                display: flex;
                align-items: flex-start;
                gap: 12px;
                transition: background 0.3s;
                cursor: pointer;
            }

            .notification-item:hover {
                background: var(--bg-card-hover);
            }

            .notification-item.unread {
                background: rgba(255, 102, 0, 0.1);
                border-left: 4px solid var(--primary-color);
            }

            .notification-icon {
                flex-shrink: 0;
                width: 36px;
                height: 36px;
                border-radius: 12px;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 16px;
                color: white;
            }

            /* Video Modal Styles */
            .video-modal {
                display: none;
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: rgba(0, 0, 0, 0.95);
                z-index: 10000;
                align-items: center;
                justify-content: center;
                backdrop-filter: blur(5px);
            }

            .video-modal.active {
                display: flex;
            }

            .video-modal-content {
                position: relative;
                max-width: 90vw;
                max-height: 90vh;
                background: #000;
                border-radius: 12px;
                overflow: hidden;
                box-shadow: 0 25px 60px rgba(0, 0, 0, 0.8);
            }

            .video-modal-header {
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                background: linear-gradient(180deg, rgba(0,0,0,0.8) 0%, transparent 100%);
                padding: 15px 20px;
                z-index: 1;
                display: flex;
                justify-content: space-between;
                align-items: center;
            }

            .video-modal-title {
                color: white;
                font-size: 16px;
                font-weight: 600;
                display: flex;
                align-items: center;
                gap: 8px;
            }

            .video-modal-controls {
                display: flex;
                gap: 10px;
            }

            .video-modal-btn {
                background: rgba(255, 255, 255, 0.2);
                border: none;
                color: white;
                border-radius: 8px;
                width: 40px;
                height: 40px;
                cursor: pointer;
                font-size: 16px;
                display: flex;
                align-items: center;
                justify-content: center;
                transition: all 0.3s;
                backdrop-filter: blur(10px);
            }

            .video-modal-btn:hover {
                background: rgba(255, 255, 255, 0.3);
                transform: scale(1.1);
            }

            .video-modal-video {
                width: 100%;
                height: auto;
                max-height: 90vh;
                border-radius: 12px;
            }

            .video-tutorial-btn {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                background: linear-gradient(135deg, #FF6600, #E55A00);
                color: white;
                border: none;
                padding: 12px 20px;
                border-radius: 10px;
                font-size: 14px;
                font-weight: 600;
                cursor: pointer;
                transition: all 0.3s;
                margin-bottom: 20px;
                box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
            }

            .video-tutorial-btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 6px 20px rgba(220, 38, 38, 0.4);
            }

            .video-tutorial-btn i {
                font-size: 16px;
            }

            /* Fullscreen video styles */
            @media (max-width: 768px) {
                .video-modal-content {
                    max-width: 100vw;
                    max-height: 100vh;
                    border-radius: 0;
                }

                .video-modal-video {
                    max-height: 100vh;
                    border-radius: 0;
                }

                .video-modal-header {
                    padding: 20px;
                }

                .video-modal-title {
                    font-size: 14px;
                }
            }

            /* PWA - Tela cheia para Android */
            @media (display-mode: standalone) {
                body {
                    overflow-x: hidden;
                    -webkit-user-select: none;
                    -webkit-touch-callout: none;
                    -webkit-tap-highlight-color: transparent;
                }
                
                /* Remove a barra de endereço fantasma */
                html {
                    height: 100vh;
                    overflow-x: hidden;
                    overflow-y: auto;
                }
                
                /* Ajustar para área segura (notch, etc) */
                body {
                    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
                }
            }

            /* Específico para Android PWA */
            @media (display-mode: standalone) and (orientation: portrait) {
                .mobile-header {
                    padding-top: max(12px, env(safe-area-inset-top));
                }
                
                .main-content {
                    padding-top: max(72px, calc(56px + env(safe-area-inset-top)));
                }
            }

            /* Prevenir zoom em inputs */
            input[type="text"],
            input[type="email"],
            input[type="password"],
            input[type="number"],
            input[type="tel"],
            textarea,
            select {
                font-size: 16px !important;
                transform: translateZ(0);
                -webkit-appearance: none;
            }

            /* Otimizações para Android */
            * {
                -webkit-tap-highlight-color: transparent;
                -webkit-touch-callout: none;
                -webkit-user-select: none;
                user-select: none;
            }

            input, textarea, button, select {
                -webkit-user-select: text;
                user-select: text;
            }

            .notification-icon.error {
                background: var(--gradient-primary);
            }

            .notification-icon.warning {
                background: var(--gradient-warning);
            }

            .notification-icon.info {
                background: linear-gradient(135deg, #3b82f6, #2563eb);
            }

            .notification-icon.success {
                background: var(--gradient-success);
            }

            .notification-body {
                flex: 1;
                min-width: 0;
            }

            .notification-message {
                font-size: 14px;
                font-weight: 600;
                margin-bottom: 4px;
                color: var(--text-light);
            }

            .notification-details {
                font-size: 12px;
                color: var(--text-muted);
                line-height: 1.4;
                margin-bottom: 6px;
            }

            .notification-time {
                font-size: 11px;
                color: var(--text-muted);
            }

            .notification-actions {
                display: flex;
                align-items: center;
                gap: 8px;
                flex-shrink: 0;
            }

            .notification-action {
                background: none;
                border: none;
                color: var(--text-muted);
                cursor: pointer;
                padding: 6px;
                border-radius: 8px;
                transition: all 0.3s;
                font-size: 14px;
            }

            .notification-action:hover {
                background: var(--bg-card-hover);
                color: var(--text-light);
            }

            .notifications-footer {
                padding: 12px 20px;
                border-top: 1px solid var(--border-dark);
                background: var(--bg-darker);
                display: flex;
                justify-content: space-between;
                align-items: center;
            }

            .notifications-clear-all {
                background: var(--primary-color);
                color: white;
                border: none;
                padding: 6px 12px;
                border-radius: 8px;
                font-size: 12px;
                cursor: pointer;
                transition: all 0.3s;
                font-weight: 500;
            }

            .notifications-clear-all:hover {
                background: var(--secondary-color);
                transform: translateY(-1px);
            }

            /* Login/Register Styles - Design Moderno */
            .auth-screen {
                display: flex;
                justify-content: center;
                align-items: center;
                min-height: 100vh;
                padding: 20px;
                background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f0f23 100%);
                position: relative;
                overflow: hidden;
            }

            /* Background Shapes Animadas */
            .auth-background-shapes {
                position: fixed;
                width: 100%;
                height: 100%;
                overflow: hidden;
                z-index: 0;
                pointer-events: none;
            }

            .auth-shape {
                position: absolute;
                border-radius: 50%;
                filter: blur(60px);
                opacity: 0.6;
                animation: authFloat 8s ease-in-out infinite;
            }

            .auth-shape-1 {
                width: 400px;
                height: 400px;
                background: linear-gradient(45deg, #FF6600, #FF8533);
                top: -100px;
                left: -100px;
            }

            .auth-shape-2 {
                width: 300px;
                height: 300px;
                background: linear-gradient(45deg, #FF7722, #FFaa44);
                bottom: -50px;
                right: -50px;
                animation-delay: 2s;
            }

            .auth-shape-3 {
                width: 200px;
                height: 200px;
                background: linear-gradient(45deg, #FF5500, #FF6600);
                top: 50%;
                left: 10%;
                animation-delay: 4s;
            }

            .auth-shape-4 {
                width: 150px;
                height: 150px;
                background: linear-gradient(45deg, #FF8844, #FFAA66);
                bottom: 30%;
                right: 15%;
                animation-delay: 6s;
            }

            @keyframes authFloat {
                0%, 100% { transform: translate(0, 0) scale(1); }
                25% { transform: translate(30px, -30px) scale(1.1); }
                50% { transform: translate(-20px, 20px) scale(0.9); }
                75% { transform: translate(20px, 10px) scale(1.05); }
            }

            /* Logo do Projeto */
            .auth-project-logo {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 12px;
                z-index: 1000;
                padding: 20px;
                background: transparent;
                animation: authFadeInDown 0.8s ease;
            }

            .auth-logo-icon {
                width: 50px;
                height: 50px;
                background: linear-gradient(135deg, #FF6600, #FF8533);
                border-radius: 15px;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 1.5rem;
                color: white;
                box-shadow: 0 10px 30px rgba(255, 102, 0, 0.4);
            }

            .auth-logo-img {
                width: 50px;
                height: 50px;
                object-fit: contain;
            }

            .auth-logo-text {
                font-size: 1.8rem;
                font-weight: 700;
                color: #ffffff;
                text-shadow: 0 0 20px rgba(255, 102, 0, 0.3);
            }

            .auth-highlight {
                color: #FF6600;
            }

            /* Botão Flutuante WhatsApp */
            .whatsapp-float {
                position: fixed;
                bottom: 20px;
                right: 20px;
                width: 50px;
                height: 50px;
                background: linear-gradient(135deg, #25D366, #128C7E);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                color: white;
                font-size: 24px;
                text-decoration: none;
                box-shadow: 0 4px 15px rgba(37, 211, 102, 0.4);
                z-index: 9999;
                transition: all 0.3s ease;
            }

            .whatsapp-float:hover {
                transform: scale(1.1);
                box-shadow: 0 6px 20px rgba(37, 211, 102, 0.6);
            }

            .whatsapp-float:active {
                transform: scale(0.95);
            }

            @keyframes authFadeInDown {
                from { opacity: 0; transform: translateY(-20px); }
                to { opacity: 1; transform: translateY(0); }
            }

            /* Container Principal */
            .auth-main-container {
                position: relative;
                width: 850px;
                max-width: 95%;
                min-height: 550px;
                background: rgba(255, 255, 255, 0.05);
                backdrop-filter: blur(20px);
                border-radius: 30px;
                box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 102, 0, 0.1);
                overflow: hidden;
                border: 1px solid rgba(255, 255, 255, 0.1);
                z-index: 1;
            }

            /* Containers dos Formulários */
            .auth-form-container {
                position: absolute;
                top: 0;
                height: 100%;
                transition: all 0.6s ease-in-out;
            }

            .auth-sign-in-container {
                left: 0;
                width: 50%;
                z-index: 2;
                background: rgba(22, 33, 62, 0.95);
            }

            .auth-sign-up-container {
                left: 0;
                width: 50%;
                opacity: 0;
                z-index: 1;
                visibility: hidden;
                pointer-events: none;
                background: rgba(22, 33, 62, 0.95);
            }

            /* Formulários */
            .auth-form-container form {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                height: 100%;
                padding: 0 50px;
                text-align: center;
            }

            .auth-form-container form h1 {
                font-size: 2rem;
                font-weight: 700;
                color: #ffffff;
                margin-bottom: 20px;
                text-shadow: 0 0 20px rgba(255, 102, 0, 0.3);
            }

            .auth-subtitle {
                font-size: 0.85rem;
                color: rgba(255, 255, 255, 0.6);
                margin-bottom: 20px;
            }

            /* Grupos de Input */
            .auth-input-group {
                position: relative;
                width: 100%;
                margin-bottom: 15px;
            }

            .auth-input-group i {
                position: absolute;
                left: 20px;
                top: 50%;
                transform: translateY(-50%);
                color: rgba(255, 255, 255, 0.4);
                font-size: 1rem;
                transition: all 0.3s ease;
            }

            .auth-input-group input {
                width: 100%;
                padding: 15px 20px 15px 50px;
                background: rgba(255, 255, 255, 0.05);
                border: 1px solid rgba(255, 255, 255, 0.1);
                border-radius: 15px;
                color: #ffffff;
                font-size: 0.95rem;
                transition: all 0.3s ease;
                outline: none;
            }

            .auth-input-group input::placeholder {
                color: rgba(255, 255, 255, 0.4);
            }

            .auth-input-group input:focus {
                border-color: #FF6600;
                background: rgba(255, 102, 0, 0.05);
                box-shadow: 0 0 20px rgba(255, 102, 0, 0.2);
            }

            .auth-input-group input:focus + i,
            .auth-input-group:focus-within i {
                color: #FF6600;
            }

            .auth-input-row {
                display: flex;
                gap: 10px;
                width: 100%;
            }

            .auth-input-row .auth-input-group {
                flex: 1;
            }

            /* Link Esqueci Senha */
            .auth-forgot-password {
                color: rgba(255, 255, 255, 0.6);
                font-size: 0.85rem;
                text-decoration: none;
                margin-bottom: 20px;
                transition: all 0.3s ease;
            }

            .auth-forgot-password:hover {
                color: #FF6600;
            }

            /* Botões */
            .auth-form-container .auth-btn {
                padding: 15px 50px;
                border-radius: 50px;
                font-size: 0.95rem;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: 1px;
                cursor: pointer;
                transition: all 0.3s ease;
                border: none;
                background: linear-gradient(135deg, #FF6600, #FF8533);
                color: #ffffff;
                box-shadow: 0 10px 30px rgba(255, 102, 0, 0.4);
                width: 100%;
                margin-top: 10px;
            }

            .auth-form-container .auth-btn:hover {
                transform: translateY(-3px);
                box-shadow: 0 15px 40px rgba(255, 102, 0, 0.5);
            }

            /* Overlay */
            .auth-overlay-container {
                position: absolute;
                top: 0;
                left: 50%;
                width: 50%;
                height: 100%;
                overflow: hidden;
                transition: transform 0.6s ease-in-out;
                z-index: 100;
            }

            .auth-overlay {
                background: linear-gradient(135deg, #FF6600, #FF5500);
                color: #ffffff;
                position: relative;
                left: -100%;
                height: 100%;
                width: 200%;
                transform: translateX(0);
                transition: transform 0.6s ease-in-out;
            }

            .auth-overlay::before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
                            radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.15) 0%, transparent 50%);
                pointer-events: none;
            }

            .auth-overlay-panel {
                position: absolute;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                padding: 0 40px;
                text-align: center;
                top: 0;
                height: 100%;
                width: 50%;
                transition: transform 0.6s ease-in-out;
            }

            .auth-overlay-left {
                transform: translateX(-20%);
            }

            .auth-overlay-right {
                right: 0;
                transform: translateX(0);
            }

            .auth-overlay-logo {
                width: 80px;
                height: 80px;
                border-radius: 50%;
                background: rgba(255, 255, 255, 0.2);
                display: flex;
                align-items: center;
                justify-content: center;
                margin-bottom: 25px;
                font-size: 2rem;
                backdrop-filter: blur(10px);
                border: 2px solid rgba(255, 255, 255, 0.3);
                animation: authPulse 2s ease-in-out infinite;
            }

            @keyframes authPulse {
                0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4); }
                50% { transform: scale(1.05); box-shadow: 0 0 30px 10px rgba(255, 255, 255, 0.1); }
            }

            .auth-overlay-panel h1 {
                font-size: 1.8rem;
                font-weight: 700;
                margin-bottom: 15px;
            }

            .auth-overlay-panel p {
                font-size: 0.95rem;
                line-height: 1.6;
                margin-bottom: 30px;
                opacity: 0.9;
            }

            /* Botão Ghost */
            .auth-ghost-btn {
                padding: 15px 50px;
                border-radius: 50px;
                font-size: 0.95rem;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: 1px;
                cursor: pointer;
                transition: all 0.3s ease;
                background: transparent;
                border: 2px solid #ffffff;
                color: #ffffff;
            }

            .auth-ghost-btn:hover {
                background: rgba(255, 255, 255, 0.15);
                transform: translateY(-3px);
                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
            }

            /* Animações de Troca */
            .auth-main-container.right-panel-active .auth-sign-up-container {
                transform: translateX(100%);
                opacity: 1;
                z-index: 5;
                visibility: visible;
                pointer-events: auto;
                animation: authShow 0.6s;
            }

            .auth-main-container.right-panel-active .auth-sign-in-container {
                transform: translateX(100%);
                opacity: 0;
                visibility: hidden;
                pointer-events: none;
            }

            @keyframes authShow {
                0%, 49.99% { opacity: 0; z-index: 1; visibility: hidden; }
                50%, 100% { opacity: 1; z-index: 5; visibility: visible; }
            }

            .auth-main-container.right-panel-active .auth-overlay-container {
                transform: translateX(-100%);
            }

            .auth-main-container.right-panel-active .auth-overlay {
                transform: translateX(50%);
            }

            .auth-main-container.right-panel-active .auth-overlay-left {
                transform: translateX(0);
            }

            .auth-main-container.right-panel-active .auth-overlay-right {
                transform: translateX(20%);
            }

            /* WhatsApp Button */
            .auth-whatsapp-btn {
                position: fixed;
                bottom: 30px;
                right: 30px;
                width: 60px;
                height: 60px;
                background: linear-gradient(135deg, #25D366, #128C7E);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                color: white;
                font-size: 2rem;
                text-decoration: none;
                box-shadow: 0 10px 30px rgba(37, 211, 102, 0.4);
                z-index: 1000;
                transition: all 0.3s ease;
                animation: authWhatsappPulse 2s ease-in-out infinite;
            }

            .auth-whatsapp-btn:hover {
                transform: scale(1.1);
            }

            .auth-whatsapp-tooltip {
                position: absolute;
                right: 70px;
                background: rgba(0, 0, 0, 0.8);
                color: white;
                padding: 8px 15px;
                border-radius: 8px;
                font-size: 0.85rem;
                opacity: 0;
                transition: all 0.3s ease;
                pointer-events: none;
            }

            .auth-whatsapp-btn:hover .auth-whatsapp-tooltip {
                opacity: 1;
            }

            @keyframes authWhatsappPulse {
                0%, 100% { box-shadow: 0 10px 30px rgba(37, 211, 102, 0.4), 0 0 0 0 rgba(37, 211, 102, 0.4); }
                50% { box-shadow: 0 10px 30px rgba(37, 211, 102, 0.4), 0 0 0 15px rgba(37, 211, 102, 0); }
            }

            /* Mensagem de Erro */
            .auth-error-message {
                position: fixed;
                bottom: 100px;
                left: 50%;
                transform: translateX(-50%);
                background: rgba(231, 76, 60, 0.9);
                color: white;
                padding: 15px 30px;
                border-radius: 10px;
                display: none;
                z-index: 1000;
            }

            .auth-error-message.show {
                display: block;
            }

            .auth-message {
                margin-top: 15px;
                padding: 10px 20px;
                border-radius: 10px;
                font-size: 0.85rem;
                display: none;
            }

            .auth-message.success {
                display: block;
                background: rgba(37, 211, 102, 0.2);
                color: #25D366;
                border: 1px solid rgba(37, 211, 102, 0.3);
            }

            .auth-message.error {
                display: block;
                background: rgba(255, 68, 68, 0.2);
                color: #ff4444;
                border: 1px solid rgba(255, 68, 68, 0.3);
            }

            /* Responsividade Mobile */
            @media (max-width: 768px) {
                .auth-main-container {
                    min-height: auto;
                    width: 100%;
                    max-width: 400px;
                    border-radius: 20px;
                }

                .auth-form-container {
                    position: relative;
                    width: 100%;
                    height: auto;
                }

                .auth-sign-in-container,
                .auth-sign-up-container {
                    width: 100%;
                    position: relative;
                    left: 0;
                    opacity: 1;
                    z-index: 1;
                }

                .auth-sign-up-container {
                    display: none;
                }

                .auth-main-container.right-panel-active .auth-sign-in-container {
                    display: none;
                }

                .auth-main-container.right-panel-active .auth-sign-up-container {
                    display: block;
                    transform: none;
                }

                .auth-overlay-container {
                    display: none;
                }

                .auth-form-container form {
                    padding: 40px 30px;
                }

                .auth-form-container form h1 {
                    font-size: 1.6rem;
                }

                .auth-project-logo {
                    padding: 15px;
                }

                .auth-logo-icon {
                    width: 40px;
                    height: 40px;
                    font-size: 1.2rem;
                }

                .auth-logo-img {
                    width: 40px;
                    height: 40px;
                }

                .auth-logo-text {
                    font-size: 1.4rem;
                }

                /* Simplificar background no mobile */
                .auth-background-shapes {
                    opacity: 0.4;
                }

                .auth-shape {
                    filter: blur(80px);
                }

                /* Mobile toggle links */
                .auth-mobile-toggle {
                    display: block;
                    margin-top: 20px;
                    color: rgba(255, 255, 255, 0.6);
                    font-size: 0.9rem;
                }

                .auth-mobile-toggle a {
                    color: #FF6600;
                    text-decoration: none;
                    font-weight: 600;
                }
            }

            /* Ajuste do body para acomodar o logo */
            .auth-screen {
                padding-top: 90px;
                padding-bottom: 30px;
            }

            @media (max-width: 768px) {
                .auth-screen {
                    padding-top: 80px;
                    padding-bottom: 20px;
                }
            }

            .form-group {
                margin-bottom: 20px;
                text-align: left;
            }

            .form-group label {
                display: block;
                margin-bottom: 8px;
                font-weight: 500;
                color: var(--text-muted);
                font-size: 14px;
            }

            .form-group input, .form-group textarea, .form-group select {
                width: 100%;
                padding: 12px 16px;
                border: 2px solid var(--border-dark);
                border-radius: 12px;
                font-size: 14px;
                transition: all 0.3s;
                background: var(--bg-darker);
                color: var(--text-light);
                font-weight: 500;
            }

            .form-group input:focus, .form-group textarea:focus, .form-group select:focus {
                border-color: var(--primary-color);
                outline: none;
                box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.2);
                background: var(--bg-card);
            }

            .auth-btn {
                background: var(--gradient-primary);
                color: white;
                border: none;
                padding: 14px 24px;
                border-radius: 12px;
                font-size: 16px;
                cursor: pointer;
                width: 100%;
                transition: all 0.3s;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                font-weight: 600;
                margin-bottom: 16px;
                box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
            }

            .auth-btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 6px 20px rgba(220, 38, 38, 0.4);
            }

            /* Admin Panel */
            .admin-panel {
                display: none;
                min-height: 100vh;
                background: linear-gradient(135deg, var(--bg-dark) 0%, var(--bg-darker) 50%, var(--bg-darkest) 100%);
            }

            .admin-panel.active {
                display: flex;
            }

            /* Sidebar duplicada removida - usando a nova definição */

            /* Sidebar-header duplicada removida - usando a nova definição */

            .sidebar-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                position: relative;
            }

            .sidebar-header h2 {
                display: flex;
                align-items: center;
                gap: 10px;
                font-size: 20px;
                font-weight: 700;
                flex: 1;
            }

            /* Desktop Notifications Button - Fixed position */
            .desktop-notifications {
                position: fixed;
                top: 20px;
                right: 20px;
                background: var(--bg-card);
                border: 1px solid var(--border-dark);
                color: var(--text-muted);
                cursor: pointer;
                padding: 12px;
                border-radius: 12px;
                width: 52px;
                height: 52px;
                display: none;
                align-items: center;
                justify-content: center;
                transition: all 0.3s;
                font-size: 24px;
                z-index: 100;
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
            }

            .desktop-notifications:hover {
                background: rgba(255, 102, 0, 0.15);
                color: var(--primary-color);
                transform: scale(1.08);
                box-shadow: 0 4px 12px rgba(255, 102, 0, 0.3);
            }

            .desktop-notifications-badge {
                position: absolute;
                top: 6px;
                right: 6px;
                background: var(--primary-color);
                color: white;
                border-radius: 50%;
                min-width: 22px;
                height: 22px;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 12px;
                font-weight: 700;
                padding: 0 5px;
                box-shadow: 0 2px 6px rgba(220, 38, 38, 0.4);
                border: 2px solid white;
            }

            /* Show on desktop only */
            @media (min-width: 769px) {
                .desktop-notifications {
                    display: flex;
                }
            }

            .menu-item {
                display: flex;
                align-items: center;
                padding: 12px 20px;
                color: var(--text-muted);
                text-decoration: none;
                transition: all 0.3s;
                gap: 12px;
                font-size: 14px;
                font-weight: 500;
                position: relative;
            }

            .menu-item:hover {
                background-color: rgba(255, 102, 0, 0.15);
                color: var(--primary-color);
            }

            .menu-item.active {
                background-color: rgba(255, 102, 0, 0.15);
                color: var(--primary-color);
                font-weight: 600;
            }

            .menu-item.active::before {
                content: '';
                position: absolute;
                left: 0;
                top: 0;
                bottom: 0;
                width: 4px;
                background: var(--primary-color);
            }

            /* DARK THEME - MENU ITEMS */
            [data-theme="dark"] .menu-item {
                color: var(--text-secondary);
            }

            [data-theme="dark"] .menu-item:hover {
                background-color: var(--bg-hover);
                color: var(--primary-color);
            }

            [data-theme="dark"] .menu-item.active {
                background-color: rgba(239, 68, 68, 0.15);
                color: var(--primary-color);
            }

            /* Wallet Section in Sidebar */
            .wallet-section {
                margin: 15px;
                padding: 16px;
                background: var(--bg-darker);
                border-radius: 12px;
                text-align: center;
                border: 1px solid var(--border-dark);
                transition: background-color 0.3s ease, border-color 0.3s ease;
            }

            /* DARK THEME - WALLET SECTION */
            [data-theme="dark"] .wallet-section {
                background: var(--bg-card);
                border-color: var(--border-color);
            }

            /* DARK THEME - COMPREHENSIVE STYLING */
            [data-theme="dark"] .mobile-header {
                background: var(--header-bg);
                border-bottom-color: var(--border-color);
                color: var(--text-primary);
            }

            [data-theme="dark"] .mobile-header h2 {
                color: var(--primary-color);
            }

            [data-theme="dark"] .notifications-dropdown {
                background: var(--notification-bg);
                border-color: var(--border-color);
                color: var(--text-primary);
            }

            [data-theme="dark"] .notifications-header {
                background: var(--bg-secondary);
                border-bottom-color: var(--border-color);
            }

            [data-theme="dark"] .notifications-title {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .notifications-title span {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .notifications-title i {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .notification-item {
                border-bottom-color: var(--border-color);
                color: var(--text-primary);
            }

            [data-theme="dark"] .notification-item:hover {
                background: var(--bg-hover);
            }

            [data-theme="dark"] .notification-message {
                color: var(--text-primary);
            }

            [data-theme="dark"] .notification-details {
                color: var(--text-secondary);
            }

            [data-theme="dark"] .notification-time {
                color: var(--text-muted);
            }

            [data-theme="dark"] .notifications-footer {
                background: var(--bg-secondary);
                border-top-color: var(--border-color);
            }

            /* DARK THEME - NOTIFICAÇÕES ESPECÍFICAS */
            [data-theme="dark"] .notifications-content {
                background: var(--bg-card) !important;
            }

            [data-theme="dark"] .notification-item.unread {
                background: rgba(239, 68, 68, 0.15) !important;
                border-left-color: var(--primary-color) !important;
            }

            [data-theme="dark"] .notification-action:hover {
                background: var(--bg-hover) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .notification-modal-content {
                background: var(--bg-card) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .notification-modal-header {
                color: var(--text-primary) !important;
                border-bottom-color: var(--border-color) !important;
            }

            [data-theme="dark"] .notification-modal-body {
                background: transparent !important;
                color: var(--text-primary) !important;
            }

            /* DARK THEME - ADMIN PANEL */
            [data-theme="dark"] .admin-panel {
                background: var(--bg-primary) !important;
            }

            [data-theme="dark"] .admin-panel.active {
                background: var(--bg-primary) !important;
            }

            [data-theme="dark"] .auth-container {
                background: var(--bg-card);
                color: var(--text-primary);
            }

            [data-theme="dark"] .form-group label {
                color: var(--text-secondary);
            }

            [data-theme="dark"] .form-group input,
            [data-theme="dark"] .form-group textarea,
            [data-theme="dark"] .form-group select {
                background: var(--bg-secondary);
                border-color: var(--border-color);
                color: var(--text-primary);
            }

            [data-theme="dark"] .form-group input:focus,
            [data-theme="dark"] .form-group textarea:focus,
            [data-theme="dark"] .form-group select:focus {
                border-color: var(--primary-color);
                background: var(--bg-tertiary);
            }

            /* Dark theme for cards and sections */
            [data-theme="dark"] .content-section {
                color: var(--text-primary);
            }

            [data-theme="dark"] .page-header {
                color: var(--text-primary);
            }

            [data-theme="dark"] .wallet-label {
                color: var(--text-secondary);
            }

            /* Dark theme for mobile notifications button */
            [data-theme="dark"] .mobile-notifications {
                color: var(--text-primary);
            }

            [data-theme="dark"] .mobile-notifications:hover {
                background: var(--bg-hover);
            }

            /* Dark theme for desktop notifications button */
            [data-theme="dark"] .desktop-notifications {
                background: var(--bg-card);
                border-color: var(--border-color);
                color: var(--text-primary);
            }

            [data-theme="dark"] .desktop-notifications:hover {
                background: var(--bg-hover);
                color: var(--primary-color);
            }

            [data-theme="dark"] .desktop-notifications-badge {
                border-color: var(--bg-card);
            }

            /* Dark theme for mobile menu button */
            [data-theme="dark"] .mobile-menu-btn {
                color: var(--text-primary);
            }

            [data-theme="dark"] .mobile-menu-btn:hover {
                background: var(--bg-hover);
            }

            /* Dark theme for overlay */
            [data-theme="dark"] .overlay {
                background: rgba(0, 0, 0, 0.7);
            }

            /* Dark theme for stats and dashboard elements */
            [data-theme="dark"] .stats-card,
            [data-theme="dark"] .stat-card,
            [data-theme="dark"] .card {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
            }

            [data-theme="dark"] .stat-card:hover {
                box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
            }

            [data-theme="dark"] .stats-grid .card,
            [data-theme="dark"] .stats-grid > div {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .stat-number {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .stat-label {
                color: var(--text-secondary) !important;
            }

            /* DARK THEME - PLATFORM SECTION */
            [data-theme="dark"] .form-card {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
            }

            [data-theme="dark"] .form-card h3 {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .login-container {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
            }

            [data-theme="dark"] .login-container.inactive {
                background: var(--bg-secondary) !important;
            }

            [data-theme="dark"] .login-header {
                background: var(--gradient-dark) !important;
            }

            [data-theme="dark"] .login-container.active .login-header {
                background: var(--gradient-dark) !important;
            }

            [data-theme="dark"] .login-title {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .login-container.active .login-title {
                color: var(--primary-color) !important;
            }

            [data-theme="dark"] .login-content {
                background: transparent !important;
            }

            [data-theme="dark"] .login-content label {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .login-content input {
                background: var(--bg-secondary) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .login-content input:focus {
                border-color: var(--primary-color) !important;
                background: var(--bg-tertiary) !important;
                box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1) !important;
            }

            [data-theme="dark"] .login-container.active .login-content input {
                border-color: var(--success-color) !important;
            }

            [data-theme="dark"] .login-container.inactive .login-content input {
                background: var(--bg-secondary) !important;
            }

            /* DARK THEME - STRATEGIES SECTION */
            [data-theme="dark"] .strategy-content {
                background: var(--bg-secondary) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .strategy-content:focus {
                border-color: var(--primary-color) !important;
                background: var(--bg-tertiary) !important;
                box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1) !important;
            }

            [data-theme="dark"] .item-card {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
            }

            [data-theme="dark"] .item-card:hover {
                box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
            }

            [data-theme="dark"] .item-header {
                background: var(--gradient-dark) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .item-info {
                background: transparent !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .item-actions {
                background: var(--bg-secondary) !important;
                border-top-color: var(--border-color) !important;
            }

            [data-theme="dark"] .default-strategy .item-header {
                background: linear-gradient(135deg, rgba(255, 215, 0, 0.3), rgba(255, 140, 0, 0.2)) !important;
                color: var(--premium-color) !important;
            }

            [data-theme="dark"] .default-strategy .item-info {
                background: var(--bg-card) !important;
            }

            /* DARK THEME - RESULTS SECTION */
            [data-theme="dark"] .results-container {
                background: var(--bg-secondary) !important;
                border-color: var(--border-color) !important;
            }

            [data-theme="dark"] .result-item {
                background: var(--bg-card) !important;
                color: var(--text-primary) !important;
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
            }

            [data-theme="dark"] .result-period {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .result-strategy {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .result-info {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .entry-info {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .entry-period {
                color: var(--text-primary) !important;
            }

            /* DARK THEME - METRICS SECTION */
            [data-theme="dark"] .metrics-chart-container {
                background: var(--bg-card) !important;
            }

            [data-theme="dark"] .form-card canvas {
                background: var(--bg-secondary) !important;
            }

            [data-theme="dark"] .chart-loading {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .chart-empty {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .chart-empty i {
                color: var(--text-muted) !important;
            }

            /* DARK THEME - GAMES SECTION */
            [data-theme="dark"] .games-grid {
                background: transparent !important;
            }

            [data-theme="dark"] .game-card .game-label {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .game-card input[type="radio"]:checked + .game-label {
                border-color: #22b96e !important;
                background: linear-gradient(135deg, rgba(34, 185, 110, 0.15), rgba(34, 185, 110, 0.1)) !important;
            }

            [data-theme="dark"] .game-info h4 {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .game-info p {
                color: var(--text-secondary) !important;
            }

            /* DARK THEME - GAME ICONS E STATUS */
            [data-theme="dark"] .game-icon {
                background: linear-gradient(135deg, #22b96e, #16a085) !important;
                color: white !important;
            }

            [data-theme="dark"] .game-card input[type="radio"]:checked + .game-label .game-icon {
                background: linear-gradient(135deg, #16a085, #22b96e) !important;
                color: white !important;
            }

            [data-theme="dark"] .game-status {
                color: #22b96e !important;
                background: transparent !important;
            }

            [data-theme="dark"] .period-icon {
                background: linear-gradient(135deg, #22b96e, #16a085) !important;
                color: white !important;
            }

            /* Time periods grid */
            [data-theme="dark"] .time-periods-grid .game-label {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .time-periods-grid input[type="radio"]:checked + .game-label {
                border-color: #22b96e !important;
                background: linear-gradient(135deg, rgba(34, 185, 110, 0.15), rgba(34, 185, 110, 0.1)) !important;
            }

            [data-theme="dark"] .time-periods-grid .period-icon {
                background: linear-gradient(135deg, #22b96e, #16a085) !important;
                color: white !important;
            }

            /* DARK THEME - TIME PERIODS ESPECÍFICOS */
            [data-theme="dark"] .time-period-label {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .time-period-card input[type="radio"]:checked + .time-period-label {
                border-color: #3b82f6 !important;
                background: linear-gradient(135deg, rgba(59, 130, 246, 0.15), rgba(59, 130, 246, 0.1)) !important;
            }

            [data-theme="dark"] .period-info h4 {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .period-info p {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .period-status {
                color: #3b82f6 !important;
                background: transparent !important;
            }

            [data-theme="dark"] .time-period-card input[type="radio"]:checked + .time-period-label .period-icon {
                background: linear-gradient(135deg, #1d4ed8, #3b82f6) !important;
                color: white !important;
            }

            /* DARK THEME - ENTRADAS ATIVAS/INTELIGENTES */
            [data-theme="dark"] .active-entries {
                background: linear-gradient(135deg, #5791fd, #0003ca) !important;
                border-color: #22b96e !important;
                color: white !important;
            }

            [data-theme="dark"] .active-entries h4 {
                color: #ffffff !important;
            }

            [data-theme="dark"] .entry-item {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .entry-info {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .entry-period {
                color: var(--text-primary) !important;
            }

            /* DARK THEME - CARDS DAS CONFIGURAÇÕES */
            
            /* Smart Entry Container */
            [data-theme="dark"] .smart-entry-container {
                background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
                border-color: var(--border-color) !important;
            }

            [data-theme="dark"] .smart-entry-container::before {
                background: linear-gradient(135deg, #3b82f6, #1d4ed8) !important;
            }

            [data-theme="dark"] .smart-entry-header {
                border-bottom-color: var(--border-color) !important;
            }

            [data-theme="dark"] .smart-entry-title {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .smart-entry-title i {
                color: #3b82f6 !important;
            }

            [data-theme="dark"] .smart-entry-info {
                background: linear-gradient(135deg, rgba(59, 130, 246, 0.15), rgba(59, 130, 246, 0.1)) !important;
                border-color: rgba(59, 130, 246, 0.3) !important;
            }

            [data-theme="dark"] .smart-entry-info-header {
                color: #3b82f6 !important;
            }

            [data-theme="dark"] .smart-entry-info-content {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .smart-entry-info-content strong {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .smart-entry-label {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .smart-entry-options {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
            }

            [data-theme="dark"] .smart-entry-control-label {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .smart-entry-select {
                background: var(--bg-secondary) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .smart-entry-select:focus {
                border-color: #3b82f6 !important;
                background: var(--bg-tertiary) !important;
            }

            [data-theme="dark"] .smart-entry-preview {
                background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
                border-color: var(--border-color) !important;
            }

            [data-theme="dark"] .smart-entry-preview-header {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .smart-entry-preview-content {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .smart-entry-preview-content strong {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .smart-entry-example {
                background: linear-gradient(135deg, rgba(34, 197, 94, 0.15), rgba(34, 197, 94, 0.1)) !important;
                border-color: rgba(34, 197, 94, 0.3) !important;
            }

            [data-theme="dark"] .smart-entry-example-header {
                color: #22c55e !important;
            }

            [data-theme="dark"] .smart-entry-example-content {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .smart-entry-example-content strong {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .smart-entry-status.inactive {
                background: var(--bg-secondary) !important;
                color: var(--text-muted) !important;
                border-color: var(--border-color) !important;
            }

            /* DARK THEME - SPECIFIC GALE */
            [data-theme="dark"] .specific-gale-container {
                background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
                border-color: #f59e0b !important;
            }

            [data-theme="dark"] .specific-gale-container::before {
                background: linear-gradient(135deg, #f59e0b, #d97706) !important;
            }

            [data-theme="dark"] .specific-gale-header {
                border-bottom-color: var(--border-color) !important;
            }

            [data-theme="dark"] .specific-gale-title {
                color: #fbbf24 !important;
            }

            [data-theme="dark"] .specific-gale-title i {
                color: #f59e0b !important;
            }

            [data-theme="dark"] .specific-gale-label {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .specific-gale-info {
                background: rgba(245, 158, 11, 0.1) !important;
                border-color: rgba(245, 158, 11, 0.3) !important;
            }

            [data-theme="dark"] .specific-gale-info-header {
                color: #fbbf24 !important;
            }

            [data-theme="dark"] .specific-gale-info-content {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .specific-gale-info-content strong {
                color: #fbbf24 !important;
            }

            [data-theme="dark"] .specific-gale-options {
                background: var(--bg-card) !important;
                border-color: rgba(245, 158, 11, 0.3) !important;
            }

            [data-theme="dark"] .specific-gale-control-label {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .specific-gale-select {
                background: var(--bg-secondary) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .specific-gale-select:focus {
                border-color: #f59e0b !important;
            }

            [data-theme="dark"] .specific-gale-preview {
                background: rgba(245, 158, 11, 0.05) !important;
                border-color: rgba(245, 158, 11, 0.2) !important;
            }

            [data-theme="dark"] .specific-gale-preview-header {
                color: #fbbf24 !important;
            }

            [data-theme="dark"] .specific-gale-preview-content {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] .specific-gale-preview-content strong {
                color: #fbbf24 !important;
            }

            [data-theme="dark"] .specific-gale-status.inactive {
                background: var(--bg-secondary) !important;
                color: var(--text-secondary) !important;
                border-color: var(--border-color) !important;
            }

            [data-theme="dark"] .specific-gale-container.active {
                border-color: #f59e0b !important;
                background: linear-gradient(135deg, rgba(245, 158, 11, 0.15), rgba(217, 119, 6, 0.1)) !important;
            }

            /* DARK THEME - CARD SISTEMA VIA API */
            [data-theme="dark"] div[style*="background: linear-gradient(135deg, #fef2f2, #fee2e2)"] {
                background: linear-gradient(135deg, rgba(239, 68, 68, 0.15), rgba(239, 68, 68, 0.1)) !important;
                border-left-color: var(--primary-color) !important;
            }

            [data-theme="dark"] div[style*="color: #7f1d1d"] {
                color: var(--text-secondary) !important;
            }

            /* DARK THEME - SUBSCRIPTION SECTION */
            [data-theme="dark"] .premium-section {
                background: var(--gradient-premium) !important;
                color: #2f3542 !important;
            }

            [data-theme="dark"] .premium-sidebar-section {
                background: var(--gradient-premium) !important;
                color: #2f3542 !important;
                border-color: #ffb700 !important;
            }

            [data-theme="dark"] .premium-sidebar-header {
                color: #2f3542 !important;
            }

            [data-theme="dark"] .premium-sidebar-status {
                color: #2f3542 !important;
            }

            [data-theme="dark"] .premium-sidebar-expiry {
                color: #2f3542 !important;
                opacity: 0.8;
            }

            [data-theme="dark"] .subscription-modal-content {
                background: var(--bg-card) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .subscription-features {
                background: rgba(255, 215, 0, 0.15) !important;
                border-color: rgba(255, 215, 0, 0.3) !important;
            }

            [data-theme="dark"] .subscription-feature {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .subscription-price {
                color: var(--premium-color) !important;
            }

            /* DARK THEME - WALLET SECTION */
            [data-theme="dark"] .wallet-balance {
                color: var(--primary-color) !important;
            }

            [data-theme="dark"] .popbra-wallet-balance {
                color: var(--primary-color) !important;
            }

            [data-theme="dark"] #currentWalletBalance {
                color: white !important;
            }

            [data-theme="dark"] #fullTransactionsList {
                background: transparent !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .transaction-item {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            /* DARK THEME - STATUS INDICATORS */
            [data-theme="dark"] .status-indicator {
                background: var(--bg-card) !important;
                border-color: var(--border-color) !important;
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .status-indicator.active {
                border-color: var(--success-color) !important;
                color: var(--success-color) !important;
            }

            [data-theme="dark"] .status-indicator.inactive {
                border-color: var(--error-color) !important;
                color: var(--error-color) !important;
            }

            [data-theme="dark"] .status-indicator.premium {
                border-color: var(--premium-color) !important;
                color: var(--premium-color) !important;
            }

            /* DARK THEME - FINAL CATCH-ALL */
            [data-theme="dark"] .page-header h1,
            [data-theme="dark"] .page-header p {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] small {
                color: var(--text-secondary) !important;
            }

            [data-theme="dark"] strong {
                color: var(--text-primary) !important;
            }

            /* Dark theme for buttons */
            [data-theme="dark"] .btn:not(.auth-btn):not(.wallet-btn):not(.notifications-clear-all) {
                background: var(--bg-secondary);
                color: var(--text-primary);
                border-color: var(--border-color);
            }

            [data-theme="dark"] .btn:not(.auth-btn):not(.wallet-btn):not(.notifications-clear-all):hover {
                background: var(--bg-hover);
                border-color: var(--border-hover);
            }

            /* Dark theme for any elements with white background */
            [data-theme="dark"] [style*="background: white"],
            [data-theme="dark"] [style*="background-color: white"],
            [data-theme="dark"] [style*="background:#fff"],
            [data-theme="dark"] [style*="background: #fff"] {
                background: var(--bg-card) !important;
                color: var(--text-primary) !important;
            }

            /* Dark theme for text colors */
            [data-theme="dark"] h1,
            [data-theme="dark"] h2,
            [data-theme="dark"] h3,
            [data-theme="dark"] h4,
            [data-theme="dark"] h5,
            [data-theme="dark"] h6 {
                color: var(--text-primary);
            }

            [data-theme="dark"] p {
                color: var(--text-secondary);
            }

            /* Dark theme for borders */
            [data-theme="dark"] [style*="border-color: #e5e7eb"],
            [data-theme="dark"] [style*="border-color:#e5e7eb"] {
                border-color: var(--border-color) !important;
            }

            /* FORÇA TODOS OS FUNDOS CLAROS PARA ESCURO - VERSÃO AGRESSIVA */
            [data-theme="dark"] * {
                scrollbar-color: var(--border-color) var(--bg-secondary);
            }

            [data-theme="dark"] *::-webkit-scrollbar {
                background: var(--bg-secondary);
            }

            [data-theme="dark"] *::-webkit-scrollbar-thumb {
                background: var(--border-color);
            }

            /* FORÇA QUALQUER ELEMENTO BRANCO PARA ESCURO - ULTRA AGRESSIVO (SEM ÍCONES) */
            [data-theme="dark"] .sidebar,
            [data-theme="dark"] .form-card,
            [data-theme="dark"] .stat-card,
            [data-theme="dark"] .item-card,
            [data-theme="dark"] .login-container,
            [data-theme="dark"] .game-label,
            [data-theme="dark"] .result-item,
            [data-theme="dark"] .auth-container,
            [data-theme="dark"] .notifications-dropdown,
            [data-theme="dark"] .mobile-header,
            [data-theme="dark"] .subscription-modal-content,
            [data-theme="dark"] .wallet-section,
            [data-theme="dark"] .card,
            [data-theme="dark"] .stats-card,
            [data-theme="dark"] .stats-grid > div,
            [data-theme="dark"] .login-header,
            [data-theme="dark"] .login-content,
            [data-theme="dark"] .item-actions,
            [data-theme="dark"] .time-periods-grid .game-label,
            [data-theme="dark"] .results-container div,
            [data-theme="dark"] .metrics-chart-container {
                background: var(--bg-card) !important;
                background-color: var(--bg-card) !important;
            }

            /* PRESERVAR ÍCONES - NÃO FORÇAR FUNDO ESCURO */
            [data-theme="dark"] .game-icon,
            [data-theme="dark"] .period-icon,
            [data-theme="dark"] .game-status,
            [data-theme="dark"] .period-status {
                background-color: unset !important;
            }

            /* FORÇA ELEMENTOS ESPECÍFICOS QUE ESTÃO BRANCOS */
            [data-theme="dark"] body {
                background: var(--bg-primary) !important;
            }

            [data-theme="dark"] .main-content {
                background: var(--bg-primary) !important;
            }

            [data-theme="dark"] .sidebar-header {
                background: var(--bg-secondary) !important;
            }

            /* Força elementos com background inline */
            [data-theme="dark"] [style*="background-color: #fff"],
            [data-theme="dark"] [style*="background-color:#fff"],
            [data-theme="dark"] [style*="background-color: #ffffff"],
            [data-theme="dark"] [style*="background-color:#ffffff"],
            [data-theme="dark"] [style*="background: #fff"],
            [data-theme="dark"] [style*="background:#fff"],
            [data-theme="dark"] [style*="background: #ffffff"],
            [data-theme="dark"] [style*="background:#ffffff"],
            [data-theme="dark"] [style*="background-color: white"],
            [data-theme="dark"] [style*="background: white"] {
                background: var(--bg-card) !important;
                background-color: var(--bg-card) !important;
            }

            /* Força qualquer elemento com fundo claro para escuro */
            [data-theme="dark"] [style*="background: #f"],
            [data-theme="dark"] [style*="background-color: #f"] {
                background: var(--bg-card) !important;
                background-color: var(--bg-card) !important;
            }

            /* Força todos os textos escuros para claro */
            [data-theme="dark"] [style*="color: #111"],
            [data-theme="dark"] [style*="color: #1f"],
            [data-theme="dark"] [style*="color: #2f"],
            [data-theme="dark"] [style*="color: #374"],
            [data-theme="dark"] [style*="color: #4b5"],
            [data-theme="dark"] [style*="color: #6b7"] {
                color: var(--text-primary) !important;
            }

            /* Força outros elementos específicos */
            [data-theme="dark"] .content-section,
            [data-theme="dark"] .page-header,
            [data-theme="dark"] .section,
            [data-theme="dark"] .container,
            [data-theme="dark"] .wrapper {
                background: transparent !important;
                color: var(--text-primary) !important;
            }

            /* Header fixo da sidebar */
            [data-theme="dark"] .sidebar-header {
                background: var(--bg-secondary) !important;
                border-bottom: 1px solid var(--border-color) !important;
            }

            /* Meta theme color update */
            [data-theme="dark"] {
                color-scheme: dark;
            }

            .wallet-balance {
                font-size: 24px;
                font-weight: 700;
                margin-bottom: 8px;
                color: var(--primary-color);
            }

            .wallet-label {
                font-size: 13px;
                color: #6b7280;
                margin-bottom: 16px;
            }

            .default-strategy {
                border: 2px solid var(--premium-color) !important;
                background: var(--bg-card) !important;
                box-shadow: 0 4px 20px rgba(255, 215, 0, 0.2) !important;
            }

            .default-strategy .item-header {
                background: linear-gradient(135deg, rgba(255, 215, 0, 0.3), rgba(255, 140, 0, 0.2)) !important;
                color: var(--premium-color) !important;
            }

            .default-strategy .item-info {
                background: var(--bg-card) !important;
            }

            .wallet-btn {
                background: var(--gradient-primary);
                color: white;
                border: none;
                padding: 8px 12px;
                border-radius: 8px;
                font-size: 13px;
                cursor: pointer;
                width: 100%;
                transition: all 0.3s;
                font-weight: 600;
                box-shadow: 0 2px 8px rgba(220, 38, 38, 0.3);
            }

            .wallet-btn:hover {
                transform: translateY(-1px);
                box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4);
            }

            /* PLATAFORMA Wallet Section */
            .popbra-wallet-section {
                margin: 15px;
                padding: 16px;
                background: linear-gradient(135deg, #fee2e2, #fecaca);
                border-radius: 12px;
                text-align: center;
                border: 1px solid rgba(220, 38, 38, 0.2);
                position: relative;
                overflow: hidden;
            }

            .popbra-wallet-header {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                margin-bottom: 12px;
                font-weight: 700;
                font-size: 16px;
                color: var(--primary-color);
            }

            .popbra-wallet-balance {
                font-size: 28px;
                font-weight: 700;
                margin-bottom: 8px;
                color: var(--primary-color);
            }

            .popbra-wallet-status {
                font-size: 11px;
                color: #7f1d1d;
                margin-top: 12px;
            }

            /* Auto Mode Section */
            .auto-mode-section {
                margin: 15px;
                padding: 16px;
                background: var(--gradient-primary);
                border-radius: 12px;
                text-align: center;
                box-shadow: 0 4px 12px rgba(220, 38, 38, 0.2);
            }

            .auto-mode-btn {
                background: white;
                color: var(--primary-color);
                border: none;
                padding: 10px 16px;
                border-radius: 10px;
                font-size: 14px;
                cursor: pointer;
                width: 100%;
                transition: all 0.3s;
                font-weight: 700;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
            }

            .auto-mode-btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
            }

            .auto-mode-btn.active {
                background: var(--gradient-success);
                color: white;
                animation: pulse-auto 2s infinite;
            }

            @keyframes pulse-auto {
                0% { box-shadow: 0 2px 8px rgba(16, 185, 129, 0.4); }
                50% { box-shadow: 0 4px 16px rgba(16, 185, 129, 0.6); }
                100% { box-shadow: 0 2px 8px rgba(16, 185, 129, 0.4); }
            }

            .auto-mode-status {
                margin-top: 10px;
                font-size: 11px;
                color: white;
                opacity: 0.9;
                line-height: 1.3;
            }

            .main-content {
                flex: 1;
                margin-left: 280px;
                padding: 24px;
                transition: all 0.3s;
            }

            /* DARK THEME - MAIN CONTENT */
            [data-theme="dark"] .main-content {
                background: transparent;
                color: var(--text-primary);
            }

            /* Status Indicators */
            .status-indicator {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                padding: 8px 16px;
                border-radius: 24px;
                font-weight: 600;
                font-size: 13px;
                background: var(--bg-card);
                border: 2px solid;
            }

            .status-indicator.active {
                border-color: var(--success-color);
                color: var(--success-color);
            }

            .status-indicator.inactive {
                border-color: var(--border-dark);
                color: var(--text-muted);
            }


            /* Cards */
            .stats-grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
                gap: 24px;
                margin-bottom: 24px;
            }

            .stat-card {
                background: var(--bg-card);
                border-radius: 16px;
                padding: 20px;
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
                text-align: center;
                transition: all 0.3s;
                position: relative;
                overflow: hidden;
                border: 1px solid var(--border-dark);
            }

            .stat-card:hover {
                transform: translateY(-4px);
                box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
            }

            .stat-card i {
                font-size: 32px;
                margin-bottom: 12px;
                display: block;
            }

            .stat-card.success i {
                color: var(--success-color);
            }

            .stat-card.error i {
                color: var(--error-color);
            }

            .stat-card.warning i {
                color: var(--warning-color);
            }

            .stat-card.info i {
                color: var(--info-color);
            }

            .stat-card.popbra i {
                color: var(--primary-color);
            }

            .stat-number {
                font-size: 32px;
                font-weight: 700;
                margin-bottom: 8px;
                color: var(--text-light);
            }

            .stat-label {
                color: var(--text-muted);
                font-size: 14px;
                font-weight: 500;
            }

            .form-card {
                background: var(--bg-card);
                backdrop-filter: blur(10px);
                border-radius: 16px;
                padding: 28px;
                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
                margin-bottom: 24px;
                border: 1px solid var(--border-light);
            }

            .form-card h3 {
                margin-bottom: 20px;
                color: var(--primary-color);
                font-size: 20px;
                font-weight: 700;
                display: flex;
                align-items: center;
                gap: 10px;
            }

            /* Buttons */
            .btn {
                padding: 10px 18px;
                border-radius: 10px;
                border: none;
                cursor: pointer;
                font-size: 14px;
                font-weight: 600;
                transition: all 0.3s;
                display: inline-flex;
                align-items: center;
                gap: 8px;
                text-decoration: none;
            }

            .btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
            }

            /* Test Connection Buttons */
            #testTokenBtn:hover, #testDamanBtn:hover {
                background: #E55A00 !important;
                transform: translateY(-2px);
                box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
            }

            /* Test Modal Styles */
            .test-modal-content {
                background: white !important;
                color: #ffffff !important;
                border: 1px solid #e5e7eb !important;
            }

            #testModalBalance {
                background: linear-gradient(135deg, #d1fae5, #a7f3d0) !important;
                color: #065f46 !important;
                border: 1px solid #6ee7b7 !important;
            }

            #testModalStatus {
                background: linear-gradient(135deg, #d1fae5, #a7f3d0) !important;
                color: #065f46 !important;
                border: 1px solid #6ee7b7 !important;
            }

            .test-modal-secondary-bg {
                background: #f9fafb !important;
                border: 1px solid #e5e7eb !important;
            }

            .test-modal-text-primary {
                color: #ffffff !important;
            }

            .test-modal-text-secondary {
                color: #6b7280 !important;
            }

            /* Test Modal Dark Theme Support */
            [data-theme="dark"] .test-modal-content {
                background: var(--bg-primary) !important;
                color: var(--text-primary) !important;
                border: 1px solid var(--border-color) !important;
            }

            [data-theme="dark"] #testModalBalance {
                background: rgba(5, 150, 105, 0.15) !important;
                color: #10b981 !important;
                border: 1px solid rgba(5, 150, 105, 0.3) !important;
            }

            [data-theme="dark"] #testModalStatus {
                background: rgba(5, 150, 105, 0.15) !important;
                color: #10b981 !important;
                border: 1px solid rgba(5, 150, 105, 0.3) !important;
            }

            [data-theme="dark"] .test-modal-secondary-bg {
                background: var(--bg-secondary) !important;
                border: 1px solid var(--border-color) !important;
            }

            [data-theme="dark"] .test-modal-text-primary {
                color: var(--text-primary) !important;
            }

            [data-theme="dark"] .test-modal-text-secondary {
                color: var(--text-secondary) !important;
            }

            /* Save Button Animation - GREEN */
            .save-btn-blue {
                background: linear-gradient(135deg, #10b981, #059669) !important;
                color: white !important;
                animation: pulse-green 2s infinite;
                box-shadow: 0 4px 14px 0 rgba(16, 185, 129, 0.4) !important;
            }

            .save-btn-blue:hover {
                background: linear-gradient(135deg, #059669, #047857) !important;
                transform: translateY(-2px);
                box-shadow: 0 6px 20px 0 rgba(16, 185, 129, 0.5) !important;
            }

            @keyframes pulse-green {
                0% {
                    box-shadow: 0 4px 14px 0 rgba(16, 185, 129, 0.4);
                    transform: scale(1);
                }
                50% {
                    box-shadow: 0 8px 25px 0 rgba(16, 185, 129, 0.6);
                    transform: scale(1.02);
                }
                100% {
                    box-shadow: 0 4px 14px 0 rgba(16, 185, 129, 0.4);
                    transform: scale(1);
                }
            }

            /* Dark theme support for save button warning */
            [data-theme="dark"] .save-btn-blue {
                background: linear-gradient(135deg, #10b981, #059669) !important;
                color: white !important;
            }

            .btn-primary {
                background: var(--gradient-primary);
                color: white;
            }

            .btn-success {
                background: var(--gradient-success);
                color: white;
            }

            .btn-danger {
                background: linear-gradient(135deg, #FF8533, #FF6600);
                color: white;
            }

            .btn-warning {
                background: var(--gradient-warning);
                color: white;
            }

            /* Login Containers */
            .login-options-container {
                display: grid;
                gap: 20px;
                grid-template-columns: 1fr 1fr;
                margin-bottom: 24px;
            }

            /* Desktop: centralizar somente o card do token POPBRA */
            @media (min-width: 769px) {
                .login-options-container #tokenContainer {
                    grid-column: 1 / -1;
                    max-width: 520px;
                    margin-left: auto;
                    margin-right: auto;
                    width: 100%;
                }
            }

            /* Mobile responsivo - stacks verticalmente */
            @media (max-width: 768px) {
                .login-options-container {
                    grid-template-columns: 1fr;
                    gap: 16px; /* Gap menor para mobile */
                }
            }
            
            /* Mobile muito pequeno - gap ainda menor */
            @media (max-width: 480px) {
                .login-options-container {
                    gap: 12px;
                    margin-bottom: 20px;
                }
            }

            .login-container {
                background: var(--bg-card);
                border-radius: 16px;
                border: 2px solid var(--border-dark);
                overflow: hidden;
                transition: all 0.3s ease;
                position: relative;
            }

            .login-container.active {
                border-color: var(--primary-color);
                box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.2);
            }

            .login-container.inactive {
                opacity: 0.6;
                background: var(--bg-darker);
            }

            .login-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 16px 20px;
                background: linear-gradient(135deg, var(--bg-darker), var(--bg-darkest));
                border-bottom: 1px solid var(--border-dark);
            }

            .login-container.active .login-header {
                background: linear-gradient(135deg, rgba(255, 102, 0, 0.1), rgba(255, 102, 0, 0.05));
            }

            .login-title {
                display: flex;
                align-items: center;
                gap: 10px;
                font-weight: 700;
                font-size: 14px;
                color: var(--text-light);
            }

            .login-container.active .login-title {
                color: var(--primary-color);
            }

            .login-title i {
                font-size: 16px;
            }

            .toggle-btn {
                padding: 6px 12px;
                border-radius: 20px;
                border: 1px solid var(--border-dark);
                background: var(--bg-darker);
                color: var(--text-muted);
                font-size: 12px;
                font-weight: 600;
                cursor: pointer;
                transition: all 0.3s ease;
                display: flex;
                align-items: center;
                gap: 6px;
            }

            .toggle-btn:hover {
                border-color: var(--primary-color);
                color: var(--primary-color);
            }

            .toggle-btn.active {
                background: var(--primary-color);
                color: white;
                border-color: var(--primary-color);
            }

            .toggle-btn.active span {
                content: 'Ativo';
            }

            .login-content {
                padding: 20px;
                transition: all 0.3s ease;
            }

            .login-container.inactive .login-content {
                opacity: 0.5;
                pointer-events: none;
            }

            /* Form responsiveness inside containers */
            .login-content .form-group {
                margin-bottom: 16px;
            }

            .login-content label {
                font-weight: 600;
                color: var(--text-muted);
                font-size: 13px;
                display: block;
                margin-bottom: 6px;
            }

            .login-content input {
                width: 100%;
                padding: 10px 12px;
                border: 1px solid var(--border-dark);
                border-radius: 8px;
                font-size: 14px;
                transition: all 0.3s ease;
                box-sizing: border-box;
                background: var(--bg-darker);
                color: var(--text-light);
            }

            .login-content input:focus {
                outline: none;
                border-color: var(--primary-color);
                box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.2);
            }

            /* Status indicators */
            .login-container.active .login-content input {
                border-color: #10b981;
            }

            .login-container.inactive .login-content input {
                background: var(--bg-darkest);
            }

            /* Games Section Styles */
            .games-grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
                gap: 20px;
                margin-bottom: 20px;
            }

            .game-card {
                position: relative;
            }

            .game-card input[type="radio"] {
                display: none;
            }

            .game-label {
                display: block;
                background: var(--bg-card);
                border: 2px solid var(--border-dark);
                border-radius: 16px;
                padding: 20px;
                cursor: pointer;
                transition: all 0.3s ease;
                position: relative;
                overflow: hidden;
            }

            .game-label:hover {
                border-color: #22b96e;
                transform: translateY(-2px);
                box-shadow: 0 8px 25px rgba(34, 185, 110, 0.2);
            }

            .game-card input[type="radio"]:checked + .game-label {
                border-color: #22b96e;
                background: rgba(34, 185, 110, 0.1);
                box-shadow: 0 8px 25px rgba(34, 185, 110, 0.3);
            }

            .game-icon {
                width: 60px;
                height: 60px;
                background: linear-gradient(135deg, #22b96e, #16a085);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-bottom: 16px;
                color: white;
                font-size: 24px;
            }

            .game-card input[type="radio"]:checked + .game-label .game-icon {
                background: linear-gradient(135deg, #16a085, #22b96e);
                animation: pulse 2s infinite;
            }

            @keyframes pulse {
                0%, 100% { transform: scale(1); }
                50% { transform: scale(1.05); }
            }

            .game-info h4 {
                margin: 0 0 8px 0;
                color: var(--text-light);
                font-size: 18px;
                font-weight: 700;
            }

            .game-info p {
                margin: 0;
                color: var(--text-muted);
                font-size: 14px;
                line-height: 1.4;
            }

            .game-status {
                position: absolute;
                top: 15px;
                right: 15px;
                opacity: 0;
                transition: all 0.3s ease;
                color: #22b96e;
                font-size: 18px;
            }

            .game-card input[type="radio"]:checked + .game-label .game-status {
                opacity: 1;
                animation: checkIn 0.5s ease;
            }

            @keyframes checkIn {
                0% { opacity: 0; transform: scale(0); }
                100% { opacity: 1; transform: scale(1); }
            }

            /* Time Periods Styles */
            .time-periods-grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
                gap: 16px;
                margin-bottom: 20px;
            }

            .time-period-card {
                position: relative;
            }

            .time-period-card input[type="radio"] {
                display: none;
            }

            .time-period-label {
                display: block;
                background: var(--bg-card);
                border: 2px solid var(--border-dark);
                border-radius: 12px;
                padding: 16px;
                cursor: pointer;
                transition: all 0.3s ease;
                position: relative;
                text-align: center;
            }

            .time-period-label:hover {
                border-color: #3b82f6;
                transform: translateY(-1px);
                box-shadow: 0 4px 15px rgba(59, 130, 246, 0.2);
            }

            .time-period-card input[type="radio"]:checked + .time-period-label {
                border-color: #3b82f6;
                background: rgba(59, 130, 246, 0.15);
                box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3);
            }

            .period-icon {
                width: 50px;
                height: 50px;
                background: linear-gradient(135deg, #3b82f6, #1d4ed8);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                margin: 0 auto 12px auto;
                color: white;
                font-size: 20px;
            }

            .time-period-card input[type="radio"]:checked + .time-period-label .period-icon {
                background: linear-gradient(135deg, #1d4ed8, #3b82f6);
                animation: pulse 2s infinite;
            }

            .period-info h4 {
                margin: 0 0 6px 0;
                color: var(--text-light);
                font-size: 16px;
                font-weight: 700;
            }

            .period-info p {
                margin: 0;
                color: var(--text-muted);
                font-size: 12px;
                line-height: 1.3;
            }

            .period-status {
                position: absolute;
                top: 10px;
                right: 10px;
                opacity: 0;
                transition: all 0.3s ease;
                color: #3b82f6;
                font-size: 16px;
            }

            .time-period-card input[type="radio"]:checked + .time-period-label .period-status {
                opacity: 1;
                animation: checkIn 0.5s ease;
            }

            /* Responsive Design */
            @media (max-width: 768px) {
                .games-grid {
                    grid-template-columns: 1fr;
                    gap: 16px;
                }

                .time-periods-grid {
                    grid-template-columns: 1fr;
                    gap: 12px;
                }

                .game-label {
                    padding: 16px;
                }

                .game-icon {
                    width: 50px;
                    height: 50px;
                    font-size: 20px;
                }

                .period-icon {
                    width: 40px;
                    height: 40px;
                    font-size: 16px;
                }
            }

            /* Active Entries */
            .active-entries {
                background: linear-gradient(135deg, #5791fd, #0003ca);
                padding: 20px;
                border-radius: 16px;
                margin-bottom: 24px;
                border: 1px solid #22b96e;
            }

            .active-entries h4 {
                margin-bottom: 16px;
                display: flex;
                align-items: center;
                gap: 8px;
                font-size: 18px;
                color: #ffffff;
                font-weight: 700;
            }

            .entry-item {
                position: relative;
                background: var(--bg-card);
                padding: 20px;
                border-radius: 16px;
                margin-bottom: 16px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
                transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
                overflow: hidden;
                border: none;
            }

            .entry-item::before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: linear-gradient(135deg, rgba(255, 102, 0, 0.05) 0%, transparent 50%, rgba(255, 102, 0, 0.05) 100%);
                z-index: 1;
            }

            /* Efeito de Scanline Tecnológica */
            .entry-item::after {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.1) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.02), rgba(0, 255, 0, 0.01), rgba(0, 0, 255, 0.02));
                background-size: 100% 3px, 3px 100%;
                pointer-events: none;
                z-index: 2;
                opacity: 0.3;
            }

            /* Borda Neon Suave e Elegante */
            .entry-item-border {
                position: absolute;
                inset: 0;
                border-radius: 16px;
                padding: 1px; /* Espessura da borda */
                background: linear-gradient(90deg, transparent, var(--primary-color), transparent, var(--primary-color), transparent);
                background-size: 200% 100%;
                mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
                -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
                mask-composite: exclude;
                -webkit-mask-composite: xor;
                animation: neon-flow 6s linear infinite;
                z-index: 1;
                opacity: 0.6;
            }

            @keyframes neon-flow {
                0% { background-position: 0% 50%; }
                100% { background-position: 200% 50%; }
            }

            .entry-item-content {
                position: relative;
                width: 100%;
                height: 100%;
                display: flex;
                justify-content: space-between;
                align-items: center;
                z-index: 3;
            }

            /* Garantir que o conteúdo fique sobre o efeito de borda */
            .entry-info, .entry-move, .entry-timer {
                position: relative;
                z-index: 2;
            }

            .entry-item:hover {
                transform: translateY(-5px) scale(1.02);
                box-shadow: 0 15px 40px rgba(255, 102, 0, 0.2);
            }

            .active-entries-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-bottom: 15px;
                padding-right: 5px;
            }

            .active-entries h4 {
                margin-bottom: 0 !important;
            }

            .entry-timer {
                color: #fff;
                padding: 0;
                font-size: 16px;
                font-weight: 800;
                font-family: 'Inter', sans-serif;
                display: flex;
                align-items: center;
                gap: 8px;
                z-index: 10;
            }

            .entry-timer svg {
                width: 14px;
                height: 14px;
                fill: var(--primary-color);
            }

            @keyframes rotate-border {
                from { transform: rotate(0deg); }
                to { transform: rotate(360deg); }
            }

            /* NOVO - Estilos para status de reconexão */
            .entry-reconnecting {
                background: rgba(255, 193, 7, 0.1) !important;
            }

            .entry-reconnecting::before {
                background: conic-gradient(from 0deg, transparent, orange, gold, orange, transparent);
            }

            .entry-error::before {
                background: conic-gradient(from 0deg, transparent, red, #ff4444, red, transparent);
            }

            .entry-error {
                background: rgba(220, 53, 69, 0.1) !important;
            }
            
            /* Animação de piscada para status de reconexão */
            @keyframes blink {
                0%, 50% { opacity: 1; }
                51%, 100% { opacity: 0.3; }
            }

            /* Login Status Section */
            .login-status {
                background: var(--bg-darker);
                padding: 14px 18px;
                border-radius: 12px;
                margin-bottom: 20px;
                display: flex;
                align-items: center;
                justify-content: space-between;
                border: 1px solid var(--border-dark);
            }

            .login-status.connected {
                background: rgba(16, 185, 129, 0.15);
                border-color: #10b981;
            }

            .login-status.disconnected {
                background: rgba(220, 38, 38, 0.15);
                border-color: #dc2626;
            }

            /* Modal */
            .modal {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0.5);
                z-index: 1000;
                display: none;
                align-items: center;
                justify-content: center;
                padding: 20px;
                backdrop-filter: blur(4px);
            }

            .modal.active {
                display: flex;
            }

            .modal-content {
                background: var(--bg-darker);
                border: 1px solid var(--border-dark);
                border-radius: 20px;
                padding: 32px;
                max-width: 480px;
                width: 100%;
                max-height: 85vh;
                overflow-y: auto;
                box-shadow: 0 25px 60px rgba(0, 0, 0, 0.5);
            }

            .modal-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-bottom: 24px;
                padding-bottom: 16px;
                border-bottom: 1px solid var(--border-light);
            }

            .modal-close {
                background: none;
                border: none;
                font-size: 24px;
                cursor: pointer;
                color: #9ca3af;
                padding: 4px;
                border-radius: 8px;
                transition: all 0.3s;
            }

            .modal-close:hover {
                background: var(--bg-card-hover);
                color: var(--text-light);
            }

            /* Confirmation Modal */
            .confirm-modal-overlay {
                display: none;
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0.6);
                backdrop-filter: blur(4px);
                z-index: 10000;
                animation: fadeIn 0.3s ease;
            }

            .confirm-modal-overlay.active {
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .confirm-modal-content {
                background: var(--bg-card);
                border-radius: 20px;
                padding: 32px;
                max-width: 440px;
                width: 90%;
                box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
                animation: slideUp 0.3s ease;
                text-align: center;
                border: 1px solid var(--border-dark);
            }

            @keyframes slideUp {
                from {
                    opacity: 0;
                    transform: translateY(20px);
                }
                to {
                    opacity: 1;
                    transform: translateY(0);
                }
            }

            .confirm-modal-icon {
                width: 80px;
                height: 80px;
                margin: 0 auto 20px;
                background: linear-gradient(135deg, #f59e0b, #fbbf24);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 40px;
                color: white;
                box-shadow: 0 8px 20px rgba(245, 158, 11, 0.3);
            }

            .confirm-modal-title {
                font-size: 24px;
                font-weight: 700;
                color: var(--text-light);
                margin-bottom: 12px;
            }

            .confirm-modal-message {
                font-size: 16px;
                color: var(--text-muted);
                margin-bottom: 28px;
                line-height: 1.5;
            }

            .confirm-modal-buttons {
                display: flex;
                gap: 12px;
                justify-content: center;
            }

            .confirm-btn {
                padding: 14px 28px;
                border-radius: 12px;
                border: none;
                font-size: 15px;
                font-weight: 600;
                cursor: pointer;
                transition: all 0.3s;
                min-width: 120px;
            }

            .confirm-btn-save {
                background: linear-gradient(135deg, #FF6600, #FF8533);
                color: white;
                box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
            }

            .confirm-btn-save:hover {
                transform: translateY(-2px);
                box-shadow: 0 6px 16px rgba(220, 38, 38, 0.4);
            }

            .confirm-btn-discard {
                background: var(--bg-darker);
                color: var(--text-muted);
            }

            .confirm-btn-discard:hover {
                background: var(--bg-card-hover);
                color: var(--text-light);
            }

            .confirm-btn-cancel {
                background: var(--bg-darker);
                color: var(--text-muted);
                border: 2px solid var(--border-dark);
            }

            .confirm-btn-cancel:hover {
                border-color: var(--primary-color);
                color: var(--text-light);
            }

            [data-theme="dark"] .confirm-modal-content {
                background: #1f2937;
            }

            [data-theme="dark"] .confirm-modal-title {
                color: #f9fafb;
            }

            [data-theme="dark"] .confirm-modal-message {
                color: #9ca3af;
            }

            [data-theme="dark"] .confirm-btn-discard {
                background: #374151;
                color: #9ca3af;
            }

            [data-theme="dark"] .confirm-btn-discard:hover {
                background: #4b5563;
                color: #f9fafb;
            }

            [data-theme="dark"] .confirm-btn-cancel {
                background: #1f2937;
                border-color: #4b5563;
                color: #9ca3af;
            }

            [data-theme="dark"] .confirm-btn-cancel:hover {
                border-color: #6b7280;
                color: #f9fafb;
            }

            /* Results */
            .results-container {
                max-height: 600px;
                overflow-y: auto;
                background: var(--bg-darker);
                border-radius: 12px;
                padding: 16px;
                border: 1px solid var(--border-dark);
            }

            .result-item {
                background: var(--bg-card);
                padding: 16px;
                margin-bottom: 12px;
                border-radius: 12px;
                border-left: 4px solid var(--border-dark);
                display: flex;
                justify-content: space-between;
                align-items: center;
                transition: all 0.3s;
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
            }

            .result-item.win {
                border-left-color: var(--success-color);
            }

            .result-item.loss {
                border-left-color: var(--error-color);
            }

            .result-item.pending {
                border-left-color: var(--warning-color);
            }

            /* Content sections */
            .content-section {
                display: none;
                animation: fadeIn 0.4s ease;
            }

            .content-section.active {
                display: block;
            }

            @keyframes fadeIn {
                from { opacity: 0; transform: translateY(10px); }
                to { opacity: 1; transform: translateY(0); }
            }

            /* Mobile */
            .mobile-header {
                display: none;
                padding: 12px 16px;
                background: var(--bg-card);
                backdrop-filter: blur(20px);
                border-bottom: 1px solid var(--border-dark);
                align-items: center;
                justify-content: space-between;
                box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                z-index: 90;
                height: 56px;
            }

            /* DESKTOP - SIDEBAR SEMPRE VISÍVEL */
            @media (min-width: 769px) {
                .sidebar {
                    left: 0;
                    position: fixed;
                    width: 280px;
                    height: 100vh;
                    box-shadow: none;
                    border-right: 1px solid var(--border-dark);
                }

                .overlay {
                    display: none !important;
                }

                .main-content {
                    margin-left: 280px;
                }
                
                .mobile-header {
                    display: none;
                }
            }

            /* MOBILE RESPONSIVO PARA NOVA SIDEBAR */
            @media (max-width: 768px) {
                .sidebar {
                    left: -100%;
                    width: 85%;
                    max-width: 300px;
                }

                .sidebar.open {
                    left: 0;
                }

                .main-content {
                    margin-left: 0;
                    padding: 16px;
                    padding-top: 72px;
                    max-width: 100vw;
                    overflow-x: hidden;
                    box-sizing: border-box;
                }

                .mobile-header {
                    display: flex;
                }

                .stats-grid {
                    grid-template-columns: 1fr;
                    gap: 12px;
                }

                .stat-card {
                    padding: 20px;
                }

                .form-card {
                    padding: 20px;
                    max-width: 100%;
                    overflow-x: hidden;
                    box-sizing: border-box;
                }

                .content-section {
                    padding: 0;
                    margin: 0;
                    max-width: 100%;
                    overflow-x: hidden;
                    box-sizing: border-box;
                }

                .page-header {
                    margin-left: 0;
                    margin-right: 0;
                    padding-left: 0;
                    padding-right: 0;
                }

                /* Estratégias - Corrigir alinhamento em mobile */
                .strategy-accordion {
                    margin-left: 0;
                    margin-right: 0;
                    width: 100%;
                    max-width: 100%;
                    overflow-x: hidden;
                    box-sizing: border-box;
                }

                .accordion-header {
                    padding: 16px;
                    box-sizing: border-box;
                }

                .accordion-title {
                    font-size: 16px;
                }

                .accordion-body {
                    padding: 16px;
                    box-sizing: border-box;
                    overflow-x: hidden;
                }

                .pattern-buttons-container {
                    flex-direction: row;
                    gap: 0;
                }

                .btn-pattern {
                    font-size: 14px;
                    padding: 12px 16px;
                }

                .pattern-builder-section {
                    padding: 16px;
                    max-width: 100%;
                    overflow-x: hidden;
                    box-sizing: border-box;
                }

                .items-grid {
                    grid-template-columns: 1fr !important;
                    gap: 16px;
                    width: 100%;
                    max-width: 100%;
                    overflow-x: hidden;
                }

                .item-card {
                    width: 100%;
                    max-width: 100%;
                }
            }

            /* Notification Toast */
            .notification {
                position: fixed;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                padding: 8px 16px;
                border-radius: 6px;
                color: white;
                z-index: 9999;
                min-width: 200px;
                max-width: 320px;
                text-align: center;
                animation: fadeInScale 0.3s ease;
                font-size: 13px;
                font-weight: 500;
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
                backdrop-filter: blur(4px);
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            .notification.success {
                background: var(--gradient-success);
            }

            .notification.error {
                background: var(--gradient-primary);
            }

            .notification.warning {
                background: var(--gradient-warning);
            }

            @keyframes fadeInScale {
                0% { 
                    opacity: 0; 
                    transform: translate(-50%, -50%) scale(0.8);
                }
                100% { 
                    opacity: 1; 
                    transform: translate(-50%, -50%) scale(1);
                }
            }

            @keyframes fadeOutScale {
                0% { 
                    opacity: 1; 
                    transform: translate(-50%, -50%) scale(1);
                }
                100% { 
                    opacity: 0; 
                    transform: translate(-50%, -50%) scale(0.8);
                }
            }

            .notification.fade-out {
                animation: fadeOutScale 0.3s ease forwards;
            }

            @keyframes slideIn {
                from { transform: translateX(100%); opacity: 0; }
                to { transform: translateX(0); opacity: 1; }
            }

            @keyframes slideInFromRight {
                from { transform: translateX(100%); opacity: 0; }
                to { transform: translateX(0); opacity: 1; }
            }

            /* Game colors preview */
            .color-preview {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                font-size: 20px;
                margin: 0 4px;
            }

            .gale-values {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
                gap: 15px;
                margin-top: 20px;
            }

            .gale-input {
                display: flex;
                flex-direction: column;
                gap: 8px;
            }

            .gale-input label {
                font-weight: 600;
                color: var(--text-muted);
                font-size: 14px;
            }

            .gale-input select,
            .gale-input input {
                padding: 12px;
                border: 2px solid var(--border-dark);
                border-radius: 10px;
                font-size: 14px;
                background: var(--bg-darker);
                color: var(--text-light);
                transition: all 0.3s;
                cursor: pointer;
            }

            .gale-input select:hover,
            .gale-input input:hover {
                border-color: var(--border-light);
            }

            .gale-input select:focus,
            .gale-input input:focus {
                border-color: var(--primary-color);
                outline: none;
                box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.2);
            }

            .gale-input select option {
                padding: 10px;
                background: var(--bg-darker);
                color: var(--text-light);
            }

            /* Loading spinner */
            .spinner {
                display: inline-block;
                width: 16px;
                height: 16px;
                border: 2px solid rgba(255, 255, 255, 0.3);
                border-radius: 50%;
                border-top-color: white;
                animation: spin 0.8s linear infinite;
            }

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

            /* Strategy content */
            .strategy-content {
                width: 100%;
                height: 350px;
                padding: 14px;
                border: 2px solid var(--border-dark);
                border-radius: 12px;
                font-family: 'Courier New', monospace;
                font-size: 13px;
                resize: vertical;
                background: var(--bg-darker);
                color: var(--text-light);
            }

            .strategy-content:focus {
                border-color: var(--primary-color);
                box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.2);
            }

            /* Items grid */
            .items-grid {
                display: grid;
                grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
                gap: 20px;
                width: 100%;
                overflow: visible !important;
                max-height: none !important;
                height: auto !important;
            }

            /* Mobile - ajustar para telas pequenas */
            @media (max-width: 640px) {
                .items-grid {
                    grid-template-columns: 1fr;
                }
            }

            .item-card {
                background: var(--bg-card);
                border-radius: 16px;
                overflow: hidden;
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
                border: 1px solid var(--border-dark);
                transition: all 0.3s;
            }

            .item-card:hover {
                transform: translateY(-4px);
                box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
            }

            .item-header {
                padding: 16px;
                background: var(--gradient-primary);
                color: white;
                display: flex;
                justify-content: space-between;
                align-items: center;
            }

            .item-info {
                padding: 16px;
            }

            .item-actions {
                padding: 16px;
                display: flex;
                flex-wrap: wrap;
                gap: 8px;
                border-top: 1px solid var(--border-dark);
                background: var(--bg-darker);
            }

            .item-actions .btn {
                flex: 1 1 auto;
                min-width: 0;
                justify-content: center;
                font-size: 13px;
                padding: 8px 10px;
                white-space: nowrap;
            }

            /* Responsividade para botões no mobile */
            @media (max-width: 768px) {
                .item-actions {
                    flex-wrap: wrap;
                    gap: 6px;
                    padding: 12px;
                }

                .item-actions .btn {
                    flex: 1 1 calc(50% - 3px); /* 2 botões por linha */
                    min-width: 0;
                    font-size: 11px;
                    padding: 8px 6px;
                    white-space: nowrap;
                }

                /* Reduzir padding em tablets */
                .form-card {
                    padding: 20px;
                }

                .accordion-body {
                    padding: 16px;
                }
            }

            @media (max-width: 480px) {
                .item-actions .btn {
                    font-size: 10px;
                    padding: 6px 4px;
                }

                .item-actions .btn i {
                    font-size: 10px;
                }

                /* Reduzir padding excessivo no mobile */
                .form-card {
                    padding: 16px;
                    margin-bottom: 16px;
                }

                .accordion-body {
                    padding: 12px;
                }

                .item-header {
                    padding: 12px;
                }

                .item-info {
                    padding: 12px;
                }

                .item-actions {
                    padding: 10px;
                }
            }

            /* Status badges */
            .status-badge {
                padding: 4px 12px;
                border-radius: 20px;
                font-size: 12px;
                font-weight: 600;
                background: rgba(255, 255, 255, 0.2);
            }

            .status-active {
                background: rgba(255, 255, 255, 0.9) !important;
                color: var(--success-color);
            }

            .status-inactive {
                background: rgba(255, 255, 255, 0.9) !important;
                color: #6b7280;
            }

            /* Forçar esconder carteira quando premium ativo */
            body.premium-active .wallet-section {
                display: none !important;
            }

            body.premium-active #walletMenuItem {
                display: none !important;
            }

            /* Mostrar seção premium quando ativo */
            body.premium-active .premium-sidebar-section {
                display: block !important;
            }

            /* PIX section */
            .pix-section {
                text-align: center;
                padding: 20px;
                background: var(--bg-darker);
                border-radius: 12px;
                margin: 20px 0;
                border: 1px solid var(--border-dark);
            }

            .qr-code {
                width: 200px;
                height: 200px;
                margin: 20px auto;
                border: 2px solid var(--border-dark);
                border-radius: 12px;
                background: var(--bg-card);
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 48px;
                color: var(--text-muted);
            }

            .pix-code {
                background: var(--bg-card);
                padding: 16px;
                border-radius: 8px;
                font-family: monospace;
                font-size: 12px;
                word-break: break-all;
                margin: 16px 0;
                border: 1px solid var(--border-dark);
                user-select: all;
                -webkit-user-select: all;
                color: var(--text-light);
            }

            .copy-btn {
                background: var(--gradient-primary);
                color: white;
                border: none;
                padding: 12px 20px;
                border-radius: 8px;
                cursor: pointer;
                font-weight: 600;
                transition: all 0.3s;
                font-size: 14px;
                display: inline-flex;
                align-items: center;
                gap: 8px;
            }

            .copy-btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
            }

            /* Messages */
            .message {
                padding: 14px 18px;
                border-radius: 10px;
                margin-bottom: 16px;
                display: flex;
                align-items: center;
                gap: 10px;
                font-size: 14px;
                font-weight: 500;
            }

            .message-success {
                background: rgba(16, 185, 129, 0.15);
                color: #10b981;
                border: 1px solid rgba(16, 185, 129, 0.3);
            }

            .message-error {
                background: rgba(220, 38, 38, 0.15);
                color: #f87171;
                border: 1px solid rgba(220, 38, 38, 0.3);
            }

            .message-info {
                background: rgba(59, 130, 246, 0.15);
                color: #60a5fa;
                border: 1px solid rgba(59, 130, 246, 0.3);
            }

            /* Page header */
            .page-header {
                margin-bottom: 24px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                flex-wrap: wrap;
                gap: 16px;
            }

            .page-header h1 {
                display: flex;
                align-items: center;
                gap: 12px;
                color: var(--text-light);
                font-size: 28px;
                font-weight: 700;
            }

            .page-header p {
                color: var(--text-muted);
                font-size: 15px;
            }

            /* Form elements */
            .form-row {
                display: flex;
                gap: 12px;
            }

            .form-row .form-group {
                flex: 1;
            }

            /* Result details */
            .result-info {
                flex: 1;
            }

            .result-period {
                font-weight: 700;
                font-size: 16px;
                color: var(--text-light);
            }

            .result-strategy {
                color: var(--text-muted);
                font-size: 13px;
                margin-top: 4px;
            }

            .result-profit {
                font-size: 15px;
                font-weight: 700;
                margin-top: 8px;
            }

            .result-profit.positive {
                color: var(--success-color);
            }

            .result-profit.negative {
                color: var(--error-color);
            }

            .result-status {
                font-size: 28px;
                margin-left: 12px;
            }

            /* Entry details */
            .entry-info {
                flex: 1;
            }

            .entry-period {
                font-weight: 700;
                font-size: 18px;
                color: var(--primary-color);
            }

            .entry-move {
                font-size: 28px;
                margin-left: 12px;
            }

            .entry-bet {
                font-size: 13px;
                color: var(--text-muted);
                margin-top: 4px;
            }

            /* Reset button */
            .reset-btn {
                position: absolute;
                top: 12px;
                right: 12px;
                background: rgba(220, 38, 38, 0.1);
                color: var(--primary-color);
                border: none;
                padding: 6px 8px;
                border-radius: 6px;
                font-size: 11px;
                cursor: pointer;
                transition: all 0.3s;
            }

            .reset-btn:hover {
                background: rgba(220, 38, 38, 0.2);
            }

            /* Auth toggle */
            .auth-toggle {
                color: var(--primary-color);
                text-decoration: none;
                font-weight: 600;
                transition: all 0.3s;
                font-size: 14px;
            }

            .auth-toggle:hover {
                color: var(--secondary-color);
                text-decoration: underline;
            }

            /* OVERLAY NOVO - SIMPLES E FUNCIONAL */
            .overlay {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0.5);
                z-index: 1400;
                display: none;
            }

            .overlay.show {
                display: block;
            }

            /* Mobile specific */
            .mobile-menu-btn {
                background: none;
                border: none;
                color: var(--text-light);
                font-size: 20px;
                cursor: pointer;
                padding: 6px;
            }

            .mobile-header h2 {
                font-size: 16px;
                margin: 0;
                color: var(--primary-color);
                font-weight: 700;
            }

            .mobile-header-right {
                display: flex;
                align-items: center;
                gap: 12px;
            }

            .mobile-notifications {
                position: relative;
                background: none;
                border: none;
                color: var(--text-light);
                cursor: pointer;
                padding: 6px;
                border-radius: 50%;
                width: 40px;
                height: 40px;
                display: flex;
                align-items: center;
                justify-content: center;
                transition: all 0.3s;
            }

            .mobile-notifications:hover {
                background: var(--bg-card-hover);
            }

            .mobile-notifications-badge {
                position: absolute;
                top: 0;
                right: 0;
                background: var(--primary-color);
                color: white;
                border-radius: 50%;
                width: 20px;
                height: 20px;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 11px;
                font-weight: bold;
            }

            /* Notification modal */
            .notification-modal {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0.8);
                z-index: 3000;
                display: none;
                align-items: center;
                justify-content: center;
                padding: 20px;
            }

            .notification-modal.active {
                display: flex;
            }

            .notification-modal-content {
                background: var(--bg-card);
                border-radius: 20px;
                padding: 28px;
                max-width: 600px;
                width: 100%;
                max-height: 80vh;
                overflow-y: auto;
                border: 1px solid var(--border-dark);
            }
            /* Token Guide Styles */
            .token-guide {
                background: var(--bg-card);
                border-radius: 16px;
                padding: 24px;
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
                border: 1px solid var(--border-dark);
            }

            .token-guide-header {
                display: flex;
                align-items: center;
                gap: 12px;
                margin-bottom: 20px;
                padding-bottom: 16px;
                border-bottom: 2px solid var(--border-dark);
            }

            .token-guide-steps {
                counter-reset: step-counter;
            }

            .token-guide-step {
                counter-increment: step-counter;
                position: relative;
                padding: 16px 0 16px 60px;
                border-left: 2px solid var(--border-dark);
                margin-left: 20px;
            }

            .token-guide-step:last-child {
                border-left: none;
            }

            .token-guide-step::before {
                content: counter(step-counter);
                position: absolute;
                left: -11px;
                top: 16px;
                background: var(--primary-color);
                color: white;
                width: 22px;
                height: 22px;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 12px;
                font-weight: 700;
            }

            .token-guide-step-content {
                background: var(--bg-darker);
                padding: 12px 16px;
                border-radius: 8px;
                border-left: 4px solid var(--primary-color);
            }

            .token-guide-step-title {
                font-weight: 600;
                color: var(--text-light);
                margin-bottom: 6px;
                font-size: 14px;
            }

            .token-guide-step-text {
                color: var(--text-muted);
                font-size: 13px;
                line-height: 1.5;
            }

            .token-guide-highlight {
                background: rgba(255, 102, 0, 0.2);
                color: var(--primary-color);
                padding: 2px 6px;
                border-radius: 4px;
                font-weight: 600;
            }

            .token-guide-warning {
                background: rgba(255, 102, 0, 0.15);
                border: 1px solid rgba(255, 102, 0, 0.3);
                padding: 16px;
                border-radius: 10px;
                margin-top: 20px;
            }

            .token-guide-warning-title {
                display: flex;
                align-items: center;
                gap: 8px;
                color: var(--primary-color);
                font-weight: 700;
                margin-bottom: 8px;
                font-size: 14px;
            }

            .token-guide-warning-text {
                color: var(--text-muted);
                font-size: 13px;
                line-height: 1.6;
            }

            /* Close guide button */
            .close-guide-btn {
                position: absolute;
                top: 16px;
                right: 16px;
                background: none;
                border: none;
                color: var(--text-muted);
                cursor: pointer;
                padding: 4px;
                border-radius: 6px;
                transition: all 0.3s;
            }

            .close-guide-btn:hover {
                background: var(--bg-card-hover);
                color: var(--text-light);
            }

            /* Custom scrollbar */
            ::-webkit-scrollbar {
                width: 8px;
                height: 8px;
            }

            ::-webkit-scrollbar-track {
                background: var(--bg-darkest);
            }

            ::-webkit-scrollbar-thumb {
                background: var(--bg-card-hover);
                border-radius: 4px;
            }

            ::-webkit-scrollbar-thumb:hover {
                background: var(--primary-color);
            }

            /* Premium Badge */
            .premium-badge {
                background: var(--gradient-premium);
                color: #2f3542;
                padding: 4px 12px;
                border-radius: 20px;
                font-size: 11px;
                font-weight: 700;
                display: inline-flex;
                align-items: center;
                gap: 4px;
                text-transform: uppercase;
                letter-spacing: 0.5px;
                box-shadow: 0 2px 8px rgba(255, 215, 0, 0.3);
            }

            .premium-section {
                background: var(--gradient-premium);
                color: #2f3542;
                padding: 20px;
                border-radius: 16px;
                text-align: center;
                box-shadow: 0 4px 20px rgba(255, 215, 0, 0.3);
                border: 2px solid #ffb700;
            }

            .premium-header {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                margin-bottom: 12px;
                font-weight: 700;
                font-size: 16px;
            }

            .premium-status {
                font-size: 24px;
                font-weight: 700;
                margin-bottom: 8px;
            }

            .premium-expiry {
                font-size: 12px;
                opacity: 0.8;
                margin-top: 8px;
            }

            /* Premium Section in Sidebar */
            .premium-sidebar-section {
                margin: 15px;
                padding: 16px;
                background: var(--gradient-premium);
                border-radius: 12px;
                text-align: center;
                border: 2px solid #ffb700;
                color: #2f3542;
            }

            .premium-sidebar-header {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                margin-bottom: 12px;
                font-weight: 700;
                font-size: 14px;
            }

            .premium-sidebar-status {
                font-size: 16px;
                font-weight: 700;
                margin-bottom: 8px;
            }

            .premium-sidebar-expiry {
                font-size: 11px;
                opacity: 0.8;
                margin-top: 8px;
            }

            /* Subscription Modal */
            .subscription-modal {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0.8);
                z-index: 3000;
                display: none;
                align-items: center;
                justify-content: center;
                padding: 20px;
                backdrop-filter: blur(4px);
            }

            .subscription-modal.active {
                display: flex;
            }

            .subscription-modal-content {
                background: var(--bg-card);
                border-radius: 20px;
                padding: 32px;
                max-width: 500px;
                width: 100%;
                max-height: 85vh;
                overflow-y: auto;
                box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
                border: 1px solid var(--border-dark);
            }

            .subscription-header {
                text-align: center;
                margin-bottom: 24px;
            }

            .subscription-price {
                font-size: 48px;
                font-weight: 700;
                color: var(--premium-color);
                margin: 16px 0;
            }

            .subscription-features {
                background: rgba(255, 215, 0, 0.1);
                padding: 20px;
                border-radius: 12px;
                margin: 20px 0;
                border: 1px solid rgba(255, 215, 0, 0.3);
            }

            .subscription-feature {
                display: flex;
                align-items: center;
                gap: 12px;
                margin-bottom: 12px;
                color: var(--text-light);
            }

            .subscription-feature:last-child {
                margin-bottom: 0;
            }

            .subscription-feature i {
                color: var(--premium-color);
                width: 20px;
                text-align: center;
            }

            .btn-premium {
                background: var(--gradient-premium);
                color: #2f3542;
                font-weight: 700;
            }

            .status-premium {
                background: rgba(255, 215, 0, 0.2) !important;
                color: var(--premium-color);
                border: 1px solid var(--premium-color);
            }

            .stat-card.premium i {
                color: var(--premium-color);
            }

            .status-indicator.premium {
                border-color: var(--premium-color);
                color: var(--premium-color);
                background: rgba(255, 215, 0, 0.1);
            }

            /* Metrics Styles */
            .metrics-stat-item {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 12px 16px;
                background: rgba(255, 71, 87, 0.1);
                border-radius: 8px;
                border-left: 4px solid var(--primary-color);
            }

            .metrics-stat-label {
                font-size: 13px;
                color: #a5a8b6;
                font-weight: 500;
            }

            .metrics-stat-value {
                font-size: 16px;
                font-weight: 700;
                color: var(--primary-color);
            }

            .metrics-chart-container {
                position: relative;
                height: 300px;
                padding: 16px;
            }
            /* Chart containers */
            .form-card canvas {
                background: rgba(47, 53, 66, 0.3);
                border-radius: 8px;
            }

            /* Loading state for charts */
            .chart-loading {
                display: flex;
                align-items: center;
                justify-content: center;
                height: 300px;
                color: #a4b0be;
                font-size: 16px;
            }

            .chart-loading i {
                margin-right: 8px;
                animation: spin 1s linear infinite;
            }

            @keyframes spin {
                0% { transform: rotate(0deg); }
                100% { transform: rotate(360deg); }
            }

            /* ============================================================================
            SMART ENTRY - ENTRADAS INTELIGENTES
            ============================================================================ */

            .smart-entry-container {
                background: var(--bg-card);
                border: 2px solid var(--border-dark);
                border-radius: 16px;
                padding: 24px;
                margin-bottom: 24px;
                position: relative;
                overflow: hidden;
            }

            .smart-entry-container::before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                height: 4px;
                background: linear-gradient(135deg, #3b82f6, #1d4ed8);
            }

            .smart-entry-header {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-bottom: 20px;
                padding-bottom: 16px;
                border-bottom: 1px solid var(--border-dark);
            }

            .smart-entry-title {
                display: flex;
                align-items: center;
                gap: 12px;
                font-size: 18px;
                font-weight: 700;
                color: var(--text-light);
            }

            .smart-entry-title i {
                font-size: 20px;
                color: #3b82f6;
            }

            /* Toggle Switch Moderno */
            .smart-entry-toggle {
                position: relative;
                display: inline-block;
            }

            .smart-entry-checkbox {
                opacity: 0;
                width: 0;
                height: 0;
            }

            .smart-entry-slider {
                position: relative;
                display: inline-block;
                width: 60px;
                height: 28px;
                background: var(--bg-darker);
                border-radius: 14px;
                cursor: pointer;
                transition: all 0.3s ease;
                box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.3);
            }

            .smart-entry-slider::before {
                content: '';
                position: absolute;
                height: 22px;
                width: 22px;
                left: 3px;
                top: 3px;
                background: var(--text-muted);
                border-radius: 50%;
                transition: all 0.3s ease;
                box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
            }

            .smart-entry-checkbox:checked + .smart-entry-slider {
                background: linear-gradient(135deg, #3b82f6, #1d4ed8);
            }

            .smart-entry-checkbox:checked + .smart-entry-slider::before {
                transform: translateX(32px);
                box-shadow: 0 2px 8px rgba(59, 130, 246, 0.4);
            }

            .smart-entry-label {
                display: flex;
                align-items: center;
                gap: 12px;
                font-weight: 600;
                color: var(--text-muted);
                cursor: pointer;
                user-select: none;
            }

            /* Como Funciona Box */
            .smart-entry-info {
                background: rgba(59, 130, 246, 0.1);
                border: 1px solid rgba(59, 130, 246, 0.3);
                border-radius: 12px;
                padding: 18px;
                margin-bottom: 20px;
            }

            .smart-entry-info-header {
                display: flex;
                align-items: center;
                gap: 8px;
                margin-bottom: 12px;
                font-weight: 700;
                color: #60a5fa;
                font-size: 15px;
            }

            .smart-entry-info-content {
                color: var(--text-muted);
                font-size: 13px;
                line-height: 1.6;
            }

            .smart-entry-info-content strong {
                color: #60a5fa;
            }

            /* Opções de Configuração */
            .smart-entry-options {
                background: var(--bg-darker);
                border-radius: 12px;
                padding: 20px;
                border: 1px solid var(--border-dark);
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
            }

            .smart-entry-controls {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 20px;
                margin-bottom: 20px;
            }

            .smart-entry-control {
                display: flex;
                flex-direction: column;
                gap: 8px;
            }

            .smart-entry-control-label {
                font-weight: 600;
                color: var(--text-muted);
                font-size: 14px;
                display: flex;
                align-items: center;
                gap: 6px;
            }

            .smart-entry-select {
                padding: 10px 14px;
                border: 2px solid var(--border-dark);
                border-radius: 8px;
                font-size: 14px;
                background: var(--bg-card);
                color: var(--text-light);
                transition: all 0.3s ease;
                cursor: pointer;
            }

            .smart-entry-select:focus {
                outline: none;
                border-color: #3b82f6;
                box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
            }

            .smart-entry-select:hover {
                border-color: var(--border-light);
            }

            /* Preview da Configuração */
            .smart-entry-preview {
                background: var(--bg-darker);
                border: 1px solid var(--border-dark);
                border-radius: 10px;
                padding: 16px;
                margin-top: 16px;
            }

            .smart-entry-preview-header {
                display: flex;
                align-items: center;
                gap: 8px;
                margin-bottom: 12px;
                font-weight: 600;
                color: var(--text-muted);
                font-size: 14px;
            }

            .smart-entry-preview-content {
                color: var(--text-muted);
                font-size: 13px;
                line-height: 1.5;
            }

            .smart-entry-preview-content strong {
                color: var(--text-light);
            }

            /* Exemplo Prático */
            .smart-entry-example {
                background: rgba(16, 185, 129, 0.1);
                border: 1px solid rgba(16, 185, 129, 0.3);
                border-radius: 10px;
                padding: 16px;
                margin-top: 16px;
            }

            .smart-entry-example-header {
                display: flex;
                align-items: center;
                gap: 8px;
                margin-bottom: 12px;
                font-weight: 600;
                color: #10b981;
                font-size: 14px;
            }

            .smart-entry-example-content {
                color: var(--text-muted);
                font-size: 13px;
                line-height: 1.6;
            }

            .smart-entry-example-content strong {
                color: #10b981;
            }

            /* Status Badges */
            .smart-entry-status {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                padding: 4px 12px;
                border-radius: 20px;
                font-size: 12px;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: 0.5px;
            }

            .smart-entry-status.active {
                background: linear-gradient(135deg, #10b981, #059669);
                color: white;
            }

            .smart-entry-status.inactive {
                background: #f1f5f9;
                color: #64748b;
                border: 1px solid #e2e8f0;
            }

            /* Animações */
            .smart-entry-fade-in {
                animation: smartEntryFadeIn 0.4s ease;
            }

            @keyframes smartEntryFadeIn {
                from {
                    opacity: 0;
                    transform: translateY(-10px);
                }
                to {
                    opacity: 1;
                    transform: translateY(0);
                }
            }

            /* Responsivo */
            @media (max-width: 768px) {
                .smart-entry-controls {
                    grid-template-columns: 1fr;
                    gap: 16px;
                }
                
                .smart-entry-header {
                    flex-direction: column;
                    align-items: flex-start;
                    gap: 12px;
                }
                
                .smart-entry-container {
                    padding: 18px;
                }
            }

            /* Estados de hover */
            .smart-entry-container:hover {
                transform: translateY(-2px);
                box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
                transition: all 0.3s ease;
            }

            /* Destaque quando ativo */
            .smart-entry-container.active {
                border-color: #3b82f6;
                background: linear-gradient(135deg, #dbeafe, #bfdbfe);
            }

            .smart-entry-container.active::before {
                background: linear-gradient(135deg, #10b981, #059669);
            }

            /* ============================================================================
            APOSTAS FRAGMENTADAS
            ============================================================================ */

            .fragmented-bets-container {
                background: var(--bg-card);
                border: 2px solid rgba(236, 72, 153, 0.3);
                border-radius: 16px;
                padding: 24px;
                margin-bottom: 24px;
                position: relative;
                overflow: hidden;
            }

            .fragmented-bets-container::before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                height: 4px;
                background: linear-gradient(135deg, #ec4899, #be185d);
            }

            .fragmented-bets-header {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-bottom: 20px;
                padding-bottom: 16px;
                border-bottom: 1px solid rgba(236, 72, 153, 0.3);
            }

            .fragmented-bets-title {
                display: flex;
                align-items: center;
                gap: 12px;
                font-size: 18px;
                font-weight: 700;
                color: #f472b6;
            }

            .fragmented-bets-title i {
                font-size: 20px;
                color: #ec4899;
            }

            .fragmented-bets-status {
                display: flex;
                align-items: center;
                gap: 6px;
                padding: 6px 14px;
                border-radius: 20px;
                font-size: 13px;
                font-weight: 600;
            }

            .fragmented-bets-status.inactive {
                background: rgba(156, 163, 175, 0.2);
                color: #6b7280;
            }

            .fragmented-bets-status.active {
                background: rgba(16, 185, 129, 0.2);
                color: #059669;
            }

            .fragmented-bets-status i {
                font-size: 8px;
            }

            .fragmented-bets-info {
                background: linear-gradient(135deg, rgba(236, 72, 153, 0.1), rgba(236, 72, 153, 0.05));
                border: 1px solid rgba(236, 72, 153, 0.3);
                border-radius: 12px;
                padding: 16px;
                margin-bottom: 20px;
            }

            .fragmented-bets-info-header {
                display: flex;
                align-items: center;
                gap: 8px;
                font-weight: 600;
                color: #be185d;
                margin-bottom: 8px;
            }

            .fragmented-bets-info-content {
                color: var(--text-muted);
                font-size: 14px;
                line-height: 1.6;
            }

            .fragmented-bets-toggle {
                position: relative;
                display: inline-block;
            }

            .fragmented-bets-checkbox {
                opacity: 0;
                width: 0;
                height: 0;
            }

            .fragmented-bets-slider {
                position: relative;
                display: inline-block;
                width: 60px;
                height: 28px;
                background: #cbd5e1;
                border-radius: 14px;
                cursor: pointer;
                transition: all 0.3s ease;
                box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
            }

            .fragmented-bets-slider::before {
                content: '';
                position: absolute;
                height: 22px;
                width: 22px;
                left: 3px;
                top: 3px;
                background: white;
                border-radius: 50%;
                transition: all 0.3s ease;
                box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
            }

            .fragmented-bets-checkbox:checked + .fragmented-bets-slider {
                background: linear-gradient(135deg, #ec4899, #be185d);
            }

            .fragmented-bets-checkbox:checked + .fragmented-bets-slider::before {
                transform: translateX(32px);
            }

            .fragmented-bets-label {
                display: flex;
                align-items: center;
                gap: 12px;
                cursor: pointer;
                font-weight: 600;
                color: var(--text-muted);
            }

            .fragmented-bets-options {
                margin-top: 20px;
                padding-top: 20px;
                border-top: 1px dashed #f9a8d4;
            }

            .fragmented-bets-preview {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 12px;
                margin-bottom: 15px;
            }

            .fragmented-bets-preview-item {
                display: flex;
                align-items: center;
                gap: 8px;
                background: rgba(255, 255, 255, 0.7);
                padding: 10px 14px;
                border-radius: 10px;
                font-size: 13px;
                color: #831843;
            }

            .fragmented-bets-preview-item i {
                color: #ec4899;
                width: 16px;
            }

            .fragmented-bets-preview-item strong {
                color: #be185d;
            }

            .fragmented-bets-warning {
                display: flex;
                align-items: center;
                gap: 10px;
                background: rgba(245, 158, 11, 0.15);
                border: 1px solid rgba(245, 158, 11, 0.4);
                padding: 12px 16px;
                border-radius: 10px;
                font-size: 13px;
                color: #92400e;
            }

            .fragmented-bets-warning i {
                color: #f59e0b;
                font-size: 16px;
            }

            /* Estados de hover */
            .fragmented-bets-container:hover {
                transform: translateY(-2px);
                box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
                transition: all 0.3s ease;
            }

            .fragmented-bets-container.active {
                border-color: #ec4899;
                background: linear-gradient(135deg, #fce7f3, #fbcfe8);
            }

            .fragmented-bets-container.active::before {
                background: linear-gradient(135deg, #10b981, #059669);
            }

            @media (max-width: 480px) {
                .fragmented-bets-preview {
                    grid-template-columns: 1fr;
                }
            }

            /* ============================================================================
            SPECIFIC GALE - APOSTAS EM GALE ESPECÍFICO
            ============================================================================ */

            .specific-gale-container {
                background: var(--bg-card);
                border: 2px solid rgba(251, 191, 36, 0.3);
                border-radius: 16px;
                padding: 24px;
                margin-bottom: 24px;
                position: relative;
                overflow: hidden;
            }

            .specific-gale-container::before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                height: 4px;
                background: linear-gradient(135deg, #f59e0b, #d97706);
            }

            .specific-gale-header {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-bottom: 20px;
                padding-bottom: 16px;
                border-bottom: 1px solid rgba(251, 191, 36, 0.3);
            }

            .specific-gale-title {
                display: flex;
                align-items: center;
                gap: 12px;
                font-size: 18px;
                font-weight: 700;
                color: #fbbf24;
            }

            .specific-gale-title i {
                font-size: 20px;
                color: #f59e0b;
            }

            /* Toggle Switch Específico */
            .specific-gale-toggle {
                position: relative;
                display: inline-block;
            }

            .specific-gale-checkbox {
                opacity: 0;
                width: 0;
                height: 0;
            }

            .specific-gale-slider {
                position: relative;
                display: inline-block;
                width: 60px;
                height: 28px;
                background: var(--bg-darker);
                border-radius: 14px;
                cursor: pointer;
                transition: all 0.3s ease;
                box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.3);
            }

            .specific-gale-slider::before {
                content: '';
                position: absolute;
                height: 22px;
                width: 22px;
                left: 3px;
                top: 3px;
                background: white;
                border-radius: 50%;
                transition: all 0.3s ease;
                box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
            }

            .specific-gale-checkbox:checked + .specific-gale-slider {
                background: linear-gradient(135deg, #f59e0b, #d97706);
            }

            .specific-gale-checkbox:checked + .specific-gale-slider::before {
                transform: translateX(32px);
                box-shadow: 0 2px 8px rgba(245, 158, 11, 0.4);
            }

            .specific-gale-label {
                display: flex;
                align-items: center;
                gap: 12px;
                font-weight: 600;
                color: var(--text-muted);
                cursor: pointer;
                user-select: none;
            }

            /* Como Funciona Box */
            .specific-gale-info {
                background: rgba(245, 158, 11, 0.1);
                border: 1px solid rgba(245, 158, 11, 0.3);
                border-radius: 12px;
                padding: 18px;
                margin-bottom: 20px;
            }

            .specific-gale-info-header {
                display: flex;
                align-items: center;
                gap: 8px;
                margin-bottom: 12px;
                font-weight: 700;
                color: #fbbf24;
                font-size: 15px;
            }

            .specific-gale-info-content {
                color: var(--text-muted);
                font-size: 13px;
                line-height: 1.6;
            }

            .specific-gale-info-content strong {
                color: #fbbf24;
            }

            /* Opções de Configuração */
            .specific-gale-options {
                background: var(--bg-darker);
                border-radius: 12px;
                padding: 20px;
                border: 1px solid rgba(251, 191, 36, 0.3);
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
            }

            .specific-gale-controls {
                display: grid;
                grid-template-columns: 1fr;
                gap: 20px;
                margin-bottom: 20px;
            }

            .specific-gale-control {
                display: flex;
                flex-direction: column;
                gap: 8px;
            }

            .specific-gale-control-label {
                font-weight: 600;
                color: var(--text-muted);
                font-size: 14px;
                display: flex;
                align-items: center;
                gap: 6px;
            }

            .specific-gale-select {
                padding: 10px 14px;
                border: 2px solid rgba(251, 191, 36, 0.4);
                border-radius: 8px;
                font-size: 14px;
                background: var(--bg-card);
                color: var(--text-light);
                transition: all 0.3s ease;
                cursor: pointer;
            }

            .specific-gale-select:focus {
                outline: none;
                border-color: #f59e0b;
                box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.2);
            }

            .specific-gale-select:hover {
                border-color: #d97706;
            }

            /* Preview da Configuração */
            .specific-gale-preview {
                background: var(--bg-darker);
                border: 1px solid rgba(245, 158, 11, 0.3);
                border-radius: 10px;
                padding: 16px;
                margin-top: 16px;
            }

            .specific-gale-preview-header {
                display: flex;
                align-items: center;
                gap: 8px;
                margin-bottom: 12px;
                font-weight: 600;
                color: #fbbf24;
                font-size: 14px;
            }

            .specific-gale-preview-content {
                color: var(--text-muted);
                font-size: 13px;
                line-height: 1.5;
            }

            .specific-gale-preview-content strong {
                color: #fbbf24;
            }

            /* Status Badges */
            .specific-gale-status {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                padding: 4px 12px;
                border-radius: 20px;
                font-size: 12px;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: 0.5px;
            }

            .specific-gale-status.active {
                background: linear-gradient(135deg, #f59e0b, #d97706);
                color: white;
            }

            .specific-gale-status.inactive {
                background: rgba(251, 191, 36, 0.15);
                color: #fbbf24;
                border: 1px solid rgba(251, 191, 36, 0.3);
            }

            /* Estados de hover */
            .specific-gale-container:hover {
                transform: translateY(-2px);
                box-shadow: 0 8px 24px rgba(245, 158, 11, 0.15);
                transition: all 0.3s ease;
            }

            /* Destaque quando ativo */
            .specific-gale-container.active {
                border-color: #f59e0b;
                background: linear-gradient(135deg, #fef3c7, #fde68a);
            }

            .specific-gale-container.active::before {
                background: linear-gradient(135deg, #f59e0b, #d97706);
            }

            /* Empty state for charts */
            .chart-empty {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                height: 300px;
                color: #747d8c;
                font-size: 14px;
            }

            .chart-empty i {
                font-size: 48px;
                margin-bottom: 16px;
                opacity: 0.5;
            }

            /* Fonte mais compacta para mobile */
            @media (max-width: 768px) {
                /* Cards de estatísticas menores */
                .stat-card {
                    padding: 16px;
                }
                
                .stat-number {
                    font-size: 24px;
                    font-weight: 700;
                    margin-bottom: 6px;
                }
                
                .stat-label {
                    font-size: 12px;
                    font-weight: 500;
                }
                
                .stat-card i {
                    font-size: 28px;
                    margin-bottom: 12px;
                }
                
                /* Carteira na sidebar menor */
                .wallet-balance {
                    font-size: 20px;
                    margin-bottom: 6px;
                }
                
                .wallet-label {
                    font-size: 12px;
                    margin-bottom: 12px;
                }
                
                /* Headers menores */
                .page-header h1 {
                    font-size: 24px;
                }
                
                .page-header p {
                    font-size: 14px;
                }
                
                /* Botões menores */
                .auto-mode-btn {
                    padding: 8px 12px;
                    font-size: 13px;
                }
                
                .wallet-btn {
                    padding: 6px 10px;
                    font-size: 12px;
                }
                
                /* Status indicators menores */
                .status-indicator {
                    padding: 6px 12px;
                    font-size: 12px;
                }
                
                
                /* Form cards menores */
                .form-card {
                    padding: 20px;
                }
                
                .form-card h3 {
                    font-size: 18px;
                    margin-bottom: 16px;
                }
            }

            /* Para telas muito pequenas (menos de 480px) */
            @media (max-width: 480px) {
                .stat-number {
                    font-size: 20px;
                }
                
                .stat-card i {
                    font-size: 24px;
                    margin-bottom: 10px;
                }
                
                .wallet-balance {
                    font-size: 18px;
                }
                
                .page-header h1 {
                    font-size: 20px;
                }
                
                .auto-mode-btn {
                    font-size: 12px;
                    padding: 6px 10px;
                }

                /* Estratégias em telas muito pequenas */
                .accordion-title {
                    font-size: 14px;
                }

                .btn-pattern {
                    font-size: 12px;
                    padding: 10px 12px;
                }

            }
            /* Otimizações específicas para PWA */
            @media (display-mode: standalone) {
                .sidebar {
                    /* Usar GPU para animações mais suaves */
                    transform: translateZ(0);
                    -webkit-transform: translateZ(0);
                    
                    /* Otimizar renderização */
                    contain: layout style paint;
                    
                    /* Reduzir repaints */
                    isolation: isolate;
                }
                
                /* Transições mais rápidas no PWA */
                .sidebar {
                    transition: transform 0.2s ease-out;
                }
                
                .overlay {
                    transition: opacity 0.2s ease-out;
                }
                
                /* Permitir scroll suave */
                body {
                    -webkit-overflow-scrolling: touch;
                }
            }

            /* Para dispositivos com baixa performance */
            @media (max-width: 768px) and (hover: none) {
                .sidebar {
                    /* Simplificar animações */
                    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
                }
                
                /* Reduzir shadows que consomem performance */
                .sidebar {
                    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.15);
                }
            }
            /* Correção definitiva para o bounce scroll */
            .sidebar {
                /* Prevenir o bounce scroll */
                overscroll-behavior: none;
                overscroll-behavior-y: none;
                -webkit-overflow-scrolling: touch;
                
                /* Para iOS Safari */
                -webkit-overscroll-behavior: none;
                -webkit-overscroll-behavior-y: none;
                
                /* Garantir que o scroll funcione corretamente */
                overflow-y: auto;
                overflow-x: hidden;
                
                /* Altura específica para o scroll funcionar */
                height: 100vh;
                height: 100dvh; /* Para navegadores modernos */
            }

            /* Prevenir bounce no body quando sidebar está ativo */
            body.sidebar-open {
                overflow: hidden;
                position: fixed;
                width: 100%;
                overscroll-behavior: none;
            }

            /* Para iOS especificamente */
            @supports (-webkit-touch-callout: none) {
                .sidebar {
                    -webkit-overflow-scrolling: auto; /* Mudar de touch para auto */
                    overflow-scrolling: auto;
                }
            }

            /* Responsive metrics */
            @media (max-width: 768px) {
                #metrics .stats-grid {
                    grid-template-columns: repeat(2, 1fr);
                }
                
                #metrics > div[style*="grid-template-columns"] {
                    grid-template-columns: 1fr !important;
                }
            }

            /* ============================================================================
            ESTRATÉGIAS DE PADRÃO - ACORDEÃO E CONSTRUTOR
            ============================================================================ */

            /* Acordeão Container */
            .strategy-accordion {
                background: var(--bg-card);
                border-radius: 16px;
                margin-bottom: 20px;
                overflow: hidden;
                border: 1px solid var(--border-dark);
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
                transition: all 0.3s ease;
            }

            .strategy-accordion:hover {
                box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
            }

            /* Dark theme accordion */
            [data-theme="dark"] .strategy-accordion {
                background: var(--bg-card);
                border-color: var(--border-color);
            }

            /* Acordeão Header */
            .accordion-header {
                padding: 20px 24px;
                background: var(--bg-darker);
                cursor: pointer;
                display: flex;
                justify-content: space-between;
                align-items: center;
                transition: all 0.3s ease;
                border-bottom: 1px solid transparent;
            }

            .accordion-header:hover {
                background: var(--bg-card-hover);
            }

            .accordion-header.active {
                background: rgba(59, 130, 246, 0.15);
                border-bottom-color: rgba(59, 130, 246, 0.3);
            }

            [data-theme="dark"] .accordion-header {
                background: var(--bg-secondary);
            }

            [data-theme="dark"] .accordion-header:hover {
                background: var(--bg-hover);
            }

            [data-theme="dark"] .accordion-header.active {
                background: rgba(59, 130, 246, 0.15);
                border-bottom-color: rgba(59, 130, 246, 0.3);
            }

            /* Acordeão Title */
            .accordion-title {
                display: flex;
                align-items: center;
                gap: 12px;
                font-size: 18px;
                font-weight: 700;
                color: var(--text-light);
            }

            .accordion-title i {
                font-size: 20px;
                color: var(--text-muted);
            }

            .accordion-header.active .accordion-title {
                color: #60a5fa;
            }

            .accordion-header.active .accordion-title i {
                color: #3b82f6;
            }

            [data-theme="dark"] .accordion-title {
                color: var(--text-primary);
            }

            [data-theme="dark"] .accordion-title i {
                color: var(--text-secondary);
            }

            /* Acordeão Icon */
            .accordion-icon {
                font-size: 16px;
                color: #9ca3af;
                transition: transform 0.3s ease;
            }

            .accordion-header.active .accordion-icon {
                transform: rotate(180deg);
                color: #3b82f6;
            }

            /* Acordeão Content */
            .accordion-content {
                max-height: 0;
                overflow: hidden;
                opacity: 0;
                display: none;
                transition: max-height 0.4s ease, opacity 0.3s ease;
            }

            .accordion-content.active {
                display: block;
                max-height: 5000px;
                overflow: visible;
                opacity: 1;
            }

            .accordion-body {
                padding: 24px;
            }

            /* Pattern Builder Section */
            .pattern-builder-section {
                background: var(--bg-darker);
                border: 2px solid var(--border-dark);
                border-radius: 12px;
                padding: 20px;
                margin-top: 16px;
            }

            [data-theme="dark"] .pattern-builder-section {
                background: var(--bg-secondary);
                border-color: var(--border-color);
            }

            /* Pattern Buttons Container */
            .pattern-buttons-container {
                display: flex;
                gap: 0;
                margin-bottom: 16px;
                overflow: hidden;
                border-radius: 25px;
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
            }

            /* Pattern Buttons */
            .btn-pattern {
                flex: 1;
                padding: 14px 20px;
                border: none;
                border-radius: 0;
                font-size: 16px;
                font-weight: 700;
                cursor: pointer;
                transition: all 0.3s ease;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
            }

            .btn-pattern:hover {
                opacity: 0.9;
            }

            .btn-pattern:active {
                opacity: 1;
            }

            .btn-pattern-grande {
                background: linear-gradient(135deg, #FF9500, #FFB340);
                color: white;
                border-top-left-radius: 25px;
                border-bottom-left-radius: 25px;
            }

            .btn-pattern-grande:hover {
                background: linear-gradient(135deg, #FFB340, #FFC870);
            }

            .btn-pattern-pequeno {
                background: linear-gradient(135deg, #5B8DEF, #7BA5F3);
                color: white;
                border-top-right-radius: 25px;
                border-bottom-right-radius: 25px;
            }

            .btn-pattern-pequeno:hover {
                background: linear-gradient(135deg, #7BA5F3, #A0C0F7);
            }

            /* Pattern Display */
            .pattern-display {
                min-height: 80px;
                background: #f9fafb;
                border: 2px dashed #d1d5db;
                border-radius: 12px;
                padding: 16px;
                display: flex;
                flex-wrap: wrap;
                gap: 8px;
                align-items: center;
                transition: all 0.3s ease;
            }

            .pattern-display.empty {
                justify-content: center;
                align-items: center;
            }

            .pattern-display.empty::before {
                content: '👆 Clique nos botões acima para construir seu padrão';
                color: #9ca3af;
                font-size: 14px;
                font-style: italic;
            }

            [data-theme="dark"] .pattern-display {
                background: var(--bg-card);
                border-color: var(--border-color);
            }

            /* Pattern Items */
            .pattern-item {
                padding: 10px 18px;
                border-radius: 20px;
                font-size: 14px;
                font-weight: 700;
                color: white;
                cursor: pointer;
                transition: all 0.3s ease;
                box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
                display: inline-flex;
                align-items: center;
                gap: 6px;
                position: relative;
            }

            .pattern-item:hover {
                transform: scale(1.05);
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
            }

            .pattern-item:hover::after {
                content: '✕';
                position: absolute;
                top: -6px;
                right: -6px;
                background: #FF8533;
                color: white;
                width: 20px;
                height: 20px;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 12px;
                font-weight: bold;
                box-shadow: 0 2px 6px rgba(239, 68, 68, 0.4);
            }

            .pattern-item.grande {
                background: linear-gradient(135deg, #FF8C00, #FFA500);
            }

            .pattern-item.pequeno {
                background: linear-gradient(135deg, #4169E1, #6495ED);
            }

            /* Clear Pattern Button */
            .btn-clear-pattern {
                background: rgba(255, 102, 0, 0.15);
                color: #FF6600;
                border: 2px solid rgba(255, 102, 0, 0.3);
                padding: 8px 16px;
                border-radius: 8px;
                font-size: 13px;
                font-weight: 600;
                cursor: pointer;
                transition: all 0.3s ease;
                display: inline-flex;
                align-items: center;
                gap: 6px;
            }

            .btn-clear-pattern:hover {
                background: rgba(255, 102, 0, 0.25);
                transform: translateY(-1px);
                box-shadow: 0 2px 8px rgba(255, 102, 0, 0.3);
            }

            [data-theme="dark"] .btn-clear-pattern {
                background: rgba(239, 68, 68, 0.2);
                border-color: rgba(239, 68, 68, 0.4);
                color: #FF8533;
            }

            /* Responsive */
            @media (max-width: 768px) {
                .accordion-header {
                    padding: 16px 18px;
                }

                .accordion-title {
                    font-size: 16px;
                }

                .accordion-title i {
                    font-size: 18px;
                }

                .accordion-body {
                    padding: 18px;
                }

                .pattern-buttons-container {
                    border-radius: 20px;
                }

                .btn-pattern {
                    padding: 12px 16px;
                    font-size: 14px;
                }

                .btn-pattern-grande {
                    border-top-left-radius: 20px;
                    border-bottom-left-radius: 20px;
                }

                .btn-pattern-pequeno {
                    border-top-right-radius: 20px;
                    border-bottom-right-radius: 20px;
                }

                .pattern-display {
                    min-height: 60px;
                    padding: 12px;
                }

                .pattern-item {
                    padding: 8px 14px;
                    font-size: 12px;
                }
            }

            /* ============================================
               TELEGRAM NOTIFICATIONS STYLES
               ============================================ */

            .telegram-container {
                display: grid;
                grid-template-columns: 1fr;
                gap: 24px;
                max-width: 1200px;
                margin: 0 auto;
            }

            .telegram-card {
                background: var(--bg-card);
                border-radius: 16px;
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
                overflow: hidden;
                transition: transform 0.2s, box-shadow 0.2s;
                border: 1px solid var(--border-dark);
            }

            .telegram-card:hover {
                transform: translateY(-2px);
                box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
            }

            .telegram-card-header {
                background: linear-gradient(135deg, #0088cc 0%, #0099e6 100%);
                color: white;
                padding: 20px 24px;
                display: flex;
                align-items: center;
                gap: 12px;
            }

            .telegram-card-header i {
                font-size: 24px;
            }

            .telegram-card-header h3 {
                margin: 0;
                font-size: 20px;
                font-weight: 600;
            }

            .telegram-card-body {
                padding: 24px;
            }

            /* Instruction Card */
            .instruction-step {
                display: flex;
                gap: 16px;
                margin-bottom: 24px;
                padding-bottom: 24px;
                border-bottom: 1px solid var(--border-dark);
            }

            .instruction-step:last-child {
                margin-bottom: 0;
                padding-bottom: 0;
                border-bottom: none;
            }

            .step-number {
                flex-shrink: 0;
                width: 40px;
                height: 40px;
                background: linear-gradient(135deg, #0088cc 0%, #0099e6 100%);
                color: white;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-weight: 700;
                font-size: 18px;
            }

            .step-content h4 {
                margin: 0 0 8px 0;
                font-size: 16px;
                font-weight: 600;
                color: var(--text-light);
            }

            .step-content p {
                margin: 0 0 12px 0;
                color: var(--text-muted);
                font-size: 14px;
                line-height: 1.6;
            }

            .telegram-bot-link {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                padding: 12px 24px;
                background: linear-gradient(135deg, #0088cc 0%, #0099e6 100%);
                color: white;
                text-decoration: none;
                border-radius: 8px;
                font-weight: 600;
                transition: transform 0.2s, box-shadow 0.2s;
            }

            .telegram-bot-link:hover {
                transform: translateY(-2px);
                box-shadow: 0 4px 12px rgba(0, 136, 204, 0.3);
                color: white;
            }

            .telegram-bot-link i {
                font-size: 20px;
            }

            /* Config Card */
            .input-with-button {
                display: flex;
                gap: 12px;
            }

            .input-with-button input {
                flex: 1;
            }

            .btn-test {
                padding: 12px 24px;
                background: linear-gradient(135deg, #10b981 0%, #059669 100%);
                color: white;
                border: none;
                border-radius: 8px;
                font-weight: 600;
                cursor: pointer;
                transition: transform 0.2s, box-shadow 0.2s;
                white-space: nowrap;
            }

            .btn-test:hover {
                transform: translateY(-2px);
                box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
            }

            .btn-telegram-save {
                width: 100%;
                padding: 14px 24px;
                background: linear-gradient(135deg, #0088cc 0%, #0099e6 100%);
                color: white;
                border: none;
                border-radius: 8px;
                font-weight: 600;
                font-size: 16px;
                cursor: pointer;
                transition: transform 0.2s, box-shadow 0.2s;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                margin-top: 16px;
            }

            .btn-telegram-save:hover {
                transform: translateY(-2px);
                box-shadow: 0 6px 16px rgba(0, 136, 204, 0.4);
            }

            .btn-telegram-save:active {
                transform: translateY(0);
            }

            .toggle-switch-container {
                display: flex;
                align-items: center;
                gap: 16px;
            }

            .toggle-switch {
                position: relative;
                display: inline-block;
                width: 60px;
                height: 34px;
            }

            .toggle-switch input {
                opacity: 0;
                width: 0;
                height: 0;
            }

            .toggle-slider {
                position: absolute;
                cursor: pointer;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background-color: #cbd5e1;
                transition: 0.3s;
                border-radius: 34px;
            }

            .toggle-slider:before {
                position: absolute;
                content: "";
                height: 26px;
                width: 26px;
                left: 4px;
                bottom: 4px;
                background-color: white;
                transition: 0.3s;
                border-radius: 50%;
            }

            .toggle-switch input:checked + .toggle-slider {
                background: linear-gradient(135deg, #0088cc 0%, #0099e6 100%);
            }

            .toggle-switch input:checked + .toggle-slider:before {
                transform: translateX(26px);
            }

            .toggle-status {
                font-weight: 600;
                font-size: 16px;
                color: #6b7280;
            }

            .toggle-switch input:checked ~ .toggle-status {
                color: #0088cc;
            }

            /* Info Card */
            .notification-type {
                display: flex;
                gap: 16px;
                margin-bottom: 24px;
                padding-bottom: 24px;
                border-bottom: 1px solid #e5e7eb;
            }

            .notification-type:last-child {
                margin-bottom: 0;
                padding-bottom: 0;
                border-bottom: none;
            }

            .notification-icon {
                flex-shrink: 0;
                width: 48px;
                height: 48px;
                border-radius: 12px;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 24px;
                color: white;
            }

            .notification-icon.entry {
                background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
            }

            .notification-icon.success {
                background: linear-gradient(135deg, #10b981 0%, #059669 100%);
            }

            .notification-icon.error {
                background: linear-gradient(135deg, #FF8533 0%, #FF6600 100%);
            }

            .notification-content h4 {
                margin: 0 0 8px 0;
                font-size: 16px;
                font-weight: 600;
                color: #1f2937;
            }

            .notification-content p {
                margin: 0 0 8px 0;
                color: #6b7280;
                font-size: 14px;
                line-height: 1.6;
            }

            .notification-example {
                background: #f3f4f6;
                padding: 8px 12px;
                border-radius: 6px;
                font-size: 13px;
                color: #4b5563;
                margin-top: 8px;
            }

            /* Dark Theme */
            [data-theme="dark"] .telegram-card {
                background: #1f2937;
            }

            [data-theme="dark"] .telegram-card-header {
                background: linear-gradient(135deg, #0088cc 0%, #0099e6 100%);
            }

            [data-theme="dark"] .step-content h4,
            [data-theme="dark"] .notification-content h4 {
                color: #f3f4f6;
            }

            [data-theme="dark"] .step-content p,
            [data-theme="dark"] .notification-content p {
                color: #9ca3af;
            }

            [data-theme="dark"] .instruction-step,
            [data-theme="dark"] .notification-type {
                border-bottom-color: #374151;
            }

            [data-theme="dark"] .notification-example {
                background: #374151;
                color: #d1d5db;
            }

            [data-theme="dark"] .form-control {
                background: #374151;
                border-color: #4b5563;
                color: #f3f4f6;
            }

            /* Responsive */
            @media (max-width: 768px) {
                .instruction-step,
                .notification-type {
                    flex-direction: column;
                }

                .input-with-button {
                    flex-direction: column;
                }

                .btn-test {
                    width: 100%;
                }
            }

            /* ============================================
               TELEGRAM SIGNALS STYLES (ADMIN)
               ============================================ */

            /* Status do sistema */
            .signal-status {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 15px;
                background: #f3f4f6;
                border-radius: 8px;
                margin-bottom: 15px;
            }

            .signal-status .status-indicator {
                width: 12px;
                height: 12px;
                border-radius: 50%;
                animation: pulse 2s infinite;
            }

            .signal-status .status-indicator.online {
                background: #10b981;
                box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
            }

            .signal-status .status-indicator.offline {
                background: #6b7280;
            }

            @keyframes pulse {
                0% {
                    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
                }
                70% {
                    box-shadow: 0 0 0 10px rgba(16, 185, 129, 0);
                }
                100% {
                    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
                }
            }

            /* Botão de toggle */
            .btn-toggle {
                width: 100%;
                padding: 20px;
                font-size: 18px;
                font-weight: 600;
                border-radius: 12px;
                border: none;
                background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%);
                color: white;
                cursor: pointer;
                transition: all 0.3s;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 10px;
                margin-bottom: 20px;
            }

            .btn-toggle:hover {
                transform: translateY(-2px);
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
            }

            .btn-toggle.active {
                background: linear-gradient(135deg, #10b981 0%, #059669 100%);
            }

            /* Lista de padrões */
            .patterns-checklist {
                display: flex;
                flex-direction: column;
                gap: 10px;
                max-height: 400px;
                overflow-y: auto;
                padding: 10px 0;
            }

            .pattern-checkbox-item {
                display: flex;
                align-items: center;
                padding: 12px;
                background: #f9fafb;
                border-radius: 8px;
                cursor: pointer;
                transition: background 0.2s;
            }

            .pattern-checkbox-item:hover {
                background: #f3f4f6;
            }

            .pattern-checkbox-item input[type="checkbox"] {
                margin-right: 10px;
                cursor: pointer;
            }

            /* Estatísticas */
            .signal-stats {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
                gap: 15px;
                margin-top: 20px;
            }

            .stat-box {
                padding: 20px 15px;
                background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
                border-radius: 12px;
                text-align: center;
                color: white;
                transition: transform 0.2s;
            }

            .stat-box:hover {
                transform: translateY(-3px);
            }

            .stat-box.stat-win {
                background: linear-gradient(135deg, #10b981 0%, #059669 100%);
            }

            .stat-box.stat-loss {
                background: linear-gradient(135deg, #FF8533 0%, #FF6600 100%);
            }

            .stat-box.stat-accuracy {
                background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
            }

            .stat-icon {
                font-size: 24px;
                margin-bottom: 8px;
                opacity: 0.9;
            }

            .stat-value {
                font-size: 32px;
                font-weight: 700;
                margin-bottom: 5px;
            }

            .stat-label {
                font-size: 12px;
                opacity: 0.9;
                text-transform: uppercase;
                letter-spacing: 0.5px;
            }

            /* Estatísticas por Estratégia */
            .strategy-stats-list {
                display: flex;
                flex-direction: column;
                gap: 12px;
                margin-top: 15px;
            }

            .strategy-stat-item {
                padding: 16px;
                background: #f9fafb;
                border-radius: 10px;
                border-left: 4px solid #3b82f6;
                transition: all 0.2s;
            }

            .strategy-stat-item:hover {
                background: #f3f4f6;
                transform: translateX(3px);
            }

            .strategy-stat-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-bottom: 10px;
            }

            .strategy-name {
                font-weight: 600;
                font-size: 15px;
                color: #ffffff;
            }

            .strategy-winrate {
                font-weight: 700;
                font-size: 16px;
                color: #3b82f6;
            }

            .strategy-stat-details {
                display: flex;
                gap: 20px;
                font-size: 13px;
                color: #6b7280;
            }

            .strategy-stat-details span {
                display: flex;
                align-items: center;
                gap: 5px;
            }

            .strategy-stat-details .win-count {
                color: #10b981;
                font-weight: 600;
            }

            .strategy-stat-details .loss-count {
                color: #FF8533;
                font-weight: 600;
            }

            /* Responsivo para Mobile */
            @media (max-width: 768px) {
                .signal-stats {
                    grid-template-columns: repeat(3, 1fr);
                    gap: 10px;
                }

                .stat-box {
                    padding: 15px 10px;
                }

                .stat-icon {
                    font-size: 20px;
                    margin-bottom: 5px;
                }

                .stat-value {
                    font-size: 24px;
                }

                .stat-label {
                    font-size: 10px;
                }

                .strategy-stat-item {
                    padding: 12px;
                }

                .strategy-name {
                    font-size: 14px;
                }

                .strategy-winrate {
                    font-size: 14px;
                }

                .strategy-stat-details {
                    flex-direction: column;
                    gap: 5px;
                    font-size: 12px;
                }
            }

            @media (max-width: 480px) {
                .signal-stats {
                    gap: 8px;
                }

                .stat-box {
                    padding: 12px 8px;
                }

                .stat-icon {
                    font-size: 18px;
                }

                .stat-value {
                    font-size: 20px;
                }

                .stat-label {
                    font-size: 9px;
                }
            }

            /* Dark Theme para Sinais */
            [data-theme="dark"] .signal-status {
                background: #374151;
            }

            [data-theme="dark"] .pattern-checkbox-item {
                background: #374151;
            }

            [data-theme="dark"] .pattern-checkbox-item:hover {
                background: #4b5563;
            }

            [data-theme="dark"] .strategy-stat-item {
                background: #374151;
                border-left-color: #3b82f6;
            }

            [data-theme="dark"] .strategy-stat-item:hover {
                background: #4b5563;
            }

            [data-theme="dark"] .strategy-name {
                color: #f3f4f6;
            }

            [data-theme="dark"] .strategy-stat-details {
                color: #9ca3af;
            }

            /* Auto Optimize Modal Styles */
            #autoOptimizeModal > div {
                max-height: 85vh;
                overflow-y: auto;
            }

            /* Custom scrollbar for modal */
            #autoOptimizeModal > div::-webkit-scrollbar {
                width: 8px;
            }

            #autoOptimizeModal > div::-webkit-scrollbar-track {
                background: rgba(0, 0, 0, 0.1);
                border-radius: 10px;
            }

            #autoOptimizeModal > div::-webkit-scrollbar-thumb {
                background: #10b981;
                border-radius: 10px;
                transition: background 0.3s;
            }

            #autoOptimizeModal > div::-webkit-scrollbar-thumb:hover {
                background: #059669;
            }

            /* Desktop - Tela Grande */
            @media (min-width: 1441px) {
                #autoOptimizeModal > div {
                    max-width: 1400px;
                    width: 85%;
                }
            }

            /* Desktop - Tela Média */
            @media (min-width: 1025px) and (max-width: 1440px) {
                #autoOptimizeModal > div {
                    max-width: 1100px;
                    width: 90%;
                }
            }

            /* Tablet */
            @media (min-width: 769px) and (max-width: 1024px) {
                #autoOptimizeModal > div {
                    max-width: 750px;
                    width: 92%;
                    max-height: 90vh;
                }
            }

            /* Mobile */
            @media (max-width: 768px) {
                #autoOptimizeModal > div {
                    max-width: 95%;
                    width: 95%;
                    padding: 20px;
                    margin: 10px;
                    max-height: 92vh;
                }

                #autoOptimizeModal > div > div:first-of-type {
                    font-size: 18px;
                    margin-bottom: 16px;
                }

                #autoOptimizeModal #autoOptimizeContent {
                    font-size: 13px;
                }

                #autoOptimizeModal .config-info {
                    padding: 12px;
                    font-size: 13px;
                }

                #autoOptimizeModal .result-item {
                    padding: 10px;
                    font-size: 12px;
                }
            }

/* --- Next block --- */

/* ===== PROFILE SECTION ===== */
            #profile .page-header h1 { color: var(--text-primary, #f1f5f9); }

            .profile-current-card {
                background: linear-gradient(135deg, rgba(30,40,60,0.95), rgba(15,20,35,0.98));
                border: 1px solid rgba(99,179,237,0.2);
                border-radius: 20px;

            @media (max-width: 768px) {
                #meuPlanoCard { padding: 15px !important; }
                #meuPlanoCard > div:first-child { flex-direction: column !important; align-items: stretch !important; gap: 12px !important; }
                #meuPlanoCard button { width: 100% !important; }
                #planoContadores { grid-template-columns: 1fr !important; }
                #plansModal .modal-box { width: 98% !important; height: 95vh !important; max-height: 95vh !important; overflow-y: auto !important; }
                #plansModal .modal-box > div:first-child { padding: 20px 16px !important; }
                #plansModal .modal-box > div:first-child h2 { font-size: 20px !important; }
                #plansContainer { grid-template-columns: 1fr !important; padding: 14px !important; gap: 14px !important; }
            }
                padding: 24px;
                display: flex;
                align-items: center;
                gap: 20px;
                margin-bottom: 20px;
                flex-wrap: wrap;
                position: relative;
                overflow: hidden;
                box-shadow: 0 4px 30px rgba(0,0,0,0.3);
            }
            .profile-current-card::before {
                content: '';
                position: absolute; top:0; left:0; right:0; height:2px;
                background: linear-gradient(90deg, #3b82f6, #8b5cf6, #ec4899);
                border-radius: 20px 20px 0 0;
            }
            .profile-avatar-wrap { position: relative; flex-shrink: 0; }
            .profile-avatar {
                width: 72px; height: 72px;
                border-radius: 50%;
                background: linear-gradient(135deg, #3b82f6, #8b5cf6);
                display: flex; align-items: center; justify-content: center;
                font-size: 28px; font-weight: 800; color: white;
                position: relative; z-index: 1;
                text-transform: uppercase;
            }
            .profile-avatar-ring {
                position: absolute; inset: -3px;
                border-radius: 50%;
                border: 2px solid transparent;
                background: linear-gradient(135deg, #3b82f6, #8b5cf6, #ec4899) border-box;
                -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
                -webkit-mask-composite: destination-out;
                mask-composite: exclude;
                animation: ringRotate 4s linear infinite;
            }
            @keyframes ringRotate { 0%{filter:hue-rotate(0deg)} 100%{filter:hue-rotate(360deg)} }
            .profile-info { flex: 1; min-width: 160px; }
            .profile-name {
                font-size: 20px; font-weight: 800;
                color: #f1f5f9; margin-bottom: 4px;
            }
            .profile-email { font-size: 13px; color: #94a3b8; margin-bottom: 10px; }
            .profile-badges { display: flex; gap: 8px; flex-wrap: wrap; }
            .profile-badge {
                padding: 3px 10px; border-radius: 20px;
                font-size: 11px; font-weight: 700; letter-spacing: 0.5px;
                display: inline-flex; align-items: center; gap: 5px;
            }
            .profile-badge.account { background: rgba(255,185,0,0.15); color: #FFD700; border: 1px solid rgba(255,215,0,0.3); }
            .profile-badge.status { background: rgba(34,197,94,0.15); color: #4ade80; border: 1px solid rgba(34,197,94,0.3); }
            .profile-badge.status i { font-size: 7px; animation: statusPulse 2s ease-in-out infinite; }
            @keyframes statusPulse { 0%,100%{opacity:1} 50%{opacity:0.3} }
            .profile-meta { display: flex; flex-direction: column; gap: 8px; min-width: 160px; }
            .profile-meta-item { display: flex; flex-direction: column; }
            .profile-meta-label { font-size: 10px; font-weight: 600; color: #64748b; text-transform: uppercase; letter-spacing: 0.7px; }
            .profile-meta-value { font-size: 13px; color: #cbd5e1; font-weight: 600; }

            /* Saved Accounts Card */
            .profile-accounts-card {
                background: rgba(15,20,35,0.95);
                border: 1px solid rgba(99,179,237,0.15);
                border-radius: 20px;
                overflow: hidden;
            }
            .profile-section-header {
                display: flex; justify-content: space-between; align-items: center;
                padding: 18px 24px;
                border-bottom: 1px solid rgba(255,255,255,0.06);
            }
            .profile-section-header h3 {
                font-size: 15px; font-weight: 700; color: #e2e8f0;
                display: flex; align-items: center; gap: 8px; margin: 0;
            }
            .profile-section-header h3 i { color: #60a5fa; }
            .btn-add-account {
                background: linear-gradient(135deg, #3b82f6, #2563eb);
                color: white; border: none; border-radius: 10px;
                padding: 8px 16px; font-size: 13px; font-weight: 700;
                cursor: pointer; display: flex; align-items: center; gap: 6px;
                transition: all 0.2s;
            }
            .btn-add-account:hover { transform: translateY(-1px); box-shadow: 0 4px 15px rgba(59,130,246,0.4); }
            .saved-accounts-list { padding: 12px 16px; display: flex; flex-direction: column; gap: 10px; }

            /* Account Item */
            .account-item {
                display: flex; align-items: center; gap: 14px;
                background: rgba(255,255,255,0.04);
                border: 1px solid rgba(255,255,255,0.07);
                border-radius: 14px; padding: 14px 16px;
                transition: all 0.25s ease;
            }
            .account-item:hover { background: rgba(255,255,255,0.08); border-color: rgba(99,179,237,0.25); }
            .account-item.current-account { border-color: rgba(59,130,246,0.45); background: rgba(59,130,246,0.07); }
            .acc-avatar {
                width: 44px; height: 44px; border-radius: 50%;
                background: linear-gradient(135deg, #3b82f6, #8b5cf6);
                display: flex; align-items: center; justify-content: center;
                font-size: 16px; font-weight: 800; color: white;
                flex-shrink: 0; text-transform: uppercase;
            }
            .acc-info { flex: 1; min-width: 0; }
            .acc-nickname { font-size: 14px; font-weight: 700; color: #e2e8f0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
            .acc-email { font-size: 12px; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
            .acc-current-tag {
                font-size: 10px; font-weight: 700;
                background: rgba(59,130,246,0.2); color: #60a5fa;
                border: 1px solid rgba(59,130,246,0.3);
                padding: 2px 8px; border-radius: 20px; white-space: nowrap;
            }
            .acc-actions { display: flex; gap: 8px; flex-shrink: 0; }
            .btn-switch-acc {
                background: linear-gradient(135deg, #22c55e, #16a34a);
                color: white; border: none; border-radius: 9px;
                padding: 7px 14px; font-size: 12px; font-weight: 700;
                cursor: pointer; display: flex; align-items: center; gap: 5px;
                transition: all 0.2s; white-space: nowrap;
            }
            .btn-switch-acc:hover { transform: translateY(-1px); box-shadow: 0 3px 12px rgba(34,197,94,0.4); }
            .btn-switch-acc:disabled { opacity: 0.5; cursor: default; transform: none; }
            .btn-delete-acc {
                background: rgba(239,68,68,0.15); color: #f87171;
                border: 1px solid rgba(239,68,68,0.25); border-radius: 9px;
                padding: 7px 10px; font-size: 12px; cursor: pointer;
                transition: all 0.2s;
            }
            .btn-delete-acc:hover { background: rgba(239,68,68,0.28); transform: translateY(-1px); }
            .no-accounts-msg {
                padding: 40px 24px; text-align: center;
                color: #475569;
            }
            .no-accounts-msg i { font-size: 36px; margin-bottom: 12px; display: block; opacity: 0.5; }
            .no-accounts-msg p { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
            .no-accounts-msg small { font-size: 12px; }

            /* Modal */
            .modal-overlay {
                position: fixed; inset: 0;
                background: rgba(0,0,0,0.7); backdrop-filter: blur(4px);
                z-index: 9999; display: flex; align-items: center; justify-content: center;
                padding: 12px;
            }
            .modal-box {
                background: #0f172a; border: 1px solid rgba(99,179,237,0.2);
                border-radius: 20px; width: 100%; max-width: 400px;
                overflow: hidden; box-shadow: 0 25px 60px rgba(0,0,0,0.6);
                animation: modalIn 0.25s ease;
                max-height: 95vh; overflow-y: auto;
            }
            @keyframes modalIn { from{opacity:0;transform:scale(0.92) translateY(20px)} to{opacity:1;transform:scale(1) translateY(0)} }
            .modal-box-header {
                display: flex; justify-content: space-between; align-items: center;
                padding: 18px 22px;
                border-bottom: 1px solid rgba(255,255,255,0.08);
                background: rgba(255,255,255,0.03);
            }
            .modal-box-header h3 { margin:0; font-size: 15px; font-weight: 700; color: #e2e8f0; display:flex;align-items:center;gap:8px; }
            .modal-box-header h3 i { color: #60a5fa; }
            .modal-close-btn { background: rgba(255,255,255,0.07); border: none; border-radius: 8px; width:30px;height:30px; color: #94a3b8; cursor: pointer; font-size:13px; transition:0.2s; }
            .modal-close-btn:hover { background: rgba(239,68,68,0.2); color: #f87171; }
            .modal-box-body { padding: 22px; display: flex; flex-direction: column; gap: 14px; }
            .modal-box-body .form-group { display: flex; flex-direction: column; gap: 6px; }
            .modal-box-body .form-group label { font-size: 12px; font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: 0.5px; }
            .modal-box-body .form-group input {
                background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
                border-radius: 10px; padding: 10px 14px; color: #e2e8f0; font-size: 14px;
                outline: none; transition: 0.2s; width: 100%; box-sizing: border-box;
            }
            .modal-box-body .form-group input:focus { border-color: rgba(59,130,246,0.5); background: rgba(59,130,246,0.07); }
            .modal-error { background: rgba(239,68,68,0.12); border: 1px solid rgba(239,68,68,0.3); border-radius: 10px; padding: 10px 14px; color: #f87171; font-size: 13px; }
            .btn-modal-save {
                width: 100%; padding: 12px;
                background: linear-gradient(135deg, #3b82f6, #2563eb);
                color: white; border: none; border-radius: 12px;
                font-size: 15px; font-weight: 700; cursor: pointer;
                display: flex; align-items: center; justify-content: center; gap: 8px;
                transition: all 0.2s;
            }
            .btn-modal-save:hover { box-shadow: 0 5px 20px rgba(59,130,246,0.4); transform: translateY(-1px); }
            .btn-modal-save:disabled { opacity: 0.6; cursor: default; transform: none; }

            /* Switching overlay */
            .switching-overlay {
                position: fixed; inset: 0;
                background: rgba(0,0,0,0.85); backdrop-filter: blur(8px);
                z-index: 99999;
                display: flex; flex-direction: column; align-items: center; justify-content: center;
                gap: 16px;
            }
            .switching-spinner {
                width: 56px; height: 56px;
                border: 4px solid rgba(255,255,255,0.1);
                border-top-color: #3b82f6;
                border-radius: 50%;
                animation: spin 0.8s linear infinite;
            }
            @keyframes spin { to{transform:rotate(360deg)} }
            .switching-text { color: #e2e8f0; font-size: 16px; font-weight: 600; }
            .switching-subtext { color: #64748b; font-size: 13px; }

/* --- Next block --- */

#premiumStatusCard {
                    position: relative; overflow: hidden;
                    background: linear-gradient(135deg, #1a1200 0%, #2d1f00 30%, #3d2900 60%, #1a1200 100%);
                    border: 1px solid rgba(255,200,0,0.35); border-radius: 20px;
                    padding: 28px 24px 20px;
                    box-shadow: 0 0 40px rgba(255,185,0,0.15), inset 0 1px 0 rgba(255,215,0,0.2);
                }
                .premium-particles { position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden; }
                .premium-particles span { position:absolute;display:block;border-radius:50%;background:rgba(255,215,0,0.4);animation:floatParticle 6s infinite ease-in-out; }
                .premium-particles span:nth-child(1){left:10%;top:20%;width:4px;height:4px;animation-delay:0s;animation-duration:7s;}
                .premium-particles span:nth-child(2){left:25%;top:70%;width:3px;height:3px;animation-delay:1s;animation-duration:9s;}
                .premium-particles span:nth-child(3){left:50%;top:10%;width:5px;height:5px;animation-delay:2s;animation-duration:6s;}
                .premium-particles span:nth-child(4){left:70%;top:80%;width:3px;height:3px;animation-delay:0.5s;animation-duration:8s;}
                .premium-particles span:nth-child(5){left:85%;top:30%;width:4px;height:4px;animation-delay:1.5s;animation-duration:7s;}
                .premium-particles span:nth-child(6){left:5%;top:60%;width:3px;height:3px;animation-delay:3s;animation-duration:10s;}
                .premium-particles span:nth-child(7){left:40%;top:50%;width:2px;height:2px;animation-delay:2.5s;animation-duration:8s;}
                .premium-particles span:nth-child(8){left:90%;top:55%;width:5px;height:5px;animation-delay:4s;animation-duration:6s;}
                .premium-particles span:nth-child(9){left:60%;top:35%;width:3px;height:3px;animation-delay:1.2s;animation-duration:9s;}
                .premium-particles span:nth-child(10){left:30%;top:85%;width:4px;height:4px;animation-delay:3.5s;animation-duration:7s;}
                @keyframes floatParticle { 0%,100%{transform:translateY(0) scale(1);opacity:0.4;} 50%{transform:translateY(-20px) scale(1.3);opacity:0.8;} }
                .premium-badge-row { display:flex;align-items:center;gap:12px;margin-bottom:18px;position:relative;z-index:1; }
                .premium-crown-icon { width:44px;height:44px;background:linear-gradient(135deg,#FFD700,#FFA500);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;color:#1a0800;box-shadow:0 4px 15px rgba(255,185,0,0.5);animation:crownPulse 3s ease-in-out infinite;flex-shrink:0; }
                @keyframes crownPulse { 0%,100%{box-shadow:0 4px 15px rgba(255,185,0,0.5);} 50%{box-shadow:0 4px 30px rgba(255,185,0,0.9),0 0 20px rgba(255,215,0,0.4);} }
                .premium-badge-label { flex:1;font-size:11px;font-weight:700;letter-spacing:1.5px;color:rgba(255,215,0,0.75);text-transform:uppercase; }
                .premium-status-pill { background:linear-gradient(135deg,#22c55e,#16a34a);color:white;font-size:10px;font-weight:800;letter-spacing:1px;padding:4px 10px;border-radius:20px;box-shadow:0 2px 8px rgba(34,197,94,0.4);animation:statusBlink 2s ease-in-out infinite;white-space:nowrap; }
                @keyframes statusBlink { 0%,100%{opacity:1;} 50%{opacity:0.75;} }
                .premium-headline { font-size:28px;font-weight:900;letter-spacing:2px;background:linear-gradient(90deg,#FFD700,#FFA500,#FFD700);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmerText 3s linear infinite;text-align:center;margin-bottom:20px;position:relative;z-index:1; }
                @keyframes shimmerText { 0%{background-position:0%} 100%{background-position:200%} }
                .premium-expiry-block { background:rgba(255,215,0,0.07);border:1px solid rgba(255,215,0,0.18);border-radius:12px;padding:12px 16px;margin-bottom:20px;position:relative;z-index:1; }
                .premium-expiry-info { display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:13px;color:rgba(255,200,100,0.85); }
                .premium-expiry-info strong { color:#FFD700;font-size:13px; }
                .premium-expiry-bar { height:6px;background:rgba(255,255,255,0.1);border-radius:3px;overflow:hidden; }
                .premium-expiry-fill { height:100%;background:linear-gradient(90deg,#FFD700,#FFA500);border-radius:3px;transition:width 0.8s ease;box-shadow:0 0 6px rgba(255,185,0,0.6); }
                .premium-benefits-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px;position:relative;z-index:1; }
                .premium-benefit-item { background:rgba(255,215,0,0.08);border:1px solid rgba(255,215,0,0.15);border-radius:12px;padding:12px 8px;text-align:center;transition:all 0.3s ease; }
                .premium-benefit-item:hover { background:rgba(255,215,0,0.15);border-color:rgba(255,215,0,0.35);transform:translateY(-2px); }
                .premium-benefit-icon { width:34px;height:34px;background:linear-gradient(135deg,#FFD700,#FFA500);border-radius:9px;display:flex;align-items:center;justify-content:center;margin:0 auto 8px;font-size:14px;color:#1a0800; }
                .premium-benefit-item span { font-size:11px;font-weight:600;color:rgba(255,215,0,0.85);display:block;line-height:1.3; }
                .premium-card-footer { display:flex;justify-content:space-between;align-items:center;padding-top:14px;border-top:1px solid rgba(255,215,0,0.15);position:relative;z-index:1;font-size:12px;color:rgba(255,200,100,0.7); }
                .premium-footer-glow { font-weight:700;font-size:12px;color:rgba(255,215,0,0.6);letter-spacing:1px; }
                @media(max-width:480px){ .premium-headline{font-size:22px;} .premium-card-footer{flex-direction:column;gap:4px;text-align:center;} }

/* --- Next block --- */

/* Accordion Styles - Push Notifications */
   .push-container .accordion-header {
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding: 16px;
       background: var(--bg-darker);
       color: var(--text-light);
       border: none;
       border-radius: 8px;
       cursor: pointer;
       font-weight: 600;
       font-size: 16px;
       transition: all 0.3s ease;
       margin-bottom: 12px;
       width: 100%;
       text-align: left;
   }

   .push-container .accordion-header:hover {
       background: var(--bg-card-hover);
       transform: translateY(-2px);
       box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
   }

   .push-container .accordion-header.active {
       background: var(--bg-card);
   }

   .push-container .accordion-icon {
       display: flex;
       align-items: center;
       justify-content: center;
       width: 24px;
       height: 24px;
       transition: transform 0.3s ease;
       margin-right: 12px;
   }

   .push-container .accordion-content {
       max-height: 0;
       overflow: hidden;
       opacity: 0;
       transition: max-height 0.3s ease, opacity 0.3s ease, overflow 0.3s ease, display 0.3s ease, margin-bottom 0.3s ease;
       margin-bottom: 0;
       background: var(--bg-card);
       border-radius: 8px;
       display: none;
   }

   .push-container .accordion-content.active {
       max-height: 1000px;
       opacity: 1;
       overflow: visible;
       display: block;
       margin-bottom: 12px;
   }

   .push-container .accordion-content-inner {
       padding: 20px;
   }

   /* Web Push Notifications Styles */
   .push-container {
       max-width: 900px;
       margin: 0 auto;
       padding: 20px;
   }

   .push-card {
       background: var(--bg-card);
       border-radius: 12px;
       box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
       margin-bottom: 20px;
       overflow: hidden;
       border: 1px solid var(--border-dark);
   }

   .push-card-header {
       background: linear-gradient(135deg, #FF6600 0%, #E55A00 100%);
       color: white;
       padding: 20px;
       display: flex;
       align-items: center;
       gap: 12px;
   }

   .push-card-header i {
       font-size: 24px;
   }

   .push-card-header h3 {
       margin: 0;
       font-size: 20px;
       font-weight: 600;
   }

   .push-card-body {
       padding: 24px;
   }

   /* Status Card */
   .status-info {
       display: flex;
       flex-direction: column;
       gap: 16px;
   }

   .status-item {
       display: flex;
       justify-content: space-between;
       align-items: center;
       padding: 12px;
       background: var(--bg-darker);
       border-radius: 8px;
   }

   .status-label {
       font-weight: 600;
       color: var(--text-light);
   }

   .status-value {
       padding: 4px 12px;
       border-radius: 6px;
       font-size: 14px;
       font-weight: 500;
   }

   .status-value.supported { background: rgba(16, 185, 129, 0.2); color: #10b981; }
   .status-value.not-supported { background: rgba(220, 38, 38, 0.2); color: #f87171; }
   .status-value.granted { background: rgba(16, 185, 129, 0.2); color: #10b981; }
   .status-value.denied { background: rgba(220, 38, 38, 0.2); color: #f87171; }
   .status-value.default { background: rgba(245, 158, 11, 0.2); color: #fbbf24; }
   .status-value.subscribed { background: rgba(16, 185, 129, 0.2); color: #10b981; }
   .status-value.not-subscribed { background: var(--bg-darker); color: var(--text-muted); }

   .ios-warning {
       background: rgba(245, 158, 11, 0.15);
       border: 2px solid rgba(245, 158, 11, 0.4);
       border-radius: 8px;
       padding: 16px;
       display: flex;
       align-items: flex-start;
       gap: 12px;
   }

   .ios-warning i {
       color: #f59e0b;
       font-size: 20px;
       margin-top: 2px;
   }

   .ios-warning p {
       margin: 0;
       color: var(--text-muted);
       line-height: 1.5;
   }

   /* Control Card */
   .control-section {
       padding: 16px 0;
       border-bottom: 1px solid var(--border-dark);
   }

   .control-section:last-child {
       border-bottom: none;
   }

   .control-info h4 {
       margin: 0 0 8px 0;
       color: var(--text-light);
       font-size: 16px;
   }

   .control-info p {
       margin: 0 0 16px 0;
       color: var(--text-muted);
       font-size: 14px;
   }

   /* Preferences Card */
   .preferences-description {
       color: var(--text-muted);
       margin-bottom: 24px;
       line-height: 1.6;
   }

   .preference-item {
       display: flex;
       justify-content: space-between;
       align-items: center;
       padding: 16px;
       border-bottom: 1px solid var(--border-dark);
       transition: background-color 0.2s;
   }

   .preference-item:hover {
       background: var(--bg-card-hover);
   }

   .preference-item:last-of-type {
       border-bottom: none;
   }

   .preference-info {
       display: flex;
       align-items: center;
       gap: 16px;
       flex: 1;
   }

   .preference-icon {
       font-size: 28px;
       width: 48px;
       height: 48px;
       display: flex;
       align-items: center;
       justify-content: center;
       background: var(--bg-darker);
       border-radius: 12px;
   }

   .preference-info h4 {
       margin: 0 0 4px 0;
       color: var(--text-light);
       font-size: 15px;
       font-weight: 600;
   }

   .preference-info p {
       margin: 0;
       color: var(--text-muted);
       font-size: 13px;
   }

   /* Toggle Switch */
   .switch {
       position: relative;
       display: inline-block;
       width: 52px;
       height: 28px;
       flex-shrink: 0;
   }

   .switch input {
       opacity: 0;
       width: 0;
       height: 0;
   }

   .slider {
       position: absolute;
       cursor: pointer;
       top: 0;
       left: 0;
       right: 0;
       bottom: 0;
       background-color: var(--bg-darker);
       transition: .3s;
       border-radius: 28px;
   }

   .slider:before {
       position: absolute;
       content: "";
       height: 20px;
       width: 20px;
       left: 4px;
       bottom: 4px;
       background-color: var(--text-muted);
       transition: .3s;
       border-radius: 50%;
   }

   input:checked + .slider {
       background-color: #FF6600;
   }

   input:checked + .slider:before {
       transform: translateX(24px);
       background-color: white;
   }

   .preferences-actions {
       margin-top: 24px;
       padding-top: 24px;
       border-top: 2px solid var(--border-dark);
   }

   /* Devices Card */
   .devices-list {
       display: flex;
       flex-direction: column;
       gap: 12px;
   }

   .device-item {
       display: flex;
       justify-content: space-between;
       align-items: center;
       padding: 16px;
       background: var(--bg-darker);
       border-radius: 8px;
       border: 1px solid var(--border-dark);
   }

   .device-info {
       display: flex;
       align-items: center;
       gap: 12px;
   }

   .device-icon {
       font-size: 24px;
       color: var(--text-muted);
   }

   .device-details h4 {
       margin: 0 0 4px 0;
       color: var(--text-light);
       font-size: 14px;
       font-weight: 600;
   }

   .device-details p {
       margin: 0;
       color: var(--text-muted);
       font-size: 12px;
   }

   .device-status {
       padding: 4px 12px;
       border-radius: 6px;
       font-size: 12px;
       font-weight: 500;
   }

   .device-status.active {
       background: rgba(16, 185, 129, 0.2);
       color: #10b981;
   }

   .device-status.inactive {
       background: rgba(220, 38, 38, 0.2);
       color: #f87171;
   }

   .loading-text {
       text-align: center;
       color: var(--text-muted);
       padding: 40px 20px;
   }

   /* Buttons */
   .push-card .btn-primary,
   .push-card .btn-secondary {
       padding: 12px 24px;
       border-radius: 8px;
       font-size: 15px;
       font-weight: 600;
       border: none;
       cursor: pointer;
       display: inline-flex;
       align-items: center;
       gap: 8px;
       transition: all 0.2s;
       width: 100%;
       justify-content: center;
   }

   .push-card .btn-primary {
       background: linear-gradient(135deg, #FF6600 0%, #E55A00 100%);
       color: white;
   }

   .push-card .btn-primary:hover {
       transform: translateY(-2px);
       box-shadow: 0 4px 12px rgba(255, 102, 0, 0.4);
   }

   .push-card .btn-secondary {
       background: var(--bg-darker);
       color: #FF6600;
       border: 2px solid #FF6600;
   }

   .push-card .btn-secondary:hover {
       background: rgba(255, 102, 0, 0.1);
   }

   /* Responsive */
   @media (max-width: 768px) {
       .push-container {
           padding: 12px;
       }

       .push-card-body {
           padding: 16px;
       }

       .preference-info {
           gap: 12px;
       }

       .preference-icon {
           font-size: 24px;
           width: 40px;
           height: 40px;
       }

       .preference-info h4 {
           font-size: 14px;
       }

       .preference-info p {
           font-size: 12px;
       }
   }

/* --- Next block --- */

@keyframes bellRing {
            0%, 100% { transform: rotate(0deg); }
            10% { transform: rotate(14deg); }
            20% { transform: rotate(-14deg); }
            30% { transform: rotate(10deg); }
            40% { transform: rotate(-10deg); }
            50% { transform: rotate(6deg); }
            60% { transform: rotate(-6deg); }
            70% { transform: rotate(0deg); }
        }
        /* Enhanced device list styles */
        .device-item-enhanced {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 16px;
            background: var(--bg-darker, #0d1117);
            border-radius: 10px;
            border: 1px solid var(--border-dark, #2d333b);
            margin-bottom: 10px;
            transition: border-color 0.2s;
        }
        .device-item-enhanced:hover {
            border-color: #FF6600;
        }
        .device-item-enhanced .device-left {
            display: flex;
            align-items: center;
            gap: 14px;
            flex: 1;
        }
        .device-item-enhanced .device-os-badge {
            min-width: 44px;
            height: 44px;
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 22px;
        }
        .device-os-badge.android { background: rgba(61,220,132,0.15); }
        .device-os-badge.ios { background: rgba(0,122,255,0.15); }
        .device-os-badge.windows { background: rgba(0,120,215,0.15); }
        .device-os-badge.macos { background: rgba(162,132,255,0.15); }
        .device-os-badge.linux { background: rgba(255,193,7,0.15); }
        .device-os-badge.unknown { background: rgba(150,150,150,0.15); }
        .device-item-enhanced .device-meta {
            flex: 1;
        }
        .device-item-enhanced .device-meta h4 {
            margin: 0 0 2px;
            color: var(--text-light, #e6edf3);
            font-size: 14px;
            font-weight: 600;
        }
        .device-item-enhanced .device-meta p {
            margin: 0;
            color: var(--text-muted, #7d8590);
            font-size: 11px;
            line-height: 1.4;
        }
        .device-item-enhanced .device-meta .device-id-text {
            font-family: monospace;
            font-size: 10px;
            color: #666;
            background: rgba(255,255,255,0.05);
            padding: 2px 6px;
            border-radius: 4px;
            display: inline-block;
            margin-top: 4px;
        }
        .device-item-enhanced .device-actions {
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .device-item-enhanced .device-status {
            padding: 4px 10px;
            border-radius: 20px;
            font-size: 11px;
            font-weight: 600;
        }
        .device-status.active { background: rgba(61,220,132,0.15); color: #3DDC84; }
        .device-status.inactive { background: rgba(255,71,87,0.15); color: #ff4757; }
        .device-remove-btn {
            width: 32px;
            height: 32px;
            border-radius: 8px;
            border: 1px solid rgba(255,71,87,0.3);
            background: rgba(255,71,87,0.1);
            color: #ff4757;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.2s;
            font-size: 13px;
        }
        .device-remove-btn:hover {
            background: rgba(255,71,87,0.25);
            border-color: #ff4757;
        }

/* --- Next block --- */

@keyframes planModalIn {
        from { opacity:0; transform: scale(0.88) translateY(30px); }
        to   { opacity:1; transform: scale(1) translateY(0); }
    }
    .plan-tab {
        flex:1; padding:7px 10px; border:none; border-radius:9px;
        font-size:12px; font-weight:700; cursor:pointer;
        transition:all 0.25s; color:#64748b; background:transparent;
        letter-spacing:0.3px;
    }
    .plan-tab.active {
        color:#0f172a; box-shadow:0 2px 12px rgba(0,0,0,0.4);
    }
    .plan-dot {
        width:8px; height:8px; border-radius:50%;
        background:rgba(255,255,255,0.15); border:none; cursor:pointer;
        transition:all 0.3s; padding:0;
    }
    .plan-dot.active {
        width:24px; border-radius:4px;
    }
    .plan-slide {
        min-width:100%; padding:20px 18px 4px; box-sizing:border-box;
    }
    .plan-card-inner {
        border-radius:18px; padding:22px 20px;
        display:flex; flex-direction:column;
        position:relative; overflow:hidden;
        transition:box-shadow 0.3s;
    }
    .plan-feature-row {
        display:flex; align-items:flex-start; gap:10px;
        padding:7px 0; border-bottom:1px solid rgba(255,255,255,0.04);
        font-size:13px;
    }
    .plan-feature-row:last-child { border-bottom:none; }
    .plan-cta-btn {
        width:100%; padding:13px; border:none; border-radius:12px;
        font-size:14px; font-weight:800; cursor:pointer;
        transition:all 0.25s; letter-spacing:0.3px;
        margin-top:16px;
    }
    .plan-cta-btn:hover { transform:translateY(-2px); filter:brightness(1.1); }