:root {
            --primary-dark: #0A0E27;
            --primary-blue: #00D4FF;
            --primary-blue-dark: #0099CC;
            --accent-orange: #FF6B35;
            --accent-green: #059669;
            --accent-red: #DC2626;
            --accent-yellow: #D97706;
            --accent-blue: #2563EB;
            --accent-purple: #8B5CF6;
            --text-white: #FFFFFF;
            --text-gray: #8B92B4;
            --text-light: #E2E8F0;
            --bg-app: #0A0E27;
            --bg-card: rgba(255,255,255,0.03);
            --bg-sidebar: #0A0E27;
            --text-main: #FFFFFF;
            --text-muted: #8B92B4;
            --border: rgba(255,255,255,0.08);
            --color-profit: #059669;
            --color-expense: #DC2626;
            --color-pending: #D97706;
            --color-progress: #2563EB;
            --color-done: #059669;
        }
        body[data-theme="cyan"],  body:not([data-theme]) { --primary-blue: #00D4FF; --primary-blue-dark: #0099CC; }
        body[data-theme="blue"]   { --primary-blue: #3B82F6; --primary-blue-dark: #2563EB; }
        body[data-theme="orange"] { --primary-blue: #FF6B35; --primary-blue-dark: #E55A2B; }
        body[data-theme="amber"]  { --primary-blue: #F59E0B; --primary-blue-dark: #D97706; }
        body[data-theme="green"]  { --primary-blue: #10B981; --primary-blue-dark: #059669; }
        body[data-theme="teal"]   { --primary-blue: #14B8A6; --primary-blue-dark: #0D9488; }
        body[data-theme="lime"]   { --primary-blue: #84CC16; --primary-blue-dark: #65A30D; }
        body[data-theme="purple"] { --primary-blue: #8B5CF6; --primary-blue-dark: #7C3AED; }
        body[data-theme="indigo"] { --primary-blue: #6366F1; --primary-blue-dark: #4F46E5; }
        body[data-theme="pink"]   { --primary-blue: #EC4899; --primary-blue-dark: #DB2777; }
        body[data-theme="rose"]   { --primary-blue: #F43F5E; --primary-blue-dark: #E11D48; }
        body[data-theme="red"]    { --primary-blue: #EF4444; --primary-blue-dark: #DC2626; }
        body[data-theme="slate"]  { --primary-blue: #64748B; --primary-blue-dark: #475569; }

        * { margin: 0; padding: 0; box-sizing: border-box; }

        body { 
            font-family: 'Inter', sans-serif; 
            background: var(--bg-app, var(--primary-dark)); 
            color: var(--text-main, var(--text-white)); 
            min-height: 100vh;
            overflow-x: hidden;
        }

        /* Scrollbar */
        ::-webkit-scrollbar { width: 8px; height: 8px; }
        ::-webkit-scrollbar-track { background: rgba(255,255,255,0.05); border-radius: 4px; }
        ::-webkit-scrollbar-thumb { background: var(--primary-blue); border-radius: 4px; }

        /* Layout Principal */
        .dashboard-layout { 
            display: flex; 
            min-height: 100vh;
        }

        /* Sidebar – usa cor do tema */
        .sidebar {
            width: 260px;
            background: linear-gradient(180deg, color-mix(in srgb, var(--primary-blue) 18%, #0f1535) 0%, #0A0E27 100%);
            border-right: 2px solid var(--primary-blue);
            padding: 1.5rem 1rem;
            display: flex;
            flex-direction: column;
            position: fixed;
            left: 0;
            top: 0;
            bottom: 0;
            z-index: 100;
            overflow-x: hidden;
            overflow-y: auto;
            transition: width 0.25s ease, padding 0.25s ease;
        }
        .sidebar.collapsed {
            width: 72px;
            padding: 1rem 0.5rem;
        }
        .sidebar.collapsed + .main-content { margin-left: 72px; }
        body.sidebar-collapsed .modal-overlay { left: 72px; }
        .sidebar.collapsed .sidebar-header .sidebar-title,
        .sidebar.collapsed .sidebar-header .sidebar-subtitle,
        .sidebar.collapsed .nav-btn .nav-btn-text,
        .sidebar.collapsed .btn-voltar .btn-voltar-text { display: none !important; }
        .sidebar.collapsed .sidebar-header { padding-bottom: 1rem; }
        .sidebar.collapsed .sidebar-logo { font-size: 3rem; }
        .sidebar.collapsed .nav-btn { justify-content: center; padding: 0.75rem; }
        .sidebar.collapsed .nav-btn .icon { font-size: 1.55rem; margin: 0; }
        .sidebar.collapsed .btn-sync-dados .icon { font-size: 1.2rem; }
        .sidebar:not(.collapsed) .nav-btn .icon { font-size: 1.2rem; }
        .sidebar.collapsed .sidebar-footer { align-items: center; }
        .sidebar.collapsed .sidebar-user-wrap { justify-content: center; }
        .sidebar.collapsed .btn-voltar { justify-content: center; padding: 0.6rem; }
        .sidebar.collapsed .btn-voltar .icon-voltar { font-size: 1.4rem; }
        .sidebar-toggle {
            position: absolute;
            top: 50%;
            right: -12px;
            transform: translateY(-50%);
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: var(--primary-blue);
            color: #0A0E27;
            border: 2px solid rgba(255,255,255,0.3);
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 0.75rem;
            z-index: 101;
            transition: transform 0.2s, background 0.2s;
            box-shadow: 0 2px 8px rgba(0,0,0,0.3);
        }
        .sidebar-toggle:hover { transform: translateY(-50%) scale(1.1); background: var(--primary-blue-dark); color: #fff; }
        .sidebar.collapsed .sidebar-toggle { right: -12px; }
        .sidebar.collapsed .sidebar-toggle .chevron-expand { display: inline; }
        .sidebar.collapsed .sidebar-toggle .chevron-collapse { display: none; }
        .sidebar-toggle .chevron-expand { display: none; }
        .sidebar-toggle .chevron-collapse { display: inline; }
        .sidebar-toggle .chevron-mobile { display: none; }
        .sidebar-toggle .chevron-desktop { display: inline; }

        .sidebar-header {
            text-align: center;
            padding-bottom: 1.5rem;
            border-bottom: 1px solid rgba(255,255,255,0.12);
            margin-bottom: 1.5rem;
        }

        .sidebar-logo { font-size: 4.25rem; margin-bottom: 0.5rem; display: flex; align-items: center; justify-content: center; width: 100%; }
        .sidebar-logo img.sidebar-logo-img { max-height: 82px; max-width: 272px; object-fit: contain; display: block; margin: 0 auto; }
        .sidebar.collapsed .sidebar-logo img.sidebar-logo-img { max-height: 3.4rem; max-width: 71px; }
        .sidebar-title { font-size: 1.1rem; font-weight: 700; }
        .sidebar-subtitle { font-size: 0.75rem; color: var(--text-gray); }
        .dashboard-sync-status { font-size: 0.75rem; margin-top: 0.5rem; padding: 0.35rem 0.5rem; border-radius: 6px; text-align: center; min-height: 1.2rem; }
        .dashboard-sync-status.status-offline { background: rgba(245,158,11,0.2); color: #FCD34D; border: 1px solid rgba(245,158,11,0.4); }
        .dashboard-sync-status.status-online { background: rgba(16,185,129,0.15); color: #6EE7B7; border: 1px solid rgba(16,185,129,0.35); }
        .dashboard-sync-status.status-syncing { background: rgba(0,212,255,0.15); color: var(--primary-blue); border: 1px solid rgba(0,212,255,0.35); }
        .dashboard-sync-status.status-synced { background: rgba(16,185,129,0.25); color: #6EE7B7; border: 1px solid rgba(16,185,129,0.5); }
        .sidebar-pagar-balao {
            display: none;
            margin-top: 0.75rem;
            padding: 0.9rem 0.85rem;
            background: linear-gradient(145deg, rgba(0,212,255,0.18) 0%, rgba(0,153,204,0.12) 100%);
            border: 1px solid rgba(0,212,255,0.45);
            border-radius: 12px;
            box-shadow: 0 4px 16px rgba(0,212,255,0.15);
            text-align: center;
        }
        .sidebar-pagar-balao.show { display: block; }
        .sidebar-pagar-balao .sidebar-pagar-titulo { font-size: 0.8rem; font-weight: 700; color: rgba(255,255,255,0.95); margin-bottom: 0.25rem; text-transform: uppercase; letter-spacing: 0.04em; }
        .sidebar-pagar-balao .sidebar-pagar-msg { font-size: 0.75rem; color: var(--text-gray); margin-bottom: 0.6rem; line-height: 1.3; }
        .sidebar-pagar-balao .sidebar-pagar-btn {
            display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
            width: 100%;
            padding: 0.6rem 1rem;
            font-size: 0.95rem; font-weight: 700;
            background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%);
            color: #0A0E27;
            border: none; border-radius: 10px;
            cursor: pointer;
            box-shadow: 0 3px 14px rgba(0,212,255,0.4);
            transition: transform 0.15s, box-shadow 0.2s;
        }
        .sidebar-pagar-balao .sidebar-pagar-btn:hover { transform: translateY(-2px); box-shadow: 0 5px 20px rgba(0,212,255,0.5); }
        .sidebar-pagar-balao .sidebar-pagar-btn:disabled { opacity: 0.85; cursor: wait; transform: none; }
        .sidebar.collapsed .sidebar-pagar-balao .sidebar-pagar-msg { display: none; }
        .sidebar.collapsed .sidebar-pagar-balao .sidebar-pagar-titulo { font-size: 0.7rem; }

        .nav-menu {
            display: flex;
            flex-direction: column;
            gap: 0.4rem;
            flex: 1;
        }

        .nav-btn {
            display: flex;
            align-items: center;
            gap: 0.7rem;
            padding: 0.85rem 1rem;
            border: none;
            border-radius: 10px;
            background: rgba(255,255,255,0.03);
            color: var(--text-gray);
            font-size: 0.9rem;
            cursor: pointer;
            transition: all 0.3s;
            text-align: left;
        }

        .nav-btn:hover {
            background: rgba(255,255,255,0.08);
            color: white;
            transform: translateX(3px);
        }

        .nav-btn.active {
            background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-blue-dark) 100%);
            color: white;
        }

        .nav-btn .icon { font-size: 1.2rem; flex-shrink: 0; }

        .sidebar-footer {
            padding-top: 1rem;
            border-top: 1px solid rgba(255,255,255,0.1);
            margin-top: auto;
        }

        .btn-voltar {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            width: 100%;
            padding: 0.7rem;
            border: 1px solid rgba(255,255,255,0.2);
            border-radius: 8px;
            background: transparent;
            color: var(--text-gray);
            font-size: 0.85rem;
            cursor: pointer;
            transition: all 0.3s;
        }
        .btn-upgrade-sidebar {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            width: 100%;
            padding: 0.7rem;
            border: 1px solid rgba(139,92,246,0.5);
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(139,92,246,0.25) 0%, rgba(124,58,237,0.2) 100%);
            color: #E9D5FF;
            font-size: 0.85rem;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s;
        }
        .btn-upgrade-sidebar:hover { background: linear-gradient(135deg, rgba(139,92,246,0.4) 0%, rgba(124,58,237,0.35) 100%); color: #fff; }
        .sidebar.collapsed .btn-upgrade-sidebar .btn-voltar-text { display: none; }

        .btn-voltar:hover {
            background: rgba(255,255,255,0.05);
            color: white;
            border-color: var(--primary-blue);
        }

        .btn-sync-dados {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            width: 100%;
            padding: 0.6rem 0.7rem;
            margin-bottom: 0.5rem;
            border: 1px solid rgba(0,212,255,0.35);
            border-radius: 8px;
            background: rgba(0,212,255,0.08);
            color: var(--primary-blue);
            font-size: 0.82rem;
            cursor: pointer;
            transition: all 0.2s;
        }
        .btn-sync-dados:hover {
            background: rgba(0,212,255,0.15);
            color: #fff;
            border-color: var(--primary-blue);
        }
        .sidebar.collapsed .btn-sync-dados .btn-sync-text { display: none !important; }
        .sidebar.collapsed .btn-sync-dados { justify-content: center; padding: 0.6rem; }

        /* Conteúdo Principal */
        .main-content {
            flex: 1;
            margin-left: 260px;
            padding: 0 2rem 1.5rem;
            position: relative;
            min-height: 100vh;
            max-height: 100vh;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            transition: margin-left 0.25s ease;
        }
        .main-top-bar {
            display: flex;
            justify-content: flex-end;
            align-items: center;
            padding: 0.75rem 0;
            margin-bottom: 0.5rem;
            border-bottom: 1px solid rgba(255,255,255,0.1);
            flex-shrink: 0;
        }
        .user-welcome-wrap {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            position: relative;
        }
        .user-welcome-wrap #welcomeMessage {
            font-size: 1rem;
            color: var(--text-light);
        }
        .header-plan-label {
            font-size: 0.8rem;
            font-weight: 600;
            color: var(--primary-blue);
            background: rgba(0,212,255,0.12);
            padding: 0.25rem 0.5rem;
            border-radius: 6px;
            margin-left: 0.35rem;
        }
        body.pdv-page-light .header-plan-label { color: #0ea5e9; background: rgba(14,165,233,0.15); }
        .user-avatar-wrap {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            cursor: pointer;
            padding: 0.5rem 0.85rem;
            border-radius: 10px;
            background: rgba(255,255,255,0.06);
            border: 1px solid rgba(255,255,255,0.12);
            min-height: 48px;
        }
        .user-avatar-wrap:hover { background: rgba(255,255,255,0.1); }
        .user-avatar-wrap img {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            object-fit: cover;
        }
        .user-avatar-wrap .no-photo {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: var(--primary-blue);
            color: #0A0E27;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.2rem;
        }
        .user-dropdown {
            position: absolute;
            top: 100%;
            right: 0;
            margin-top: 0.35rem;
            min-width: 160px;
            background: #1a1f3a;
            border: 1px solid rgba(255,255,255,0.15);
            border-radius: 8px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.4);
            z-index: 200;
            overflow: hidden;
        }
        .user-dropdown.hidden { display: none; }
        .user-dropdown a {
            display: block;
            padding: 0.65rem 1rem;
            color: var(--text-light);
            text-decoration: none;
            font-size: 0.9rem;
            border: none;
            background: none;
            width: 100%;
            text-align: left;
            cursor: pointer;
        }
        .user-dropdown a:hover { background: rgba(255,255,255,0.08); color: white; }
        .main-inner {
            flex: 1;
            overflow-y: auto;
            overflow-x: hidden;
            padding-top: 0.5rem;
        }

        .content-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 1.5rem;
            padding-bottom: 1rem;
            border-bottom: 1px solid rgba(255,255,255,0.1);
        }

        .content-header h1 {
            font-size: 1.6rem;
            display: flex;
            align-items: center;
            gap: 0.7rem;
        }

        .quick-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
            align-items: center;
        }

        .btn-primary {
            padding: 0.7rem 1.2rem;
            border: none;
            border-radius: 8px;
            background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%);
            color: white;
            font-weight: 600;
            font-size: 0.9rem;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            transition: all 0.3s;
            text-align: center;
        }

        .btn-primary:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 15px rgba(0,212,255,0.3);
        }

        /* Seções */
        .section { display: none; animation: fadeIn 0.3s ease; }
        .section.active { display: block; }

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

        /* Stats Grid */
        .stats-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
            gap: 1rem;
            margin-bottom: 1.5rem;
        }
        .stats-grid.overview-unified-cards {
            grid-template-columns: repeat(5, 1fr);
            gap: 0.75rem;
            margin-bottom: 1rem;
        }
        .charts-row.overview-charts-pair {
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
            margin-bottom: 1rem;
        }
        .chart-container-compact { padding: 1rem; }
        .chart-canvas-wrap { position: relative; height: 200px; }
        .top-products-chart-wrap {
            position: relative;
            max-height: 220px;
            overflow-y: auto;
            margin: 0.5rem 0 0.75rem;
            -webkit-overflow-scrolling: touch;
        }
        .top-products-chart-wrap[hidden] { display: none !important; }
        .finance-chart-scroll {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            margin: 0.5rem 0;
            touch-action: pan-x;
            padding-bottom: 0.25rem;
        }
        .finance-chart-inner {
            width: 720px;
            min-width: 720px;
            height: 220px;
            position: relative;
        }
        .finance-taxas-resumo { margin-top: 0.6rem; font-size: 0.85rem; color: var(--text-gray); }
        .overview-lucro-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 0.75rem;
        }
        .overview-lucro-card { padding: 0.85rem 0.7rem; text-align: center; }
        .overview-vendas-por-forma {
            margin: 0.5rem 0;
            padding: 0.55rem 0.65rem;
            background: rgba(255,255,255,0.03);
            border-radius: 8px;
            font-size: 0.85rem;
        }
        .overview-vendas-list { max-height: 280px; overflow-y: auto; }
        .empty-soft {
            color: var(--text-gray);
            text-align: center;
            padding: 0.85rem;
            margin: 0;
            font-size: 0.9rem;
        }
        .overview-recent-title { margin: 1.25rem 0 0.75rem; }
        .overview-vendas-unificadas .card-subtitle { margin-bottom: 0.35rem; }
        @media (max-width: 900px) {
            .stats-grid.overview-unified-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
            .overview-lucro-grid { grid-template-columns: 1fr 1fr; }
        }
        @media (max-width: 1024px) {
            .stats-grid.overview-unified-cards,
            .stats-grid.overview-top-cards {
                grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
                gap: 0.4rem;
            }
            .stats-grid.overview-unified-cards .stat-value { font-size: 0.95rem !important; }
            .stats-grid.overview-unified-cards .stat-label { font-size: 0.65rem !important; }
            .stats-grid.overview-unified-cards .stat-icon { font-size: 1.15rem !important; }
            .stats-grid.overview-unified-cards .stat-card { padding: 0.5rem 0.25rem !important; }
            .finance-chart-inner { width: 960px !important; min-width: 960px !important; height: 300px !important; }
        }

        /* Bloco de upgrade (seção bloqueada por plano) */
        .section-upgrade-block {
            max-width: 480px;
            margin: 2rem auto;
            padding: 2rem;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 16px;
            text-align: center;
        }
        .section-upgrade-block h3 { margin-bottom: 0.75rem; color: var(--text-light); font-size: 1.2rem; }
        .section-upgrade-block p { color: var(--text-gray); font-size: 0.95rem; margin-bottom: 1.25rem; line-height: 1.5; }
        .section-upgrade-block .btn-upgrade { padding: 0.75rem 1.5rem; border-radius: 10px; font-weight: 600; background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 100%); color: #fff; border: none; cursor: pointer; font-size: 1rem; }
        .section-upgrade-block .btn-upgrade:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(139,92,246,0.4); }

        /* Config Pagamentos: grid de planos */
        .config-pagamentos-planos-wrap { margin-bottom: 1.5rem; }
        .config-pagamentos-planos-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; }
        .config-plano-card { padding: 1.25rem; border-radius: 12px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); }
        .config-plano-card-destaque { border-color: rgba(0,212,255,0.4); background: rgba(0,212,255,0.06); }
        .config-plano-card-pro { border-color: rgba(139,92,246,0.5); background: rgba(139,92,246,0.08); }
        .config-plano-name { font-weight: 700; font-size: 1.1rem; margin-bottom: 0.35rem; color: var(--text-light); }
        .config-plano-preco { font-size: 1.4rem; font-weight: 700; color: var(--primary-blue); margin-bottom: 0.5rem; }
        .config-plano-card-pro .config-plano-preco { color: #C4B5FD; }
        .config-plano-desc { font-size: 0.8rem; color: var(--text-gray); line-height: 1.4; margin-bottom: 1rem; }
        .config-plano-topicos { font-size: 0.8rem; color: var(--text-gray); line-height: 1.4; margin-bottom: 1rem; }
        .config-plano-topicos ul { margin: 0; padding-left: 1.1rem; list-style: disc; }
        .config-plano-topicos li { margin-bottom: 0.25rem; }
        .config-plano-btn { width: 100%; padding: 0.6rem; font-size: 0.9rem; }
        .config-plano-btn-pro { background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 100%); }

        .stat-card {
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 12px;
            padding: 1.2rem;
            text-align: center;
            transition: all 0.3s;
        }

        .stat-card:hover {
            transform: translateY(-3px);
            border-color: rgba(0,212,255,0.3);
            box-shadow: 0 8px 25px rgba(0,0,0,0.2);
        }

        .btn-servico-rapido {
            display: inline-flex;
            align-items: center;
            min-height: 40px;
            padding: 0.45rem 0.85rem;
            border-radius: 8px;
            border: 1px solid #7DD3FC;
            background: #E0F2FE;
            color: #0C4A6E;
            font-size: 0.82rem;
            font-weight: 600;
            cursor: pointer;
            line-height: 1.25;
            text-align: left;
        }
        .btn-servico-rapido:hover {
            background: #BAE6FD;
            color: #075985;
        }
        body[data-appearance="light"] .btn-servico-rapido {
            background: #E0F2FE;
            color: #0C4A6E;
            border-color: #38BDF8;
        }
        body:not([data-appearance="light"]) .btn-servico-rapido {
            background: rgba(14, 165, 233, 0.22);
            color: #E0F2FE;
            border-color: rgba(56, 189, 248, 0.55);
        }
        body:not([data-appearance="light"]) .btn-servico-rapido:hover {
            background: rgba(14, 165, 233, 0.35);
            color: #fff;
        }
        .stat-icon { font-size: 2rem; margin-bottom: 0.5rem; }
        .stat-value { font-size: 1.6rem; font-weight: 700; color: var(--primary-blue); }
        .stat-label { font-size: 0.75rem; color: var(--text-gray); margin-top: 0.3rem; }

        /* Semântica financeira / status OS */
        .stat-card-open { border-left: 4px solid var(--color-pending); }
        .stat-card-open .stat-value { color: var(--color-pending); }
        .stat-card-progress { border-left: 4px solid var(--color-progress); }
        .stat-card-progress .stat-value { color: var(--color-progress); }
        .stat-card-done { border-left: 4px solid var(--color-done); }
        .stat-card-done .stat-value { color: var(--color-done); }
        .stat-card-revenue { border-left: 4px solid var(--primary-blue); }
        .stat-card-profit { border-left: 4px solid var(--color-profit); }
        .stat-card-profit .stat-value { color: var(--color-profit); }
        .stat-card-pending { border-left: 4px solid var(--color-pending); }
        .stat-card-pending .stat-value { color: var(--color-pending); }
        .stat-card-expense { border-left: 4px solid var(--color-expense); }
        .stat-card-expense .stat-value { color: var(--color-expense); }
        .text-profit, .value-profit { color: var(--color-profit) !important; }
        .text-expense, .value-expense { color: var(--color-expense) !important; }
        .text-pending, .value-pending { color: var(--color-pending) !important; }

        /* Cards Grid */
        .card-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
            gap: 1rem;
        }
        .pdv-card { border-radius: 12px; }
        .pdv-product-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
            gap: 0.75rem;
        }
        .pdv-product-grid .card { padding: 0.85rem; }
        .pdv-product-grid .btn-small.btn-view { padding: 0.5rem 0.85rem; font-weight: 600; }

        .card {
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 12px;
            padding: 1.2rem;
            transition: all 0.3s;
        }

        .card:hover {
            border-color: rgba(0,212,255,0.2);
            transform: translateY(-2px);
        }

        .card-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            margin-bottom: 0.8rem;
        }

        .card-title { font-size: 1rem; margin: 0; font-weight: 600; }
        .card-subtitle { font-size: 0.8rem; color: var(--text-gray); margin: 0.2rem 0 0; }
        .card-value { font-size: 1.3rem; font-weight: 700; color: var(--primary-blue); margin-top: 0.5rem; }

        .card-actions {
            display: flex;
            gap: 0.4rem;
            margin-top: 1rem;
            flex-wrap: wrap;
        }

        .view-toggle { display: flex; gap: 0.25rem; align-items: center; }
        .view-toggle button { padding: 0.4rem 0.8rem; border-radius: 8px; font-size: 0.8rem; cursor: pointer; border: 1px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.05); color: var(--text-light); }
        .view-toggle button.active { background: var(--primary-blue); color: #fff; border-color: var(--primary-blue); }
        .view-toggle button:hover:not(.active) { background: rgba(255,255,255,0.1); }
        /* Destaque: Quadro (visão por status) */
        .view-toggle button.view-toggle-featured {
            padding: 0.45rem 1rem;
            font-weight: 800;
            font-size: 0.85rem;
            letter-spacing: 0.01em;
            border: 2px solid var(--primary-blue);
            background: color-mix(in srgb, var(--primary-blue) 18%, transparent);
            color: #fff;
            box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary-blue) 35%, transparent), 0 4px 14px color-mix(in srgb, var(--primary-blue) 28%, transparent);
        }
        .view-toggle button.view-toggle-featured:hover:not(.active) {
            background: color-mix(in srgb, var(--primary-blue) 28%, transparent);
        }
        .view-toggle button.view-toggle-featured.active {
            background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-blue-dark) 100%);
            color: #fff;
            border-color: var(--primary-blue);
            box-shadow: 0 4px 18px color-mix(in srgb, var(--primary-blue) 45%, transparent);
        }
        .data-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
        .data-table th, .data-table td { padding: 0.75rem; text-align: left; border-bottom: 1px solid rgba(255,255,255,0.08); }
        .data-table th { color: var(--text-gray); font-weight: 600; }
        .data-table tr:hover { background: rgba(255,255,255,0.03); }
        .data-table .actions-cell { white-space: nowrap; }
        .data-table .actions-cell .btn-small { margin: 0 0.2rem; }
        .status-select-inline {
            min-width: 155px;
            padding: 0.3rem 0.45rem;
            border-radius: 8px;
            border: 1px solid rgba(255,255,255,0.2);
            background: rgba(255,255,255,0.07);
            color: var(--text-light);
            font-size: 0.82rem;
        }

        .btn-small {
            padding: 0.35rem 0.7rem;
            border: none;
            border-radius: 6px;
            font-size: 0.75rem;
            cursor: pointer;
            transition: all 0.2s;
        }

        .btn-view { background: rgba(0,212,255,0.15); color: #00D4FF; }
        .btn-view:hover { background: rgba(0,212,255,0.25); }
        .btn-edit { background: rgba(255,193,7,0.15); color: #FFC107; }
        .btn-edit:hover { background: rgba(255,193,7,0.25); }
        .btn-delete { background: rgba(239,68,68,0.15); color: #EF4444; }
        .btn-delete:hover { background: rgba(239,68,68,0.25); }
        .btn-qty-add { background: rgba(16,185,129,0.2); color: #10B981; }
        .btn-qty-add:hover { background: rgba(16,185,129,0.35); }
        .btn-qty-remove { background: rgba(245,158,11,0.2); color: #F59E0B; }
        .btn-qty-remove:hover { background: rgba(245,158,11,0.35); }
        .btn-pdf { background: rgba(16,185,129,0.15); color: #10B981; }
        .btn-pdf:hover { background: rgba(16,185,129,0.25); }
        .btn-whatsapp { background: rgba(37,211,102,0.15); color: #25D366; }
        .btn-whatsapp:hover { background: rgba(37,211,102,0.25); }
        .btn-payment { background: rgba(0,212,255,0.15); color: var(--primary-blue); }
        .btn-payment:hover { background: rgba(0,212,255,0.25); }

        /* Status Dropdown */
        .status-dropdown { position: relative; display: inline-block; }

        .status-dropdown-btn {
            padding: 0.3rem 0.7rem;
            border-radius: 15px;
            font-size: 0.7rem;
            font-weight: 600;
            border: none;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 0.3rem;
            color: inherit;
        }

        .status-dropdown-content {
            display: none;
            position: absolute;
            right: 0;
            background: linear-gradient(145deg, #0f1535 0%, #0A0E27 100%);
            min-width: 160px;
            box-shadow: 0 8px 25px rgba(0,0,0,0.4);
            border-radius: 10px;
            z-index: 100;
            border: 1px solid rgba(255,255,255,0.1);
            overflow: hidden;
        }

        .status-dropdown:hover .status-dropdown-content { display: block; }

        .status-menu-floating {
            background: linear-gradient(145deg, #0f1535 0%, #0A0E27 100%);
            min-width: 170px;
            box-shadow: 0 8px 25px rgba(0,0,0,0.45);
            border-radius: 10px;
            z-index: 9999;
            border: 1px solid rgba(255,255,255,0.12);
            overflow: hidden;
        }
        .status-menu-floating .status-option {
            color: #E2E8F0 !important;
        }
        .status-menu-floating .status-option.active {
            background: rgba(0,212,255,0.28);
            color: #fff !important;
            font-weight: 700;
        }

        .status-option {
            padding: 0.6rem 1rem;
            cursor: pointer;
            font-size: 0.8rem;
            transition: background 0.2s;
            display: flex;
            align-items: center;
            gap: 0.5rem;
            color: #E2E8F0;
        }

        .status-option:hover { background: rgba(255,255,255,0.1); color: #fff; }

        /* Status Colors — !important evita herança do tema claro (texto preto no fundo azul) */
        .status-pending,
        .status-dropdown-btn.status-pending { background: rgba(255,193,7,0.22) !important; color: #FFC107 !important; }
        .status-approved,
        .status-dropdown-btn.status-approved { background: rgba(16,185,129,0.22) !important; color: #34D399 !important; }
        .status-inprogress,
        .status-dropdown-btn.status-inprogress { background: rgba(0,212,255,0.22) !important; color: #67E8F9 !important; }
        .status-completed,
        .status-dropdown-btn.status-completed { background: rgba(139,92,246,0.22) !important; color: #C4B5FD !important; }
        .status-paid,
        .status-dropdown-btn.status-paid { background: rgba(16,185,129,0.3) !important; color: #34D399 !important; }
        .status-partial,
        .status-dropdown-btn.status-partial { background: rgba(255,159,64,0.22) !important; color: #FDBA74 !important; }
        .status-waiting-parts,
        .status-dropdown-btn.status-waiting-parts { background: rgba(245,158,11,0.25) !important; color: #FBBF24 !important; }
        .status-cancelled,
        .status-dropdown-btn.status-cancelled { background: rgba(239,68,68,0.22) !important; color: #FCA5A5 !important; }

        .quote-checklist .chk-item {
            display: flex;
            align-items: center;
            gap: 0.35rem;
            font-size: 0.82rem;
            color: var(--text-light);
            padding: 0.35rem 0.5rem;
            background: rgba(255,255,255,0.04);
            border-radius: 8px;
            cursor: pointer;
        }
        .quote-checklist .chk-item input { accent-color: var(--primary-blue); }
        .quote-fotos-actions .btn-add-item { min-height: 42px; }

        /* Lightbox fotos do aparelho */
        .foto-lightbox {
            display: none;
            position: fixed;
            inset: 0;
            z-index: 2147483000;
            background: rgba(2, 6, 23, 0.92);
            align-items: center;
            justify-content: center;
            padding: 1rem;
            box-sizing: border-box;
            -webkit-tap-highlight-color: transparent;
        }
        body.foto-lightbox-open { overflow: hidden; }
        .foto-lightbox-img {
            max-width: min(96vw, 920px);
            max-height: 86vh;
            width: auto;
            height: auto;
            object-fit: contain;
            border-radius: 10px;
            box-shadow: 0 20px 60px rgba(0,0,0,0.45);
            background: #0f172a;
        }
        .foto-lightbox-close {
            position: absolute;
            top: max(12px, env(safe-area-inset-top));
            right: max(12px, env(safe-area-inset-right));
            width: 44px;
            height: 44px;
            border: none;
            border-radius: 50%;
            background: rgba(255,255,255,0.18);
            color: #fff;
            font-size: 1.75rem;
            line-height: 1;
            cursor: pointer;
            z-index: 2;
        }
        .foto-lightbox-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 48px;
            height: 48px;
            border: none;
            border-radius: 50%;
            background: rgba(255,255,255,0.16);
            color: #fff;
            font-size: 2rem;
            line-height: 1;
            cursor: pointer;
            z-index: 2;
        }
        .foto-lightbox-prev { left: max(8px, env(safe-area-inset-left)); }
        .foto-lightbox-next { right: max(8px, env(safe-area-inset-right)); }
        .foto-lightbox-counter {
            position: absolute;
            bottom: max(16px, env(safe-area-inset-bottom));
            left: 50%;
            transform: translateX(-50%);
            color: #E2E8F0;
            font-size: 0.9rem;
            font-weight: 600;
            background: rgba(15,23,42,0.65);
            padding: 0.35rem 0.75rem;
            border-radius: 999px;
        }
        .doc-foto-thumb:hover { outline: 2px solid #2563EB; outline-offset: 1px; }
        @media print {
            .foto-lightbox, .foto-lightbox * { display: none !important; }
            .doc-fotos-block .no-print { display: none !important; }
            .doc-foto-thumb { border: 1px solid #dee2e6 !important; cursor: default !important; }
        }

        /* Payment Badge */
        .payment-badge {
            display: inline-flex;
            align-items: center;
            gap: 0.3rem;
            padding: 0.2rem 0.6rem;
            border-radius: 10px;
            font-size: 0.7rem;
            background: rgba(255,255,255,0.08);
            margin-top: 0.5rem;
            color: var(--text-gray);
        }

        /* Chart Containers */
        .chart-container {
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 12px;
            padding: 1.2rem;
            margin-bottom: 1.5rem;
            max-height: 320px;
            overflow: hidden;
        }
        .chart-container canvas {
            max-height: 220px;
            display: block;
        }

        .chart-container h3 {
            margin-bottom: 1rem;
            font-size: 1rem;
            color: var(--text-light);
        }

        .charts-row {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
            gap: 1.5rem;
            margin-bottom: 1.5rem;
            min-width: 0;
        }

        /* Activity History */
        .activity-list {
            max-height: 300px;
            overflow-y: auto;
        }

        .activity-item {
            display: flex;
            align-items: flex-start;
            gap: 0.8rem;
            padding: 0.8rem;
            border-bottom: 1px solid rgba(255,255,255,0.05);
            animation: fadeIn 0.3s ease;
        }

        .activity-icon {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1rem;
            flex-shrink: 0;
        }

        .activity-content { flex: 1; }
        .activity-text { margin: 0; font-size: 0.85rem; color: var(--text-light); }
        .activity-time { margin: 0.2rem 0 0; font-size: 0.7rem; color: var(--text-gray); }

        /* Modal */
        .modal-overlay {
            position: fixed;
            top: 0;
            left: 260px;
            right: 0;
            bottom: 0;
            background: rgba(0,0,0,0.85);
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 1000;
            padding: 1rem;
            overflow-y: auto;
        }

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

        /* Overlay suave para modais do PDV (menos preta fosca) */
        .modal-overlay.pdv-modal-overlay {
            background: rgba(15, 23, 42, 0.35);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            transition: opacity 0.2s ease;
        }
        body.pdv-standalone .modal-overlay.pdv-modal-overlay { left: 0; }
        .modal-overlay.pdv-modal-overlay.active {
            animation: pdvOverlayFade 0.2s ease;
        }

        /* Bloqueio do PDV até digitar senha (acima do conteúdo, abaixo dos modais globais) */
        .pdv-password-overlay {
            position: fixed;
            top: 0;
            left: 260px;
            right: 0;
            bottom: 0;
            z-index: 10002;
            display: none;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            background: rgba(10, 14, 39, 0.92);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
            padding: 1.5rem;
        }
        body.sidebar-collapsed .pdv-password-overlay { left: 72px; }
        body.pdv-standalone .pdv-password-overlay { left: 0; }
        .pdv-password-overlay-inner {
            display: flex;
            flex-direction: column;
            align-items: center;
            max-width: 380px;
        }
        .pdv-password-overlay-title {
            margin: 0 0 0.5rem;
            font-size: 1.25rem;
            font-weight: 700;
            color: var(--text-light, #e2e8f0);
        }
        .pdv-password-overlay-input {
            width: 100%;
            max-width: 280px;
            padding: 0.65rem 0.75rem;
            border-radius: 10px;
            border: 1px solid rgba(255,255,255,0.15);
            background: rgba(255,255,255,0.06);
            color: #fff;
            margin-bottom: 0.75rem;
            font-size: 1rem;
        }
        @keyframes pdvOverlayFade {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        .modal {
            background: linear-gradient(145deg, #0f1535 0%, #0A0E27 100%);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 16px;
            padding: 1.5rem;
            width: 100%;
            max-width: 650px;
            max-height: 90vh;
            overflow-y: auto;
            position: relative;
        }
        /* Garantir que inputs dentro de modais aceitam digitação e foco */
        .modal input:not([readonly]):not([disabled]),
        .modal select:not([disabled]),
        .modal textarea:not([readonly]):not([disabled]) {
            pointer-events: auto;
            -webkit-user-select: text;
            user-select: text;
        }

        .modal-close {
            position: absolute;
            top: 1rem;
            right: 1rem;
            background: rgba(255,255,255,0.1);
            border: none;
            color: white;
            width: 32px;
            height: 32px;
            border-radius: 50%;
            cursor: pointer;
            font-size: 1.2rem;
            transition: all 0.2s;
        }

        .modal-close:hover { background: rgba(239,68,68,0.3); }

        .modal-header { margin-bottom: 1.2rem; }
        .modal-header h2 { margin: 0; font-size: 1.3rem; display: flex; align-items: center; gap: 0.5rem; }

        /* Forms */
        .form-group { margin-bottom: 1rem; }

        .form-group label {
            display: block;
            margin-bottom: 0.4rem;
            font-size: 0.85rem;
            color: var(--text-light);
            font-weight: 500;
        }

        .form-group input,
        .form-group select,
        .form-group textarea {
            width: 100%;
            padding: 0.7rem 1rem;
            border: 1px solid rgba(0,0,0,0.2);
            border-radius: 8px;
            background: #ffffff;
            color: #000000;
            font-size: 0.9rem;
            font-family: inherit;
        }

        .form-group input:focus,
        .form-group select:focus,
        .form-group textarea:focus {
            outline: none;
            border-color: var(--primary-blue);
        }

        #quotesFilterStatus,
        #quotesFilterStatus option { background: #1a1f3a !important; color: #E2E8F0 !important; }
        #vendaAvulsaPayment, #vendaAvulsaParcelas { background: #1a1f3a !important; color: #E2E8F0 !important; }
        #vendaAvulsaPayment option, #vendaAvulsaParcelas option { background: #1a1f3a !important; color: #E2E8F0 !important; }
        #section-venda .card { background: rgba(255,255,255,0.03); color: #E2E8F0; }
        #section-venda .card .card-title, #section-venda .card label, #section-venda .card p { color: #E2E8F0; }
        #section-venda #vendaCartItems, #section-venda #vendaCartItems p { color: #E2E8F0; }

        /* PDV repaginado - tela clara e intuitiva */
        .pdv-section { background: #f8fafc; color: #1e293b; }
        .pdv-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 2px solid #e2e8f0; }
        .pdv-header h1 { margin: 0; font-size: 1.5rem; color: #0f172a; }
        .pdv-datetime { margin: 0.25rem 0 0; font-size: 0.8rem; color: #64748b; font-weight: 500; }
        .pdv-vendedor-wrap { display: flex; flex-direction: column; align-items: flex-end; }
        .pdv-vendedor-label { font-size: 0.75rem; color: #64748b; margin-bottom: 0.25rem; }
        .pdv-vendedor-select { padding: 0.6rem 1rem; border-radius: 10px; border: 2px solid #cbd5e1; background: #fff !important; color: #1e293b !important; font-size: 0.95rem; min-width: 180px; }
        .pdv-section .pdv-vendedor-select option { background: #fff !important; color: #1e293b !important; }
        .pdv-vendedor-status { margin: 0.25rem 0 0; font-size: 0.8rem; color: #64748b; }
        .pdv-main { max-width: 720px; margin: 0 auto; }
        .pdv-barcode-input { width: 100%; max-width: 320px; padding: 0.6rem 1rem; border-radius: 10px; border: 2px solid #e2e8f0; background: #fff; color: #334155; font-size: 1rem; margin-bottom: 0.35rem; }
        .pdv-barcode-input:focus { outline: none; border-color: var(--primary-blue); }
        .pdv-barcode-hint { font-size: 0.8rem; color: #64748b; margin: 0 0 1rem; max-width: 420px; line-height: 1.4; }
        .pdv-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 2rem; align-items: stretch; }
        .pdv-btn-add, .pdv-btn-manual { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem 1.5rem; border-radius: 16px; border: 2px dashed #cbd5e1; background: #fff; color: #334155; font-size: 1.1rem; font-weight: 600; cursor: pointer; transition: all 0.2s; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
        .pdv-btn-add:hover, .pdv-btn-manual:hover { border-color: var(--primary-blue); background: rgba(0,212,255,0.06); color: var(--primary-blue); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
        .pdv-btn-add { border-color: #10B981; color: #059669; }
        .pdv-btn-add:hover { border-color: #059669; background: rgba(16,185,129,0.08); color: #047857; }
        .pdv-btn-manual { border-color: #F59E0B; color: #D97706; }
        .pdv-btn-manual:hover { border-color: #D97706; background: rgba(245,158,11,0.08); color: #B45309; }
        .pdv-btn-icon { font-size: 2.5rem; margin-bottom: 0.5rem; }
        .pdv-btn-text { display: block; }
        .pdv-btn-hint { font-size: 0.8rem; font-weight: 400; color: #94a3b8; margin-top: 0.25rem; }
        .pdv-btn-shortcut { font-size: 0.7rem; color: #cbd5e1; margin-top: 0.2rem; font-weight: 600; }
        .pdv-cart-box { background: #fff; border-radius: 16px; padding: 1.5rem; box-shadow: 0 4px 20px rgba(0,0,0,0.08); border: 1px solid #e2e8f0; }
        .pdv-cart-title { margin: 0 0 0.5rem; font-size: 1rem; color: #64748b; }
        .pdv-cart-count { font-size: 0.8rem; color: #94a3b8; margin-bottom: 0.75rem; }
        .pdv-cart-items { min-height: 80px; max-height: 280px; overflow-y: auto; margin-bottom: 1rem; }
        .pdv-cart-items .pdv-cart-item { display: flex; justify-content: space-between; align-items: center; padding: 0.7rem 0; border-bottom: 1px solid #f1f5f9; color: #334155; font-size: 0.95rem; }
        .pdv-cart-items .pdv-cart-item .pdv-cart-item-rm { background: #fee2e2; color: #dc2626; border: none; padding: 0.3rem 0.6rem; border-radius: 8px; cursor: pointer; font-size: 1rem; font-weight: 700; line-height: 1; transition: background 0.15s; }
        .pdv-cart-items .pdv-cart-item .pdv-cart-item-rm:hover { background: #fecaca; }
        .pdv-cart-total-box { background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%); border: 1px solid #bae6fd; border-radius: 12px; padding: 1rem 1.25rem; margin-top: 0.75rem; }
        .pdv-cart-total-wrap { display: flex; justify-content: space-between; align-items: center; }
        .pdv-cart-total-label { font-size: 1rem; font-weight: 600; color: #0c4a6e; }
        .pdv-cart-total-value { font-size: 1.75rem; font-weight: 800; color: #0369a1; letter-spacing: -0.02em; }
        .pdv-cart-empty { color: #94a3b8; font-size: 0.95rem; padding: 2rem 1rem; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; }
        .pdv-cart-empty-icon { font-size: 2.5rem; opacity: 0.6; }
        .pdv-payment-row { margin-top: 1rem; }
        .pdv-payment-row label, .pdv-parcelas-wrap label { display: block; font-size: 0.85rem; color: #64748b; margin-bottom: 0.35rem; }
        .pdv-payment-select { width: 100%; max-width: 260px; padding: 0.65rem 1rem; border-radius: 10px; border: 2px solid #e2e8f0; background: #fff; color: #334155; font-size: 1rem; }
        .pdv-payment-shortcuts { font-size: 0.75rem; color: #94a3b8; margin: 0.4rem 0 0; }
        .pdv-payment-shortcuts kbd { padding: 0.1rem 0.35rem; background: #e2e8f0; border-radius: 4px; color: #475569; font-size: 0.7rem; }
        .pdv-parcelas-wrap { margin-top: 0.75rem; }
        .pdv-parcelas-wrap select { padding: 0.5rem; border-radius: 8px; border: 1px solid #e2e8f0; background: #fff; color: #334155; }
        .pdv-juros-info, .pdv-liquido-info { font-size: 0.8rem; color: #64748b; margin-top: 0.35rem; }
        .pdv-finalize-actions { display: flex; gap: 0.75rem; margin-top: 1.25rem; flex-wrap: wrap; }
        .pdv-btn-finalize { padding: 0.9rem 1.75rem; font-size: 1.05rem; font-weight: 600; border-radius: 12px; border: none; background: linear-gradient(135deg, #10B981 0%, #059669 100%); color: #fff; cursor: pointer; transition: transform 0.2s; }
        .pdv-btn-finalize:hover { transform: scale(1.02); }
        .pdv-btn-clear { padding: 0.7rem 1.25rem; border-radius: 10px; border: 1px solid #e2e8f0; background: #fff; color: #64748b; cursor: pointer; font-size: 0.95rem; }
        .pdv-btn-clear:hover { background: #fef2f2; color: #dc2626; }
        .pdv-caixa-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
        .pdv-btn-sangria { padding: 0.5rem 1rem; border-radius: 8px; border: 1px solid #fecaca; background: #fef2f2; color: #b91c1c; font-size: 0.9rem; cursor: pointer; }
        .pdv-btn-sangria:hover { background: #fee2e2; }
        .pdv-btn-reforco { padding: 0.5rem 1rem; border-radius: 8px; border: 1px solid #bbf7d0; background: #f0fdf4; color: #15803d; font-size: 0.9rem; cursor: pointer; }
        .pdv-btn-reforco:hover { background: #dcfce7; }
        /* Modal PDV Produtos */
        .pdv-modal-produtos { max-width: 90vw; width: 720px; max-height: 85vh; display: flex; flex-direction: column; background: #fff; color: #1e293b; border-radius: 20px; box-shadow: 0 25px 50px rgba(0,0,0,0.15); }
        .pdv-modal-produtos-header { padding-bottom: 1rem; border-bottom: 1px solid #e2e8f0; margin-bottom: 1rem; }
        .pdv-modal-produtos-title-row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.35rem; }
        .pdv-modal-produtos-header h2 { margin: 0; font-size: 1.35rem; color: #0f172a; }
        .pdv-modal-produtos-count { font-size: 0.85rem; color: #64748b; font-weight: 600; background: #f1f5f9; padding: 0.35rem 0.75rem; border-radius: 20px; }
        .pdv-modal-produtos-hint { margin: 0 0 0.75rem; font-size: 0.8rem; color: #94a3b8; }
        .pdv-modal-produtos-hint kbd { font-size: 0.75rem; padding: 0.15rem 0.4rem; background: #e2e8f0; border-radius: 4px; color: #475569; }
        .pdv-modal-produtos-header input { width: 100%; padding: 0.75rem 1rem; border-radius: 12px; border: 2px solid #e2e8f0; font-size: 1rem; margin-bottom: 0.5rem; transition: border-color 0.2s; }
        .pdv-modal-produtos-header input:focus { outline: none; border-color: var(--primary-blue); }
        .pdv-modal-categoria-label { display: block; font-size: 0.8rem; color: #64748b; margin: 0 0 0.35rem; font-weight: 600; }
        .pdv-modal-produtos-filters { display: flex; gap: 0.5rem; flex-wrap: wrap; width: 100%; }
        .pdv-modal-produtos-filters select,
        .pdv-modal-categoria-select { padding: 0.5rem 1rem; border-radius: 10px; border: 2px solid #e2e8f0; background: #fff; color: #334155; font-size: 0.9rem; min-width: 0; flex: 1 1 200px; }
        .pdv-modal-produtos-list { flex: 1; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.75rem; min-height: 120px; }
        .pdv-modal-prod-item { padding: 1rem; border-radius: 14px; border: 2px solid #e2e8f0; background: #f8fafc; cursor: pointer; transition: all 0.2s; text-align: left; }
        .pdv-modal-prod-item:hover { border-color: var(--primary-blue); background: rgba(0,212,255,0.08); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
        .pdv-modal-prod-item .name { font-weight: 600; color: #1e293b; margin-bottom: 0.25rem; display: block; line-height: 1.3; }
        .pdv-modal-prod-item .price { color: #059669; font-weight: 700; font-size: 1.05rem; }
        .pdv-modal-prod-item .code { font-size: 0.8rem; color: #94a3b8; margin-top: 0.2rem; display: block; }
        .pdv-modal-prod-empty { grid-column: 1 / -1; text-align: center; padding: 2.5rem 1rem; color: #64748b; }
        .pdv-modal-prod-empty-icon { font-size: 3rem; margin-bottom: 0.5rem; opacity: 0.5; }
        /* Modal PDV Qty */
        .pdv-modal-qty { max-width: 380px; background: #fff; color: #1e293b; }
        .pdv-modal-qty h2 { margin: 0 0 0.5rem; font-size: 1.2rem; }
        .pdv-modal-qty-sub { margin: 0 0 1.25rem; color: #64748b; font-size: 0.9rem; }
        .pdv-modal-qty-row { margin-bottom: 1rem; }
        .pdv-modal-qty-row label { display: block; font-size: 0.85rem; color: #64748b; margin-bottom: 0.35rem; }
        .pdv-modal-qty-row input { width: 100%; padding: 0.75rem; border-radius: 10px; border: 2px solid #e2e8f0; font-size: 1.1rem; }
        .pdv-modal-price-row input { font-weight: 600; }
        .pdv-modal-qty-btn { width: 100%; padding: 0.9rem; font-size: 1rem; margin-top: 0.5rem; }
        /* Modal PDV Valor manual */
        .pdv-modal-valor { max-width: 340px; background: #fff; color: #1e293b; }
        .pdv-modal-valor h2 { margin: 0 0 0.5rem; }
        .pdv-modal-valor-hint { margin: 0 0 1rem; color: #64748b; font-size: 0.9rem; }
        .pdv-modal-valor-display { font-size: 2rem; font-weight: 700; text-align: right; padding: 1rem; background: #f1f5f9; border-radius: 12px; margin-bottom: 1rem; color: #0f172a; display: block; width: 100%; box-sizing: border-box; border: 2px solid #e2e8f0; }
        .pdv-modal-valor-input:focus { outline: none; border-color: var(--primary-blue); }
        .pdv-calc-buttons { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-bottom: 1rem; }
        .pdv-calc-btn { padding: 1rem; font-size: 1.25rem; font-weight: 600; border-radius: 10px; border: 2px solid #e2e8f0; background: #f8fafc; color: #334155; cursor: pointer; transition: all 0.15s; }
        .pdv-calc-btn:hover { background: #e2e8f0; border-color: #cbd5e1; }
        .pdv-calc-clear { background: #fee2e2; color: #dc2626; border-color: #fecaca; }
        .pdv-modal-valor-desc { margin-bottom: 1rem; }
        .pdv-modal-valor-desc label { display: block; font-size: 0.85rem; color: #64748b; margin-bottom: 0.35rem; }
        .pdv-modal-valor-desc input { width: 100%; padding: 0.65rem; border-radius: 8px; border: 2px solid #e2e8f0; }
        .pdv-modal-valor-ok { width: 100%; padding: 0.9rem; font-size: 1rem; }
        .quote-step { display: none; }
        .quote-step.active { display: block; }
        .quote-step-indicator { font-size: 0.85rem; color: var(--text-gray); margin-top: 0.35rem; }
        .quote-wizard-actions { display: flex; gap: 0.75rem; justify-content: flex-end; margin-top: 1.5rem; flex-wrap: wrap; }
        .quote-wizard-actions .btn-secondary { padding: 0.7rem 1.2rem; background: rgba(255,255,255,0.1); color: var(--text-light); border: 1px solid rgba(255,255,255,0.2); border-radius: 8px; cursor: pointer; }

        .form-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }

        .theme-btn {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            border: 3px solid transparent;
            cursor: pointer;
            transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
        }
        .theme-btn:hover { transform: scale(1.12); box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
        .theme-btn.active { border-color: #fff; box-shadow: 0 0 0 2px rgba(255,255,255,0.8); }
        .theme-option { display: flex; flex-direction: column; align-items: center; gap: 0.35rem; }
        .theme-option span { font-size: 0.75rem; color: var(--text-gray); white-space: nowrap; }

        .form-section {
            background: rgba(255,255,255,0.02);
            border: 1px solid rgba(255,255,255,0.05);
            border-radius: 10px;
            padding: 1rem;
            margin-bottom: 1rem;
        }

        .config-buttons-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; }
        .config-menu-btn { display: flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 1rem 1.25rem; border-radius: 12px; border: 1px solid rgba(255,255,255,0.15); background: rgba(255,255,255,0.06); color: var(--text-light); font-size: 0.95rem; font-weight: 500; cursor: pointer; transition: all 0.2s; text-align: center; }
        .config-menu-btn:hover { background: rgba(0,212,255,0.15); border-color: var(--primary-blue); color: #fff; }

        .form-section h4 {
            color: var(--primary-blue);
            margin-bottom: 0.8rem;
            font-size: 0.9rem;
        }

        /* Página Pagamentos / Mensalidade - template atraente */
        .config-page-pagamentos .main-inner { max-width: 520px; }
        .config-pagamentos-nav { margin-bottom: 1.25rem; }
        .config-pagamentos-back {
            background: rgba(255,255,255,0.06); color: var(--text-light);
            border: 1px solid rgba(255,255,255,0.1); border-radius: 14px;
            padding: 0.7rem 1.1rem; font-size: 0.95rem; cursor: pointer;
            transition: background 0.2s, border-color 0.2s, color 0.2s;
        }
        .config-pagamentos-back:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.18); color: #fff; }
        .config-pagamentos-card {
            max-width: 100%;
            background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(15,20,35,0.6) 100%);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 24px;
            box-shadow: 0 20px 50px rgba(0,0,0,0.35), 0 0 0 1px rgba(34,197,94,0.08);
            overflow: hidden;
        }
        .config-pagamentos-hero {
            height: 6px;
            background: linear-gradient(90deg, #22C55E 0%, #16A34A 50%, #15803D 100%);
            opacity: 0.9;
        }
        .config-pagamentos-card-inner { padding: 2.25rem 2rem; }
        .config-pagamentos-badge {
            display: inline-block;
            font-size: 0.8rem;
            font-weight: 600;
            color: #22C55E;
            background: rgba(34,197,94,0.12);
            padding: 0.35rem 0.75rem;
            border-radius: 20px;
            margin-bottom: 0.75rem;
            letter-spacing: 0.02em;
        }
        .config-pagamentos-header { margin-bottom: 1.5rem; }
        .config-pagamentos-title { font-size: 1.85rem; font-weight: 700; margin: 0 0 0.4rem; color: #fff; letter-spacing: -0.03em; }
        .config-pagamentos-sub { margin: 0; font-size: 1rem; color: var(--text-gray); line-height: 1.5; }
        .config-pagamentos-status {
            margin-bottom: 1.5rem;
            padding: 1.35rem 1.5rem;
            background: rgba(255,255,255,0.04);
            border-radius: 18px;
            border: 1px solid rgba(255,255,255,0.06);
        }
        .config-pagamentos-status-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }
        .config-pagamentos-status-item { display: flex; flex-direction: column; gap: 0.25rem; }
        .config-pagamentos-status-label { font-size: 0.8rem; color: var(--text-gray); text-transform: uppercase; letter-spacing: 0.04em; }
        .config-pagamentos-status-value { font-size: 1.1rem; font-weight: 600; color: #fff; }
        .config-pagamentos-status-value.config-pagamentos-dia { font-size: 1rem; font-weight: 500; color: rgba(255,255,255,0.85); }
        @media (max-width: 480px) { .config-pagamentos-status-grid { grid-template-columns: 1fr; } }
        .config-pagamentos-box-online {
            padding: 2rem;
            background: linear-gradient(160deg, rgba(34,197,94,0.12) 0%, rgba(22,163,74,0.06) 100%);
            border: 1px solid rgba(34,197,94,0.25);
            border-radius: 20px;
            margin-bottom: 1.5rem;
            box-shadow: 0 8px 24px rgba(34,197,94,0.08);
        }
        .config-pagamentos-preco {
            font-size: 2rem;
            font-weight: 700;
            color: #fff;
            margin-bottom: 0.5rem;
            letter-spacing: -0.02em;
        }
        .config-pagamentos-preco span { font-size: 1rem; font-weight: 500; color: var(--text-gray); }
        .config-pagamentos-seguro {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            font-size: 0.95rem;
            font-weight: 600;
            color: #4ADE80;
            margin-bottom: 0.6rem;
        }
        .config-pagamentos-lock { font-size: 1.1rem; }
        .config-pagamentos-desc {
            color: rgba(255,255,255,0.7);
            font-size: 0.9rem;
            margin: 0 0 1.5rem;
            line-height: 1.5;
        }
        .config-pagamentos-cta {
            width: 100%;
            padding: 1.15rem 1.5rem;
            font-size: 1.08rem;
            font-weight: 600;
            background: linear-gradient(135deg, #22C55E 0%, #16A34A 100%) !important;
            border: none;
            border-radius: 16px;
            color: #fff;
            cursor: pointer;
            transition: transform 0.15s, box-shadow 0.2s;
            box-shadow: 0 4px 16px rgba(34,197,94,0.3);
        }
        .config-pagamentos-cta:hover {
            transform: translateY(-2px);
            box-shadow: 0 10px 28px rgba(34,197,94,0.4);
        }
        .config-pagamentos-footer { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,0.08); }
        .config-pagamentos-whatsapp-btn {
            width: 100%;
            padding: 0.9rem 1.25rem;
            font-size: 1rem;
            background: #25D366;
            color: #fff;
            border: none;
            border-radius: 14px;
            cursor: pointer;
            font-weight: 500;
            transition: filter 0.2s, transform 0.15s;
        }
        .config-pagamentos-whatsapp-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
        .config-pagamentos-dados {
            padding: 1.25rem;
            background: rgba(255,255,255,0.04);
            border-radius: 12px;
            border: 1px solid rgba(255,255,255,0.08);
            margin-bottom: 1rem;
        }
        .config-pagamentos-cartao { margin-bottom: 1rem; }
        .config-pagamentos-cartao-titulo { font-size: 0.9rem; font-weight: 600; margin: 0 0 0.5rem; }
        .config-pagamentos-details { margin-top: 1rem; border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; overflow: hidden; }
        .config-pagamentos-details summary { padding: 0.75rem 1rem; cursor: pointer; font-size: 0.9rem; color: var(--text-gray); list-style: none; }
        .config-pagamentos-details summary::-webkit-details-marker { display: none; }
        .config-pagamentos-details summary::before { content: '▸ '; }
        .config-pagamentos-details[open] summary::before { content: '▾ '; }
        .config-pagamentos-details .config-pagamentos-dados { margin: 0; border-radius: 0; border: none; border-top: 1px solid rgba(255,255,255,0.06); }
        .config-pagamentos-details .config-pagamentos-cartao { padding: 0 1rem 1rem; }

        /* Quote Items */
        .quote-item-row {
            display: flex;
            gap: 0.5rem;
            margin-bottom: 0.5rem;
            align-items: center;
        }

        .quote-item-row input {
            flex: 2;
            padding: 0.6rem;
            border: 1px solid rgba(0,0,0,0.2);
            border-radius: 6px;
            background: #ffffff;
            color: #000000;
        }

        .quote-item-row input.item-value { flex: 1; }

        .btn-remove-item {
            width: 28px;
            height: 28px;
            background: rgba(239,68,68,0.2);
            border: none;
            border-radius: 6px;
            color: #EF4444;
            font-size: 1rem;
            cursor: pointer;
            transition: all 0.2s;
        }

        .btn-remove-item:hover { background: rgba(239,68,68,0.3); }

        .btn-add-item {
            width: 100%;
            padding: 0.7rem;
            background: rgba(16,185,129,0.1);
            border: 2px dashed rgba(16,185,129,0.3);
            border-radius: 8px;
            color: var(--accent-green);
            font-weight: 600;
            cursor: pointer;
            transition: all 0.2s;
        }

        .btn-add-item:hover {
            background: rgba(16,185,129,0.2);
            border-color: var(--accent-green);
        }

        /* Calculations */
        .quote-calculations {
            background: rgba(0,212,255,0.05);
            border: 1px solid rgba(0,212,255,0.2);
            border-radius: 10px;
            padding: 1rem;
            margin: 1rem 0;
        }

        .calc-row {
            display: flex;
            justify-content: space-between;
            padding: 0.4rem 0;
            border-bottom: 1px solid rgba(255,255,255,0.05);
            font-size: 0.9rem;
        }

        .calc-row.total-row {
            font-size: 1.1rem;
            font-weight: 700;
            color: var(--primary-blue);
            border-bottom: none;
            padding-top: 0.6rem;
        }

        .discount-row input {
            width: 70px;
            padding: 0.25rem;
            border: 1px solid rgba(0,0,0,0.2);
            border-radius: 4px;
            background: #ffffff;
            color: #000000;
            text-align: center;
        }

        /* Company Select */
        .company-select {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-height: 100vh;
            padding: 2rem;
            background: linear-gradient(135deg, #0A0E27 0%, #1a1f3a 100%);
        }

        .company-select h1 {
            margin-bottom: 2.5rem;
            font-size: 1.8rem;
            text-align: center;
        }

        .company-buttons {
            display: flex;
            gap: 1.5rem;
            flex-wrap: wrap;
            justify-content: center;
        }

        .company-btn {
            width: 260px;
            padding: 2rem;
            border: 2px solid;
            border-radius: 16px;
            background: rgba(255,255,255,0.02);
            cursor: pointer;
            transition: all 0.3s;
            text-align: center;
        }

        .company-btn.tech {
            border-color: var(--primary-blue);
            color: var(--primary-blue);
        }

        .company-btn.tech:hover {
            background: rgba(0,212,255,0.1);
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(0,212,255,0.2);
        }

        .company-btn.car {
            border-color: var(--accent-orange);
            color: var(--accent-orange);
        }

        .company-btn.car:hover {
            background: rgba(255,107,53,0.1);
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(255,107,53,0.2);
        }

        .company-btn .icon { font-size: 3.5rem; margin-bottom: 0.8rem; }
        .company-btn h3 { font-size: 1.3rem; margin: 0; }
        .company-btn p { font-size: 0.85rem; margin: 0.4rem 0 0; opacity: 0.7; }

        /* ========== LOGIN – Layout como no print (duas colunas, limpo) ========== */
        .login-page {
            min-height: 100vh;
            display: grid;
            grid-template-columns: 1fr 1fr;
            align-items: stretch;
        }
        .login-page .login-left {
            background: #0c1220;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: 3rem 3.5rem;
            position: relative;
        }
        .login-page .login-left .brand-wrap {
            position: relative;
            z-index: 1;
            max-width: 400px;
            text-align: center;
            animation: loginFloat 5s ease-in-out 1.2s infinite;
        }
        @keyframes loginFadeInUp {
            from { opacity: 0; transform: translateY(12px); }
            to { opacity: 1; transform: translateY(0); }
        }
        @keyframes loginFloat {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-8px); }
        }
        .login-page .login-left .brand {
            margin-bottom: 1.5rem;
            display: flex;
            justify-content: center;
            padding: 0.75rem 1rem;
            background: #0c1220;
            border-radius: 12px;
            animation: loginFadeInUp 0.8s ease-out;
        }
        .login-page .login-left .login-brand-img {
            max-height: 195px;
            max-width: 442px;
            width: auto;
            height: auto;
            object-fit: contain;
            display: block;
            background: transparent !important;
            mix-blend-mode: normal;
        }
        .login-page .login-left .brand-title {
            font-size: 1.95rem;
            font-weight: 700;
            color: #fff;
            margin-bottom: 0.75rem;
            letter-spacing: -0.02em;
            line-height: 1.2;
            animation: loginFadeInUp 0.8s ease-out 0.15s both;
        }
        .login-page .login-left .brand-desc {
            font-size: 1rem;
            color: rgba(255,255,255,0.65);
            max-width: 360px;
            margin: 0 auto;
            line-height: 1.6;
            font-weight: 400;
            animation: loginFadeInUp 0.8s ease-out 0.3s both;
        }
        .login-page .login-right {
            background: #0a0e18;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 2.5rem 3rem;
            position: relative;
        }
        .login-card {
            width: 100%;
            max-width: 400px;
            background: rgba(255,255,255,0.05);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 16px;
            padding: 2.5rem 2.25rem;
            box-shadow: 0 20px 50px rgba(0,0,0,0.3);
            position: relative;
        }
        .login-card .logo {
            margin-bottom: 1.35rem;
            text-align: center;
            padding: 0.5rem;
            background: rgba(0,0,0,0.2);
            border-radius: 10px;
        }
        .login-card .login-card-logo-img {
            max-height: 52px;
            max-width: 130px;
            width: auto;
            height: auto;
            object-fit: contain;
            display: inline-block;
            background: transparent !important;
            mix-blend-mode: normal;
        }
        .login-card h1 {
            font-size: 1.5rem;
            text-align: center;
            color: #fff;
            margin-bottom: 0.3rem;
            font-weight: 700;
        }
        .login-card .login-sub {
            text-align: center;
            color: rgba(255,255,255,0.5);
            font-size: 0.875rem;
            margin-bottom: 1.75rem;
        }
        .login-card .form-group {
            margin-bottom: 1.35rem;
            position: relative;
        }
        .login-card .form-group label {
            display: block;
            font-size: 0.8rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
            color: rgba(255,255,255,0.85);
            text-transform: uppercase;
            letter-spacing: 0.05em;
        }
        .login-card .form-group input {
            width: 100%;
            padding: 0.85rem 1rem;
            padding-right: 2.75rem;
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 10px;
            background: rgba(0,0,0,0.25);
            color: #fff;
            font-size: 1rem;
            transition: border-color 0.2s, background 0.2s;
        }
        .login-card .form-group input::placeholder { color: rgba(255,255,255,0.35); }
        .login-card .form-group input:focus {
            outline: none;
            border-color: rgba(0,212,255,0.5);
            background: rgba(0,0,0,0.3);
        }
        .login-card .form-group.input-error input { border-color: var(--accent-red); box-shadow: 0 0 0 2px rgba(239,68,68,0.2); }
        .login-card .password-wrap { position: relative; }
        .login-card .password-wrap input { padding-right: 2.75rem; }
        .login-card .btn-toggle-pwd {
            position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
            background: none; border: none; color: rgba(255,255,255,0.5); cursor: pointer;
            padding: 0.25rem; font-size: 1.1rem;
            transition: color 0.2s;
        }
        .login-card .btn-toggle-pwd:hover { color: rgba(255,255,255,0.9); }
        .login-card .login-options {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 1.5rem;
            flex-wrap: wrap;
            gap: 0.5rem;
        }
        .login-card .login-options label {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            font-size: 0.85rem;
            color: rgba(255,255,255,0.6);
            cursor: pointer;
            margin: 0;
        }
        .login-card .login-options input[type=checkbox] { width: auto; margin: 0; }
        .login-card .login-forgot {
            font-size: 0.85rem;
            color: var(--primary-blue);
            text-decoration: none;
            font-weight: 500;
            transition: color 0.2s, text-decoration 0.2s;
        }
        .login-card .login-forgot:hover { color: #5ce1ff; text-decoration: underline; }
        .login-card .btn-entrar {
            width: 100%;
            padding: 0.95rem 1.25rem;
            border: none;
            border-radius: 10px;
            background: var(--primary-blue);
            color: #fff;
            font-weight: 600;
            font-size: 1rem;
            cursor: pointer;
            transition: background 0.2s, opacity 0.2s;
        }
        .login-card .btn-entrar:hover { background: #00b8d9; opacity: 0.95; }
        .login-card .btn-entrar:active { opacity: 1; }
        .login-card .login-err {
            color: #fca5a5;
            font-size: 0.85rem;
            margin-top: 1rem;
            text-align: center;
            display: none;
            padding: 0.75rem 1rem;
            background: rgba(239,68,68,0.12);
            border: 1px solid rgba(239,68,68,0.25);
            border-radius: 10px;
        }
        .login-card .login-err.show { display: block; animation: shake 0.4s ease; }
        @keyframes shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-6px)} 75%{transform:translateX(6px)} }
        .login-card .login-cadastro-text { color: rgba(255,255,255,0.5); }
        .login-card .login-cadastro-link { color: var(--primary-blue); font-weight: 600; text-decoration: none; border-bottom: 1px solid transparent; transition: color 0.2s, border-color 0.2s; }
        .login-card .login-cadastro-link:hover { color: #5ce1ff; border-bottom-color: rgba(92,225,255,0.5); }
        .btn-indique-ganhe { width: 100%; padding: 0.75rem 1rem; background: linear-gradient(135deg, #22C55E 0%, #16A34A 100%); color: #fff; border: none; border-radius: 10px; font-weight: 700; font-size: 0.95rem; cursor: pointer; transition: transform 0.15s, box-shadow 0.2s; }
        .btn-indique-ganhe:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(34,197,94,0.4); }

        /* ========== PÁGINA CADASTRO TRIAL – template profissional ========== */
        .trial-signup-page { min-height: 100vh; background: linear-gradient(165deg, #0A0E27 0%, #0d1230 40%, #151b3d 100%); display: flex; flex-direction: column; padding: 1.5rem 1rem; box-sizing: border-box; }
        .trial-signup-page.hidden { display: none !important; }
        .trial-signup-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.75rem; }
        .trial-signup-back { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.65rem 1.15rem; background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.9); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; text-decoration: none; font-size: 0.9rem; font-weight: 500; cursor: pointer; transition: background 0.2s, border-color 0.2s; }
        .trial-signup-back:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.2); color: #fff; }
        .trial-signup-logo { display: flex; align-items: center; gap: 0.5rem; }
        .trial-signup-logo img { height: 40px; width: auto; }
        .trial-signup-logo span { font-size: 1.35rem; font-weight: 700; color: #fff; letter-spacing: -0.02em; }
        .trial-signup-container { max-width: 900px; margin: 0 auto; width: 100%; flex: 1; }
        .trial-signup-hero { text-align: center; margin-bottom: 2.25rem; }
        .trial-signup-hero h1 { font-size: 1.9rem; font-weight: 800; color: #fff; margin: 0 0 0.6rem; letter-spacing: -0.03em; }
        .trial-signup-hero-sub { font-size: 1rem; color: rgba(255,255,255,0.72); margin: 0; line-height: 1.6; max-width: 520px; margin-left: auto; margin-right: auto; }
        .trial-signup-hero-sub strong { color: var(--accent-green); }
        .trial-signup-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); border-radius: 20px; padding: 1.85rem 2rem; margin-bottom: 1.5rem; box-shadow: 0 10px 44px rgba(0,0,0,0.28); }
        .trial-signup-section-title { font-size: 1.1rem; font-weight: 700; color: #fff; margin: 0 0 1.25rem; letter-spacing: -0.02em; }
        .trial-signup-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem 1.5rem; }
        .trial-signup-card .form-group { margin-bottom: 0; }
        .trial-signup-card .form-group label { display: block; font-size: 0.85rem; font-weight: 600; color: rgba(255,255,255,0.92); margin-bottom: 0.4rem; }
        .trial-signup-card .form-group .req { color: #f87171; }
        .trial-signup-card .form-group .opt { font-weight: 400; color: rgba(255,255,255,0.5); font-size: 0.8rem; }
        .trial-signup-card input[type="text"], .trial-signup-card input[type="email"], .trial-signup-card input[type="tel"], .trial-signup-card input[type="password"] { width: 100%; padding: 0.8rem 1.1rem; border-radius: 14px; border: 1px solid rgba(255,255,255,0.14); background: rgba(0,0,0,0.22); color: #fff; font-size: 0.95rem; box-sizing: border-box; }
        .trial-signup-card input::placeholder { color: rgba(255,255,255,0.38); }
        .trial-signup-card input:focus { outline: none; border-color: var(--primary-blue); box-shadow: 0 0 0 3px rgba(0,212,255,0.18); }
        .trial-signup-section-indicacao .trial-signup-indicacao-box { background: linear-gradient(135deg, rgba(34,197,94,0.1) 0%, rgba(22,163,74,0.06) 100%); border: 1px solid rgba(34,197,94,0.32); border-radius: 16px; padding: 1.2rem 1.4rem; margin-bottom: 0; }
        .trial-signup-section-indicacao .trial-signup-indicacao-box.has-code { border-color: rgba(34,197,94,0.5); background: linear-gradient(135deg, rgba(34,197,94,0.16) 0%, rgba(22,163,74,0.1) 100%); }
        .trial-signup-indicacao-box label { color: rgba(255,255,255,0.95); font-size: 0.9rem; font-weight: 600; }
        .trial-signup-indicacao-box input { background: rgba(0,0,0,0.25); border-radius: 12px; padding: 0.7rem 1rem; width: 100%; box-sizing: border-box; border: 1px solid rgba(255,255,255,0.12); color: #fff; font-size: 0.95rem; }
        .trial-signup-desconto-msg { display: none; margin-top: 0.75rem; padding: 0.75rem 1rem; background: rgba(34,197,94,0.18); border-radius: 12px; font-size: 0.9rem; color: #86efac; font-weight: 500; }
        .trial-signup-desconto-msg.show { display: block; }
        .trial-signup-preco-box { display: none; margin-top: 0.65rem; padding: 0.85rem 1.1rem; background: rgba(0,0,0,0.28); border-radius: 14px; font-size: 0.95rem; }
        .trial-signup-preco-box.show { display: block; }
        .trial-signup-preco-box .preco-original { text-decoration: line-through; color: rgba(255,255,255,0.5); margin-right: 0.5rem; font-size: 0.95rem; }
        .trial-signup-preco-box .preco-atual { font-weight: 800; color: var(--accent-green); font-size: 1.28rem; letter-spacing: -0.02em; }
        .trial-signup-validar-wrap { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-top: 0.6rem; }
        .trial-signup-btn-validar { padding: 0.6rem 1.25rem; border-radius: 12px; font-size: 0.9rem; font-weight: 600; cursor: pointer; background: rgba(0,212,255,0.2); color: var(--primary-blue); border: 1px solid rgba(0,212,255,0.4); transition: background 0.2s, border-color 0.2s; }
        .trial-signup-btn-validar:hover { background: rgba(0,212,255,0.3); border-color: var(--primary-blue); }
        .trial-signup-btn-validar:disabled { opacity: 0.6; cursor: not-allowed; }
        .trial-codigo-validacao-msg { font-size: 0.875rem; font-weight: 500; }
        .trial-codigo-validacao-msg.ok { color: var(--accent-green); }
        .trial-codigo-validacao-msg.err { color: #f87171; }
        .trial-signup-trial-cta { margin-bottom: 1.5rem; }
        .trial-signup-btn-trial { width: 100%; padding: 1.15rem 1.35rem; border-radius: 16px; font-size: 1.05rem; font-weight: 700; background: rgba(255,255,255,0.08); color: #fff; border: 1px solid rgba(255,255,255,0.2); cursor: pointer; transition: all 0.2s; }
        .trial-signup-btn-trial:hover { background: rgba(255,255,255,0.14); transform: translateY(-2px); box-shadow: 0 8px 28px rgba(0,0,0,0.25); }
        .trial-signup-planos-intro { font-size: 0.95rem; font-weight: 600; color: rgba(255,255,255,0.9); margin: 0 0 1rem; }
        .trial-signup-planos-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; align-items: stretch; }
        .trial-signup-plano-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 20px; padding: 1.6rem 1.4rem; text-align: left; display: flex; flex-direction: column; box-shadow: 0 8px 34px rgba(0,0,0,0.22); transition: transform 0.2s, box-shadow 0.2s; }
        .trial-signup-plano-card:hover { transform: translateY(-3px); box-shadow: 0 14px 44px rgba(0,0,0,0.3); }
        .trial-signup-plano-card.trial-signup-plano-destaque { border-color: rgba(0,212,255,0.45); background: linear-gradient(180deg, rgba(0,212,255,0.1) 0%, rgba(0,212,255,0.03) 100%); box-shadow: 0 8px 38px rgba(0,212,255,0.12); }
        .trial-signup-plano-card.trial-signup-plano-pro { border-color: rgba(139,92,246,0.5); background: linear-gradient(180deg, rgba(139,92,246,0.1) 0%, rgba(139,92,246,0.03) 100%); box-shadow: 0 8px 38px rgba(139,92,246,0.12); }
        .trial-signup-plano-badge { font-size: 1.05rem; font-weight: 800; color: #fff; text-align: center; margin-bottom: 0.75rem; letter-spacing: -0.02em; text-transform: uppercase; letter-spacing: 0.04em; }
        .trial-signup-plano-preco-wrap { text-align: center; margin-bottom: 1rem; padding: 0.6rem 0; border-bottom: 1px solid rgba(255,255,255,0.1); }
        .trial-signup-plano-preco-wrap .trial-signup-plano-preco { font-size: 1.85rem; font-weight: 800; color: #fff; display: inline; letter-spacing: -0.04em; line-height: 1.2; }
        .trial-signup-plano-periodo { font-size: 0.95rem; font-weight: 600; color: rgba(255,255,255,0.55); margin-left: 0.2rem; }
        .trial-signup-plano-desc-title { font-size: 0.8rem; font-weight: 700; color: rgba(255,255,255,0.7); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0.6rem; }
        .trial-signup-plano-topicos { list-style: none; margin: 0 0 1.25rem; padding: 0; flex: 1; }
        .trial-signup-plano-topicos li { font-size: 0.88rem; color: rgba(255,255,255,0.88); line-height: 1.55; margin-bottom: 0.45rem; padding-left: 1.35rem; position: relative; }
        .trial-signup-plano-topicos li::before { content: ''; position: absolute; left: 0; top: 0.5em; width: 6px; height: 6px; background: rgba(0,212,255,0.7); border-radius: 50%; }
        .trial-signup-plano-destaque .trial-signup-plano-topicos li::before { background: var(--primary-blue); }
        .trial-signup-plano-pro .trial-signup-plano-topicos li::before { background: rgba(167,139,250,0.9); }
        .trial-signup-btn-plano { padding: 1rem 1.25rem; font-size: 1.05rem; font-weight: 700; margin-top: auto; border-radius: 14px; min-height: 52px; cursor: pointer; border: none; transition: all 0.2s; }
        .trial-signup-plano-card[data-plano="basic"] .trial-signup-btn-plano { background: rgba(255,255,255,0.14); color: #fff; }
        .trial-signup-plano-card[data-plano="basic"] .trial-signup-btn-plano:hover { background: rgba(255,255,255,0.22); transform: translateY(-1px); }
        .trial-signup-plano-card.trial-signup-plano-destaque .trial-signup-btn-plano { background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%); color: #0A0E27; box-shadow: 0 4px 22px rgba(0,212,255,0.35); }
        .trial-signup-plano-card.trial-signup-plano-destaque .trial-signup-btn-plano:hover { box-shadow: 0 6px 28px rgba(0,212,255,0.45); transform: translateY(-1px); }
        .trial-signup-plano-card.trial-signup-plano-pro .trial-signup-btn-plano { background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 100%); color: #fff; box-shadow: 0 4px 22px rgba(139,92,246,0.35); }
        .trial-signup-plano-card.trial-signup-plano-pro .trial-signup-btn-plano:hover { box-shadow: 0 6px 28px rgba(139,92,246,0.45); transform: translateY(-1px); }
        .trial-signup-pro-indicacao { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,0.15); }
        .trial-signup-pro-indicacao-msg { font-size: 0.85rem; color: rgba(255,255,255,0.65); margin: 0 0 0.6rem; text-align: center; }
        .trial-signup-btn-indicacao { width: 100%; padding: 1rem 1.25rem; font-size: 1.05rem; font-weight: 700; border-radius: 14px; cursor: pointer; background: linear-gradient(135deg, rgba(34,197,94,0.4) 0%, rgba(22,163,74,0.32) 100%); color: #fff; border: 1px solid rgba(34,197,94,0.5); transition: all 0.2s; }
        .trial-signup-btn-indicacao:hover { background: linear-gradient(135deg, rgba(34,197,94,0.5) 0%, rgba(22,163,74,0.42) 100%); transform: translateY(-1px); box-shadow: 0 6px 24px rgba(34,197,94,0.3); }
        .trial-signup-footer-note { text-align: center; font-size: 0.85rem; color: rgba(255,255,255,0.5); margin-top: 1.5rem; line-height: 1.6; padding: 0 0.5rem; }
        @media (max-width: 900px) { .trial-signup-planos-grid { grid-template-columns: 1fr; } .trial-signup-container { max-width: 560px; } .trial-signup-form-grid { grid-template-columns: 1fr; } }
        @media (max-width: 600px) { .trial-signup-container { padding: 0; max-width: 100%; } .trial-signup-card { padding: 1.4rem 1.25rem; border-radius: 18px; } .trial-signup-plano-card { padding: 1.35rem 1.2rem; } .trial-signup-plano-preco-wrap .trial-signup-plano-preco { font-size: 1.6rem; } }
        /* Banner modo offline / sincronização */
        #offlineBanner { position: fixed; top: 0; left: 0; right: 0; z-index: 9999; padding: 0.6rem 1rem; text-align: center; font-size: 0.9rem; font-weight: 500; display: none; }
        #offlineBanner.offline { display: block; background: linear-gradient(90deg, #B45309 0%, #D97706 100%); color: #fff; box-shadow: 0 2px 12px rgba(0,0,0,0.3); }
        #offlineBanner.syncing { display: block; background: linear-gradient(90deg, #059669 0%, #10B981 100%); color: #fff; }
        #offlineBanner.synced { display: block; background: var(--primary-blue); color: #0A0E27; }
        .modal-afiliado .modal-header { margin-bottom: 1rem; }
        .modal-afiliado .form-group { margin-bottom: 1rem; }

        /* ——— Painel do Afiliado (claro / escuro + mobile) ——— */
        #afiliadoScreen {
            --aff-bg: #0B1224;
            --aff-surface: rgba(255,255,255,0.05);
            --aff-surface-2: rgba(255,255,255,0.08);
            --aff-border: rgba(148,163,184,0.22);
            --aff-text: #F8FAFC;
            --aff-muted: #94A3B8;
            --aff-accent: #38BDF8;
            --aff-accent-soft: rgba(56,189,248,0.14);
            --aff-warn-bg: rgba(251,146,60,0.12);
            --aff-warn-border: rgba(251,146,60,0.45);
            --aff-input-bg: rgba(2,6,23,0.55);
            --aff-input-border: rgba(148,163,184,0.28);
            --aff-shadow: 0 10px 30px rgba(2,6,23,0.35);
            min-height: 100vh;
            box-sizing: border-box;
            background: radial-gradient(1200px 500px at 10% -10%, rgba(56,189,248,0.18), transparent 55%),
                        linear-gradient(165deg, #070B18 0%, #0B1224 45%, #111827 100%);
            color: var(--aff-text);
            padding: 1.25rem clamp(1rem, 3vw, 2rem) 2rem;
        }
        #afiliadoScreen.hidden { display: none !important; }
        body[data-appearance="light"] #afiliadoScreen {
            --aff-bg: #F1F5F9;
            --aff-surface: #FFFFFF;
            --aff-surface-2: #F8FAFC;
            --aff-border: #CBD5E1;
            --aff-text: #0F172A;
            --aff-muted: #64748B;
            --aff-accent: #0284C7;
            --aff-accent-soft: rgba(2,132,199,0.1);
            --aff-warn-bg: #FFF7ED;
            --aff-warn-border: #FDBA74;
            --aff-input-bg: #FFFFFF;
            --aff-input-border: #CBD5E1;
            --aff-shadow: 0 8px 24px rgba(15,23,42,0.08);
            background: linear-gradient(165deg, #E8EEF5 0%, #F8FAFC 50%, #E2E8F0 100%);
            color: var(--aff-text);
        }
        .afiliado-header {
            display: flex; justify-content: space-between; align-items: flex-start;
            gap: 1rem; flex-wrap: wrap; margin-bottom: 1.35rem;
            padding-bottom: 1rem; border-bottom: 1px solid var(--aff-border);
        }
        .afiliado-header-title { min-width: 0; flex: 1; }
        .afiliado-title {
            margin: 0; font-size: clamp(1.25rem, 4vw, 1.65rem); font-weight: 750;
            letter-spacing: -0.03em; color: var(--aff-text);
        }
        .afiliado-subtitle {
            margin: 0.25rem 0 0; font-size: 0.9rem; color: var(--aff-muted);
            word-break: break-word;
        }
        .afiliado-header-actions {
            display: flex; align-items: center; gap: 0.65rem; flex-wrap: wrap;
        }
        .afiliado-theme-toggle {
            display: inline-flex; align-items: center; gap: 0.25rem;
            padding: 0.2rem; border-radius: 999px;
            background: var(--aff-surface); border: 1px solid var(--aff-border);
        }
        .afiliado-theme-btn {
            width: 2.35rem; height: 2.35rem; border: none; border-radius: 999px;
            background: transparent; cursor: pointer; font-size: 1.05rem; line-height: 1;
            display: inline-flex; align-items: center; justify-content: center;
            transition: background 0.15s, transform 0.15s;
        }
        .afiliado-theme-btn:hover { background: var(--aff-accent-soft); }
        .afiliado-theme-btn.active {
            background: var(--aff-accent); color: #fff;
            box-shadow: 0 0 0 1px color-mix(in srgb, var(--aff-accent) 40%, transparent);
        }
        #afiliadoScreen .btn-logout {
            color: #B91C1C; background: rgba(239,68,68,0.1); border-color: rgba(239,68,68,0.35);
        }
        body:not([data-appearance="light"]) #afiliadoScreen .btn-logout {
            color: #FCA5A5; background: rgba(239,68,68,0.12); border-color: rgba(239,68,68,0.35);
        }
        .afiliado-stats {
            display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 0.85rem; margin-bottom: 1.35rem;
        }
        .afiliado-stat-card {
            background: var(--aff-surface); border: 1px solid var(--aff-border);
            border-radius: 14px; padding: 1rem 0.85rem; text-align: center;
            box-shadow: var(--aff-shadow);
        }
        .afiliado-stat-value {
            margin: 0; font-size: clamp(1.25rem, 3.5vw, 1.55rem); font-weight: 750;
            color: var(--aff-accent); letter-spacing: -0.02em;
        }
        .afiliado-stat-label {
            margin: 0.35rem 0 0; font-size: 0.78rem; color: var(--aff-muted); line-height: 1.3;
        }
        .afiliado-section { margin-bottom: 1.5rem; }
        .afiliado-section-title {
            margin: 0 0 0.35rem; font-size: 1.05rem; font-weight: 700; color: var(--aff-text);
        }
        .afiliado-section-desc {
            margin: 0 0 0.75rem; font-size: 0.82rem; color: var(--aff-muted); line-height: 1.45;
        }
        .afiliado-section-desc strong { color: var(--aff-text); font-weight: 650; }
        .afiliado-chart-wrap {
            background: var(--aff-surface); border: 1px solid var(--aff-border);
            border-radius: 14px; padding: 0.85rem; max-height: 240px;
            box-shadow: var(--aff-shadow);
        }
        .afiliado-table-wrap {
            overflow-x: auto; -webkit-overflow-scrolling: touch;
            background: var(--aff-surface); border: 1px solid var(--aff-border);
            border-radius: 14px; box-shadow: var(--aff-shadow);
        }
        .afiliado-table { width: 100%; min-width: 560px; border-collapse: collapse; }
        .afiliado-table th, .afiliado-table td {
            padding: 0.7rem 0.85rem; text-align: left;
            border-bottom: 1px solid var(--aff-border); color: var(--aff-text); font-size: 0.88rem;
        }
        .afiliado-table th {
            color: var(--aff-muted); font-weight: 650; font-size: 0.78rem;
            text-transform: uppercase; letter-spacing: 0.03em; background: var(--aff-surface-2);
        }
        .afiliado-table tbody tr:last-child td { border-bottom: none; }
        .afiliado-codigo {
            margin: 0 0 0.75rem; font-size: 1.2rem; font-weight: 750;
            color: var(--aff-accent); letter-spacing: 0.04em;
        }
        .afiliado-link-box {
            display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
            padding: 1rem; background: var(--aff-accent-soft);
            border: 1px solid color-mix(in srgb, var(--aff-accent) 35%, var(--aff-border));
            border-radius: 14px;
        }
        .afiliado-qr {
            width: 112px; height: 112px; flex-shrink: 0; background: #fff;
            border-radius: 10px; display: flex; align-items: center; justify-content: center;
            border: 1px solid var(--aff-border);
        }
        .afiliado-qr img { max-width: 100%; max-height: 100%; }
        .afiliado-link-actions { flex: 1; min-width: min(100%, 220px); }
        .afiliado-link-input {
            width: 100%; box-sizing: border-box; padding: 0.65rem 0.75rem;
            background: var(--aff-input-bg); border: 1px solid var(--aff-input-border);
            border-radius: 10px; color: var(--aff-text); font-size: 0.88rem;
        }
        .afiliado-copy-btn { margin-top: 0.65rem; width: auto; }
        .afiliado-lead-quente {
            margin-top: 0.5rem; padding: 1rem 1.1rem;
            background: var(--aff-warn-bg); border: 1px solid var(--aff-warn-border);
            border-radius: 14px;
        }
        .afiliado-lead-title {
            margin: 0 0 0.35rem; font-size: 1rem; font-weight: 700; color: var(--aff-text);
        }
        .afiliado-lead-list { list-style: none; margin: 0; padding: 0; color: var(--aff-text); }
        .afiliado-lead-list li { margin-bottom: 0.5rem; color: var(--aff-text); }

        @media (max-width: 900px) {
            .afiliado-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        }
        @media (max-width: 640px) {
            #afiliadoScreen { padding: 1rem 0.85rem 1.75rem; }
            .afiliado-header { gap: 0.75rem; }
            .afiliado-header-actions { width: 100%; justify-content: space-between; }
            .afiliado-stats { grid-template-columns: 1fr 1fr; gap: 0.65rem; }
            .afiliado-stat-card { padding: 0.85rem 0.65rem; }
            .afiliado-link-box { flex-direction: column; align-items: stretch; }
            .afiliado-qr { width: 132px; height: 132px; margin: 0 auto; }
            .afiliado-copy-btn { width: 100%; }
            .afiliado-table { min-width: 480px; }
            .afiliado-chart-wrap { max-height: 200px; padding: 0.65rem; }
        }
        @media (max-width: 380px) {
            .afiliado-stats { grid-template-columns: 1fr; }
        }

        #welcomeModal .modal { max-width: 480px; text-align: center; padding: 2.5rem; background: linear-gradient(160deg, rgba(15,23,42,0.98) 0%, rgba(30,41,59,0.98) 100%); border: 1px solid rgba(0,212,255,0.25); box-shadow: 0 25px 80px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.05); }
        .welcome-modal .welcome-modal-content { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; }
        .welcome-modal .welcome-title, .welcome-modal .welcome-text { text-align: center; }
        .welcome-modal .welcome-icon { font-size: 3.5rem; margin-bottom: 1rem; display: flex; justify-content: center; align-items: center; min-height: 90px; padding: 0.75rem; background: rgba(12,18,32,0.6); border-radius: 12px; }
        .welcome-modal .welcome-logo-img { max-height: 72px; max-width: 180px; width: auto; height: auto; object-fit: contain; background: transparent !important; mix-blend-mode: normal; display: block; }
        .welcome-modal .welcome-title { font-size: 1.6rem; color: #fff; margin-bottom: 0.5rem; font-weight: 700; letter-spacing: -0.02em; }
        .welcome-modal .welcome-text { color: rgba(255,255,255,0.75); font-size: 0.95rem; margin-bottom: 0; line-height: 1.5; }
        .welcome-modal #welcomeBtnEnter { display: none; }

        /* ——— Loading Imperio OS (pós-login) ——— */
        .imperio-loading-screen {
            position: fixed; inset: 0; z-index: 10000;
            display: flex; align-items: center; justify-content: center;
            background: linear-gradient(145deg, #050814 0%, #0A0E27 42%, #0c1a3a 100%);
            opacity: 1; transition: opacity 0.35s ease;
        }
        .imperio-loading-screen.hidden { display: none !important; opacity: 0; pointer-events: none; }
        .imperio-loading-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
        .imp-orb {
            position: absolute; border-radius: 50%; filter: blur(70px); opacity: 0.45;
            animation: imperioOrbMove 9s ease-in-out infinite;
        }
        .imp-orb-1 { width: 320px; height: 320px; background: rgba(0,212,255,0.22); top: 8%; left: 10%; }
        .imp-orb-2 { width: 240px; height: 240px; background: rgba(59,130,246,0.28); bottom: 12%; right: 8%; animation-delay: 2s; }
        .imp-orb-3 { width: 180px; height: 180px; background: rgba(16,185,129,0.18); top: 55%; left: 45%; animation-delay: 4s; }
        .imp-orb-4 { width: 140px; height: 140px; background: rgba(139,92,246,0.16); top: 20%; right: 28%; animation-delay: 1s; }
        @keyframes imperioOrbMove {
            0%, 100% { transform: translate(0,0) scale(1); }
            50% { transform: translate(28px,-22px) scale(1.08); }
        }
        .imperio-loading-content { position: relative; z-index: 1; text-align: center; padding: 2rem 1.5rem; max-width: 420px; }
        .imperio-loading-logo-wrap {
            position: relative; width: 148px; height: 148px; margin: 0 auto 1.35rem;
        }
        .imperio-loading-ring {
            position: absolute; inset: -10px; border-radius: 50%;
            border: 3px solid transparent;
            border-top-color: #00D4FF; border-right-color: rgba(0,212,255,0.25);
            animation: imperioSpin 1.05s linear infinite;
        }
        .imperio-loading-ring-2 {
            inset: -18px; border-top-color: rgba(59,130,246,0.7); border-right-color: transparent;
            border-bottom-color: rgba(0,212,255,0.15); animation-duration: 1.6s; animation-direction: reverse;
        }
        @keyframes imperioSpin { to { transform: rotate(360deg); } }
        .imperio-loading-logo {
            width: 120px; height: 120px; object-fit: contain; margin: 14px;
            background: transparent !important; animation: imperioLogoPulse 1.6s ease-in-out infinite;
            filter: drop-shadow(0 0 18px rgba(0,212,255,0.35));
        }
        @keyframes imperioLogoPulse {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.04); }
        }
        .imperio-loading-brand {
            font-size: 0.72rem; letter-spacing: 0.28em; text-transform: uppercase;
            color: rgba(0,212,255,0.85); font-weight: 700; margin: 0 0 0.65rem;
        }
        .imperio-loading-title {
            font-size: clamp(1.35rem, 4vw, 1.75rem); font-weight: 800; margin: 0 0 0.55rem;
            background: linear-gradient(90deg, #ffffff 0%, #00D4FF 55%, #60A5FA 100%);
            -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
            letter-spacing: -0.02em;
        }
        .imperio-loading-text { color: rgba(226,232,240,0.78); font-size: 0.98rem; margin: 0 0 1.35rem; min-height: 1.4em; }
        .imperio-loading-dots::after { content: ''; animation: imperioDots 1.4s steps(4, end) infinite; }
        @keyframes imperioDots {
            0% { content: ''; } 25% { content: '.'; } 50% { content: '..'; } 75% { content: '...'; }
        }
        .imperio-loading-progress {
            width: min(240px, 70vw); height: 4px; margin: 0 auto 1.1rem;
            background: rgba(255,255,255,0.1); border-radius: 999px; overflow: hidden;
        }
        .imperio-loading-progress-bar {
            height: 100%; width: 38%;
            background: linear-gradient(90deg, #00D4FF, #3B82F6, #10B981);
            border-radius: 999px; animation: imperioLoadBar 1.15s ease-in-out infinite;
        }
        @keyframes imperioLoadBar {
            0% { transform: translateX(-120%); }
            100% { transform: translateX(320%); }
        }
        .imperio-loading-hint {
            font-size: 0.78rem; color: rgba(148,163,184,0.85); letter-spacing: 0.04em; margin: 0;
        }

        /* ——— Kanban Serviços ——— */
        .servicos-kanban-wrap { width: 100%; overflow-x: auto; padding-bottom: 0.5rem; }
        .servicos-kanban {
            display: flex; gap: 0.85rem; min-width: max-content; align-items: flex-start;
        }
        .kanban-col {
            width: 260px; min-height: 320px; background: rgba(15,23,42,0.65);
            border: 1px solid rgba(255,255,255,0.1); border-radius: 14px;
            display: flex; flex-direction: column; transition: border-color 0.15s, background 0.15s;
        }
        .kanban-col-over { border-color: rgba(0,212,255,0.55); background: rgba(0,212,255,0.06); }
        .kanban-col-head {
            display: flex; justify-content: space-between; align-items: center;
            padding: 0.75rem 0.85rem; border-bottom: 1px solid rgba(255,255,255,0.08);
            font-size: 0.85rem; font-weight: 700; color: #E2E8F0;
        }
        .kanban-count {
            background: rgba(0,212,255,0.15); color: #00D4FF; border-radius: 999px;
            padding: 0.1rem 0.5rem; font-size: 0.75rem;
        }
        .kanban-col-body { padding: 0.65rem; display: flex; flex-direction: column; gap: 0.55rem; min-height: 200px; }
        .kanban-empty { color: rgba(148,163,184,0.7); font-size: 0.78rem; text-align: center; margin: 1.5rem 0; }
        .kanban-card {
            background: linear-gradient(160deg, rgba(30,41,59,0.95), rgba(15,23,42,0.98));
            border: 1px solid rgba(255,255,255,0.1); border-radius: 12px; padding: 0.75rem;
            cursor: grab; touch-action: manipulation;
        }
        .kanban-card:active { cursor: grabbing; }
        .kanban-dragging { opacity: 0.55; }
        .kanban-card-title { font-weight: 700; font-size: 0.9rem; color: #fff; }
        .kanban-card-sub { font-size: 0.8rem; color: rgba(226,232,240,0.8); margin-top: 0.2rem; }
        .kanban-card-meta { font-size: 0.72rem; color: var(--text-gray); margin-top: 0.2rem; }
        .kanban-gar { color: #86EFAC !important; }
        .kanban-card-value { margin-top: 0.45rem; font-weight: 700; color: #00D4FF; font-size: 0.95rem; }
        .kanban-card-actions { display: flex; gap: 0.35rem; margin-top: 0.55rem; flex-wrap: wrap; }
        @media (max-width: 700px) {
            .kanban-col { width: 220px; }
        }
        @media (max-width: 900px) {
            .login-page { grid-template-columns: 1fr; }
            .login-page .login-left { padding: 2.5rem 2rem; min-height: 200px; }
            .login-page .login-left .brand-wrap { max-width: 100%; }
            .login-page .login-left .brand-title { font-size: 1.5rem; }
            .login-page .login-left .brand-desc { display: none; }
            .login-page .login-left .login-brand-img { max-height: 133px; max-width: 332px; }
        }

        /* ========== PAINEL ADMIN (registro de clientes) ========== */
        #adminScreen {
            --admin-surface: rgba(255,255,255,0.04);
            --admin-surface-2: rgba(255,255,255,0.06);
            --admin-border: rgba(255,255,255,0.08);
            --admin-radius: 14px;
            --admin-gap: 1.25rem;
            --admin-ok: #22C55E;
            --admin-warn: #F59E0B;
            --admin-danger: #EF4444;
            /* Admin é sempre fundo escuro: não herdar --text-* do tema claro */
            --text-light: #E8EEF8;
            --text-gray: #B6C0D8;
            --text-main: #F8FAFC;
            color: #E8EEF8;
            display: none; flex-direction: column; min-height: 100vh; overflow: hidden;
            background: linear-gradient(160deg, #0A0E27 0%, #0f1535 45%, #151b3d 100%);
            font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
        }
        #adminScreen.active { display: flex; }
        #adminScreen .admin-icon { width: 1.1rem; height: 1.1rem; display: block; flex-shrink: 0; }
        #adminScreen .admin-icon-lg { width: 1.35rem; height: 1.35rem; }
        .admin-header {
            flex-shrink: 0; padding: 0.9rem 1.25rem; border-bottom: 1px solid var(--admin-border);
            display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem;
            width: 100%;
            background: rgba(0,0,0,0.28); backdrop-filter: blur(10px);
        }
        .admin-body { display: flex; flex: 1; min-height: 0; overflow: hidden; }
        .admin-sidebar {
            flex-shrink: 0; width: 248px; background: rgba(0,0,0,0.28); border-right: 1px solid var(--admin-border);
            display: flex; flex-direction: column; padding: 0.75rem 0 1.25rem; overflow-y: auto;
        }
        .admin-nav-group {
            margin: 0.85rem 1.25rem 0.35rem; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.08em;
            text-transform: uppercase; color: rgba(139,146,180,0.85);
        }
        .admin-nav-group:first-child { margin-top: 0.35rem; }
        .admin-nav-btn {
            display: flex; align-items: center; gap: 0.65rem; width: 100%; padding: 0.7rem 1.15rem; border: none; background: transparent; color: var(--text-gray); font-size: 0.9rem; font-weight: 500; cursor: pointer; text-align: left; transition: background 0.18s, color 0.18s, border-color 0.18s; border-left: 3px solid transparent; font-family: inherit;
        }
        .admin-nav-btn:hover { background: rgba(255,255,255,0.06); color: #fff; }
        .admin-nav-btn.active { background: rgba(0,212,255,0.12); color: var(--primary-blue); border-left-color: var(--primary-blue); }
        .admin-nav-btn .icon { display: flex; align-items: center; justify-content: center; opacity: 0.9; }
        .admin-nav-badge {
            margin-left: auto; min-width: 1.35rem; height: 1.35rem; padding: 0 0.4rem; border-radius: 999px;
            background: var(--admin-danger); color: #fff; font-size: 0.7rem; font-weight: 700;
            display: inline-flex; align-items: center; justify-content: center;
        }
        .admin-nav-badge[hidden] { display: none !important; }
        .admin-main-inner { flex: 1; overflow-y: auto; padding: 1.5rem 1.75rem 2.5rem; }
        .admin-section-page { display: none; animation: adminFadeIn 0.22s ease; }
        .admin-section-page.active { display: block; }
        @keyframes adminFadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
        .admin-brand { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
        .admin-brand-icon { width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%); display: flex; align-items: center; justify-content: center; color: #0A0E27; box-shadow: 0 4px 14px rgba(0,212,255,0.35); }
        .admin-header .admin-title { font-size: 1.35rem; font-weight: 750; color: #fff; letter-spacing: -0.03em; margin: 0 0 0.1rem 0; }
        .admin-header .admin-subtitle { font-size: 0.8rem; color: var(--text-gray); font-weight: 500; margin: 0; }
        .btn-logout {
            display: inline-flex; align-items: center; gap: 0.4rem;
            padding: 0.55rem 1rem; background: rgba(239,68,68,0.12); color: #FCA5A5; border: 1px solid rgba(239,68,68,0.35); border-radius: 10px; font-weight: 600; cursor: pointer; font-size: 0.875rem; transition: background 0.2s, border-color 0.2s; font-family: inherit;
        }
        .btn-logout:hover { background: rgba(239,68,68,0.22); border-color: rgba(239,68,68,0.5); }
        .admin-page-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 0.25rem; }
        .admin-toolbar, .admin-toolbar-actions { display: flex; align-items: flex-end; gap: 0.65rem; flex-wrap: wrap; }
        .admin-toolbar { margin-bottom: 1rem; }
        .admin-toolbar-grow { flex: 1; min-width: 200px; }
        .admin-toolbar-grow label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--text-gray); margin-bottom: 0.4rem; text-transform: uppercase; letter-spacing: 0.03em; }
        .admin-toolbar-end { justify-content: flex-end; margin-top: 1.25rem; }
        .admin-toolbar-gap { margin-top: 1rem; }
        .admin-form-collapse { margin-bottom: 1.25rem; border: 1px solid var(--admin-border); border-radius: var(--admin-radius); background: rgba(0,0,0,0.15); }
        .admin-form-collapse > summary {
            cursor: pointer; padding: 0.85rem 1.1rem; font-weight: 600; color: var(--text-light); list-style: none;
            user-select: none;
        }
        .admin-form-collapse > summary::-webkit-details-marker { display: none; }
        .admin-form-collapse > summary::after { content: '+'; float: right; color: var(--primary-blue); font-weight: 700; }
        .admin-form-collapse[open] > summary::after { content: '−'; }
        .admin-form-collapse > :not(summary) { padding: 0 1.1rem 1.1rem; }
        .admin-block-title { font-size: 1rem; font-weight: 700; color: #fff; margin: 0 0 0.35rem; }
        .admin-block-desc, .admin-field-hint, .admin-modal-desc { color: var(--text-gray); font-size: 0.85rem; line-height: 1.45; margin: 0 0 0.85rem; white-space: pre-wrap; }
        .admin-field-hint { margin-top: 0.35rem; margin-bottom: 0; }
        .admin-form-block { margin-bottom: 1.25rem; }
        .admin-check-label { display: flex; align-items: center; gap: 0.55rem; cursor: pointer; color: var(--text-light); font-size: 0.9rem; margin-top: 1.6rem; }
        .admin-check-label input { width: 18px; height: 18px; }
        .admin-form-check { display: flex; align-items: center; }
        .btn-secondary-admin {
            padding: 0.55rem 1rem; background: rgba(255,255,255,0.06); color: var(--text-light); border: 1px solid var(--admin-border);
            border-radius: 10px; font-weight: 600; cursor: pointer; font-size: 0.875rem; font-family: inherit; transition: background 0.15s;
        }
        .btn-secondary-admin:hover { background: rgba(255,255,255,0.1); }
        .btn-warn-admin { padding: 0.55rem 1rem; background: rgba(245,158,11,0.18); color: #FDE047; border: 1px solid rgba(245,158,11,0.4); border-radius: 10px; font-weight: 600; cursor: pointer; font-size: 0.875rem; font-family: inherit; }
        .btn-danger-soft, .btn-ok-soft, .btn-warn-soft {
            padding: 0.5rem 0.85rem; border-radius: 8px; cursor: pointer; font-size: 0.85rem; font-weight: 600; font-family: inherit; border: 1px solid;
        }
        .btn-danger-soft { background: rgba(239,68,68,0.2); color: #FCA5A5; border-color: rgba(239,68,68,0.4); }
        .btn-ok-soft { background: rgba(34,197,94,0.2); color: #86EFAC; border-color: rgba(34,197,94,0.4); }
        .btn-warn-soft { background: rgba(245,158,11,0.2); color: #FDE047; border-color: rgba(245,158,11,0.4); }
        .admin-badge {
            display: inline-flex; align-items: center; padding: 0.15rem 0.55rem; border-radius: 999px; font-size: 0.72rem; font-weight: 700;
            letter-spacing: 0.02em; text-transform: uppercase;
        }
        .admin-badge-ok { background: rgba(34,197,94,0.15); color: #86EFAC; border: 1px solid rgba(34,197,94,0.35); }
        .admin-badge-warn { background: rgba(245,158,11,0.15); color: #FDE047; border: 1px solid rgba(245,158,11,0.35); }
        .admin-badge-alert { background: rgba(239,68,68,0.15); color: #FCA5A5; border: 1px solid rgba(239,68,68,0.35); }
        .admin-badge-muted { background: rgba(255,255,255,0.06); color: var(--text-gray); border: 1px solid var(--admin-border); }
        .admin-badge-platform-imperio { background: rgba(46,196,255,0.14); color: #7dd3fc; border: 1px solid rgba(46,196,255,0.35); }
        .admin-badge-platform-carros { background: rgba(240,162,2,0.16); color: #fbbf24; border: 1px solid rgba(240,162,2,0.4); }
        .admin-platform-tabs {
            display: flex;
            flex-wrap: wrap;
            gap: 0.45rem;
            margin: 0 0 1rem;
        }
        .admin-platform-tab {
            border: 1px solid rgba(255,255,255,0.12);
            background: rgba(255,255,255,0.04);
            color: var(--text-gray);
            border-radius: 999px;
            padding: 0.45rem 0.95rem;
            font-size: 0.88rem;
            font-weight: 600;
            cursor: pointer;
        }
        .admin-platform-tab:hover { color: #fff; border-color: rgba(255,255,255,0.25); }
        .admin-platform-tab.active {
            color: #041018;
            background: linear-gradient(135deg, #2ec4ff, #1496d4);
            border-color: transparent;
        }
        .admin-platform-tab.active-carros {
            background: linear-gradient(135deg, #f0a202, #d97706);
            color: #1a1205;
        }
        .admin-platform-gate {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 2rem 1.25rem 2.5rem;
            position: relative;
            overflow: auto;
            background:
                radial-gradient(900px 420px at 15% 10%, rgba(46,196,255,0.16), transparent 55%),
                radial-gradient(800px 380px at 90% 80%, rgba(240,162,2,0.12), transparent 50%),
                linear-gradient(165deg, #070b1a 0%, #0c1230 50%, #10183a 100%);
        }
        .admin-platform-gate-panel {
            width: min(920px, 100%);
            text-align: center;
            animation: adminGateIn 0.45s ease-out;
        }
        @keyframes adminGateIn {
            from { opacity: 0; transform: translateY(12px); }
            to { opacity: 1; transform: none; }
        }
        .admin-platform-gate-kicker {
            display: inline-block;
            margin: 0 0 0.85rem;
            padding: 0.35rem 0.85rem;
            border-radius: 999px;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            color: #7dd3fc;
            background: rgba(46,196,255,0.12);
            border: 1px solid rgba(46,196,255,0.28);
            font-family: 'Outfit', 'Plus Jakarta Sans', sans-serif;
        }
        .admin-platform-gate-title {
            margin: 0 0 0.65rem;
            font-family: 'Outfit', 'Plus Jakarta Sans', sans-serif;
            font-size: clamp(1.55rem, 3.2vw, 2.15rem);
            font-weight: 800;
            letter-spacing: -0.03em;
            line-height: 1.15;
            color: #f8fafc;
        }
        .admin-platform-gate-desc {
            margin: 0 auto 1.75rem;
            max-width: 46ch;
            color: #94a3b8;
            font-size: 0.98rem;
            line-height: 1.55;
        }
        .admin-platform-gate-cards {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 1.1rem;
            text-align: left;
        }
        #adminScreen button.admin-platform-gate-card,
        .admin-platform-gate-card {
            appearance: none;
            -webkit-appearance: none;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 0.45rem;
            width: 100%;
            margin: 0;
            padding: 1.35rem 1.3rem 1.25rem;
            border-radius: 18px;
            border: 1px solid rgba(46,196,255,0.35);
            background:
                linear-gradient(165deg, rgba(46,196,255,0.14) 0%, rgba(12,18,40,0.92) 45%, rgba(8,12,28,0.98) 100%);
            color: #e2e8f0;
            cursor: pointer;
            text-align: left;
            font-family: 'Plus Jakarta Sans', Inter, sans-serif;
            box-shadow: 0 18px 40px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.06);
            transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
        }
        #adminScreen button.admin-platform-gate-card:hover,
        .admin-platform-gate-card:hover {
            transform: translateY(-4px);
            border-color: #2ec4ff;
            box-shadow: 0 22px 48px rgba(46,196,255,0.18), inset 0 1px 0 rgba(255,255,255,0.08);
        }
        #adminScreen button.admin-platform-gate-card-carros,
        .admin-platform-gate-card-carros {
            border-color: rgba(240,162,2,0.4);
            background:
                linear-gradient(165deg, rgba(240,162,2,0.16) 0%, rgba(28,18,8,0.92) 45%, rgba(14,10,6,0.98) 100%);
        }
        #adminScreen button.admin-platform-gate-card-carros:hover,
        .admin-platform-gate-card-carros:hover {
            border-color: #f0a202;
            box-shadow: 0 22px 48px rgba(240,162,2,0.16), inset 0 1px 0 rgba(255,255,255,0.08);
        }
        .admin-platform-gate-visual {
            width: 100%;
            height: 104px;
            border-radius: 14px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 0.35rem;
            background: rgba(0,0,0,0.28);
            border: 1px solid rgba(255,255,255,0.06);
        }
        .admin-platform-gate-visual-imperio {
            background:
                radial-gradient(120px 80px at 50% 40%, rgba(46,196,255,0.22), transparent 70%),
                rgba(0,0,0,0.28);
        }
        .admin-platform-gate-visual-carros {
            background:
                radial-gradient(120px 80px at 50% 40%, rgba(240,162,2,0.22), transparent 70%),
                rgba(0,0,0,0.28);
        }
        .admin-platform-gate-logo {
            max-height: 78px;
            max-width: 160px;
            width: auto;
            height: auto;
            object-fit: contain;
            background: transparent !important;
            mix-blend-mode: normal;
        }
        .admin-platform-gate-badge {
            display: inline-flex;
            align-items: center;
            padding: 0.22rem 0.65rem;
            border-radius: 999px;
            font-size: 0.7rem;
            font-weight: 800;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: #041018;
            background: linear-gradient(135deg, #2ec4ff, #1496d4);
        }
        .admin-platform-gate-badge-carros {
            background: linear-gradient(135deg, #f0a202, #e85d04);
            color: #1a0f00;
        }
        .admin-platform-gate-name {
            font-family: 'Outfit', 'Plus Jakarta Sans', sans-serif;
            font-size: 1.35rem;
            font-weight: 800;
            letter-spacing: -0.02em;
            color: #fff;
            margin-top: 0.15rem;
        }
        .admin-platform-gate-tagline {
            color: #94a3b8;
            font-size: 0.92rem;
            font-weight: 500;
        }
        .admin-platform-gate-points {
            display: grid;
            gap: 0.35rem;
            width: 100%;
            margin: 0.45rem 0 0.35rem;
            padding: 0.75rem 0.85rem;
            border-radius: 12px;
            background: rgba(0,0,0,0.22);
            border: 1px solid rgba(255,255,255,0.05);
        }
        .admin-platform-gate-points span {
            color: #cbd5e1;
            font-size: 0.84rem;
            line-height: 1.35;
        }
        .admin-platform-gate-points span::before {
            content: "✓ ";
            color: #3ddc97;
            font-weight: 700;
        }
        .admin-platform-gate-card-carros .admin-platform-gate-points span::before { color: #f0a202; }
        .admin-platform-gate-cta {
            margin-top: auto;
            display: inline-flex;
            align-items: center;
            font-size: 0.88rem;
            font-weight: 700;
            color: #7dd3fc;
            padding-top: 0.35rem;
        }
        .admin-platform-gate-cta-carros { color: #fbbf24; }
        .admin-platform-gate-foot {
            margin: 1.5rem 0 0;
            color: #64748b;
            font-size: 0.8rem;
        }
        .admin-platform-gate-foot strong {
            color: #cbd5e1;
            font-weight: 700;
            letter-spacing: 0.02em;
        }
        .admin-brand-icon-logo {
            background: rgba(0,0,0,0.25) !important;
            box-shadow: none !important;
            overflow: hidden;
            padding: 4px;
        }
        .admin-brand-logo-img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            background: transparent !important;
            mix-blend-mode: normal;
        }
        .admin-title {
            font-family: 'Outfit', 'Plus Jakarta Sans', sans-serif;
            letter-spacing: -0.02em;
        }
        @media (max-width: 720px) {
            .admin-platform-gate-cards { grid-template-columns: 1fr; }
            .admin-platform-gate { padding: 1.25rem 1rem 2rem; align-items: flex-start; }
        }
        .admin-platform-bar {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 0.5rem;
            padding: 0.65rem 1rem;
            border-bottom: 1px solid var(--admin-border);
            background: rgba(0,0,0,0.2);
            width: 100%;
        }
        .admin-platform-bar-label {
            color: var(--text-gray);
            font-size: 0.8rem;
            text-transform: uppercase;
            letter-spacing: 0.04em;
            margin-right: 0.25rem;
            font-family: 'Outfit', sans-serif;
            font-weight: 600;
        }
        #adminTabCarros.active,
        #adminTabCarrosTop.active,
        #adminTabCarrosTop.active-carros {
            background: linear-gradient(135deg, #f0a202, #e85d04);
            color: #1a0f00;
        }
        .admin-row-actions { display: flex; align-items: center; gap: 0.45rem; flex-shrink: 0; }
        .admin-actions-menu { position: relative; }
        .admin-actions-trigger {
            width: 36px; height: 36px; border-radius: 8px; border: 1px solid var(--admin-border); background: rgba(255,255,255,0.05);
            color: var(--text-light); cursor: pointer; font-size: 1.1rem; line-height: 1; font-family: inherit;
        }
        .admin-actions-trigger:hover { background: rgba(255,255,255,0.1); }
        .admin-actions-dropdown {
            display: none; position: absolute; right: 0; top: calc(100% + 4px); min-width: 180px; z-index: 20;
            background: #121833; border: 1px solid var(--admin-border); border-radius: 10px; padding: 0.35rem;
            box-shadow: 0 12px 32px rgba(0,0,0,0.45);
        }
        .admin-actions-menu.open .admin-actions-dropdown { display: block; }
        .admin-actions-dropdown button {
            display: block; width: 100%; text-align: left; padding: 0.55rem 0.75rem; border: none; background: transparent;
            color: var(--text-light); border-radius: 8px; cursor: pointer; font-size: 0.85rem; font-family: inherit;
        }
        .admin-actions-dropdown button:hover { background: rgba(255,255,255,0.08); }
        .admin-actions-dropdown button.danger { color: #FCA5A5; }
        .admin-list-item-empresa { align-items: flex-start; }
        .admin-list-item-empresa .empresa-main { flex: 1; min-width: 200px; display: flex; flex-direction: column; gap: 0.3rem; }
        .empresa-meta { font-size: 0.85rem; color: var(--text-gray); line-height: 1.4; }
        .admin-banner-title { font-size: 0.95rem; color: #F59E0B; margin-bottom: 0.5rem; font-weight: 700; }
        .admin-banner-list { margin: 0; padding-left: 1.2rem; font-size: 0.9rem; }
        .admin-row-unread td { background: rgba(245,158,11,0.04); }
        #adminScreen .admin-stat-icon { display: flex; color: var(--primary-blue); opacity: 0.9; margin-bottom: 0.45rem; }
        #adminScreen .admin-stat-icon .admin-icon { width: 1.35rem; height: 1.35rem; }
        .admin-wa-link {
            display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.55rem; border-radius: 999px;
            background: rgba(37,211,102,0.12); color: #86EFAC; border: 1px solid rgba(37,211,102,0.35);
            font-size: 0.78rem; font-weight: 600; text-decoration: none;
        }
        .admin-wa-link:hover { background: rgba(37,211,102,0.2); color: #bbf7d0; }
        .admin-empty { padding: 1.5rem 0; }
        .admin-table-wrap { overflow-x: auto; border-radius: var(--admin-radius); border: 1px solid var(--admin-border); margin-top: 0.75rem; }
        .admin-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
        .admin-table th {
            padding: 0.85rem 1rem; text-align: left; color: var(--text-gray); font-weight: 600;
            background: rgba(0,0,0,0.28); border-bottom: 1px solid var(--admin-border); white-space: nowrap;
        }
        .admin-table td { padding: 0.75rem 1rem; border-bottom: 1px solid rgba(255,255,255,0.06); color: var(--text-light); vertical-align: middle; }
        .admin-table tr:last-child td { border-bottom: none; }
        .admin-table .text-right { text-align: right; }
        .admin-table .text-center { text-align: center; }
        .admin-table-pagamentos { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
        .admin-filter-tabs { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 1rem; }
        .admin-filter-tab {
            padding: 0.45rem 0.9rem; border-radius: 999px; border: 1px solid var(--admin-border); background: transparent;
            color: var(--text-gray); font-size: 0.85rem; font-weight: 600; cursor: pointer; font-family: inherit;
        }
        .admin-filter-tab.active { background: rgba(0,212,255,0.14); color: var(--primary-blue); border-color: rgba(0,212,255,0.4); }
        .admin-afiliado-detalhe { margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--admin-border); }
        .admin-afiliado-detalhe-nome { margin: 0.75rem 0 0.35rem; color: #fff; font-size: 1.15rem; }
        .admin-afiliado-detalhe-codigo { font-size: 1rem; font-weight: 700; color: #7DD3FC; margin: 0 0 0.5rem; }
        .admin-afiliado-detalhe-info, .admin-afiliado-detalhe-link { color: #C5CEE0; font-size: 0.9rem; margin: 0 0 0.5rem; }
        .admin-afiliado-link-input {
            width: 100%; max-width: 420px; margin-top: 0.35rem; padding: 0.45rem 0.65rem; font-size: 0.8rem;
            background: rgba(0,0,0,0.35); border: 1px solid rgba(255,255,255,0.22); border-radius: 8px; color: #F8FAFC;
        }
        .admin-list-afiliados, .admin-list-emteste { max-height: 520px; overflow-y: auto; list-style: none; margin: 0; padding: 0; }
        .admin-list-item-afiliado { cursor: pointer; }
        .admin-list-item-afiliado .empresa-main strong,
        #adminSectionAfiliados .empresa-main strong {
            color: #FFFFFF !important;
            font-size: 1rem;
            font-weight: 700;
        }
        .admin-list-item-afiliado .empresa-meta,
        #adminSectionAfiliados .empresa-meta {
            color: #C5CEE0 !important;
        }
        #adminSectionAfiliados .admin-section-title { color: #FFFFFF !important; }
        #adminSectionAfiliados .admin-section-desc,
        #adminSectionAfiliados .empty-msg,
        #adminSectionAfiliados label,
        #adminSectionAfiliados .admin-table th {
            color: #C5CEE0 !important;
        }
        #adminSectionAfiliados .admin-table td {
            color: #E8EEF8 !important;
        }
        .admin-list-item-emteste { list-style: none; }
        .admin-modal-actions { margin-top: 1.25rem; display: flex; gap: 0.75rem; justify-content: flex-end; flex-wrap: wrap; }
        .admin-modal-quick-actions { margin-top: 1rem; display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
        .admin-meses-pagamento { display: inline-flex; align-items: center; gap: 0.4rem; }
        .admin-input-meses { width: 64px; }
        .admin-codigo-badge { margin: 0; padding: 0.5rem; background: rgba(0,212,255,0.12); border: 1px solid rgba(0,212,255,0.3); border-radius: 8px; color: var(--primary-blue); font-weight: 600; }
        .admin-input-with-action { position: relative; }
        .admin-input-with-action .admin-input { padding-right: 2.75rem; }
        .admin-input-action {
            position: absolute; right: 0.45rem; top: 50%; transform: translateY(-50%); background: transparent; border: none;
            color: rgba(255,255,255,0.55); cursor: pointer; padding: 0.25rem; display: flex;
        }
        .admin-pagamento-aviso {
            margin-top: 0.75rem; padding: 0.65rem 0.85rem; background: rgba(245,158,11,0.12); border: 1px solid rgba(245,158,11,0.35);
            border-radius: 10px; font-size: 0.8rem; color: #FDE047; line-height: 1.4;
        }
        .modal-box-confirm { max-width: 420px; }
        .admin-btn-back { margin-bottom: 0.25rem; }
        .admin-card-chart { margin-top: 0.25rem; }
        .admin-dashboard-list .admin-empty-inline { color: var(--text-gray); padding: 0.75rem 0; list-style: none; }
        .admin-container { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; flex: 1; min-height: 0; overflow-y: auto; padding-bottom: 3rem; }
        .admin-section { margin-top: 0; max-width: 1180px; }
        .admin-section-title { font-size: 1.45rem; font-weight: 750; color: #fff; margin-bottom: 0.35rem; letter-spacing: -0.03em; display: flex; align-items: center; gap: 0.5rem; }
        .admin-section-desc { color: var(--text-gray); font-size: 0.9rem; margin-bottom: 1.25rem; line-height: 1.5; max-width: 720px; }
        .admin-card { background: var(--admin-surface, rgba(255,255,255,0.04)); border: 1px solid var(--admin-border, rgba(255,255,255,0.08)); border-radius: 16px; padding: 1.5rem; margin-bottom: 1.25rem; box-shadow: 0 4px 24px rgba(0,0,0,0.15); }
        .admin-card-empresas { border-radius: 18px; padding: 2rem; border: 1px solid rgba(255,255,255,0.1); }
        .admin-empresas-busca { margin-bottom: 1.25rem; }
        .admin-empresas-busca label { display: block; font-size: 0.9rem; font-weight: 600; color: var(--text-light); margin-bottom: 0.5rem; }
        .admin-input-empresas { padding: 0.85rem 1.1rem; border-radius: 12px; font-size: 0.95rem; border: 1px solid rgba(255,255,255,0.12); }
        .admin-form-row-empresas { gap: 1rem; margin-bottom: 1rem; }
        .admin-form-row-empresas .form-group { margin-bottom: 0; }
        .admin-empresas-btn-wrap { display: flex; align-items: flex-end; }
        .btn-add-empresas { padding: 0.85rem 1.5rem; border-radius: 12px; font-size: 0.95rem; font-weight: 600; }
        .admin-list-empresas .admin-list-item { border-radius: 14px; padding: 1.1rem 1.25rem; }
        .admin-recebimento-conferir { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid rgba(255,255,255,0.1); }
        .admin-recebimento-conferir-titulo { font-weight: 600; color: var(--text-light); margin: 0 0 0.5rem; font-size: 0.95rem; }
        .admin-recebimento-conferir-desc { color: var(--text-gray); font-size: 0.85rem; margin: 0 0 0.75rem; line-height: 1.45; }
        .admin-form-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; margin-bottom: 1rem; }
        .btn-add { padding: 0.65rem 1.25rem; background: linear-gradient(135deg, var(--primary-blue) 0%, #0099CC 100%); color: #0A0E27; border: none; border-radius: 10px; font-weight: 700; cursor: pointer; font-size: 0.9rem; transition: transform 0.15s, box-shadow 0.2s; box-shadow: 0 2px 12px rgba(0,212,255,0.3); }
        .btn-add:hover { transform: translateY(-1px); box-shadow: 0 4px 18px rgba(0,212,255,0.4); }
        .admin-stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1.25rem; margin-bottom: 1.75rem; }
        .admin-dashboard-stats { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
        .admin-stat-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); border-radius: 14px; padding: 1.25rem; position: relative; overflow: hidden; }
        .admin-stat-card-alert { border-color: rgba(239,68,68,0.4); background: rgba(239,68,68,0.08); }
        .admin-stat-card-warn { border-color: rgba(245,158,11,0.4); background: rgba(245,158,11,0.08); }
        .admin-stat-card-ok { border-color: rgba(34,197,94,0.4); background: rgba(34,197,94,0.08); }
        .admin-dashboard-lists { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.25rem; margin-top: 1.5rem; }
        .admin-dashboard-box { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 12px; padding: 1.25rem; }
        .admin-dashboard-box-title { font-size: 1rem; color: var(--text-light); margin: 0 0 0.35rem; font-weight: 600; }
        .admin-dashboard-box-desc { font-size: 0.8rem; color: var(--text-gray); margin: 0 0 0.75rem; line-height: 1.35; }
        .admin-dashboard-list { list-style: none; margin: 0; padding: 0; font-size: 0.9rem; max-height: 200px; overflow-y: auto; }
        .admin-dashboard-list li { padding: 0.5rem 0; border-bottom: 1px solid rgba(255,255,255,0.06); display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; }
        .admin-dashboard-list li:last-child { border-bottom: none; }
        .admin-dashboard-datas { margin-top: 1rem; }
        .admin-stat-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--primary-blue), transparent); opacity: 0.8; }
        .admin-stat-card .admin-stat-value { font-size: 1.75rem; font-weight: 800; color: var(--primary-blue); letter-spacing: -0.02em; margin: 0 0 0.2rem 0; line-height: 1.2; }
        .admin-stat-card .admin-stat-label { font-size: 0.8rem; color: var(--text-gray); font-weight: 500; margin: 0; text-transform: uppercase; letter-spacing: 0.04em; }
        .admin-stat-card .admin-stat-icon { margin-bottom: 0.5rem; opacity: 0.9; }
        .admin-chart-wrap { height: 220px; max-height: 220px; position: relative; width: 100%; margin-top: 0.5rem; border-radius: 12px; background: rgba(0,0,0,0.15); padding: 0.75rem; }
        .admin-chart-wrap canvas { max-height: 100% !important; display: block; }
        .admin-chart-title { font-size: 0.9rem; color: var(--text-gray); margin-bottom: 0.5rem; font-weight: 600; }

        /* ===== Admin Overview v2 ===== */
        .admin-overview-v2 .admin-kpi-hero {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 1rem;
            margin: 1.25rem 0 1rem;
        }
        .admin-kpi {
            position: relative;
            overflow: hidden;
            border-radius: 18px;
            padding: 1.35rem 1.25rem 1.2rem;
            border: 1px solid rgba(255,255,255,0.08);
            background: linear-gradient(165deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0.02) 100%);
            min-height: 118px;
        }
        .admin-kpi::after {
            content: '';
            position: absolute;
            right: -20px; top: -20px;
            width: 90px; height: 90px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(255,255,255,0.12), transparent 70%);
            pointer-events: none;
        }
        .admin-kpi-ok { border-color: rgba(34,197,94,0.35); background: linear-gradient(160deg, rgba(34,197,94,0.18), rgba(255,255,255,0.03)); }
        .admin-kpi-warn { border-color: rgba(245,158,11,0.35); background: linear-gradient(160deg, rgba(245,158,11,0.16), rgba(255,255,255,0.03)); }
        .admin-kpi-money { border-color: rgba(0,212,255,0.35); background: linear-gradient(160deg, rgba(0,212,255,0.16), rgba(255,255,255,0.03)); }
        .admin-kpi-alert { border-color: rgba(239,68,68,0.35); background: linear-gradient(160deg, rgba(239,68,68,0.14), rgba(255,255,255,0.03)); }
        .admin-overview-v2 .admin-kpi-hero.admin-kpi-saas {
            grid-template-columns: repeat(3, minmax(0, 1fr));
            margin-top: 0;
        }
        .admin-kpi-cac { border-color: rgba(245,158,11,0.4); background: linear-gradient(160deg, rgba(245,158,11,0.18), rgba(255,255,255,0.03)); }
        .admin-kpi-ltv { border-color: rgba(34,197,94,0.4); background: linear-gradient(160deg, rgba(34,197,94,0.16), rgba(255,255,255,0.03)); }
        .admin-kpi-churn { border-color: rgba(239,68,68,0.4); background: linear-gradient(160deg, rgba(239,68,68,0.16), rgba(255,255,255,0.03)); }
        .admin-cac-spend {
            margin: 0 0 1.15rem;
            padding: 0.9rem 1.05rem;
            border-radius: 14px;
            border: 1px solid rgba(255,255,255,0.08);
            background: rgba(0,0,0,0.18);
        }
        .admin-cac-spend label {
            display: block;
            font-size: 0.78rem;
            font-weight: 650;
            color: var(--text-gray);
            margin-bottom: 0.45rem;
        }
        .admin-cac-spend-row {
            display: flex;
            flex-wrap: wrap;
            gap: 0.75rem;
            align-items: center;
        }
        .admin-cac-spend-row input {
            width: 160px;
            max-width: 100%;
            padding: 0.55rem 0.7rem;
            border-radius: 10px;
            border: 1px solid rgba(255,255,255,0.12);
            background: rgba(255,255,255,0.06);
            color: #fff;
            font-size: 0.95rem;
        }
        .admin-cac-spend-row span { font-size: 0.78rem; color: var(--text-gray); max-width: 640px; }
        .admin-saas-charts {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 1rem;
            margin-bottom: 1.25rem;
        }
        .admin-saas-charts .candle-head h3 {
            color: #fff;
            font-size: 0.95rem;
            font-weight: 750;
        }
        #adminScreen .candle-chart-wrap {
            background: #1a2340 !important;
            border-color: rgba(255,255,255,0.08) !important;
        }
        #adminScreen .candle-stats b { color: #F8FAFC; }
        .admin-retention-card { margin-bottom: 1.25rem; }
        .admin-aff-retencao-kpis,
        .afiliado-retencao-kpis {
            display: flex;
            flex-wrap: wrap;
            gap: 0.65rem 1.1rem;
            margin: 0 0 0.75rem;
            font-size: 0.88rem;
            color: var(--text-gray);
        }
        .admin-aff-retencao-kpis b,
        .afiliado-retencao-kpis b { color: var(--text-light); }
        .admin-kpi-label { display: block; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-gray); font-weight: 600; }
        .admin-kpi-value { display: block; margin: 0.45rem 0 0.25rem; font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; color: #fff; line-height: 1.1; }
        .admin-kpi-hint { font-size: 0.8rem; color: rgba(255,255,255,0.55); }
        .admin-overview-secondary-stats {
            display: grid;
            grid-template-columns: repeat(6, minmax(0, 1fr));
            gap: 0.65rem;
            margin-bottom: 1.25rem;
        }
        .admin-mini-stat {
            border-radius: 12px;
            padding: 0.7rem 0.85rem;
            background: rgba(0,0,0,0.2);
            border: 1px solid rgba(255,255,255,0.06);
            display: flex;
            flex-direction: column;
            gap: 0.2rem;
        }
        .admin-mini-stat span { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-gray); }
        .admin-mini-stat strong { font-size: 1.05rem; color: var(--text-light); font-weight: 700; }
        .admin-charts-row {
            display: grid;
            grid-template-columns: 1.4fr 1fr;
            gap: 1rem;
            margin-bottom: 1.25rem;
        }
        .admin-card-chart { padding: 1.15rem 1.2rem 1rem; }
        .admin-chart-wrap-donut { height: 240px; }
        .admin-flow-row {
            display: grid;
            grid-template-columns: 1.2fr 1fr;
            gap: 1rem;
            margin-bottom: 1.25rem;
        }
        .admin-pay-cols { display: grid; gap: 1rem; }
        .admin-card-head { margin-bottom: 0.35rem; }
        .admin-timeline {
            list-style: none;
            margin: 0;
            padding: 0.25rem 0 0.5rem 0.35rem;
            max-height: 360px;
            overflow-y: auto;
            border-left: 2px solid rgba(0,212,255,0.25);
        }
        .admin-timeline-item {
            position: relative;
            padding: 0.65rem 0 0.65rem 1.1rem;
            margin-left: 0;
        }
        .admin-timeline-item::before {
            content: '';
            position: absolute;
            left: -6px;
            top: 1rem;
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: var(--primary-blue);
            box-shadow: 0 0 0 3px rgba(0,212,255,0.2);
        }
        .admin-timeline-item.login::before { background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,0.2); }
        .admin-timeline-item.payment::before { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245,158,11,0.2); }
        .admin-timeline-item.admin::before { background: #a78bfa; box-shadow: 0 0 0 3px rgba(167,139,250,0.25); }
        .admin-timeline-title { margin: 0; font-size: 0.92rem; color: #fff; font-weight: 600; }
        .admin-timeline-meta { margin: 0.2rem 0 0; font-size: 0.78rem; color: var(--text-gray); }
        .admin-flow-teaser-actions { margin-top: 0.75rem; }
        .admin-fluxo-filters { margin-bottom: 1rem; padding: 1rem 1.15rem; }
        .admin-fluxo-filter-row {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 0.85rem;
        }
        .admin-fluxo-hint { margin: 0.75rem 0 0; font-size: 0.82rem; color: var(--text-gray); }
        .admin-fluxo-kpis {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 0.65rem;
            margin-bottom: 1rem;
        }
        .admin-fluxo-grid {
            display: grid;
            grid-template-columns: 1fr 1.15fr;
            gap: 1rem;
        }
        .admin-fluxo-clientes {
            display: flex;
            flex-direction: column;
            gap: 0.55rem;
            max-height: 520px;
            overflow-y: auto;
        }
        .admin-fluxo-cliente {
            text-align: left;
            width: 100%;
            padding: 0.75rem 0.85rem;
            border-radius: 12px;
            border: 1px solid rgba(255,255,255,0.08);
            background: rgba(255,255,255,0.03);
            color: inherit;
            cursor: pointer;
            transition: border-color 0.15s, background 0.15s;
        }
        .admin-fluxo-cliente:hover { background: rgba(255,255,255,0.06); }
        .admin-fluxo-cliente.active {
            border-color: rgba(0,212,255,0.45);
            background: rgba(0,212,255,0.08);
        }
        .admin-fluxo-cliente-top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.5rem;
            margin-bottom: 0.25rem;
        }
        .admin-fluxo-cliente .empresa-meta { display: block; margin-top: 0.15rem; }
        .admin-fluxo-cliente .admin-wa-link { display: inline-block; margin-top: 0.45rem; }
        .admin-fluxo-timeline { max-height: 560px; }
        @media (max-width: 980px) {
            .admin-fluxo-filter-row,
            .admin-fluxo-kpis,
            .admin-fluxo-grid { grid-template-columns: 1fr; }
        }
        .admin-pay-list { max-height: 160px; }
        .admin-pay-badge {
            display: inline-block;
            font-size: 0.68rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.04em;
            padding: 0.15rem 0.45rem;
            border-radius: 999px;
        }
        .admin-pay-badge-ok { background: rgba(34,197,94,0.15); color: #86efac; }
        .admin-pay-badge-pend { background: rgba(245,158,11,0.15); color: #fcd34d; }
        .admin-pay-badge-late { background: rgba(239,68,68,0.15); color: #fca5a5; }
        @media (max-width: 1100px) {
            .admin-overview-v2 .admin-kpi-hero { grid-template-columns: 1fr 1fr; }
            .admin-overview-v2 .admin-kpi-hero.admin-kpi-saas { grid-template-columns: 1fr 1fr; }
            .admin-overview-secondary-stats { grid-template-columns: repeat(3, 1fr); }
            .admin-charts-row, .admin-flow-row, .admin-saas-charts { grid-template-columns: 1fr; }
        }
        @media (max-width: 640px) {
            .admin-overview-v2 .admin-kpi-hero { grid-template-columns: 1fr; }
            .admin-overview-secondary-stats { grid-template-columns: 1fr 1fr; }
            .admin-kpi-value { font-size: 1.65rem; }
        }

        .admin-list { max-height: 380px; overflow-y: auto; }
        .admin-list-item { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.1rem; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 12px; margin-bottom: 0.6rem; font-size: 0.9rem; flex-wrap: wrap; gap: 0.6rem; transition: background 0.15s, border-color 0.15s; }
        .admin-list-item:hover { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.1); }
        .admin-list-item span { color: #E8EEF8; line-height: 1.45; }
        #adminScreen .empresa-main strong { color: #FFFFFF; }
        #adminScreen .empresa-meta { color: #C5CEE0; }
        .btn-config { padding: 0.4rem 0.85rem; background: rgba(0,212,255,0.15); color: var(--primary-blue); border: 1px solid rgba(0,212,255,0.35); border-radius: 8px; cursor: pointer; font-size: 0.8rem; font-weight: 600; transition: background 0.15s; }
        .btn-config:hover { background: rgba(0,212,255,0.25); }
        .btn-remove { padding: 0.4rem 0.75rem; background: rgba(239,68,68,0.15); color: #FCA5A5; border: 1px solid rgba(239,68,68,0.3); border-radius: 8px; cursor: pointer; font-size: 0.8rem; font-weight: 600; }
        .btn-remove:hover { background: rgba(239,68,68,0.25); }
        .admin-list-item-assinante { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 0.75rem; }
        .admin-list-item-assinante .assinante-info { display: flex; flex-direction: column; gap: 0.25rem; flex: 1; min-width: 200px; }
        .admin-list-item-assinante .assinante-info strong { color: #fff; font-size: 1rem; }
        .admin-list-item-assinante .assinante-meta { font-size: 0.85rem; color: var(--text-gray); }
        .admin-list-item-assinante .assinante-actions { display: flex; gap: 0.5rem; flex-shrink: 0; }
        .banner-vencimentos { background: linear-gradient(135deg, rgba(245,158,11,0.2) 0%, rgba(239,68,68,0.1) 100%); border: 1px solid rgba(245,158,11,0.4); border-radius: 14px; padding: 1.1rem 1.5rem; margin-bottom: 1.5rem; }
        .banner-vencimento-empresa {
            display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem;
            background: linear-gradient(135deg, rgba(239,68,68,0.22) 0%, rgba(185,28,28,0.12) 100%);
            border: 1px solid rgba(239,68,68,0.45);
            border-radius: 12px;
            padding: 1rem 1.25rem;
            margin-bottom: 1rem;
        }
        .banner-vencimento-text { flex: 1; min-width: 200px; font-size: 0.95rem; color: rgba(255,255,255,0.95); }
        .banner-vencimento-btn {
            padding: 0.5rem 1rem; font-size: 0.9rem; font-weight: 600;
            background: linear-gradient(135deg, #22C55E 0%, #16A34A 100%);
            color: #fff; border: none; border-radius: 8px; cursor: pointer;
            white-space: nowrap; transition: transform 0.15s, box-shadow 0.2s;
        }
        .banner-vencimento-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(34,197,94,0.4); }
        .banner-vencimento-btn:disabled { opacity: 0.8; cursor: not-allowed; transform: none; }
        .banner-vencimento-btn-link {
            padding: 0.5rem 1rem; font-size: 0.9rem; font-weight: 600;
            background: rgba(255,255,255,0.12); color: #fff;
            border-radius: 8px; text-decoration: none; white-space: nowrap;
            transition: background 0.2s;
        }
        .banner-vencimento-btn-link:hover { background: rgba(255,255,255,0.2); color: #fff; }
        /* Admin mobile: menu hamburger e sidebar colapsável */
        .admin-header-toggle { display: none; padding: 0.5rem; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: 10px; color: #fff; cursor: pointer; font-size: 1.25rem; align-items: center; justify-content: center; }
        .admin-header-toggle:focus { outline: none; }
        @media (max-width: 768px) {
            #adminScreen .admin-header { padding: 0.75rem 1rem; gap: 0.5rem; }
            #adminScreen .admin-header .admin-brand-icon { width: 36px; height: 36px; font-size: 1.1rem; }
            #adminScreen .admin-title { font-size: 1.15rem; }
            #adminScreen .admin-subtitle { font-size: 0.75rem; }
            #adminScreen .admin-header-toggle { display: flex; }
            #adminScreen .admin-body { position: relative; flex-direction: column; }
            #adminScreen .admin-sidebar {
                position: fixed; top: 0; left: 0; bottom: 0; z-index: 1000;
                width: 260px; max-width: 85vw;
                transform: translateX(-100%); transition: transform 0.25s ease;
                box-shadow: 4px 0 20px rgba(0,0,0,0.3);
            }
            #adminScreen.admin-sidebar-open .admin-sidebar { transform: translateX(0); }
            #adminScreen .admin-sidebar-overlay {
                display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 999;
            }
            #adminScreen.admin-sidebar-open .admin-sidebar-overlay { display: block; }
            #adminScreen .admin-main-inner { padding: 1rem; min-height: 0; }
            #adminScreen .admin-form-row { grid-template-columns: 1fr; }
            #adminScreen .admin-stats-grid { grid-template-columns: 1fr 1fr; }
            #adminScreen .admin-dashboard-lists { grid-template-columns: 1fr; }
            #adminScreen .admin-container { padding: 0 1rem; }
        }
        @media (max-width: 480px) {
            #adminScreen .admin-stats-grid { grid-template-columns: 1fr; }
            #adminScreen .admin-dashboard-box { padding: 1rem; }
        }
        .admin-input, .admin-select, .admin-textarea { width: 100%; padding: 0.75rem 1rem; border-radius: 10px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.06); color: #fff; font-size: 0.9rem; transition: border-color 0.2s, background 0.2s; }
        .admin-input:focus, .admin-select:focus, .admin-textarea:focus { outline: none; border-color: var(--primary-blue); background: rgba(255,255,255,0.08); }
        .admin-input::placeholder, .admin-textarea::placeholder { color: rgba(255,255,255,0.4); }
        .admin-form-group label { display: block; font-size: 0.8rem; font-weight: 600; color: var(--text-gray); margin-bottom: 0.4rem; text-transform: uppercase; letter-spacing: 0.03em; }
        .modal-overlay-admin { position: fixed; inset: 0; background: rgba(0,0,0,0.8); backdrop-filter: blur(4px); display: none; align-items: center; justify-content: center; z-index: 1000; padding: 1rem; }
        .modal-overlay-admin.active { display: flex; }
        .modal-box-admin { background: linear-gradient(160deg, #0f1535 0%, #0A0E27 100%); border: 1px solid rgba(255,255,255,0.12); border-radius: 20px; padding: 1.75rem; width: 100%; max-width: 440px; box-shadow: 0 24px 48px rgba(0,0,0,0.4); }
        .modal-box-admin.modal-box-editar-assinante { max-width: 560px; max-height: 90vh; overflow-y: auto; }
        .modal-box-admin h3 { margin-bottom: 1.25rem; color: var(--primary-blue); font-size: 1.2rem; font-weight: 700; }
        .modal-assinante-section { margin-bottom: 1.5rem; padding-bottom: 1.25rem; border-bottom: 1px solid rgba(255,255,255,0.08); }
        .modal-assinante-section:last-of-type { border-bottom: none; }
        .modal-assinante-section-title { font-size: 0.95rem; font-weight: 700; color: rgba(255,255,255,0.9); margin: 0 0 0.75rem; }
        .modal-assinante-empresa-readonly { background: rgba(0,0,0,0.2); border-radius: 12px; padding: 1rem; }
        .modal-assinante-empresa-line { margin: 0.35rem 0; font-size: 0.9rem; color: rgba(255,255,255,0.85); }
        .modal-assinante-empresa-vazio { margin: 0; color: var(--text-gray); font-size: 0.9rem; }
        .modal-assinante-pagamentos-desc { font-size: 0.8rem; color: var(--text-gray); margin: 0 0 0.5rem; }
        .modal-assinante-pagamentos-table-wrap { max-height: 200px; overflow-y: auto; margin-top: 0.5rem; }
        .admin-secret { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,0.06); }
        .admin-secret-link { font-size: 0.85rem; color: var(--text-gray); cursor: pointer; user-select: none; padding: 0.5rem 0; display: inline-flex; align-items: center; gap: 0.4rem; border-radius: 8px; transition: color 0.2s; }
        .admin-secret-link:hover { color: var(--primary-blue); }
        .admin-secret-panel { display: none; margin-top: 1.5rem; }
        .admin-secret-panel.show { display: block; }
        .empty-msg { color: var(--text-gray); font-size: 0.9rem; padding: 1.5rem; text-align: center; }
        .btn-refresh-list { padding: 0.4rem 0.9rem; font-size: 0.85rem; background: rgba(255,255,255,0.08); color: var(--text-light); border: 1px solid rgba(255,255,255,0.15); border-radius: 8px; cursor: pointer; font-weight: 500; transition: background 0.2s; }
        .btn-refresh-list:hover { background: rgba(255,255,255,0.12); }

        .global-footer {
            position: fixed;
            bottom: 8px;
            left: 0;
            right: 0;
            text-align: center;
            font-size: 0.75rem;
            color: var(--text-gray);
            z-index: 9000;
            pointer-events: none;
        }

        /* PDV: página toda em tema claro quando estiver no PDV */
        body.pdv-page-light {
            background: #f1f5f9;
            color: #1e293b;
        }
        body.pdv-page-light .dashboard-layout {
            background: #f1f5f9;
        }
        /* Sidebar mantém a cor original da plataforma no PDV */
        body.pdv-page-light .main-content {
            background: #f1f5f9;
        }
        body.pdv-page-light .main-top-bar {
            border-bottom-color: #e2e8f0;
        }
        body.pdv-page-light .user-welcome-wrap #welcomeMessage {
            color: #334155;
        }
        body.pdv-page-light .user-avatar-wrap {
            background: #fff;
            border-color: #e2e8f0;
            color: #334155;
        }
        body.pdv-page-light .user-avatar-wrap:hover {
            background: #f8fafc;
        }
        body.pdv-page-light .user-avatar-wrap .no-photo {
            background: var(--primary-blue);
            color: #fff;
        }
        body.pdv-page-light .user-dropdown {
            background: #fff;
            border-color: #e2e8f0;
            box-shadow: 0 10px 30px rgba(0,0,0,0.12);
        }
        body.pdv-page-light .user-dropdown a {
            color: #334155;
        }
        body.pdv-page-light .user-dropdown a:hover {
            background: #f8fafc;
            color: #0f172a;
        }
        body.pdv-page-light .global-footer {
            color: #64748b;
        }
        body.pdv-page-light .content-header {
            border-bottom-color: #e2e8f0;
        }
        body.pdv-page-light .content-header h1 {
            color: #0f172a;
        }
        body.pdv-page-light .main-inner {
            background: transparent;
        }
        body.pdv-page-light select,
        body.pdv-page-light .pdv-vendedor-select,
        body.pdv-page-light .pdv-section select {
            background: #fff !important;
            color: #1e293b !important;
        }
        body.pdv-page-light .pdv-section select option {
            background: #fff !important;
            color: #1e293b !important;
        }

        /* PDV página única: esconde sidebar, barra superior e footer */
        body.pdv-standalone .sidebar { display: none !important; }
        body.pdv-standalone .main-top-bar { display: none !important; }
        body.pdv-standalone .global-footer { display: none !important; }
        body.pdv-standalone .main-content { margin-left: 0 !important; max-width: none !important; }
        body.pdv-standalone .main-inner { max-width: none; }
        body.pdv-standalone { overflow-x: hidden; }
        .pdv-return-bar { flex-shrink: 0; padding: 0.75rem 1rem; margin-bottom: 0.5rem; border-bottom: 1px solid #e2e8f0; display: flex; align-items: center; background: #f8fafc; }
        .pdv-btn-return { padding: 0.5rem 1rem; background: #fff; color: #334155; border: 1px solid #e2e8f0; border-radius: 10px; font-size: 0.9rem; font-weight: 600; cursor: pointer; transition: background 0.2s, box-shadow 0.2s; display: inline-flex; align-items: center; gap: 0.35rem; }
        .pdv-btn-return:hover { background: #f1f5f9; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }

        /* Invoice Print Styles */
        .invoice-print-container {
            background: white;
            color: #333;
            padding: 0;
            border-radius: 0;
        }

        /* Template A4 - Comprovante de venda avulsa (preview no modal) */
        .comprovante-a4 { max-width: 210mm; margin: 0 auto; background: #fff; color: #1e293b; font-family: 'Segoe UI', system-ui, Arial, sans-serif; padding: 1.5rem; border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.08); }
        .comprovante-a4-header { padding-bottom: 1.25rem; border-bottom: 3px solid #0ea5e9; margin-bottom: 1.25rem; }
        .comprovante-a4-brand { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
        .comprovante-a4-logo { max-height: 56px; max-width: 160px; object-fit: contain; }
        .comprovante-a4-brand-text { flex: 1; min-width: 0; }
        .comprovante-a4-title { margin: 0; font-size: 1.5rem; font-weight: 700; color: #0f172a; }
        .comprovante-a4-subtitle { margin: 0.25rem 0 0; font-size: 0.95rem; color: #64748b; font-weight: 600; letter-spacing: 0.02em; }
        .comprovante-a4-info { margin-bottom: 1.25rem; }
        .comprovante-a4-info-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem 1.5rem; }
        .comprovante-a4-info-grid > div { display: flex; flex-direction: column; gap: 0.15rem; }
        .comprovante-a4-label { font-size: 0.75rem; color: #64748b; text-transform: uppercase; letter-spacing: 0.04em; }
        .comprovante-a4-value { font-size: 0.95rem; font-weight: 600; color: #334155; }
        .comprovante-a4-items { margin-bottom: 1rem; overflow-x: auto; }
        .comprovante-a4-table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
        .comprovante-a4-th, .comprovante-a4-td { padding: 0.6rem 0.75rem; text-align: left; border-bottom: 1px solid #e2e8f0; }
        .comprovante-a4-th { background: #f8fafc; color: #475569; font-weight: 600; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.03em; }
        .comprovante-a4-th-qty, .comprovante-a4-td-qty { text-align: center; width: 4rem; }
        .comprovante-a4-th:not(.comprovante-a4-th-name), .comprovante-a4-td:not(.comprovante-a4-td-name) { text-align: right; }
        .comprovante-a4-td-name { max-width: 280px; word-break: break-word; }
        .comprovante-a4-total-wrap { padding: 1rem 0.75rem; background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%); border-radius: 10px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
        .comprovante-a4-total-label { font-size: 1rem; font-weight: 600; color: #0c4a6e; }
        .comprovante-a4-total-value { font-size: 1.5rem; font-weight: 800; color: #0369a1; }
        .comprovante-a4-footer { font-size: 0.75rem; color: #94a3b8; text-align: center; padding-top: 0.75rem; border-top: 1px solid #e2e8f0; }
        .comprovante-a4-footer p { margin: 0; }
        @media (max-width: 480px) {
            .comprovante-a4 { padding: 1rem; }
            .comprovante-a4-title { font-size: 1.25rem; }
            .comprovante-a4-info-grid { grid-template-columns: 1fr; }
            .comprovante-a4-th, .comprovante-a4-td { padding: 0.5rem 0.4rem; font-size: 0.85rem; }
            .comprovante-a4-total-value { font-size: 1.25rem; }
        }

        /* Modal comprovante: A4 preview + mobile */
        .comprovante-modal { max-width: min(95vw, 800px); max-height: 92vh; display: flex; flex-direction: column; overflow: hidden; }
        .comprovante-modal-actions { margin-bottom: 1rem; display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; flex-shrink: 0; }
        .comprovante-modal-actions span { color: var(--text-gray); font-size: 0.85rem; margin-right: 0.25rem; }
        .comprovante-modal-content { background: #f8fafc; color: #333; padding: 1rem; border-radius: 12px; overflow: auto; flex: 1; min-height: 0; -webkit-overflow-scrolling: touch; }
        @media (max-width: 768px) {
            .comprovante-modal { max-width: 100%; max-height: 90vh; margin: 0.5rem; }
            .comprovante-modal-content { padding: 0.75rem; }
        }

        @media print {
            body * { visibility: hidden !important; }
            #invoicePrintable, #invoicePrintable * { visibility: visible !important; }
            #invoicePrintable {
                position: absolute !important;
                left: 0 !important;
                top: 0 !important;
                width: 100% !important;
                max-width: 100% !important;
                margin: 0 !important;
                padding: 0 !important;
                background: #fff !important;
                color: #111 !important;
                z-index: 99999 !important;
            }
            /* NÃO esconder o overlay que contém o PDF — só limpar a moldura */
            .sidebar, .btn-voltar, .no-print,
            .main-top-bar, .global-footer, .nav-btn,
            .mobile-bottom-nav,
            #viewModal .modal-header, #viewModal .modal-close,
            #viewModal .modal > .btn-primary,
            #viewModal button { display: none !important; }
            #viewModal.modal-overlay,
            #viewModal .modal,
            #viewModal #documentContent {
                display: block !important;
                visibility: visible !important;
                position: static !important;
                inset: auto !important;
                width: 100% !important;
                max-width: none !important;
                max-height: none !important;
                overflow: visible !important;
                background: #fff !important;
                border: none !important;
                box-shadow: none !important;
                padding: 0 !important;
                margin: 0 !important;
            }
            .main-content { margin-left: 0 !important; }
        }

        .hidden { display: none !important; }
        #bloqueioMensalidadeVencida {
            display: none;
            position: absolute;
            left: 0; right: 0; top: 0; bottom: 0;
            background: rgba(10,14,39,0.97);
            z-index: 500;
            align-items: center;
            justify-content: center;
            padding: 2rem;
            text-align: center;
        }
        #bloqueioMensalidadeVencida.show { display: flex !important; }
        #bloqueioMensalidadeVencida .bloqueio-box {
            max-width: 420px;
            background: linear-gradient(160deg, rgba(30,41,59,0.98) 0%, rgba(15,23,42,0.98) 100%);
            border: 1px solid rgba(239,68,68,0.35);
            border-radius: 16px;
            padding: 2rem;
            box-shadow: 0 25px 60px rgba(0,0,0,0.5);
        }
        #bloqueioMensalidadeVencida .bloqueio-title { font-size: 1.35rem; color: #FCA5A5; margin-bottom: 0.75rem; font-weight: 700; }
        #bloqueioMensalidadeVencida .bloqueio-text { color: rgba(255,255,255,0.8); font-size: 0.95rem; line-height: 1.5; margin-bottom: 1.25rem; }
        #bloqueioMensalidadeVencida .bloqueio-btn { display: inline-block; padding: 0.75rem 1.5rem; background: var(--primary-blue); color: #fff; border-radius: 10px; font-weight: 600; text-decoration: none; margin-top: 0.5rem; cursor: pointer; border: none; font-size: 1rem; }
        #bloqueioMensalidadeVencida .bloqueio-btn:hover { opacity: 0.9; }

        /* Notification Toast */
        .toast {
            position: fixed;
            bottom: 20px;
            right: 20px;
            background: linear-gradient(135deg, #10B981 0%, #059669 100%);
            color: white;
            padding: 1rem 1.5rem;
            border-radius: 10px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
            z-index: 9999;
            transform: translateX(150%);
            transition: transform 0.3s ease;
        }

        .toast.show { transform: translateX(0); }
        .toast.error { background: linear-gradient(135deg, #EF4444 0%, #DC2626 100%); }

        /* Barra inferior mobile — deslizar horizontal (itens NÃO encolhem) */
        .mobile-bottom-nav {
            display: none;
            position: fixed;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 200;
            width: 100%;
            max-width: 100vw;
            background: rgba(232, 238, 245, 0.98);
            border-top: 1px solid #CBD5E1;
            box-shadow: 0 -8px 28px rgba(15, 23, 42, 0.12);
            padding: 0.5rem 0 calc(0.5rem + env(safe-area-inset-bottom, 0px));
            -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(12px);
        }
        body:not([data-appearance="light"]) .mobile-bottom-nav {
            background: rgba(15, 21, 53, 0.98);
            border-top-color: rgba(255,255,255,0.12);
            box-shadow: 0 -8px 28px rgba(0,0,0,0.35);
        }
        .mobile-bottom-nav-track {
            display: flex !important;
            flex-direction: row !important;
            flex-wrap: nowrap !important;
            align-items: stretch;
            justify-content: flex-start !important;
            gap: 0.4rem;
            width: 100%;
            max-width: 100%;
            overflow-x: auto !important;
            overflow-y: hidden !important;
            -webkit-overflow-scrolling: touch;
            scroll-snap-type: x proximity;
            padding: 0 0.75rem 0.2rem;
            scrollbar-width: none;
            overscroll-behavior-x: contain;
            touch-action: pan-x;
        }
        .mobile-bottom-nav-track::-webkit-scrollbar { display: none; height: 0; }
        .mobile-nav-btn {
            flex: 0 0 92px !important;
            flex-grow: 0 !important;
            flex-shrink: 0 !important;
            flex-basis: 92px !important;
            width: 92px !important;
            min-width: 92px !important;
            max-width: 92px !important;
            scroll-snap-align: start;
            min-height: 72px !important;
            height: auto;
            padding: 0.5rem 0.3rem !important;
            border: none;
            border-radius: 14px;
            background: transparent;
            color: #475569;
            display: flex !important;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 0.25rem;
            cursor: pointer;
            touch-action: manipulation;
            -webkit-tap-highlight-color: transparent;
            box-sizing: border-box;
        }
        body:not([data-appearance="light"]) .mobile-nav-btn { color: #CBD5E1; }
        .mobile-nav-icon { font-size: 1.75rem !important; line-height: 1; pointer-events: none; }
        .mobile-nav-label {
            font-size: 0.8rem !important;
            font-weight: 700 !important;
            line-height: 1.15;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: 100%;
            letter-spacing: -0.01em;
            pointer-events: none;
        }
        .mobile-nav-btn.active {
            background: color-mix(in srgb, var(--primary-blue) 22%, #fff) !important;
            color: #0F172A !important;
            box-shadow: 0 2px 10px rgba(37, 99, 235, 0.18);
        }
        body:not([data-appearance="light"]) .mobile-nav-btn.active {
            background: color-mix(in srgb, var(--primary-blue) 32%, transparent) !important;
            color: #fff !important;
        }
        body.pdv-standalone .mobile-bottom-nav { display: none !important; }

        /* Responsive - mobile e tablet */
        @media (max-width: 1024px) {
            .dashboard-layout { flex-direction: column; width: 100%; max-width: 100%; overflow-x: hidden; }
            /* Remove sidebar lateral no mobile — menu na barra inferior */
            #dashboard > .sidebar,
            #dashboard #sidebar,
            aside.sidebar#sidebar { display: none !important; }
            .mobile-bottom-nav { display: block !important; }
            .main-content,
            .sidebar.collapsed + .main-content {
                margin-left: 0 !important;
                margin-right: 0 !important;
                width: 100% !important;
                max-width: 100% !important;
                padding: 0.75rem 1rem calc(5.5rem + env(safe-area-inset-bottom, 0px));
                margin-top: 0;
                max-height: none;
                min-height: auto;
            }
            body.sidebar-collapsed .modal-overlay { left: 0 !important; right: 0 !important; }
            .modal-overlay { left: 0 !important; right: 0 !important; }
            body { overflow-x: hidden; }
            .main-inner { margin-left: 0 !important; max-width: 100%; }
            .modal-overlay-admin { padding: 1rem; align-items: flex-start; padding-top: 2rem; }
            .modal-box-admin { max-width: 100%; }
            .charts-row {
                grid-template-columns: 1fr !important;
                gap: 0.75rem;
                min-width: 0;
            }
            .charts-row.overview-charts-pair {
                grid-template-columns: 1fr 1fr !important;
                gap: 0.5rem;
            }
            .stats-grid { grid-template-columns: 1fr 1fr; gap: 0.65rem; }
            .stats-grid.overview-unified-cards,
            .stats-grid.overview-top-cards {
                grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
                gap: 0.4rem;
            }
            .stats-grid.overview-unified-cards .stat-card { padding: 0.5rem 0.25rem; }
            .stats-grid.overview-unified-cards .stat-value { font-size: 0.95rem !important; }
            .stats-grid.overview-unified-cards .stat-label { font-size: 0.65rem !important; }
            .stats-grid.overview-unified-cards .stat-icon { font-size: 1.15rem; margin-bottom: 0.1rem; }
            .finance-chart-inner { width: 960px !important; min-width: 960px !important; height: 300px !important; }
            .chart-container { max-height: none; padding: 0.85rem; min-width: 0; }
            .chart-container canvas { max-height: 240px; width: 100% !important; height: auto !important; }
            .chart-container h3 { font-size: 1.15rem; margin-bottom: 0.65rem; }
            .content-header { flex-direction: column; align-items: stretch !important; gap: 0.65rem; margin-bottom: 1rem; padding-bottom: 0.75rem; }
            .content-header h1 { font-size: 1.45rem !important; line-height: 1.25; }
            .quick-actions {
                width: 100%;
                display: grid !important;
                grid-template-columns: 1fr !important;
                gap: 0.55rem !important;
                flex-wrap: unset !important;
            }
            .quick-actions .btn-primary {
                width: 100% !important;
                min-height: 54px !important;
                font-size: 1.1rem !important;
                padding: 0.9rem 1rem !important;
                border-radius: 12px;
                box-sizing: border-box;
                justify-content: center !important;
            }
            .stat-card {
                padding: 0.85rem 0.7rem;
                min-height: 0;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 0.15rem;
                touch-action: manipulation;
            }
            .stat-icon { font-size: 1.75rem; margin-bottom: 0.15rem; }
            .stat-value { font-size: 1.65rem !important; line-height: 1.15; font-weight: 800; }
            .stat-label { font-size: 0.88rem !important; line-height: 1.2; font-weight: 600; }
            .main-top-bar { padding: 0.5rem 0; }
            .user-welcome-wrap #welcomeMessage { font-size: 0.95rem; }
            .header-plan-label { font-size: 0.85rem; padding: 0.3rem 0.55rem; }
            .user-avatar-wrap { min-width: 48px; min-height: 48px; }
            .toast { left: 1rem; right: 1rem; bottom: calc(6.25rem + env(safe-area-inset-bottom, 0px)); }
            .global-footer { font-size: 0.7rem; bottom: calc(5.4rem + env(safe-area-inset-bottom, 0px)); }
            .form-row { grid-template-columns: 1fr; }
            .admin-form-row { grid-template-columns: 1fr; }
            .admin-stats-grid { grid-template-columns: 1fr; }
            .admin-container { padding: 0 1rem; }
            .admin-header { padding: 1rem; flex-wrap: wrap; }
            .admin-header .admin-title { font-size: 1.2rem; }
            .login-card { padding: 2rem 1.5rem; }
            .login-page { padding: 1rem; }
            .card-grid { grid-template-columns: 1fr; }
            .btn-primary { min-height: 44px; }
            /* PDV: modal catálogo — touch e coluna única no mobile */
            .modal.pdv-modal-produtos {
                width: 100% !important;
                max-width: 100% !important;
                max-height: calc(100vh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 1rem) !important;
                margin: 0 !important;
                border-radius: 16px 16px 0 0 !important;
            }
            .pdv-modal-produtos-header input { font-size: 16px; }
            .pdv-modal-categoria-label { font-size: 0.85rem; }
            .pdv-modal-produtos-filters { flex-direction: column; align-items: stretch; }
            .pdv-modal-produtos-filters select,
            .pdv-modal-categoria-select {
                width: 100%;
                max-width: 100%;
                min-height: 44px;
                font-size: 16px;
                flex: none;
                -webkit-appearance: none;
                appearance: none;
            }
            .pdv-modal-produtos-list {
                grid-template-columns: 1fr 1fr;
                gap: 0.5rem;
            }
            .pdv-modal-prod-item { padding: 0.75rem; min-height: 44px; touch-action: manipulation; }
        }
        @media (max-width: 480px) {
            .pdv-modal-produtos-list { grid-template-columns: 1fr; }
            .stat-card { padding: 0.8rem 0.65rem; min-height: 0; }
            .stat-value { font-size: 1.55rem !important; }
            .stat-label { font-size: 0.82rem !important; }
            .card { padding: 0.85rem; }
        }
        @media print {
            .global-footer { display: none !important; }
        }
        body { padding-bottom: 28px; }

        /* ========== Aparência clara (padrão) — fundo suave + cores semânticas ========== */
        body[data-appearance="light"] {
            --bg-app: #E8EEF5;
            --bg-card: #FFFFFF;
            --bg-sidebar: #FFFFFF;
            --text-main: #0F172A;
            --text-muted: #64748B;
            --text-gray: #64748B;
            --text-light: #1E293B;
            --border: #E2E8F0;
            --primary-dark: #E8EEF5;
            --accent-green: #059669;
            --accent-red: #DC2626;
            --accent-yellow: #D97706;
            background: linear-gradient(165deg, #E8EEF5 0%, #F1F5F9 45%, #E2EAF4 100%);
            color: var(--text-main);
        }
        body[data-appearance="light"] .dashboard-layout,
        body[data-appearance="light"] .main-content,
        body[data-appearance="light"] .main-inner {
            background: transparent;
        }
        body[data-appearance="light"] .sidebar {
            background: linear-gradient(180deg, #FFFFFF 0%, color-mix(in srgb, var(--primary-blue) 8%, #F8FAFC) 100%);
            border-right: 2px solid color-mix(in srgb, var(--primary-blue) 45%, #CBD5E1);
            box-shadow: 4px 0 24px rgba(15, 23, 42, 0.06);
        }
        body[data-appearance="light"] .sidebar-title,
        body[data-appearance="light"] .sidebar-subtitle,
        body[data-appearance="light"] .nav-btn,
        body[data-appearance="light"] .btn-voltar {
            color: #334155;
        }
        body[data-appearance="light"] .nav-btn:hover {
            background: color-mix(in srgb, var(--primary-blue) 12%, #F1F5F9);
            color: #0F172A;
        }
        body[data-appearance="light"] .nav-btn.active {
            background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-blue-dark) 100%);
            color: #fff;
        }
        body[data-appearance="light"] .main-top-bar {
            border-bottom-color: var(--border);
            background: rgba(255,255,255,0.72);
            backdrop-filter: blur(8px);
        }
        body[data-appearance="light"] .content-header {
            border-bottom-color: var(--border);
        }
        body[data-appearance="light"] .content-header h1,
        body[data-appearance="light"] .user-welcome-wrap #welcomeMessage {
            color: #0F172A;
        }
        body[data-appearance="light"] .user-avatar-wrap {
            background: #fff;
            border-color: var(--border);
            color: #334155;
        }
        body[data-appearance="light"] .user-dropdown {
            background: #fff;
            border-color: var(--border);
            box-shadow: 0 12px 32px rgba(15,23,42,0.12);
        }
        body[data-appearance="light"] .user-dropdown a { color: #334155; }
        body[data-appearance="light"] .user-dropdown a:hover { background: #F1F5F9; color: #0F172A; }
        body[data-appearance="light"] .global-footer { color: #64748B; }

        body[data-appearance="light"] .stat-card,
        body[data-appearance="light"] .card,
        body[data-appearance="light"] .chart-container,
        body[data-appearance="light"] .form-section,
        body[data-appearance="light"] .config-menu-btn,
        body[data-appearance="light"] .config-plano-card {
            background: #FFFFFF;
            border: 1px solid var(--border);
            box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
            color: #0F172A;
        }
        body[data-appearance="light"] .stat-card:hover,
        body[data-appearance="light"] .card:hover {
            box-shadow: 0 10px 28px rgba(15, 23, 42, 0.1);
            border-color: color-mix(in srgb, var(--primary-blue) 40%, #CBD5E1);
        }
        body[data-appearance="light"] .stat-label,
        body[data-appearance="light"] .card-subtitle { color: #64748B; }
        body[data-appearance="light"] .card-title { color: #0F172A; }

        body[data-appearance="light"] .data-table th { color: #64748B; }
        body[data-appearance="light"] .data-table td { color: #1E293B; border-bottom-color: #E2E8F0; }
        body[data-appearance="light"] .data-table tr:hover { background: #F8FAFC; }

        body[data-appearance="light"] .form-group label { color: #334155; }
        body[data-appearance="light"] .form-group input,
        body[data-appearance="light"] .form-group select,
        body[data-appearance="light"] .form-group textarea,
        body[data-appearance="light"] input[type="text"],
        body[data-appearance="light"] input[type="number"],
        body[data-appearance="light"] input[type="email"],
        body[data-appearance="light"] input[type="password"],
        body[data-appearance="light"] input[type="date"],
        body[data-appearance="light"] input[type="tel"],
        body[data-appearance="light"] select,
        body[data-appearance="light"] textarea,
        body[data-appearance="light"] .status-select-inline {
            background: #FFFFFF !important;
            color: #0F172A !important;
            border: 1px solid #CBD5E1 !important;
        }
        body[data-appearance="light"] .form-group input::placeholder,
        body[data-appearance="light"] textarea::placeholder { color: #94A3B8; }

        body[data-appearance="light"] .modal-overlay {
            background: rgba(15, 23, 42, 0.45);
        }
        body[data-appearance="light"] .modal {
            background: #FFFFFF;
            border: 1px solid #E2E8F0;
            box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
            color: #0F172A;
        }
        body[data-appearance="light"] .modal-close {
            background: #F1F5F9;
            color: #334155;
        }
        body[data-appearance="light"] .modal-header h2,
        body[data-appearance="light"] .modal h2,
        body[data-appearance="light"] .modal h3,
        body[data-appearance="light"] .modal h4 { color: #0F172A; }

        body[data-appearance="light"] .view-toggle button {
            background: #F8FAFC;
            border-color: #CBD5E1;
            color: #334155;
        }
        body[data-appearance="light"] .view-toggle button.active {
            background: var(--primary-blue);
            color: #fff;
            border-color: var(--primary-blue);
        }
        body[data-appearance="light"] .view-toggle button.view-toggle-featured {
            background: color-mix(in srgb, var(--primary-blue) 12%, #fff);
            border-color: var(--primary-blue);
            color: var(--primary-blue-dark);
            box-shadow: 0 2px 10px color-mix(in srgb, var(--primary-blue) 22%, transparent);
        }
        body[data-appearance="light"] .view-toggle button.view-toggle-featured.active {
            background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-blue-dark) 100%);
            color: #fff;
        }

        /* Status no tema claro: fundo sólido + texto escuro legível */
        body[data-appearance="light"] .status-dropdown-btn.status-pending { background: #FEF3C7 !important; color: #92400E !important; }
        body[data-appearance="light"] .status-dropdown-btn.status-approved { background: #D1FAE5 !important; color: #065F46 !important; }
        body[data-appearance="light"] .status-dropdown-btn.status-inprogress { background: #DBEAFE !important; color: #1E40AF !important; }
        body[data-appearance="light"] .status-dropdown-btn.status-completed { background: #EDE9FE !important; color: #5B21B6 !important; }
        body[data-appearance="light"] .status-dropdown-btn.status-paid { background: #A7F3D0 !important; color: #065F46 !important; }
        body[data-appearance="light"] .status-dropdown-btn.status-partial { background: #FFEDD5 !important; color: #9A3412 !important; }
        body[data-appearance="light"] .status-dropdown-btn.status-waiting-parts { background: #FEF3C7 !important; color: #92400E !important; }
        body[data-appearance="light"] .status-dropdown-btn.status-cancelled { background: #FEE2E2 !important; color: #991B1B !important; }
        body[data-appearance="light"] .status-menu-floating {
            background: #FFFFFF;
            border-color: #E2E8F0;
            box-shadow: 0 12px 32px rgba(15,23,42,0.15);
        }
        body[data-appearance="light"] .status-menu-floating .status-option {
            color: #0F172A !important;
        }
        body[data-appearance="light"] .status-menu-floating .status-option:hover {
            background: #F1F5F9;
            color: #0F172A !important;
        }
        body[data-appearance="light"] .status-menu-floating .status-option.active {
            background: #DBEAFE !important;
            color: #1E40AF !important;
        }

        body[data-appearance="light"] .kanban-col {
            background: #F8FAFC;
            border-color: #E2E8F0;
        }
        body[data-appearance="light"] .kanban-col-head { color: #0F172A; border-bottom-color: #E2E8F0; }
        body[data-appearance="light"] .kanban-card {
            background: #FFFFFF;
            border-color: #E2E8F0;
            box-shadow: 0 2px 8px rgba(15,23,42,0.06);
        }
        body[data-appearance="light"] .kanban-card-title { color: #0F172A; }
        body[data-appearance="light"] .kanban-card-sub { color: #64748B; }
        body[data-appearance="light"] .kanban-card-value { color: var(--primary-blue-dark); }
        body[data-appearance="light"] .kanban-empty { color: #94A3B8; }

        body[data-appearance="light"] .config-menu-btn { color: #0F172A; }
        body[data-appearance="light"] .config-menu-btn:hover {
            border-color: color-mix(in srgb, var(--primary-blue) 50%, #CBD5E1);
        }
        body[data-appearance="light"] .activity-list,
        body[data-appearance="light"] #overviewVendasAvulsasPorForma {
            background: #FFFFFF !important;
            border: 1px solid var(--border);
            color: #334155;
        }

        .appearance-toggle {
            display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.5rem;
        }
        body[data-appearance="light"] .appearance-btn,
        .appearance-btn {
            min-height: 44px; padding: 0.55rem 1.1rem; border-radius: 10px;
            border: 1px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.06);
            color: var(--text-light); font-weight: 600; cursor: pointer; font-size: 0.9rem;
        }
        body[data-appearance="light"] .appearance-btn {
            border-color: #CBD5E1; background: #F8FAFC; color: #334155;
        }
        .appearance-btn.active {
            background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-blue-dark) 100%);
            color: #fff; border-color: transparent;
        }
        body[data-appearance="light"] .theme-option span { color: #475569; }

        body[data-appearance="light"] .btn-small.btn-edit { background: rgba(217,119,6,0.12); color: #B45309; }
        body[data-appearance="light"] .btn-small.btn-delete { background: rgba(220,38,38,0.12); color: #B91C1C; }
        body[data-appearance="light"] .btn-small.btn-pdf { background: rgba(5,150,105,0.12); color: #047857; }
        body[data-appearance="light"] .btn-small.btn-view { background: color-mix(in srgb, var(--primary-blue) 15%, #fff); color: var(--primary-blue-dark); }

        body[data-appearance="light"] .dashboard-sync-status.status-offline { background: #FEF3C7; color: #92400E; border-color: #FCD34D; }
        body[data-appearance="light"] .dashboard-sync-status.status-online,
        body[data-appearance="light"] .dashboard-sync-status.status-synced { background: #D1FAE5; color: #065F46; border-color: #6EE7B7; }

        body[data-appearance="light"] .sidebar-toggle {
            background: var(--primary-blue); color: #fff;
        }

        /* Login: mantém impacto visual mas suaviza no claro */
        body[data-appearance="light"] .login-page {
            background: linear-gradient(145deg, #E8EEF5 0%, #DCE6F2 100%);
        }

        @media (max-width: 768px) {
            body[data-appearance="light"] .stat-card,
            body[data-appearance="light"] .card,
            body[data-appearance="light"] .chart-container {
                box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
            }
            body[data-appearance="light"] .nav-btn,
            body[data-appearance="light"] .btn-primary,
            body[data-appearance="light"] .btn-small,
            body[data-appearance="light"] .appearance-btn,
            body[data-appearance="light"] .config-menu-btn {
                min-height: 44px;
            }
            body[data-appearance="light"] .modal {
                max-height: 92vh;
                border-radius: 14px;
            }
            body[data-appearance="light"] .form-group input,
            body[data-appearance="light"] .form-group select,
            body[data-appearance="light"] .form-group textarea {
                font-size: 16px; /* evita zoom iOS */
            }
            body[data-appearance="light"] .kanban-card-actions .btn-small {
                min-height: 40px; padding: 0.45rem 0.65rem;
            }
        }

        /* ===== OVERRIDE FINAL: mobile = barra inferior, SEM sidebar lateral ===== */
        @media (max-width: 1024px) {
            html {
                -webkit-text-size-adjust: 100%;
                text-size-adjust: 100%;
            }
            html body #dashboard.dashboard-layout > aside.sidebar#sidebar,
            html body #dashboard > #sidebar,
            html body.use-mobile-bottom-nav #sidebar {
                display: none !important;
                visibility: hidden !important;
                width: 0 !important;
                height: 0 !important;
                overflow: hidden !important;
                pointer-events: none !important;
                position: absolute !important;
                left: -9999px !important;
            }
            html body #dashboard .mobile-bottom-nav,
            html body.use-mobile-bottom-nav .mobile-bottom-nav {
                display: block !important;
            }
            html body #dashboard .mobile-bottom-nav-track,
            html body.use-mobile-bottom-nav .mobile-bottom-nav-track {
                display: flex !important;
                flex-wrap: nowrap !important;
                justify-content: flex-start !important;
                overflow-x: auto !important;
            }
            html body #dashboard .mobile-nav-btn,
            html body.use-mobile-bottom-nav .mobile-nav-btn {
                flex: 0 0 128px !important;
                flex-shrink: 0 !important;
                width: 128px !important;
                min-width: 128px !important;
                max-width: 128px !important;
                min-height: 100px !important;
            }
            html body #dashboard .mobile-nav-icon,
            html body.use-mobile-bottom-nav .mobile-nav-icon {
                font-size: 39px !important;
            }
            html body #dashboard .mobile-nav-label,
            html body.use-mobile-bottom-nav .mobile-nav-label {
                font-size: 18px !important;
                font-weight: 700 !important;
            }
            html body #dashboard .main-content,
            html body.use-mobile-bottom-nav .main-content {
                margin-left: 0 !important;
                width: 100% !important;
                max-width: 100% !important;
                padding: 0.85rem 1rem calc(8.5rem + env(safe-area-inset-bottom, 0px)) !important;
            }
            html body #dashboard .charts-row:not(.overview-charts-pair),
            html body.use-mobile-bottom-nav .charts-row:not(.overview-charts-pair) {
                grid-template-columns: 1fr !important;
            }
            html body #dashboard .charts-row.overview-charts-pair,
            html body.use-mobile-bottom-nav .charts-row.overview-charts-pair {
                grid-template-columns: 1fr 1fr !important;
                gap: 0.5rem !important;
            }
            html body #dashboard .stats-grid.overview-unified-cards,
            html body.use-mobile-bottom-nav .stats-grid.overview-unified-cards,
            html body #dashboard .stats-grid.overview-top-cards,
            html body.use-mobile-bottom-nav .stats-grid.overview-top-cards {
                grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
                gap: 0.4rem !important;
            }
            html body #dashboard .stats-grid.overview-unified-cards .stat-value,
            html body.use-mobile-bottom-nav .stats-grid.overview-unified-cards .stat-value {
                font-size: 1.35rem !important;
                font-weight: 800 !important;
            }
            html body #dashboard .stats-grid.overview-unified-cards .stat-label,
            html body.use-mobile-bottom-nav .stats-grid.overview-unified-cards .stat-label {
                font-size: 0.9rem !important;
                font-weight: 600 !important;
            }
            html body #dashboard .stats-grid.overview-unified-cards .stat-icon,
            html body.use-mobile-bottom-nav .stats-grid.overview-unified-cards .stat-icon {
                font-size: 1.6rem !important;
            }
            html body #dashboard .stats-grid.overview-unified-cards .stat-card,
            html body.use-mobile-bottom-nav .stats-grid.overview-unified-cards .stat-card {
                padding: 0.7rem 0.35rem !important;
            }
            html body #dashboard .finance-chart-inner,
            html body.use-mobile-bottom-nav .finance-chart-inner {
                width: 1260px !important;
                min-width: 1260px !important;
                height: 392px !important;
            }
            html body #dashboard .quick-actions .btn-primary,
            html body.use-mobile-bottom-nav .quick-actions .btn-primary {
                width: 100%;
                min-height: 76px !important;
                font-size: 1.4rem !important;
                justify-content: center !important;
            }
            html body #dashboard .content-header h1,
            html body.use-mobile-bottom-nav .content-header h1 {
                font-size: 1.85rem !important;
            }
            html body #dashboard .chart-canvas-wrap,
            html body.use-mobile-bottom-nav .chart-canvas-wrap {
                height: 210px !important;
            }
            html body #dashboard .stats-grid:not(.overview-top-cards):not(.overview-unified-cards),
            html body.use-mobile-bottom-nav .stats-grid:not(.overview-top-cards):not(.overview-unified-cards) {
                grid-template-columns: 1fr 1fr !important;
            }
            html body #dashboard .overview-lucro-grid,
            html body.use-mobile-bottom-nav .overview-lucro-grid {
                display: grid !important;
                grid-template-columns: 1fr 1fr !important;
                gap: 0.5rem !important;
            }
            html body #dashboard .finance-chart-scroll,
            html body.use-mobile-bottom-nav .finance-chart-scroll {
                overflow-x: auto !important;
                -webkit-overflow-scrolling: touch;
            }
            html body #dashboard .stat-value,
            html body.use-mobile-bottom-nav .stat-value {
                font-size: 1.25rem !important;
                font-weight: 800 !important;
            }
            html body #dashboard .stat-label,
            html body.use-mobile-bottom-nav .stat-label {
                font-size: 0.75rem !important;
                font-weight: 600 !important;
            }
            html body #dashboard .stat-card,
            html body.use-mobile-bottom-nav .stat-card {
                padding: 0.65rem 0.5rem !important;
                min-height: 0 !important;
            }
            html body #dashboard .stat-icon,
            html body.use-mobile-bottom-nav .stat-icon {
                font-size: 1.35rem !important;
            }
            html body #dashboard .quick-actions,
            html body.use-mobile-bottom-nav .quick-actions {
                display: grid !important;
                grid-template-columns: 1fr !important;
                width: 100%;
            }
            html body #dashboard .quick-actions .btn-primary,
            html body.use-mobile-bottom-nav .quick-actions .btn-primary {
                width: 100%;
                min-height: 54px !important;
                font-size: 1.1rem !important;
                justify-content: center !important;
            }
            html body.pdv-standalone .mobile-bottom-nav {
                display: none !important;
            }
        }

        @media (max-width: 480px) {
            .pdv-modal-produtos-list { grid-template-columns: 1fr; }
            .stat-card { padding: 0.8rem 0.65rem; }
            .stat-value { font-size: 1.55rem !important; }
            .stat-label { font-size: 0.82rem !important; }
            .card { padding: 0.85rem; }
            .mobile-nav-btn {
                flex: 0 0 88px !important;
                width: 88px !important;
                min-width: 88px !important;
                max-width: 88px !important;
            }
            .mobile-nav-icon { font-size: 1.65rem !important; }
            .mobile-nav-label { font-size: 0.75rem !important; }
        }

        /* ===== Tutorial guiado Imperio OS ===== */
        .imperio-tour-root {
            display: none;
            position: fixed;
            inset: 0;
            z-index: 2147483000;
            pointer-events: none;
        }
        .imperio-tour-root.active { display: block; }
        body.imperio-tour-open { overflow: hidden; }
        body.imperio-tour-open .mobile-bottom-nav {
            opacity: 0.25;
            pointer-events: none;
        }
        .imperio-tour-spotlight {
            position: fixed;
            border-radius: 14px;
            box-shadow: 0 0 0 9999px rgba(15, 23, 42, 0.72);
            border: 2px solid #38BDF8;
            outline: 2px solid rgba(56, 189, 248, 0.35);
            pointer-events: none;
            transition: top 0.2s ease, left 0.2s ease, width 0.2s ease, height 0.2s ease;
            z-index: 1;
        }
        .imperio-tour-tooltip {
            position: fixed;
            z-index: 2;
            pointer-events: auto;
            background: #0F172A;
            color: #F8FAFC;
            border: 1px solid rgba(148, 163, 184, 0.35);
            border-radius: 14px;
            padding: 1rem 1.1rem 0.9rem;
            box-shadow: 0 18px 50px rgba(0,0,0,0.45);
            max-width: 340px;
        }
        body[data-appearance="light"] .imperio-tour-tooltip {
            background: #FFFFFF;
            color: #0F172A;
            border-color: #E2E8F0;
            box-shadow: 0 18px 40px rgba(15,23,42,0.18);
        }
        .imperio-tour-progress {
            font-size: 0.75rem;
            font-weight: 700;
            color: #38BDF8;
            margin-bottom: 0.35rem;
            letter-spacing: 0.02em;
        }
        .imperio-tour-title {
            margin: 0 0 0.45rem;
            font-size: 1.05rem;
            font-weight: 800;
            line-height: 1.25;
        }
        .imperio-tour-text {
            margin: 0 0 0.9rem;
            font-size: 0.9rem;
            line-height: 1.45;
            color: #CBD5E1;
        }
        body[data-appearance="light"] .imperio-tour-text { color: #475569; }
        .imperio-tour-actions {
            display: flex;
            gap: 0.5rem;
            justify-content: space-between;
            align-items: center;
        }
        .imperio-tour-btn {
            border: none;
            border-radius: 10px;
            padding: 0.55rem 0.85rem;
            font-weight: 700;
            font-size: 0.88rem;
            cursor: pointer;
        }
        .imperio-tour-btn-primary {
            background: linear-gradient(135deg, #0EA5E9, #0284C7);
            color: #fff;
        }
        .imperio-tour-btn-ghost {
            background: rgba(148,163,184,0.18);
            color: inherit;
        }
        .imperio-tour-never,
        .imperio-tour-skip {
            position: fixed;
            z-index: 3;
            pointer-events: auto;
            border: 1px solid rgba(255,255,255,0.25);
            background: rgba(15,23,42,0.88);
            color: #F8FAFC;
            border-radius: 999px;
            padding: 0.45rem 0.85rem;
            font-size: 0.78rem;
            font-weight: 700;
            cursor: pointer;
        }
        .imperio-tour-never {
            top: max(12px, env(safe-area-inset-top));
            right: max(12px, env(safe-area-inset-right));
        }
        .imperio-tour-skip {
            top: max(12px, env(safe-area-inset-top));
            left: max(12px, env(safe-area-inset-left));
        }
        body[data-appearance="light"] .imperio-tour-never,
        body[data-appearance="light"] .imperio-tour-skip {
            background: rgba(255,255,255,0.95);
            color: #0F172A;
            border-color: #CBD5E1;
        }
        @media (max-width: 1024px) {
            .imperio-tour-tooltip {
                max-width: min(340px, calc(100vw - 24px));
                font-size: 0.95rem;
            }
            .imperio-tour-never,
            .imperio-tour-skip {
                top: auto;
                bottom: max(72px, calc(env(safe-area-inset-bottom) + 64px));
                padding: 0.55rem 0.95rem;
                font-size: 0.82rem;
                box-shadow: 0 8px 24px rgba(0,0,0,0.35);
            }
            .imperio-tour-never {
                right: max(12px, env(safe-area-inset-right));
                left: auto;
            }
            .imperio-tour-skip {
                left: max(12px, env(safe-area-inset-left));
                right: auto;
            }
        }

        /* ========== LOGIN MARKETING (Kamino + Gerencia + Flash) ========== */
        #companySelect.login-page-pro {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            justify-content: flex-start;
            min-height: 100vh;
            height: 100vh;
            max-height: 100vh;
            padding: 0;
            background: #07111f;
            overflow-x: hidden;
            overflow-y: auto;
        }
        .login-pro-nav {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            padding: 1rem 6vw;
            position: sticky;
            top: 0;
            z-index: 20;
            background: #07111f;
            border-bottom: 1px solid rgba(125, 211, 252, 0.12);
        }
        .login-pro-brand {
            display: flex;
            align-items: center;
            gap: 0.65rem;
            color: #fff;
            font-weight: 800;
            letter-spacing: 0.04em;
            font-size: 0.95rem;
        }
        .login-pro-logo { width: 36px; height: 36px; object-fit: contain; }
        .login-pro-links { display: flex; gap: 1.25rem; }
        .login-pro-links a {
            color: rgba(255,255,255,0.78);
            text-decoration: none;
            font-size: 0.92rem;
            font-weight: 600;
        }
        .login-pro-links a:hover { color: #fff; }
        .login-pro-nav-cta {
            background: #fff;
            color: #1d4ed8;
            font-weight: 800;
            text-decoration: none;
            padding: 0.55rem 1rem;
            border-radius: 999px;
            font-size: 0.88rem;
            box-shadow: 0 8px 24px rgba(0,0,0,0.18);
        }
        .login-pro-hero {
            display: grid;
            grid-template-columns: minmax(0, 1.15fr) minmax(320px, 420px);
            gap: 2.5rem;
            align-items: start;
            padding: 2.5rem 6vw 2.75rem;
            width: 100%;
            margin: 0;
            box-sizing: border-box;
            background: radial-gradient(900px 420px at 14% -10%, rgba(56,189,248,0.1), transparent 58%), #07111f;
        }
        .login-pro-kicker {
            display: inline-flex;
            color: #93c5fd;
            font-weight: 700;
            font-size: 0.82rem;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            margin: 0 0 0.85rem;
        }
        .login-pro-copy h1 {
            font-size: clamp(2rem, 4vw, 3.2rem);
            line-height: 1.18;
            color: #fff;
            font-weight: 800;
            letter-spacing: 0;
            word-spacing: 0.06em;
            margin: 0 0 1rem;
        }
        .login-pro-copy h1 em {
            font-style: normal;
            color: #7dd3fc;
        }
        .login-pro-lead {
            color: rgba(226,232,240,0.82);
            font-size: 1.05rem;
            line-height: 1.65;
            max-width: 560px;
            margin: 0 0 1.25rem;
        }
        .login-pro-checks {
            list-style: none;
            padding: 0;
            margin: 0 0 1.5rem;
        }
        .login-pro-checks li {
            position: relative;
            padding: 0.35rem 0 0.35rem 1.7rem;
            color: rgba(255,255,255,0.9);
            font-weight: 600;
            font-size: 0.95rem;
        }
        .login-pro-checks li::before {
            content: "✓";
            position: absolute;
            left: 0;
            top: 0.35rem;
            width: 1.2rem;
            height: 1.2rem;
            border-radius: 999px;
            background: rgba(34,197,94,0.18);
            color: #86efac;
            font-size: 0.75rem;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .login-pro-hero-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1.1rem; }
        .login-pro-pill {
            background: linear-gradient(135deg, #38bdf8 0%, #2563eb 100%);
            color: #fff;
            text-decoration: none;
            font-weight: 800;
            padding: 0.85rem 1.3rem;
            border-radius: 999px;
            box-shadow: 0 12px 30px rgba(37,99,235,0.35);
        }
        .login-pro-ghost {
            color: #fff;
            text-decoration: none;
            font-weight: 700;
            padding: 0.85rem 1.2rem;
            border-radius: 999px;
            border: 1px solid rgba(255,255,255,0.22);
            background: rgba(255,255,255,0.06);
        }
        .login-pro-rating {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 0.55rem 0.85rem;
            color: rgba(255,255,255,0.78);
            font-size: 0.88rem;
            margin-bottom: 1.5rem;
        }
        .login-pro-dots {
            width: 72px;
            height: 22px;
            border-radius: 999px;
            background:
                radial-gradient(circle at 11px 11px, #60a5fa 8px, transparent 9px),
                radial-gradient(circle at 28px 11px, #38bdf8 8px, transparent 9px),
                radial-gradient(circle at 45px 11px, #a78bfa 8px, transparent 9px);
            background-color: rgba(255,255,255,0.08);
        }
        .login-pro-visual { position: relative; min-height: 210px; max-width: 520px; }
        .login-mock {
            background: rgba(15,23,42,0.72);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 18px;
            box-shadow: 0 24px 50px rgba(0,0,0,0.28);
            padding: 0.85rem 1rem;
            backdrop-filter: blur(8px);
        }
        .login-mock-top { font-size: 0.75rem; color: rgba(255,255,255,0.7); font-weight: 700; margin-bottom: 0.4rem; }
        .login-mock-svg { width: 100%; height: 110px; display: block; }
        .login-mock-wa .login-mock-top { color: #86efac; }
        .login-wa-thread { display: flex; flex-direction: column; gap: 0.45rem; }
        .login-wa-msg {
            background: #005c4b;
            border-radius: 12px 12px 12px 4px;
            padding: 0.55rem 0.7rem;
            max-width: 94%;
        }
        .login-wa-msg b { display: block; color: #fff; font-size: 0.78rem; margin-bottom: 0.12rem; }
        .login-wa-msg span { color: rgba(255,255,255,0.84); font-size: 0.72rem; line-height: 1.35; }
        .login-mock-a { transform: rotate(-4deg); }
        .login-mock-b {
            position: absolute; right: -8px; top: 86px; width: 180px; transform: rotate(6deg);
        }
        .login-mock-c {
            position: absolute; left: 18px; bottom: -18px; display: flex; gap: 0.5rem; transform: rotate(-2deg);
        }
        .login-mock-bars span {
            display: block; height: 8px; border-radius: 999px;
            background: linear-gradient(90deg, #22c55e, #4ade80);
            margin: 0.45rem 0;
        }
        .login-mock-kpi {
            background: rgba(37,99,235,0.35);
            border-radius: 12px;
            padding: 0.45rem 0.65rem;
            min-width: 110px;
        }
        .login-mock-kpi b { display: block; color: #fff; font-size: 0.85rem; }
        .login-mock-kpi small { color: rgba(255,255,255,0.7); }

        .login-page-pro .login-pro-panel { position: sticky; top: 5.5rem; }
        .login-page-pro .login-card {
            max-width: none;
            background: #fff;
            border: 0;
            border-radius: 24px;
            padding: 1.6rem 1.45rem 1.35rem;
            box-shadow: 0 30px 80px rgba(0,0,0,0.28);
            color: #0f172a;
        }
        .login-page-pro .login-card-head {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            margin-bottom: 1.15rem;
        }
        .login-page-pro .login-card-logo-img {
            max-height: 42px;
            max-width: 42px;
            background: #eff6ff !important;
            border-radius: 12px;
            padding: 4px;
        }
        .login-page-pro .login-card h2 {
            margin: 0;
            font-size: 1.2rem;
            color: #0f172a;
            text-align: left;
            font-weight: 800;
        }
        .login-page-pro .login-card .login-sub {
            text-align: left;
            color: #64748b;
            margin: 0.15rem 0 0;
            font-size: 0.82rem;
        }
        .login-page-pro .login-card .form-group label {
            color: #334155;
            text-transform: none;
            letter-spacing: 0;
            font-size: 0.8rem;
        }
        .login-page-pro .login-card .form-group input,
        .login-page-pro .login-card .login-input-row input {
            background: #f8fafc;
            color: #0f172a;
            border: 1px solid #e2e8f0;
            border-radius: 12px;
            padding-right: 1rem;
        }
        .login-page-pro .login-card .form-group input:focus,
        .login-page-pro .login-card .login-input-row input:focus {
            background: #fff;
            border-color: #2563eb;
            box-shadow: 0 0 0 3px rgba(37,99,235,0.15);
        }
        .login-page-pro .login-input-row { position: relative; }
        .login-page-pro .login-input-row input { width: 100%; padding-right: 2.6rem; }
        .login-page-pro .login-card .btn-toggle-pwd {
            position: absolute;
            right: 10px;
            top: 50%;
            transform: translateY(-50%);
            color: #64748b;
        }
        .login-page-pro .login-card .login-options label { color: #475569; text-transform: none; }
        .login-page-pro .login-card .login-forgot { color: #2563eb; }
        .login-page-pro .login-card .btn-entrar {
            background: #2563eb;
            border-radius: 14px;
            font-weight: 800;
            padding: 0.95rem 1.2rem;
            text-transform: none;
            letter-spacing: 0.02em;
        }
        .login-page-pro .login-card .btn-entrar:hover { background: #1d4ed8; opacity: 1; }
        .login-page-pro .login-legal {
            font-size: 0.72rem;
            color: #94a3b8;
            text-align: center;
            margin: 0.85rem 0 0.5rem;
            line-height: 1.45;
        }
        .login-page-pro .login-card-foot {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 0.35rem;
            font-size: 0.75rem;
            color: #94a3b8;
            margin-bottom: 0.85rem;
        }
        .login-page-pro .login-card-foot a { color: #2563eb; text-decoration: none; font-weight: 700; }
        .login-page-pro .login-cadastro-text { color: #64748b !important; margin-top: 0.35rem; font-size: 0.84rem; text-align: center; }
        .login-page-pro .login-cadastro-link { color: #1d4ed8; }
        .login-page-pro .login-afiliado-wrap {
            margin-top: 1rem;
            padding-top: 0.9rem;
            border-top: 1px solid #e2e8f0;
        }
        .login-page-pro .login-afiliado-desc { font-size: 0.78rem; color: #64748b; margin-top: 0.45rem; }
        .login-page-pro #btnInstallApp {
            width: 100%;
            margin-top: 0.75rem;
            background: #f8fafc;
            color: #0f172a;
            border: 1px solid #e2e8f0;
            border-radius: 12px;
            padding: 0.7rem 1rem;
            font-weight: 700;
        }
        .login-page-pro .login-err {
            color: #b91c1c;
            background: #fef2f2;
            border-color: #fecaca;
        }

        .login-pro-proof {
            text-align: center;
            padding: 2.1rem 6vw 2rem;
            background: #07111f;
            color: #fff;
            font-weight: 700;
            font-size: 1.2rem;
            letter-spacing: 0;
            word-spacing: 0.04em;
            line-height: 1.45;
            border-top: 1px solid rgba(125, 211, 252, 0.08);
        }
        .login-pro-proof p { margin: 0; max-width: 720px; margin-inline: auto; }
        .login-pro-strip {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 1rem;
            padding: 0.5rem 6vw 1.5rem;
            background: #07111f;
            color: #fff;
        }
        .login-pro-strip-item {
            text-align: left;
            padding: 1.2rem 1.15rem;
            background: #0d1b30;
            border: 1px solid rgba(125, 211, 252, 0.14);
            border-radius: 18px;
        }
        .login-pro-strip-item span.login-strip-ico {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            margin: 0 0 0.75rem;
            border-radius: 12px;
            background: rgba(56, 189, 248, 0.14);
            color: #7dd3fc;
        }
        .login-pro-strip-item span.login-strip-ico svg { width: 20px; height: 20px; }
        .login-pro-strip-item strong {
            display: block;
            font-size: 0.98rem;
            margin-bottom: 0.35rem;
            letter-spacing: 0;
            line-height: 1.3;
        }
        .login-pro-strip-item small {
            display: block;
            color: rgba(226, 232, 240, 0.78);
            font-size: 0.82rem;
            line-height: 1.45;
            opacity: 1;
        }
        .login-pro-recursos {
            padding: 1.5rem 6vw 2.5rem;
            background: #07111f;
            color: #fff;
        }
        .login-pro-section-kicker {
            text-align: center;
            text-transform: uppercase;
            letter-spacing: 0.14em;
            font-size: 0.75rem;
            font-weight: 800;
            color: #7dd3fc;
            margin: 0 0 0.55rem;
        }
        .login-pro-recursos h2 {
            text-align: center;
            font-size: clamp(1.55rem, 3vw, 2.15rem);
            margin: 0 auto 0.7rem;
            max-width: 640px;
            letter-spacing: 0;
            word-spacing: 0.04em;
            line-height: 1.25;
        }
        .login-pro-recursos-lead {
            text-align: center;
            max-width: 560px;
            margin: 0 auto 0.85rem;
            color: rgba(226, 232, 240, 0.78);
            font-size: 1rem;
            line-height: 1.6;
        }
        .login-recurso-pin {
            height: calc(100vh + (var(--recurso-count, 6) - 1) * 95vh);
        }
        .login-recurso-stage {
            position: sticky;
            top: 4.6rem;
            min-height: calc(100vh - 5.2rem);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 0.5rem 0 1.25rem;
        }
        .login-recurso-deck {
            position: relative;
            width: min(560px, 100%);
            min-height: 320px;
            margin: 0.4rem 0 1.1rem;
            perspective: 1400px;
            transform-style: preserve-3d;
        }
        .login-recurso-deck article:first-child { opacity: 1; }
        .login-recurso-deck article {
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            min-height: 100%;
            background: #0d1b30;
            border: 1px solid rgba(125, 211, 252, 0.18);
            border-radius: 22px;
            padding: 1.7rem 1.6rem 1.5rem;
            box-shadow: 0 22px 50px rgba(0, 0, 0, 0.28);
            opacity: 0;
            pointer-events: none;
            will-change: transform, opacity, filter;
            transform-style: preserve-3d;
            backface-visibility: hidden;
        }
        .login-recurso-deck article.is-active {
            z-index: 2;
            box-shadow: 0 28px 70px rgba(56, 189, 248, 0.16), 0 22px 50px rgba(0, 0, 0, 0.35);
        }
        .login-recurso-bar {
            width: min(220px, 70vw);
            height: 3px;
            border-radius: 999px;
            background: rgba(255,255,255,0.12);
            overflow: hidden;
        }
        .login-recurso-bar span {
            display: block;
            height: 100%;
            width: 0;
            border-radius: inherit;
            background: linear-gradient(90deg, #38bdf8, #2563eb);
        }
        .login-recurso-ico {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 46px;
            height: 46px;
            margin-bottom: 0.95rem;
            border-radius: 14px;
            background: rgba(56, 189, 248, 0.14);
            color: #7dd3fc;
        }
        .login-recurso-ico svg { width: 22px; height: 22px; }
        .login-recurso-deck h3 {
            margin: 0 0 0.55rem;
            font-size: 1.45rem;
            color: #fff;
            letter-spacing: 0;
            line-height: 1.25;
        }
        .login-recurso-deck p {
            margin: 0;
            color: rgba(226, 232, 240, 0.8);
            font-size: 1rem;
            line-height: 1.6;
        }
        .login-recurso-nav {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 0.65rem;
        }
        .login-recurso-count {
            font-size: 0.78rem;
            font-weight: 800;
            letter-spacing: 0.08em;
            color: rgba(226, 232, 240, 0.7);
        }
        .login-recurso-dots {
            display: flex;
            gap: 0.45rem;
        }
        .login-recurso-dots button {
            width: 8px;
            height: 8px;
            padding: 0;
            border: 0;
            border-radius: 999px;
            background: rgba(255,255,255,0.28);
            cursor: pointer;
        }
        .login-recurso-dots button.is-active {
            width: 22px;
            background: #38bdf8;
        }
        .login-recursos-static .login-recurso-pin { height: auto; }
        .login-recursos-static .login-recurso-stage {
            position: static;
            min-height: 0;
        }
        .login-recursos-static .login-recurso-deck {
            display: grid;
            gap: 1rem;
            min-height: 0;
        }
        .login-recursos-static .login-recurso-deck article {
            position: static;
            opacity: 1 !important;
            transform: none !important;
            pointer-events: auto;
        }

        body[data-appearance="light"] #companySelect.login-page-pro {
            background: #07111f;
        }

        @media (min-width: 1200px) {
            .login-pro-hero {
                padding-left: max(6vw, calc((100vw - 1180px) / 2));
                padding-right: max(6vw, calc((100vw - 1180px) / 2));
            }
        }
        @media (max-width: 960px) {
            .login-pro-hero { grid-template-columns: 1fr; padding: 1.4rem 1.1rem 1.5rem; }
            .login-page-pro .login-pro-panel { position: static; }
            .login-pro-visual { display: none; }
            .login-pro-links { display: none; }
            .login-pro-strip { grid-template-columns: 1fr 1fr; }
            .login-recurso-stage { top: 4.2rem; min-height: calc(100vh - 4.8rem); }
            .login-pro-nav { padding: 0.85rem 1.1rem; }
        }

        /* ========== VELAS + METAS + CONFIG HUB ========== */
        .chart-container-candles {
            max-height: none;
            overflow: visible;
        }
        .chart-container-candles canvas,
        .candle-chart-wrap canvas {
            display: block !important;
            width: 100% !important;
            height: 100% !important;
            max-height: none !important;
        }
        .candle-head {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 0.75rem;
            flex-wrap: wrap;
            margin-bottom: 0.65rem;
        }
        .candle-head h3 { margin: 0; }
        .candle-stats {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem 1rem;
            font-size: 0.88rem;
            font-weight: 700;
            color: var(--text-gray);
        }
        .candle-stats b { color: var(--text-light); }
        .candle-stats .up { color: #22c55e; }
        .candle-stats .down { color: #ef4444; }
        .candle-chart-wrap {
            position: relative;
            height: 190px;
            background: #f8fafc;
            border: 1px solid #e2e8f0;
            border-radius: 16px;
            overflow: hidden;
        }
        body:not([data-appearance="light"]) .candle-chart-wrap {
            background: #1a2340;
            border-color: rgba(255,255,255,0.08);
        }
        body[data-appearance="light"] .candle-chart-wrap {
            background: #f8fafc;
        }
        .candle-chart-wrap-lg { height: 260px; }
        .candle-range {
            display: inline-flex;
            background: rgba(255,255,255,0.06);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 999px;
            padding: 3px;
            gap: 2px;
        }
        .candle-range button {
            border: 0;
            background: transparent;
            color: var(--text-gray);
            font-size: 0.72rem;
            font-weight: 800;
            padding: 0.28rem 0.65rem;
            border-radius: 999px;
            cursor: pointer;
        }
        .candle-range button.active {
            background: #2563eb;
            color: #fff;
        }
        .chart-color-legend {
            display: flex;
            flex-wrap: wrap;
            gap: 0.55rem 1.1rem;
            margin: 0 0 1rem;
            padding: 0.85rem 1.1rem;
            background: #f8fafc;
            border: 1px solid #e2e8f0;
            border-radius: 14px;
            font-size: 0.9rem;
            font-weight: 700;
            color: #334155;
        }
        body:not([data-appearance="light"]) .chart-color-legend {
            background: rgba(255,255,255,0.04);
            border-color: rgba(255,255,255,0.08);
            color: var(--text-gray);
        }
        .chart-color-legend span {
            display: inline-flex;
            align-items: center;
            gap: 0.4rem;
        }
        .chart-color-legend i {
            width: 10px;
            height: 10px;
            border-radius: 999px;
            display: inline-block;
        }
        .chart-color-legend .leg-lucro { background: #22C55E; }
        .chart-color-legend .leg-despesas { background: #EF4444; }
        .chart-color-legend .leg-receber { background: #F59E0B; }
        .chart-color-legend .leg-receita { background: #38BDF8; }
        .chart-color-legend .leg-os { background: #A78BFA; }
        .chart-color-legend .leg-meta { background: #F59E0B; }
        .chart-line-tip {
            position: absolute;
            z-index: 4;
            min-width: 176px;
            padding: 0.6rem 0.75rem;
            border-radius: 12px;
            background: #fff;
            border: 1px solid #e2e8f0;
            color: #334155;
            font-size: 0.82rem;
            line-height: 1.5;
            pointer-events: none;
            display: none;
            box-shadow: 0 14px 32px rgba(15, 23, 42, 0.14);
        }
        .chart-line-tip b { color: #0f172a; }
        body:not([data-appearance="light"]) .chart-line-tip {
            background: rgba(15, 23, 42, 0.96);
            border-color: rgba(255,255,255,0.12);
            color: #e2e8f0;
            box-shadow: 0 12px 28px rgba(0,0,0,0.35);
        }
        body:not([data-appearance="light"]) .chart-line-tip b { color: #fff; }
        .meta-kpis {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 0.6rem;
            margin-bottom: 0.75rem;
        }
        .meta-kpi {
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 14px;
            padding: 0.7rem 0.75rem;
        }
        .meta-kpi span { display: block; font-size: 0.72rem; color: var(--text-gray); margin-bottom: 0.2rem; }
        .meta-kpi strong { font-size: 1.05rem; color: var(--text-light); }
        .metas-table-wrap { overflow-x: auto; }
        .metas-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 0.85rem;
        }
        .metas-table th, .metas-table td {
            padding: 0.65rem 0.5rem;
            border-bottom: 1px solid rgba(255,255,255,0.08);
            text-align: left;
            white-space: nowrap;
        }
        .metas-table th { color: var(--text-gray); font-size: 0.75rem; font-weight: 700; }
        .meta-bar {
            height: 8px;
            background: rgba(255,255,255,0.08);
            border-radius: 999px;
            overflow: hidden;
            min-width: 90px;
        }
        .meta-bar > i {
            display: block;
            height: 100%;
            background: linear-gradient(90deg, #22c55e, #4ade80);
            border-radius: inherit;
        }
        .meta-bar.is-low > i { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
        .meta-bar.is-miss > i { background: linear-gradient(90deg, #ef4444, #fb7185); }

        .config-hub { max-width: 980px; }
        .config-hub-kicker {
            text-transform: uppercase;
            letter-spacing: 0.14em;
            font-size: 0.72rem;
            font-weight: 800;
            color: var(--text-gray);
            margin: 0 0 0.35rem;
        }
        .config-hub-title {
            margin: 0 0 0.5rem;
            font-size: 1.55rem;
            letter-spacing: -0.03em;
            color: var(--text-light);
        }
        .config-hub-lead {
            color: var(--text-gray);
            margin: 0 0 1.35rem;
            max-width: 640px;
            line-height: 1.55;
        }
        .config-hub-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
            gap: 0.85rem;
        }
        .config-hub-card {
            text-align: left;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 18px;
            padding: 1.05rem 1rem;
            color: var(--text-light);
            cursor: pointer;
            transition: transform 0.15s, border-color 0.15s, background 0.15s;
        }
        .config-hub-card:hover {
            transform: translateY(-2px);
            border-color: rgba(37,99,235,0.55);
            background: rgba(37,99,235,0.12);
        }
        .config-hub-icon { display: block; font-size: 1.35rem; margin-bottom: 0.45rem; }
        .config-hub-card strong { display: block; margin-bottom: 0.3rem; font-size: 0.95rem; }
        .config-hub-card span:last-child {
            display: block;
            color: var(--text-gray);
            font-size: 0.78rem;
            line-height: 1.4;
            font-weight: 500;
        }
        .config-hub-report {
            margin-top: 1.5rem;
            padding-top: 1rem;
            border-top: 1px solid rgba(255,255,255,0.08);
            font-size: 0.85rem;
            color: var(--text-gray);
        }
        .config-hub-report .config-link-reportar-bug {
            background: none;
            border: none;
            color: var(--primary-blue);
            cursor: pointer;
            text-decoration: underline;
            padding: 0;
        }
        .config-switch {
            display: flex;
            align-items: center;
            gap: 0.65rem;
            font-weight: 700;
            color: var(--text-light);
            margin: 1rem 0 0.35rem;
            cursor: pointer;
        }
        .config-switch-hint { color: var(--text-gray); font-size: 0.8rem; margin: 0; }
        .config-func-add {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
            gap: 0.6rem;
            align-items: end;
        }
        .config-func-add select,
        .config-func-add input {
            width: 100%;
            padding: 0.6rem;
            border-radius: 8px;
            background: #1a1f3a;
            color: #E2E8F0;
            border: 1px solid rgba(255,255,255,0.15);
        }
        .func-meta-card {
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 14px;
            padding: 0.75rem;
            margin-bottom: 0.65rem;
            background: rgba(255,255,255,0.03);
        }
        .func-meta-card .func-meta-top {
            display: flex;
            justify-content: space-between;
            gap: 0.75rem;
            align-items: center;
            flex-wrap: wrap;
        }
        .func-meta-fields {
            display: grid;
            grid-template-columns: 1fr 1fr auto;
            gap: 0.5rem;
            margin-top: 0.7rem;
            align-items: end;
        }
        .func-meta-fields input,
        .func-meta-fields select,
        #configPageMetas input[type="number"],
        #configPageMetas select {
            width: 100%;
            padding: 0.6rem;
            border-radius: 10px;
            border: 1px solid rgba(255,255,255,0.15);
            background: #1a1f3a;
            color: #E2E8F0;
            box-sizing: border-box;
        }
        body[data-appearance="light"] .config-hub-card {
            background: #fff;
            border-color: #e2e8f0;
            color: #0f172a;
        }
        body[data-appearance="light"] .config-hub-card span:last-child { color: #64748b; }
        body[data-appearance="light"] .config-hub-title { color: #0f172a; }
        body[data-appearance="light"] .config-func-add select,
        body[data-appearance="light"] .config-func-add input {
            background: #fff;
            color: #0f172a;
            border-color: #cbd5e1;
        }
        body[data-appearance="light"] .func-meta-card {
            background: #fff;
            border-color: #e2e8f0;
        }
        body[data-appearance="light"] .meta-kpi {
            background: #fff;
            border-color: #e2e8f0;
        }
        body[data-appearance="light"] .meta-kpi strong { color: #0f172a; }
        @media (max-width: 1024px) {
            .meta-kpis { grid-template-columns: 1fr 1fr; }
            .func-meta-fields { grid-template-columns: 1fr; }
            html body #dashboard .candle-chart-wrap,
            html body.use-mobile-bottom-nav .candle-chart-wrap {
                height: 200px;
            }
        }