/* =====================================================================
   LAYOUT NOVO (roupagem gamificada) - estilo "Arena"
   - Tudo preso a html.rg: sem a classe, nada aqui vale. Quem liga é
     Configurações › Sistema › layout_novo (components/roupagem.blade.php).
   - Só aparência: cores, cantos, sombras, fontes e animações.
     Não mexe em position, z-index, display, overflow nem largura de
     estrutura (sidebar, navbar, content-wrapper, modais) - era isso que
     quebrava telas na tentativa antiga.
   - A cor da banca continua vindo de --primary-color (é o destaque).
   ===================================================================== */

html.rg {
    /* fundo roxo-noite, superfícies roxas e blocos de cor forte (lima, amarelo, coral, azul, rosa) */
    --rg-bg: #0f0828;
    --rg-bg-2: #150c35;
    --rg-surface: #1f1650;           /* card */
    --rg-surface-2: #2a1f66;         /* campo, cabeçalho de tabela, card dentro de card */
    --rg-surface-3: #36297d;         /* hover */
    --rg-glass: var(--rg-surface);
    --rg-glass-borda: rgba(255, 255, 255, .09);
    --rg-line: rgba(255, 255, 255, .08);
    --rg-line-2: rgba(255, 255, 255, .16);
    --rg-ink: #ffffff;
    --rg-ink-2: #dcd7f7;
    --rg-ink-3: #a8a1d3;
    --rg-accent: var(--primary-color, #a3d712);
    /* cor da banca legível sobre o fundo escuro (para texto e ícones) */
    --rg-accent-ink: color-mix(in srgb, var(--rg-accent) 80%, #fff);
    --rg-accent-soft: color-mix(in srgb, var(--rg-accent) 18%, transparent);
    --rg-on-accent: #10151f; /* o JS troca para branco se a cor da banca for escura */
    /* paleta de apoio (chips dos atalhos, etiquetas, contagem) */
    --rg-gold: #f5c542;
    --rg-coral: #f0705a;
    --rg-sky: #7cc6f7;
    --rg-violeta: #8b5cf6;
    --rg-lima: #c6f432;              /* destaque principal da roupagem: vira a cor da banca quando ela escolhe uma (components/roupagem) */
    --rg-lima-claro: #e8ff8a;
    --rg-lima-escuro: #9ed400;
    --rg-lima-escuro-2: #9be12a;
    --rg-lima-sombra: #7fa312;
    --rg-lima-hover: #d4ff4a;
    --rg-lima-brilho: #c9f53b;
    --rg-on-lima: var(--rg-tinta);   /* texto sobre bloco lima */
    --rg-lima-texto: var(--rg-lima); /* texto lima sobre fundo escuro */
    --rg-rosa: #ff5fa2;
    --rg-tinta: #14102e;             /* texto escuro sobre bloco colorido */
    --rg-good: #34d399;
    --rg-bad: #f87171;
    --rg-warn: #fb923c;
    --rg-radius: 18px;
    --rg-radius-sm: 12px;
    --rg-shadow: 0 8px 24px rgba(4, 2, 16, .35);
    --rg-shadow-lg: 0 24px 60px rgba(4, 2, 16, .6);
    --rg-font: "Plus Jakarta Sans", "Exo", system-ui, -apple-system, "Segoe UI", sans-serif;
    --rg-font-display: "Unbounded", "Plus Jakarta Sans", system-ui, sans-serif;
    --rg-prog: 0;
    color-scheme: dark;
}

/* ---------- Fonte ----------
   O master aplica "Exo" em todos os elementos (body, *). Troco só onde não é ícone:
   ícones (fa, bi, ion, material) continuam com a fonte deles. */
html.rg body,
html.rg body :where(*):not(i):not([class*="fa-"]):not([class^="fa"]):not([class*=" fa"]):not([class*="bi-"]):not([class^="bi "]):not([class*="ion-"]):not([class^="ion"]):not([class*="icon"]):not([class*="material"]):not(svg *) {
    font-family: var(--rg-font);
}
html.rg body {
    color: var(--rg-ink);
    background: var(--rg-bg);
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent;
}

/* ---------- Legibilidade (público mais velho) ----------
   Texto nunca abaixo de 16px no corpo e 14px em legenda; peso maior. */
html.rg body { font-size: 16px; line-height: 1.55; font-weight: 500; }
html.rg p, html.rg li, html.rg td, html.rg .card-body, html.rg .modal-body { font-size: max(1em, 16px); }
html.rg small, html.rg .small, html.rg .text-sm, html.rg .table th, html.rg .table thead th,
html.rg label, html.rg .form-text, html.rg .dataTables_info { font-size: max(1em, 14px) !important; }
html.rg .table td { font-size: max(1em, 15px); }
html.rg .main-footer [style*="font-size"],
html.rg .main-footer small,
html.rg .main-footer p { font-size: max(1em, 13px) !important; }
/* só no conteúdo e nos popups: na barra do topo (celular) botão maior empurra o avatar para fora da tela */
html.rg .content-wrapper .btn,
html.rg .modal .btn { font-size: max(1em, 15px); }
html.rg .table thead th { text-transform: none; letter-spacing: 0; }

/* ---------- Fundo de página ----------
   Liso e escuro, com dois brilhos bem fracos (roxo e cor da banca) para não ficar chapado. */
html.rg .wrapper,
html.rg .content-wrapper,
html.rg body.login-page,
html.rg body.layout-top-nav {
    background:
        radial-gradient(60vw 50vh at 100% 0%, rgba(139, 92, 246, .30), transparent 70%),
        radial-gradient(45vw 40vh at 0% 60%, rgba(255, 95, 162, .14), transparent 70%),
        radial-gradient(50vw 40vh at 30% 100%, color-mix(in srgb, var(--rg-accent) 14%, transparent), transparent 70%),
        var(--rg-bg-2) !important;
    background-attachment: fixed !important;
    color: var(--rg-ink);
}

/* títulos: fonte de destaque, sem cor forçada (herda a do bloco) */
html.rg h1, html.rg h2, html.rg h3,
html.rg .h1, html.rg .h2, html.rg .h3 {
    font-family: var(--rg-font-display) !important;
    font-weight: 700;
    letter-spacing: -.02em;
}
html.rg h4, html.rg h5, html.rg h6,
html.rg .h4, html.rg .h5, html.rg .h6 { font-weight: 800; letter-spacing: -.01em; }
/* títulos soltos na página: tamanho de seção, não de cartaz */
html.rg .content-wrapper h1:not(.card h1):not(.modal h1) { font-size: clamp(1.25rem, 1rem + 1vw, 1.6rem); }

html.rg .text-muted { color: var(--rg-ink-3) !important; }
/* cores de status em versão clara, legível sobre o fundo escuro */
html.rg .text-success { color: #4ade80 !important; }
html.rg .text-danger { color: #fca5a5 !important; }
html.rg .text-warning { color: #fcd34d !important; }
html.rg .text-info { color: var(--rg-sky) !important; }
html.rg .text-primary { color: var(--rg-accent-ink) !important; }
html.rg .text-secondary { color: var(--rg-ink-2) !important; }
html.rg .text-dark { color: var(--rg-ink) !important; }
/* exceto dentro de fundos claros do próprio sistema (alertas, badges claros) */
html.rg .alert .text-dark, html.rg .bg-warning .text-dark, html.rg .badge.text-dark { color: #171a3a !important; }
html.rg hr { border-color: var(--rg-line); }
html.rg a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link) { color: var(--rg-accent-ink); }

/* ---------- Navbar (topo) ---------- */
html.rg .main-header,
html.rg .main-header.navbar {
    /* sem backdrop-filter/transform: eles prendem popups position:fixed que vivem dentro da navbar */
    background: #170e3d !important;
    border-bottom: 1px solid var(--rg-line) !important;
    box-shadow: 0 6px 24px rgba(4, 2, 16, .45) !important;
}
html.rg .main-header .nav-link,
html.rg .main-header .navbar-nav > .nav-item > a:not(.btn),
html.rg .main-header .fa, html.rg .main-header .fas, html.rg .main-header .bi {
    color: #fff;
}
/* Depositar: cheio na cor da banca. Sacar: contorno (mesma classe no HTML, separados pelo link) */
html.rg .main-header .btn-despositar {
    background: var(--rg-accent) !important;
    border: 1.5px solid var(--rg-accent) !important;
    color: var(--rg-on-accent) !important;
    border-radius: 12px !important;
    font-weight: 800;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--rg-accent) 30%, transparent) !important;
}
html.rg .main-header .btn-despositar[href*="withdraw"],
html.rg .main-header button.btn-despositar:disabled {
    background: transparent !important;
    color: var(--rg-accent-ink) !important;
    box-shadow: none !important;
}
html.rg .main-header .btn-despositar[href*="withdraw"]:hover { background: var(--rg-accent-soft) !important; }
/* saldo da carteira: pílula escura com borda */
html.rg .main-header .btn-money {
    background: var(--rg-surface) !important;
    border: 1px solid var(--rg-line-2) !important;
    border-radius: 12px !important;
    color: #fff !important;
    font-family: var(--rg-font-display) !important;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    box-shadow: none !important;
}

/* ---------- Sidebar ---------- */
html.rg .main-sidebar,
html.rg .main-sidebar .sidebar,
html.rg [class*="sidebar-dark-"] {
    background: #170e3d !important;
    border-right: 1px solid var(--rg-line);
    box-shadow: none !important;
}
/* O script da barra do topo desce o menu (top 72px/111px), mas a altura seguia 100vh: o fim do menu
   (Tutoriais, Bônus) ficava abaixo da tela, inalcançável pela rolagem. Topo e base fixos resolvem a altura. */
html.rg .layout-fixed .main-sidebar { height: auto !important; min-height: 0 !important; bottom: 0 !important; }
html.rg .layout-fixed .main-sidebar .sidebar { height: 100% !important; }
html.rg .main-sidebar .brand-link { border-bottom-color: var(--rg-line) !important; color: #fff !important; }
html.rg .main-sidebar .nav-sidebar .nav-link:not(.btn),
html.rg .main-sidebar .nav-sidebar .nav-link p:not(.btn *),
html.rg .main-sidebar .nav-sidebar .nav-link i:not(.btn *),
html.rg .main-sidebar .user-panel,
html.rg .main-sidebar .user-panel a {
    color: var(--rg-ink-2) !important;
}
html.rg .main-sidebar .nav-sidebar .nav-link {
    border-radius: 12px;
    transition: background .18s ease, color .18s ease;
}
html.rg .main-sidebar .nav-sidebar .nav-link:not(.btn):hover {
    background: var(--rg-surface) !important;
}
html.rg .main-sidebar .nav-sidebar .nav-link:not(.btn):hover p,
html.rg .main-sidebar .nav-sidebar .nav-link:not(.btn):hover i { color: #fff !important; }
/* item da página atual: cheio na cor da banca, texto escuro (como no "Tela principal" do layout) */
html.rg .main-sidebar .nav-sidebar .nav-link.active:not(.btn) {
    background: var(--rg-accent) !important;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--rg-accent) 25%, transparent) !important;
}
html.rg .main-sidebar .nav-sidebar .nav-link.active:not(.btn) p,
html.rg .main-sidebar .nav-sidebar .nav-link.active:not(.btn) i { color: var(--rg-on-accent) !important; }
/* grupo aberto (Loterias, Bichão...): só um fundo leve */
html.rg .main-sidebar .nav-sidebar .menu-open > .nav-link:not(.btn):not(.active) { background: var(--rg-surface) !important; }
html.rg .main-sidebar .nav-treeview { background: transparent !important; }
html.rg .main-sidebar .nav-header {
    color: var(--rg-ink-3) !important;
    font-size: .72rem !important;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
/* divisórias entre itens do menu: mais sutis */
html.rg .main-sidebar .nav-sidebar > .nav-item { border-color: var(--rg-line) !important; }
/* botões coloridos do topo do menu (cor configurada pela banca): mantém a cor, visual plano */
html.rg .main-sidebar a.btn,
html.rg .main-sidebar .btn {
    border-radius: 12px !important;
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .18) !important;
    font-weight: 800;
    transition: transform .15s ease, filter .15s ease;
}
html.rg .main-sidebar a.btn:hover,
html.rg .main-sidebar .btn:hover { transform: translateY(-1px); filter: brightness(1.08); }

/* ---------- Cards ---------- */
html.rg .card,
html.rg .card-master,
html.rg .info-box,
html.rg .small-box {
    background: var(--rg-surface) !important;
    border: 1px solid var(--rg-glass-borda) !important;
    border-radius: var(--rg-radius) !important;
    box-shadow: var(--rg-shadow) !important;
    opacity: 1 !important;
    color: var(--rg-ink);
}
html.rg .card-header,
html.rg .card-footer {
    background: transparent !important;
    border-color: var(--rg-line) !important;
    color: var(--rg-ink);
}
html.rg .card-header { border-left-color: var(--rg-accent) !important; }
html.rg .card-header:first-child { border-radius: var(--rg-radius) var(--rg-radius) 0 0 !important; }
html.rg .card-footer:last-child { border-radius: 0 0 var(--rg-radius) var(--rg-radius) !important; }
html.rg .card-title { color: var(--rg-ink); font-weight: 800; }
html.rg .small-box .icon > i { color: rgba(255, 255, 255, .12) !important; }
html.rg .card .card { background: var(--rg-surface-2) !important; box-shadow: none !important; }
/* faixa colorida no topo dos cards do conteúdo (sombra interna: não mexe em medida) */
html.rg .content-wrapper .card:not(.card .card) { box-shadow: inset 0 3px 0 var(--rg-violeta), var(--rg-shadow) !important; }

/* entrada suave dos cards */
html.rg .content-wrapper .card { animation: rg-rise .35s ease-out both; }

/* ---------- Tabelas ---------- */
html.rg .table {
    color: var(--rg-ink) !important;
    background: transparent;
}
html.rg .table thead th,
html.rg .table > thead > tr > th {
    background: var(--rg-surface-2) !important;
    color: var(--rg-ink-2) !important;
    font-size: .76rem;
    font-weight: 800;
    border-color: var(--rg-line) !important;
}
html.rg .table td,
html.rg .table th { border-color: var(--rg-line) !important; }
html.rg .table-striped tbody tr:nth-of-type(odd) { background: rgba(255, 255, 255, .03) !important; }
html.rg .table-hover tbody tr:hover,
html.rg table.dataTable tbody tr:hover { background: var(--rg-accent-soft) !important; }
html.rg .table-responsive { border-radius: var(--rg-radius-sm); -webkit-overflow-scrolling: touch; }

/* DataTables */
html.rg .dataTables_wrapper .dataTables_filter input,
html.rg .dataTables_wrapper .dataTables_length select { border-radius: 10px !important; }
html.rg .dataTables_wrapper .dataTables_info { color: var(--rg-ink-3) !important; }

/* ---------- Paginação ---------- */
html.rg .pagination .page-link {
    border: 1px solid var(--rg-line) !important;
    background: var(--rg-surface) !important;
    color: var(--rg-ink-2) !important;
    border-radius: 10px !important;
    margin: 0 2px;
    font-weight: 700;
}
html.rg .pagination .page-item.active .page-link {
    background: var(--rg-accent) !important;
    border-color: var(--rg-accent) !important;
    color: var(--rg-on-accent) !important;
}

/* ---------- Formulários ---------- */
html.rg .form-control,
html.rg .custom-select,
html.rg select.form-control,
html.rg .input-group-text,
html.rg .select2-container--bootstrap4 .select2-selection,
html.rg .select2-container--default .select2-selection--single {
    background-color: var(--rg-surface-2) !important;
    color: var(--rg-ink) !important;
    border: 1.5px solid var(--rg-line-2) !important;
    border-radius: var(--rg-radius-sm) !important;
    transition: border-color .15s ease, box-shadow .15s ease;
}
html.rg .input-group-text { background-color: var(--rg-surface-3) !important; color: var(--rg-ink-2) !important; }
html.rg .input-group > .form-control:not(:last-child),
html.rg .input-group > .custom-select:not(:last-child),
html.rg .input-group > .input-group-prepend > .input-group-text,
html.rg .input-group > .input-group-append:not(:last-child) > .input-group-text { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
html.rg .input-group > .form-control:not(:first-child),
html.rg .input-group > .custom-select:not(:first-child),
html.rg .input-group > .input-group-append > .input-group-text,
html.rg .input-group > .input-group-prepend:not(:first-child) > .input-group-text { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; }
html.rg .form-control:focus,
html.rg .custom-select:focus {
    border-color: var(--rg-accent) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rg-accent) 35%, transparent) !important;
}
html.rg .form-control::placeholder { color: var(--rg-ink-3) !important; opacity: 1; }
html.rg .form-control:disabled,
html.rg .form-control[readonly] { background-color: var(--rg-surface) !important; }
html.rg label { color: var(--rg-ink-2); font-weight: 700; }
html.rg input[type="checkbox"], html.rg input[type="radio"] { accent-color: var(--rg-accent); }
/* lista nativa do select abre no padrão do sistema operacional: texto escuro para ler */
html.rg select option { color: #171a3a; background: #f5f3ff; }
html.rg .select2-dropdown { background: var(--rg-surface) !important; border-color: var(--rg-line-2) !important; color: #fff; }
html.rg .select2-container .select2-selection__rendered { color: #fff !important; }
html.rg .select2-results__option { color: #fff; }

/* ---------- Botões ----------
   Mantém tamanho e cor de cada botão; só arredonda, dá peso e o "aperto" ao tocar. */
html.rg .btn {
    border-radius: var(--rg-radius-sm);
    font-weight: 800;
    letter-spacing: .01em;
    touch-action: manipulation;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease, background-color .18s ease;
}
html.rg .btn:not(:disabled):not(.disabled):active { transform: scale(.96); }
html.rg .btn:not(:disabled):not(.disabled):hover { filter: brightness(1.06); }
/* sem !important: cor inline do botão (configurada pela banca) continua valendo */
html.rg .btn-primary {
    background: var(--rg-accent);
    border-color: var(--rg-accent);
    color: var(--rg-on-accent);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--rg-accent) 28%, transparent);
}
html.rg .btn-success {
    /* verde mais escuro: texto branco precisa de contraste alto */
    background: #15803d;
    border-color: #15803d;
    color: #fff;
}
html.rg .btn-danger {
    background: #dc2626;
    border-color: #dc2626;
    color: #fff;
}
html.rg .btn-secondary,
html.rg .btn-default,
html.rg .btn-light {
    background: var(--rg-surface-2);
    border: 1px solid var(--rg-line-2);
    color: var(--rg-ink);
}
html.rg .btn-outline-secondary,
html.rg .btn-outline-light,
html.rg .btn-outline-dark {
    color: var(--rg-ink-2) !important;
    border-color: var(--rg-line-2) !important;
}
html.rg .btn-outline-secondary:hover,
html.rg .btn-outline-secondary.active { background: var(--rg-surface-2) !important; }
html.rg .btn-outline-primary {
    border-color: var(--rg-accent) !important;
    color: var(--rg-accent-ink) !important;
}
html.rg .btn-outline-primary:hover,
html.rg .btn-outline-primary.active {
    background: var(--rg-accent) !important;
    color: var(--rg-on-accent) !important;
}

/* ---------- Modais e alertas ---------- */
html.rg .modal-content {
    background: var(--rg-surface);
    color: var(--rg-ink);
    border: 1px solid var(--rg-line-2) !important;
    border-radius: 22px !important;
    box-shadow: var(--rg-shadow-lg) !important;
}
html.rg .modal-header,
html.rg .modal-footer { border-color: var(--rg-line) !important; }
html.rg .modal-title { font-weight: 800; color: var(--rg-ink); }
html.rg .modal-backdrop.show { opacity: .7; }
html.rg .modal.fade .modal-dialog { transition: transform .28s cubic-bezier(.2, .9, .3, 1.2), opacity .2s ease; }
html.rg .close { color: var(--rg-ink); text-shadow: none; opacity: .8; }
html.rg .swal2-popup {
    border-radius: 22px !important;
    font-family: var(--rg-font) !important;
    background: var(--rg-surface) !important;
    color: #fff !important;
    border: 1px solid var(--rg-line-2);
    box-shadow: var(--rg-shadow-lg) !important;
}
html.rg .swal2-title,
html.rg .swal2-html-container,
html.rg .swal2-content { color: #fff !important; }
html.rg .swal2-input, html.rg .swal2-textarea {
    background: var(--rg-surface-2) !important;
    color: #fff !important;
    border: 1.5px solid var(--rg-line-2) !important;
    border-radius: 12px !important;
}
html.rg .swal2-styled { border-radius: 12px !important; font-weight: 800 !important; }
html.rg #toast-container > div {
    border-radius: 16px !important;
    box-shadow: var(--rg-shadow-lg) !important;
    opacity: .98 !important;
}
html.rg .alert { border-radius: var(--rg-radius-sm); border-width: 1px; }
html.rg .dropdown-menu {
    background: var(--rg-surface) !important;
    border: 1px solid var(--rg-line-2) !important;
    border-radius: 14px !important;
    box-shadow: var(--rg-shadow-lg) !important;
    padding: 6px;
}
html.rg .dropdown-item { border-radius: 10px; color: #fff; }
html.rg .dropdown-item:hover, html.rg .dropdown-item:focus { background: var(--rg-surface-2); color: #fff; }
html.rg .badge { border-radius: 999px; font-weight: 800; }
html.rg .nav-tabs .nav-link { border-radius: 12px 12px 0 0; }
html.rg .nav-pills .nav-link.active { background: var(--rg-accent) !important; color: var(--rg-on-accent) !important; }
html.rg .progress { border-radius: 999px; background: var(--rg-surface-2); }
html.rg .main-footer {
    background: #170e3d !important;
    border-top: 1px solid var(--rg-line) !important;
    color: var(--rg-ink-3) !important;
}

/* Proteção de contraste: o JS marca caixas com fundo fixo do tema antigo e
   texto que ficaria invisível (claro em claro, escuro em escuro). */
html.rg [data-rg-sup="caixa"] {
    background-color: var(--rg-surface) !important;
    color: var(--rg-ink) !important;
    border-color: var(--rg-line) !important;
    border-radius: var(--rg-radius);
}
html.rg [data-rg-sup="caixa"] [data-rg-sup="caixa"] { background-color: var(--rg-surface-2) !important; }
/* popup/janela flutuante: fundo sólido para o texto ficar legível por cima da página */
html.rg [data-rg-sup="flutuante"] {
    background-color: var(--rg-surface) !important;
    color: var(--rg-ink) !important;
    border-color: var(--rg-line-2) !important;
    border-radius: 22px;
    box-shadow: var(--rg-shadow-lg) !important;
}
html.rg [data-rg-sup="campo"] {
    background-color: var(--rg-surface-2) !important;
    color: var(--rg-ink) !important;
    border: 1.5px solid var(--rg-line-2) !important;
}
html.rg [data-rg-ink="dark"] { color: #171a3a !important; }
html.rg [data-rg-ink="light"] { color: #ffffff !important; }
/* texto colorido fraco: o JS calcula a mesma cor, mais clara, em --rg-cor */
html.rg [data-rg-ink="cor"] { color: var(--rg-cor) !important; }

/* =====================================================================
   TELA PRINCIPAL
   ===================================================================== */
/* banner grande: cantos e sombra */
html.rg .carousel,
html.rg .carousel-inner { border-radius: 24px; }
html.rg .carousel-inner { overflow: hidden; }
html.rg .carousel { box-shadow: var(--rg-shadow-lg); }
html.rg .carousel-indicators li { border-radius: 999px; height: 6px; width: 6px; transition: width .3s ease, background-color .3s ease; }
html.rg .carousel-indicators li.active { width: 26px; background-color: var(--rg-on-accent, #10151f); opacity: .9; }

/* atalhos (Suporte, Bilhete, Bônus...): card escuro com o ícone dentro de um "chip" colorido */
html.rg .category-info > a {
    display: block;
    padding: 14px 10px 12px;
    border-radius: var(--rg-radius);
    background: var(--rg-surface);
    border: 1px solid var(--rg-glass-borda);
    text-align: center;
    transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
}
html.rg .category-info > a:hover,
html.rg .category-info > a:active {
    transform: translateY(-3px);
    border-color: var(--rg-line-2);
    background: var(--rg-surface-2);
}
html.rg .category-info .icon-container {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 8px;
    border-radius: 18px;
    /* os ícones da banca já são coloridos: fundo escuro e anel na cor do atalho, o ícone é o destaque */
    background: var(--rg-bg);
    box-shadow: inset 0 0 0 3px var(--rg-chip, var(--rg-violeta)), 0 6px 16px color-mix(in srgb, var(--rg-chip, var(--rg-violeta)) 35%, transparent);
}
/* uma cor por atalho, em rodízio (como no layout de referência) */
html.rg .category-info:nth-child(5n+1) { --rg-chip: var(--rg-violeta); }
html.rg .category-info:nth-child(5n+2) { --rg-chip: var(--rg-gold); }
html.rg .category-info:nth-child(5n+3) { --rg-chip: var(--rg-accent); }
html.rg .category-info:nth-child(5n+4) { --rg-chip: var(--rg-sky); }
html.rg .category-info:nth-child(5n+5) { --rg-chip: var(--rg-coral); }
html.rg .category-info .icon-container img {
    width: 46px !important;
    height: 46px;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
    transition: transform .25s cubic-bezier(.2, 1.4, .4, 1);
}
html.rg .category-info > a:hover .icon-container img { transform: scale(1.08) rotate(-4deg); }
html.rg .category-info .txtnav {
    margin: 0;
    color: var(--rg-ink) !important;
    font-size: .9rem !important;
    font-weight: 800;
    letter-spacing: 0;
}

/* títulos das seções de jogos ("Jogos de Hoje"...) */
html.rg .swipe-controles h1 {
    font-size: clamp(1.15rem, .95rem + .8vw, 1.45rem) !important;
    margin: 0;
}
html.rg .swipe-controles h1::after {
    content: "";
    display: block;
    width: 44px;
    height: 5px;
    margin-top: 6px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--rg-lima), var(--rg-gold), var(--rg-coral));
}

/* card de cada jogo: banner da loteria dentro de um card, contagem embaixo */
html.rg .box-imgs {
    margin: 6px;
    padding: 10px !important;
    border-radius: var(--rg-radius);
    background: var(--rg-surface);
    border: 1px solid var(--rg-glass-borda);
    transition: transform .2s ease, border-color .2s ease;
}
html.rg .box-imgs:hover { transform: translateY(-3px); border-color: var(--rg-cor-jogo, var(--rg-line-2)); }
/* uma cor por card, em rodízio: borda de baixo grossa e a contagem na mesma cor */
html.rg .box-imgs { border-bottom: 4px solid var(--rg-cor-jogo, var(--rg-violeta)); }
html.rg .box-imgs:nth-child(6n+1) { --rg-cor-jogo: var(--rg-lima); }
html.rg .box-imgs:nth-child(6n+2) { --rg-cor-jogo: var(--rg-gold); }
html.rg .box-imgs:nth-child(6n+3) { --rg-cor-jogo: var(--rg-violeta); }
html.rg .box-imgs:nth-child(6n+4) { --rg-cor-jogo: var(--rg-sky); }
html.rg .box-imgs:nth-child(6n+5) { --rg-cor-jogo: var(--rg-coral); }
html.rg .box-imgs:nth-child(6n+6) { --rg-cor-jogo: var(--rg-rosa); }
html.rg .box-imgs .hover-container {
    display: block;
    border-radius: 14px;
    overflow: hidden;
}
html.rg .box-imgs .hover-container img { border-radius: 14px !important; transition: transform .45s ease; }
html.rg .box-imgs .hover-container:hover img { transform: scale(1.05); }

/* contagem regressiva do sorteio: pílula escura com relógio */
html.rg .count-live-tag {
    border-radius: 999px !important;
    background: var(--rg-cor-jogo, var(--rg-lima)) !important;
    border: 0 !important;
    color: var(--rg-on-lima) !important;
    font-family: var(--rg-font-display) !important;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    box-shadow: none !important;
}
html.rg .ao-vivo-tag {
    border-radius: 999px !important;
    background: var(--rg-coral) !important;
    color: #fff !important;
    font-weight: 800;
}
html.rg .ao-vivo-tag::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 6px;
    border-radius: 50%;
    background: #fff;
    vertical-align: middle;
    animation: rg-vivo 1.2s ease-in-out infinite;
}

/* "Indique e ganhe": card com ícone na cor da banca */
html.rg .card-afiliado .card-title i { color: var(--rg-accent-ink); }

html.rg .count-live-tag svg circle,
html.rg .count-live-tag svg path { stroke: var(--rg-tinta) !important; }

/* "Clique para indicar um amigo" (funcionários): faixa vira card, com ícone em chip */
html.rg .card-indica {
    background: var(--rg-surface) !important;
    border: 1px solid var(--rg-glass-borda) !important; /* a borda vermelha vem inline */
    border-radius: var(--rg-radius) !important;
    padding: 14px 18px !important;
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease;
}
html.rg .card-indica:hover { background: var(--rg-surface-2) !important; border-color: var(--rg-line-2) !important; }
html.rg .card-indica h5 { margin: 0; color: var(--rg-ink) !important; font-size: 1rem; }
html.rg .card-indica::before {
    content: "\f234"; /* user-plus (Font Awesome 5) */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin-right: 12px;
    border-radius: 10px;
    background: var(--rg-accent);
    color: var(--rg-on-accent);
    font-size: 15px;
}

@keyframes rg-vivo {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .35; transform: scale(.7); }
}

/* =====================================================================
   TELA PRINCIPAL - blocos do layout novo (partials/roupagem/*)
   ===================================================================== */
/* letreiro "Fulano ganhou no..." */
html.rg .rg-letreiro {
    display: flex;
    align-items: stretch;
    margin: 0 0 18px;
    border-radius: 16px;
    overflow: hidden;
    background: linear-gradient(90deg, #7c3aed, #9333ea 50%, #c026d3);
    box-shadow: 0 10px 28px rgba(124, 58, 237, .35);
}
html.rg .rg-letreiro-rotulo {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 16px;
    background: var(--rg-lima);
    color: var(--rg-on-lima);
    font-family: var(--rg-font-display) !important;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}
html.rg .rg-letreiro-ponto {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--rg-tinta);
    animation: rg-vivo 1.2s ease-in-out infinite;
}
html.rg .rg-letreiro-janela { flex: 1; overflow: hidden; }
html.rg .rg-letreiro-trilho {
    display: flex;
    width: max-content;
    animation: rg-letreiro 60s linear infinite;
}
html.rg .rg-letreiro:hover .rg-letreiro-trilho { animation-play-state: paused; }
html.rg .rg-letreiro-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 14px 26px;
    color: #fff;
    font-size: 1rem;
    white-space: nowrap;
}
html.rg .rg-letreiro-item b { font-weight: 800; }
html.rg .rg-letreiro-item::before {
    content: "";
    width: 8px;
    height: 8px;
    margin-right: 6px;
    border-radius: 50%;
    background: var(--rg-lima);
}
html.rg .rg-letreiro-valor {
    margin-left: 4px;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--rg-gold);
    color: var(--rg-tinta);
    font-family: var(--rg-font-display) !important;
    font-weight: 800;
    font-size: .9rem;
}
@keyframes rg-letreiro { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* painel */
html.rg .rg-painel { margin: 18px 0 22px; }
html.rg .rg-painel h3 {
    margin: 0;
    font-size: 1.1rem !important;
    color: #fff;
}

/* 3 cards do consultor/gerente: blocos de cor forte */
html.rg .rg-cards-equipe {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 14px;
}
html.rg .rg-card-kpi {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 140px;
    padding: 18px 20px;
    border-radius: 22px;
    text-decoration: none !important;
    transition: transform .18s ease, filter .18s ease;
}
html.rg .rg-card-kpi:hover { transform: translateY(-3px); filter: brightness(1.05); }
html.rg .rg-card-kpi-1 { background: var(--rg-gold); color: var(--rg-tinta) !important; box-shadow: 0 12px 30px rgba(245, 197, 66, .3); }
html.rg .rg-card-kpi-2 { background: var(--rg-violeta); color: #fff !important; box-shadow: 0 12px 30px rgba(139, 92, 246, .35); }
html.rg .rg-card-kpi-3 { background: var(--rg-coral); color: var(--rg-tinta) !important; box-shadow: 0 12px 30px rgba(240, 112, 90, .3); }
html.rg .rg-card-kpi-titulo {
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: .85;
}
html.rg .rg-card-kpi-valor {
    font-family: var(--rg-font-display) !important;
    font-size: clamp(1.4rem, 1rem + 1.4vw, 2rem);
    font-weight: 800;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}
html.rg .rg-card-kpi-barra {
    height: 9px;
    border-radius: 999px;
    background: rgba(20, 16, 46, .25);
    overflow: hidden;
}
html.rg .rg-card-kpi-barra > span { display: block; height: 100%; border-radius: 999px; background: var(--rg-tinta); }
html.rg .rg-card-kpi-detalhe { font-size: .88rem; font-weight: 700; opacity: .9; margin-top: auto; }

/* grade: sorteios de hoje à esquerda, sequência e indique à direita */
html.rg .rg-painel-grade {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 14px;
    align-items: stretch; /* "Sorteios de hoje" acompanha a altura da coluna da direita */
}
html.rg .rg-painel-lado { display: grid; gap: 14px; align-content: start; }
/* sem nada à direita (visitante): a lista ocupa a largura toda e tem altura própria (rola por dentro) */
html.rg .rg-painel-grade:not(:has(.rg-painel-lado > *)) { grid-template-columns: minmax(0, 1fr); }
html.rg .rg-painel-grade:not(:has(.rg-sorteios)) { grid-template-columns: minmax(0, 1fr); }
html.rg .rg-painel-grade:not(:has(.rg-sorteios)):not(:has(.rg-painel-lado > *)) { display: none; }
@media (min-width: 992px) { html.rg .rg-painel-grade:not(:has(.rg-sorteios)) .rg-painel-lado { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); align-items: stretch; } }
html.rg .rg-painel-grade:not(:has(.rg-painel-lado > *)) .rg-painel-lado { display: none; }
@media (min-width: 992px) {
    html.rg .rg-painel-grade:not(:has(.rg-painel-lado > *)) .rg-sorteios { height: auto; min-height: 0; }
    html.rg .rg-painel-grade:not(:has(.rg-painel-lado > *)) .rg-sorteios ul { flex: none; max-height: 432px; }
}
html.rg .rg-bloco {
    padding: 18px 20px;
    border-radius: 22px;
    background: var(--rg-surface);
    border: 1px solid var(--rg-glass-borda);
    box-shadow: var(--rg-shadow);
}
html.rg .rg-bloco-topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}
html.rg .rg-bloco-topo a { color: var(--rg-lima-texto) !important; font-weight: 800; font-size: .9rem; }

/* sorteios de hoje (versão compacta) */
html.rg .rg-sorteios ul { list-style: none; margin: 0; padding: 0; }
html.rg .rg-sorteios-vazio { margin: 6px 0 0; color: var(--rg-ink-2); font-size: .95rem; line-height: 1.45; }
/* sem sorteio aberto: "milhar da sorte" (caça-níquel) */
html.rg .rg-sv { position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; margin: 4px 0 0; padding: 20px 16px 16px; border-radius: 18px; text-align: center; overflow: hidden; min-width: 0;
    background: radial-gradient(90% 70% at 50% 0%, color-mix(in srgb, var(--rg-lima-brilho) 14%, transparent), transparent 60%), radial-gradient(80% 80% at 100% 100%, rgba(139, 92, 246, .28), transparent 60%), linear-gradient(160deg, #241a52, #160f36);
    border: 1px solid color-mix(in srgb, var(--rg-lima) 30%, transparent); box-shadow: inset 0 0 40px rgba(139, 92, 246, .18); }
html.rg .rg-sv-topo h4 { margin: 6px 0 0; color: #fff; font-size: 1.15rem; font-weight: 900; line-height: 1.25; }
html.rg .rg-sv-topo h4 em { font-style: normal; color: var(--rg-lima-texto); text-shadow: 0 0 18px color-mix(in srgb, var(--rg-lima-brilho) 45%, transparent); }
html.rg .rg-sv-aguarde { display: inline-flex; align-items: center; gap: 7px; padding: 4px 11px; border-radius: 999px; background: rgba(255,255,255,.06); color: var(--rg-ink-2); font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
html.rg .rg-sv-aguarde i { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--rg-gold); box-shadow: 0 0 0 0 rgba(245, 197, 66, .6); animation: rg-sv-pulso 1.6s infinite; }
@keyframes rg-sv-pulso { 70% { box-shadow: 0 0 0 9px rgba(245, 197, 66, 0); } 100% { box-shadow: 0 0 0 0 rgba(245, 197, 66, 0); } }
html.rg .rg-sv-maquina { display: flex; flex-direction: column; align-items: center; gap: 10px; }
html.rg .rg-sv-rolos { display: flex; gap: 8px; padding: 10px; border-radius: 18px; background: #0d0920; border: 2px solid color-mix(in srgb, var(--rg-gold) 55%, transparent); box-shadow: 0 0 0 4px rgba(245, 197, 66, .08), 0 10px 26px rgba(0,0,0,.45); }
html.rg .rg-sv-rolo { width: 52px; height: 64px; display: grid; place-items: center; border-radius: 12px; background: linear-gradient(180deg, #fff 0%, #e9e6f7 48%, #cfc9e8 100%); box-shadow: inset 0 -6px 10px rgba(0,0,0,.18), inset 0 6px 10px rgba(255,255,255,.7); overflow: hidden; }
html.rg .rg-sv-rolo b { color: #1a1338; font-size: 2rem; font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1; }
html.rg .rg-sv-rolo.rodando b { animation: rg-sv-roda .12s linear infinite; filter: blur(.6px); }
@keyframes rg-sv-roda { from { transform: translateY(-30%); } to { transform: translateY(30%); } }
html.rg .rg-sv-rolo.parou { animation: rg-sv-trava .28s ease-out; }
@keyframes rg-sv-trava { 0% { transform: translateY(-6px); } 60% { transform: translateY(3px); } 100% { transform: none; } }
html.rg .rg-sv.revelado .rg-sv-rolos { border-color: var(--rg-lima); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima-brilho) 15%, transparent), 0 0 30px color-mix(in srgb, var(--rg-lima-brilho) 35%, transparent); transition: box-shadow .3s, border-color .3s; }
html.rg .rg-sv-bicho { display: inline-flex; align-items: center; gap: 10px; padding: 6px 14px 6px 8px; border-radius: 999px; background: rgba(255,255,255,.07); border: 1px solid var(--rg-line); animation: rg-sv-surge .4s cubic-bezier(.2, 1.4, .4, 1); text-align: left; }
html.rg .rg-sv-bicho[hidden] { display: none; }
html.rg .rg-sv-bicho > span { font-size: 1.7rem; line-height: 1; }
html.rg .rg-sv-bicho small { display: block; color: var(--rg-ink-3); font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
html.rg .rg-sv-bicho b { color: #fff; font-size: .98rem; }
@keyframes rg-sv-surge { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: none; } }
html.rg .rg-sv-acoes { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; width: 100%; max-width: 380px; }
html.rg .rg-sv-girar, html.rg .rg-sv-jogar { flex: 1 1 140px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 16px; border-radius: 14px; font-weight: 900; font-size: .95rem; text-decoration: none !important; white-space: nowrap; cursor: pointer; }
html.rg .rg-sv-girar { border: 0; background: linear-gradient(180deg, #ffd95a, #f5b821); color: #2a1a00; box-shadow: 0 5px 0 #b9850c, 0 10px 20px rgba(245, 184, 33, .3); transition: transform .08s, box-shadow .08s; }
html.rg .rg-sv-girar:active { transform: translateY(4px); box-shadow: 0 1px 0 #b9850c; }
html.rg .rg-sv-girar:disabled { opacity: .75; cursor: wait; }
html.rg .rg-sv.girando .rg-sv-girar i { animation: rg-sv-gira .6s linear infinite; }
@keyframes rg-sv-gira { to { transform: rotate(360deg); } }
html.rg .rg-sv:not(.girando):not(.revelado) .rg-sv-girar { animation: rg-sv-chama 2s ease-in-out infinite; }
@keyframes rg-sv-chama { 0%, 100% { transform: none; } 50% { transform: scale(1.04); } }
html.rg .rg-sv-jogar { background: var(--rg-lima); color: var(--rg-on-lima) !important; box-shadow: 0 5px 0 var(--rg-lima-sombra), 0 10px 20px color-mix(in srgb, var(--rg-lima-brilho) 25%, transparent); animation: rg-sv-surge .4s cubic-bezier(.2, 1.4, .4, 1); }
html.rg .rg-sv-jogar[hidden] { display: none; }
html.rg .rg-sv-resultados { color: var(--rg-ink-2) !important; font-size: .82rem; font-weight: 600; text-decoration: none !important; }
html.rg .rg-sv-resultados i { color: var(--rg-gold); margin-right: 4px; }
html.rg .rg-sv-resultados:hover { color: #fff !important; }
html.rg .rg-sv-topo p { margin: 4px 0 0; color: var(--rg-ink-2); font-size: .88rem; }
/* na home, perto dos cards do Bichão: faixa larga no computador (texto | rolos | botões) */
html.rg .rg-sv { margin: 0; padding: 22px 18px; }
html.rg .rg-sv-faixa { margin: 6px 0 14px; }
@media (min-width: 992px) {
    html.rg .rg-sv { flex-direction: row; justify-content: space-between; gap: 24px; padding: 22px 28px; text-align: left; }
    html.rg .rg-sv-topo { flex: 1 1 0; min-width: 0; }
    html.rg .rg-sv-topo h4 { font-size: 1.35rem; }
    html.rg .rg-sv-maquina { flex: none; }
    html.rg .rg-sv-acoes { flex: 1 1 0; flex-direction: column; align-items: stretch; max-width: 240px; }
    html.rg .rg-sv-girar, html.rg .rg-sv-jogar { flex: none; }
}
@media (max-width: 380px) { html.rg .rg-sv-rolo { width: 44px; height: 56px; } html.rg .rg-sv-rolo b { font-size: 1.7rem; } html.rg .rg-sv-topo h4 { font-size: 1.02rem; } }
@media (prefers-reduced-motion: reduce) { html.rg .rg-sv *, html.rg .rg-sv { animation: none !important; } }
@media (min-width: 992px) {
    /* a coluna da direita define a altura; "Sorteios de hoje" preenche essa altura
       (height 0 + min-height 100%: a lista não empurra a linha da grade) e rola se passar */
    html.rg .rg-sorteios { display: flex; flex-direction: column; height: 0; min-height: 100%; }
    /* piso de ~5 sorteios na linha da grade (não no cartão, senão ele vaza sobre o que vem abaixo):
       com a coluna da direita curta (só a Sequência) a lista não encolhe a um sorteio */
    html.rg .rg-painel-grade:has(.rg-sorteios):has(.rg-painel-lado > *) { grid-auto-rows: minmax(480px, auto); }
    html.rg .rg-sorteios ul {
        flex: 1;
        min-height: 0;
        overflow-y: auto;
        display: flex;
        flex-direction: column;
        scrollbar-width: thin;
        scrollbar-color: var(--rg-surface-3) transparent;
        /* esmaece o pé da lista: mostra que há mais sorteios rolando */
        -webkit-mask-image: linear-gradient(to bottom, #000 82%, transparent);
        mask-image: linear-gradient(to bottom, #000 82%, transparent);
        padding-bottom: 28px;
    }
    html.rg .rg-sorteios li a { padding-top: 9px; padding-bottom: 9px; }
    /* com poucos sorteios as linhas se espaçam até o limite; com muitos, rola */
    html.rg .rg-sorteios li { flex: 1 0 auto; display: flex; align-items: center; max-height: 86px; }
    html.rg .rg-sorteios li > a { flex: 1; }
}
@media (max-width: 991px) {
    /* celular/tablet: altura de ~6 linhas e rola por dentro (com muitos sorteios a página não fica enorme) */
    html.rg .rg-sorteios ul {
        max-height: 432px; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
        scrollbar-width: thin; scrollbar-color: var(--rg-surface-3) transparent;
    }
    html.rg .rg-sorteios ul:has(> li:nth-child(7)) {
        -webkit-mask-image: linear-gradient(to bottom, #000 84%, transparent); mask-image: linear-gradient(to bottom, #000 84%, transparent); padding-bottom: 28px;
    }
}
html.rg .rg-sorteios li + li { border-top: 1px solid var(--rg-line); }
html.rg .rg-sorteios li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 4px;
    color: #fff !important;
    text-decoration: none;
    border-radius: 10px;
    transition: background-color .15s ease;
}
html.rg .rg-sorteios li a:hover { background: var(--rg-surface-2); }
html.rg .rg-sorteio-cor {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    flex: none;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}
html.rg .rg-sorteio-cor img { width: 100%; height: 100%; object-fit: cover; }
html.rg .rg-sorteio-nome { flex: 1; font-weight: 700; }
html.rg .rg-sorteio-tempo {
    font-family: var(--rg-font-display) !important;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--rg-ink-2);
}
html.rg .rg-sorteio-tempo.urgente { color: var(--rg-coral); }
html.rg .rg-sorteios li a i { color: var(--rg-ink-3); font-size: .75rem; }

/* sequência de dias jogados */
html.rg .rg-sequencia-total {
    font-family: var(--rg-font-display) !important;
    font-weight: 800;
    color: var(--rg-coral);
}
html.rg .rg-sequencia-dias { display: flex; justify-content: space-between; gap: 6px; margin: 4px 0 10px; }
html.rg .rg-sequencia-dia { display: flex; flex-direction: column; align-items: center; gap: 6px; }
html.rg .rg-sequencia-caixa {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: .85rem;
}
html.rg .rg-sequencia-caixa.jogou { background: var(--rg-coral); color: var(--rg-tinta); box-shadow: 0 4px 12px rgba(240, 112, 90, .4); }
html.rg .rg-sequencia-caixa.hoje { border: 2px solid var(--rg-coral); animation: rg-pulse 1.6s ease-in-out infinite; }
html.rg .rg-sequencia-caixa.perdeu { background: var(--rg-surface-2); }
html.rg .rg-sequencia-caixa.futuro { border: 2px dashed var(--rg-line-2); }
html.rg .rg-sequencia-letra { font-size: .72rem; font-weight: 800; color: var(--rg-ink-3); }
html.rg .rg-sequencia p,
html.rg .rg-indique p { margin: 0; color: var(--rg-ink-2); font-size: .95rem; }

/* indique e ganhe */
html.rg .rg-indique { display: grid; gap: 10px; }
html.rg .rg-indique-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 13px;
    border: 0;
    border-radius: 14px;
    background: var(--rg-lima);
    color: var(--rg-on-lima);
    font-weight: 800;
    font-size: 1rem;
    cursor: pointer;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--rg-lima) 25%, transparent);
    transition: transform .12s ease, filter .15s ease;
}
html.rg .rg-indique-btn:hover { filter: brightness(1.05); }
html.rg .rg-indique-btn:active { transform: scale(.97); }
html.rg .rg-indique-link { color: var(--rg-lima-texto) !important; font-weight: 700; font-size: .9rem; text-align: center; }
html.rg .rg-indique-btn-2 {
    background: transparent;
    color: var(--rg-lima-texto);
    border: 2px solid var(--rg-lima);
    box-shadow: none;
    padding: 10px;
    font-size: .92rem;
}
/* a faixa antiga "Clique para indicar um amigo" tem os mesmos links do card "Indique e ganhe":
   no layout novo fica só o card (os links continuam iguais) */
html.rg .rg-painel ~ .card-indica[href="#collapseExample"],
html.rg .rg-painel ~ .card-indica[href="#collapseExample"] + p,
html.rg .rg-painel ~ #collapseExample { display: none !important; }

/* "Sua jornada": estrelas (cliente) ou carreira/dias seguidos (consultor e gerente) */
html.rg .rg-jornada { margin-bottom: 14px; padding: 22px 24px; }
html.rg .rg-jornada-topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
html.rg .rg-jornada-sobre {
    display: block;
    margin-bottom: 2px;
    color: var(--rg-ink-3);
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
html.rg .rg-jornada h3 { font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem) !important; }
html.rg .rg-jornada-destaque { text-align: right; }
html.rg .rg-jornada-destaque b {
    display: block;
    font-family: var(--rg-font-display) !important;
    font-size: clamp(1.2rem, 1rem + .8vw, 1.6rem);
    color: var(--rg-gold);
    font-variant-numeric: tabular-nums;
}
html.rg .rg-jornada-destaque span { color: var(--rg-ink-2); font-size: .88rem; }
html.rg .rg-jornada-trilha {
    position: relative;
    display: grid;
    grid-template-columns: repeat(var(--rg-colunas), minmax(0, 1fr));
    margin: 22px 0 18px;
}
/* linha de fundo e linha preenchida, passando pelo meio das etapas */
html.rg .rg-jornada-trilha::before,
html.rg .rg-jornada-trilha::after {
    content: "";
    position: absolute;
    top: 25px;
    left: calc(100% / var(--rg-colunas) / 2);
    height: 8px;
    border-radius: 999px;
}
html.rg .rg-jornada-trilha::before { right: calc(100% / var(--rg-colunas) / 2); background: var(--rg-bg); }
html.rg .rg-jornada-trilha::after {
    /* até a etapa atual + o pedaço andado no trecho visível entre ela e a próxima (fora da área coberta pelos quadrados),
       para que mesmo pouco progresso apareça saindo da etapa atual */
    --rg-no-meio: 29px;
    width: calc(100% / var(--rg-colunas) * var(--rg-idx) + var(--rg-no-meio) + max(var(--rg-min, 0px), (100% / var(--rg-colunas) - var(--rg-no-meio) * 2) * var(--rg-passo, 0) / 100));
    max-width: calc(100% - 100% / var(--rg-colunas));
    background: var(--rg-lima);
    box-shadow: 0 0 14px color-mix(in srgb, var(--rg-lima) 45%, transparent);
}
html.rg .rg-jornada-etapa { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
html.rg .rg-jornada-no {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 16px;
    font-family: var(--rg-font-display) !important;
    font-weight: 800;
    font-size: 1.05rem;
}
html.rg .rg-jornada-etapa.feito .rg-jornada-no { background: var(--rg-etapa-cor, var(--rg-lima)); color: var(--rg-on-lima); }
html.rg .rg-jornada-etapa.atual .rg-jornada-no {
    background: var(--rg-tinta);
    color: var(--rg-lima-texto);
    border: 4px solid var(--rg-etapa-cor, var(--rg-lima));
    box-shadow: 0 0 0 5px rgba(255, 255, 255, .9), 0 8px 22px color-mix(in srgb, var(--rg-lima) 35%, transparent);
    animation: rg-pulse 2s ease-in-out infinite;
}
html.rg .rg-jornada-etapa.futuro .rg-jornada-no {
    background: var(--rg-surface-2);
    color: var(--rg-ink-3);
    border: 2px dashed color-mix(in srgb, var(--rg-etapa-cor, var(--rg-violeta)) 70%, transparent);
}
html.rg .rg-jornada-no { position: relative; }
html.rg .rg-jornada-no i { font-size: 1.35rem; }
html.rg .rg-jornada-no-foto { overflow: hidden; padding: 0; background: #fff !important; }
html.rg .rg-jornada-no-foto img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
html.rg .rg-jornada-etapa.futuro .rg-jornada-no-foto img { filter: grayscale(.85) brightness(.75); }
html.rg .rg-jornada-etapa.futuro .rg-jornada-no i { color: color-mix(in srgb, var(--rg-etapa-cor, var(--rg-violeta)) 75%, #fff); }
html.rg .rg-jornada-etapa.feito .rg-jornada-no::after {
    content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: .6rem;
    position: absolute; right: -6px; bottom: -6px; width: 20px; height: 20px; border-radius: 50%;
    display: grid; place-items: center; background: var(--rg-lima); color: var(--rg-on-lima); border: 2px solid var(--rg-bg);
}
html.rg .rg-jornada-rotulo {
    max-width: 100%;
    padding: 0 2px;
    font-size: .82rem;
    font-weight: 700;
    color: #fff;
    line-height: 1.25;
    /* prêmio com nome longo ("Viagem para Noronha (c/ acompanhante)"): no máximo 2 linhas */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
}
html.rg .rg-jornada-etapa.futuro .rg-jornada-rotulo { color: var(--rg-ink-3); }
html.rg .rg-jornada-atual {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border-radius: 18px;
    background: var(--rg-bg);
}
html.rg .rg-jornada-atual-marca {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--rg-gold);
    color: var(--rg-tinta);
    font-family: var(--rg-font-display) !important;
    font-weight: 800;
}
html.rg .rg-jornada-atual-texto { flex: 1; display: flex; flex-direction: column; min-width: 0; }
html.rg .rg-jornada-atual-texto b { color: #fff; font-size: 1.02rem; }
html.rg .rg-jornada-atual-texto span { color: var(--rg-ink-2); font-size: .9rem; }
html.rg .rg-jornada-status {
    flex: none;
    padding: 7px 14px;
    border-radius: 999px;
    border: 1.5px solid var(--rg-gold);
    color: var(--rg-gold);
    font-weight: 800;
    font-size: .85rem;
}

@media (max-width: 991px) {
    html.rg .rg-painel-grade { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
    html.rg .rg-jornada { padding: 16px; }
    html.rg .rg-jornada-destaque { text-align: left; }
    html.rg .rg-jornada-trilha { margin: 16px 0 14px; }
    html.rg .rg-jornada-trilha::before, html.rg .rg-jornada-trilha::after { top: 18px; height: 6px; }
    html.rg .rg-jornada-no { width: 42px; height: 42px; border-radius: 12px; font-size: .82rem; }
    html.rg .rg-jornada-etapa.atual .rg-jornada-no { border-width: 3px; box-shadow: 0 0 0 3px rgba(255, 255, 255, .9); }
    html.rg .rg-jornada-rotulo { font-size: .62rem; overflow-wrap: normal; word-break: normal; }
    html.rg .rg-jornada-no i { font-size: 1rem; }
    html.rg .rg-jornada-atual { flex-wrap: wrap; }
    /* texto ocupa a linha toda ao lado do selo; "Em andamento" desce para a linha de baixo */
    html.rg .rg-jornada-atual-texto { flex: 1 1 calc(100% - 70px); }
    html.rg .rg-jornada-atual-marca { width: 44px; height: 44px; }
    html.rg .rg-jornada-status { margin-left: 58px; }
}
@media (max-width: 767px) {
    html.rg .rg-cards-equipe { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    html.rg .rg-card-kpi { min-height: 0; padding: 14px 16px; border-radius: 18px; }
    html.rg .rg-letreiro { border-radius: 12px; margin-bottom: 12px; }
    html.rg .rg-letreiro-rotulo { padding: 0 10px; font-size: .7rem; }
    html.rg .rg-letreiro-item { padding: 10px 18px; font-size: .9rem; }
    html.rg .rg-bloco { padding: 14px 16px; border-radius: 18px; }
    html.rg .rg-sequencia-caixa { width: 30px; height: 30px; }
}

/* card da roleta (partials/roupagem/roleta): compacto, na coluna da Sequência - roda pequena + texto */
html.rg .rg-roleta {
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    border-radius: 22px;
    background: var(--rg-surface);
    border: 1px solid var(--rg-glass-borda);
    box-shadow: var(--rg-shadow);
}
html.rg .rg-roleta-roda { position: relative; display: block; transition: transform .3s ease; }
html.rg .rg-roleta-roda:hover { transform: rotate(-8deg) scale(1.03); }
html.rg .rg-roleta-roda svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 8px 16px rgba(0, 0, 0, .35)); }
html.rg .rg-roleta-roda text {
    font-family: var(--rg-font) !important;
    font-size: 8.5px;
    font-weight: 800;
    fill: var(--rg-tinta);
}
html.rg .rg-roleta-roda .rg-roleta-longo { font-size: 6.6px; }
html.rg .rg-roleta-roda .rg-roleta-centro { font-size: 10px; fill: #fff; letter-spacing: .04em; }
html.rg .rg-roleta-seta {
    position: absolute;
    top: -5px;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -8px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 14px solid #fff;
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .3));
}
html.rg .rg-roleta-texto { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; }
html.rg .rg-roleta-sobre {
    color: var(--rg-gold);
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}
html.rg .rg-roleta-texto h3 { margin: 0; color: #fff; font-size: 1.1rem !important; line-height: 1.2; }
html.rg .rg-roleta-texto p { margin: 0; color: var(--rg-ink-2); font-size: .85rem; line-height: 1.35; }
html.rg .rg-roleta-btn {
    display: block;
    width: 100%;
    margin-top: 4px;
    padding: 10px;
    border-radius: 12px;
    background: var(--rg-gold);
    color: var(--rg-tinta) !important;
    font-weight: 800;
    font-size: .95rem;
    text-align: center;
    text-decoration: none !important;
    box-shadow: 0 8px 18px rgba(245, 197, 66, .28);
    transition: transform .12s ease, filter .15s ease;
}
html.rg .rg-roleta-btn:hover { filter: brightness(1.06); }
html.rg .rg-roleta-btn:active { transform: scale(.97); }
html.rg .rg-roleta-link { color: var(--rg-lima-texto) !important; font-weight: 700; font-size: .85rem; }
@media (max-width: 767px) {
    html.rg .rg-roleta { grid-template-columns: 100px minmax(0, 1fr); gap: 12px; padding: 14px 16px; border-radius: 18px; }
}

/* =====================================================================
   BICHÃO - fluxo em passos (bichao/fluxo.blade.php, só no layout novo)
   ===================================================================== */
html.rg .rg-bx {
    --rg-mod-0: var(--rg-lima); --rg-mod-1: var(--rg-gold); --rg-mod-2: var(--rg-violeta);
    --rg-mod-3: var(--rg-sky); --rg-mod-4: var(--rg-coral); --rg-mod-5: var(--rg-rosa);
    max-width: 1100px;
    margin: 18px auto 0;
    padding-bottom: 96px; /* espaço para a barra de navegação fixa */
}
html.rg .rg-bx h3 { margin: 0 0 6px; color: #fff; font-size: clamp(1.15rem, 1rem + .7vw, 1.5rem) !important; }
html.rg .rg-bx h4 { color: #fff; font-size: 1rem; margin: 0 0 8px; }
html.rg .rg-bx-topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; margin-bottom: 14px; }
html.rg .rg-bx-topo h2 { margin: 0; color: #fff; font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.2rem) !important; }
html.rg .rg-bx-sobre { color: var(--rg-gold); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-bx-completo { color: var(--rg-ink-3) !important; font-size: .85rem; font-weight: 700; text-decoration: underline; }
html.rg .rg-bx-ajuda { color: var(--rg-ink-2); margin: 0 0 14px; }

/* indicador de passos */
html.rg .rg-bx-passos { display: flex; gap: 6px; list-style: none; margin: 0 0 18px; padding: 0; }
html.rg .rg-bx-passos li {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 14px;
    background: var(--rg-surface);
    border: 1px solid var(--rg-glass-borda);
    color: var(--rg-ink-3);
    font-size: .88rem;
}
html.rg .rg-bx-passos li span {
    display: inline-flex; align-items: center; justify-content: center; flex: none;
    width: 26px; height: 26px; border-radius: 8px;
    background: var(--rg-surface-2); color: var(--rg-ink-2);
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: .8rem;
}
html.rg .rg-bx-passos li.feito { color: var(--rg-ink-2); }
html.rg .rg-bx-passos li.feito span { background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-bx-passos li.atual { border-color: var(--rg-lima); color: #fff; box-shadow: 0 0 0 3px color-mix(in srgb, var(--rg-lima) 15%, transparent); }
html.rg .rg-bx-passos li.atual span { background: var(--rg-tinta); color: var(--rg-lima-texto); box-shadow: inset 0 0 0 2px var(--rg-lima); }

html.rg .rg-bx-passo {
    padding: 22px;
    border-radius: 24px;
    background: var(--rg-surface);
    border: 1px solid var(--rg-glass-borda);
    box-shadow: var(--rg-shadow);
    animation: rg-rise .25s ease-out both;
}

html.rg .rg-bx-sub { margin-top: 12px; }
html.rg .rg-bx-sub h3::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 10px; border-radius: 3px; background: var(--rg-lima); vertical-align: middle; }

/* 1. modalidades */
html.rg .rg-bx-mods { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; margin-top: 10px; }
html.rg .rg-bx-mod {
    display: flex; flex-direction: column; gap: 6px; text-align: left;
    padding: 16px 16px 14px;
    border-radius: 18px;
    border: 2px solid transparent;
    background: var(--rg-surface-2);
    box-shadow: inset 0 4px 0 var(--rg-mod-cor);
    color: #fff;
    cursor: pointer;
    transition: transform .15s ease, border-color .15s ease, background-color .15s ease;
}
html.rg .rg-bx-mod:hover { transform: translateY(-2px); background: var(--rg-surface-3); }
html.rg .rg-bx-mod.ativo { border-color: var(--rg-mod-cor); background: color-mix(in srgb, var(--rg-mod-cor) 16%, var(--rg-surface-2)); }
html.rg .rg-bx-mod-nome { font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.05rem; }
html.rg .rg-bx-mod-desc { color: var(--rg-ink-2); font-size: .88rem; line-height: 1.35; flex: 1; }
html.rg .rg-bx-mod-rodape { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 4px; font-size: .78rem; color: var(--rg-ink-3); }
html.rg .rg-bx-mod-rodape b { padding: 3px 9px; border-radius: 999px; background: var(--rg-mod-cor); color: var(--rg-tinta); font-weight: 800; white-space: nowrap; }

/* 2. palpite: números */
html.rg .rg-bx-entrada { display: grid; gap: 14px; justify-items: center; margin: 6px 0 16px; }
html.rg .rg-bx-campos { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center; }
html.rg .rg-bx-campo {
    height: 74px;
    border-radius: 18px;
    border: 2px solid var(--rg-line-2) !important;
    background: var(--rg-bg) !important;
    color: #fff !important;
    text-align: center;
    font-family: var(--rg-font-display) !important;
    font-size: 2.2rem;
    font-weight: 800;
    letter-spacing: .25em;
    outline: none;
}
html.rg .rg-bx-campo:focus { border-color: var(--rg-lima) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 20%, transparent); }
html.rg .rg-bx-campo::placeholder { color: rgba(255, 255, 255, .18); }
html.rg .rg-bx-campo-unico { width: min(100%, calc(var(--rg-digitos) * 1.15em + 1.4em)); padding: 0 .4em 0 .65em; }
html.rg .rg-bx-campo-par { width: 2.9em; padding-left: .25em; }
html.rg .rg-bx-sep { color: var(--rg-ink-3); font-size: 1.6rem; font-weight: 800; }
html.rg .rg-bx-acoes-palpite { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }

/* 2. palpite: bichos */
html.rg .rg-bx-bichos { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px; margin: 6px 0 16px; }
html.rg .rg-bx-bicho {
    position: relative;
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    padding: 10px 6px 8px;
    border-radius: 16px;
    border: 2px solid transparent;
    background: var(--rg-surface-2);
    color: #fff;
    cursor: pointer;
    transition: transform .15s ease, border-color .15s ease, background-color .15s ease;
}
html.rg .rg-bx-bicho:hover { transform: translateY(-2px); }
html.rg .rg-bx-bicho img { width: 62px; height: 62px; object-fit: contain; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .35)); }
html.rg .rg-bx-bicho b { font-size: .9rem; }
html.rg .rg-bx-bicho small { color: var(--rg-ink-3); font-size: .7rem; letter-spacing: .02em; }
html.rg .rg-bx-bicho-num {
    position: absolute; top: 6px; left: 6px;
    padding: 1px 7px; border-radius: 8px;
    background: var(--rg-bg); color: var(--rg-gold);
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: .7rem;
}
html.rg .rg-bx-bicho.ativo { border-color: var(--rg-lima); background: color-mix(in srgb, var(--rg-lima) 18%, var(--rg-surface-2)); animation: rg-pop .3s ease both; }
html.rg .rg-bx-bicho.ativo::after {
    content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900;
    position: absolute; top: 6px; right: 6px;
    width: 22px; height: 22px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--rg-lima); color: var(--rg-on-lima); font-size: .7rem;
}

/* lista de palpites */
html.rg .rg-bx-palpites-caixa { padding: 14px 16px; border-radius: 18px; background: var(--rg-bg); }
html.rg .rg-bx-palpites-topo { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; color: #fff; }
html.rg .rg-bx-palpites { display: flex; flex-wrap: wrap; gap: 8px; }
html.rg .rg-bx-chip {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 7px 8px 7px 14px;
    border-radius: 999px;
    background: var(--rg-gold); color: var(--rg-tinta);
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: .9rem;
    animation: rg-pop .25s ease both;
}
html.rg .rg-bx-chip button {
    width: 24px; height: 24px; border-radius: 50%; border: 0;
    background: rgba(20, 16, 46, .2); color: var(--rg-tinta);
    font-size: 1rem; line-height: 1; cursor: pointer;
}
html.rg .rg-bx-montando { color: var(--rg-lima-texto); font-weight: 700; font-size: .9rem; align-self: center; }
html.rg .rg-bx-vazio { color: var(--rg-ink-3); font-size: .9rem; }
html.rg .rg-bx-link { background: none; border: 0; color: var(--rg-coral); font-weight: 700; cursor: pointer; padding: 0; }

/* 3. prêmios */
html.rg .rg-bx-premios-livre { display: flex; flex-wrap: wrap; gap: 10px; }
html.rg .rg-bx-premio {
    min-width: 76px; padding: 16px 18px;
    border-radius: 16px; border: 2px solid var(--rg-line-2);
    background: var(--rg-surface-2); color: #fff;
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.2rem;
    cursor: pointer; transition: transform .12s ease;
}
html.rg .rg-bx-premio:active { transform: scale(.96); }
html.rg .rg-bx-premio.ativo { background: var(--rg-lima); border-color: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-bx-premio-todos { flex: 1 1 160px; }
html.rg .rg-bx-dica { margin: 14px 0 0; color: var(--rg-ink-3); font-size: .88rem; }
html.rg .rg-bx-opcoes { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
html.rg .rg-bx-opcao {
    display: flex; flex-direction: column; gap: 4px; align-items: flex-start;
    padding: 18px; border-radius: 18px; border: 2px solid var(--rg-line-2);
    background: var(--rg-surface-2); color: #fff; cursor: pointer;
}
html.rg .rg-bx-opcao b { font-family: var(--rg-font-display) !important; font-size: 1.15rem; }
html.rg .rg-bx-opcao span { color: var(--rg-gold); font-weight: 800; }
html.rg .rg-bx-opcao.ativo { border-color: var(--rg-lima); background: color-mix(in srgb, var(--rg-lima) 16%, var(--rg-surface-2)); }
html.rg .rg-bx-fixo { padding: 16px; border-radius: 16px; background: var(--rg-bg); color: var(--rg-ink-2); }
html.rg .rg-bx-fixo i { color: var(--rg-lima-texto); margin-right: 6px; }

/* 4. valor */
html.rg .rg-bx-valores { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
html.rg .rg-bx-valor-rapido {
    padding: 14px 6px; border-radius: 16px; border: 2px solid var(--rg-line-2);
    background: var(--rg-surface-2); color: #fff;
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.05rem; cursor: pointer;
}
html.rg .rg-bx-valor-rapido.ativo { background: var(--rg-gold); border-color: var(--rg-gold); color: var(--rg-tinta); }
html.rg .rg-bx-valor-campo {
    display: flex; align-items: center; gap: 8px;
    padding: 0 18px; border-radius: 18px; border: 2px solid var(--rg-line-2);
    background: var(--rg-bg);
}
html.rg .rg-bx-valor-campo:focus-within { border-color: var(--rg-lima); }
html.rg .rg-bx-valor-campo span { color: var(--rg-ink-3); font-weight: 800; font-size: 1.3rem; }
html.rg .rg-bx-valor-campo input {
    flex: 1; min-width: 0; height: 64px; border: 0 !important; background: transparent !important; box-shadow: none !important;
    color: #fff !important; font-family: var(--rg-font-display) !important; font-size: 1.8rem; font-weight: 800; outline: none;
}
html.rg .rg-bx-ganho {
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    margin: 16px 0 12px; padding: 18px; border-radius: 20px;
    background: linear-gradient(135deg, #7c3aed, #c026d3); text-align: center;
}
html.rg .rg-bx-ganho span { color: rgba(255, 255, 255, .85); font-weight: 700; font-size: .9rem; }
html.rg .rg-bx-ganho b { color: #fff; font-family: var(--rg-font-display) !important; font-size: clamp(1.8rem, 1.3rem + 2vw, 2.6rem); line-height: 1.1; }
html.rg .rg-bx-ganho small { color: var(--rg-gold); font-weight: 700; min-height: 1.2em; }
html.rg .rg-bx-mais { margin: 6px 0 12px; color: var(--rg-ink-2); }
html.rg .rg-bx-mais summary { cursor: pointer; font-weight: 700; color: var(--rg-lima-texto); }
html.rg .rg-bx-teimosinha { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
html.rg .rg-bx-teimosinha b { min-width: 28px; text-align: center; color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.3rem; }
html.rg .rg-bx-passo-btn {
    width: 42px; height: 42px; border-radius: 12px; border: 2px solid var(--rg-line-2);
    background: var(--rg-surface-2); color: #fff; font-size: 1.3rem; font-weight: 800; cursor: pointer;
}
html.rg .rg-bx-cliente { margin-top: 14px; padding: 16px; border-radius: 18px; background: var(--rg-bg); }

/* 5. revisão */
html.rg .rg-bx-revisao { display: grid; gap: 2px; margin: 10px 0 14px; }
html.rg .rg-bx-rev-linha { display: flex; justify-content: space-between; gap: 16px; padding: 12px 4px; border-bottom: 1px solid var(--rg-line); }
html.rg .rg-bx-rev-linha span { color: var(--rg-ink-3); }
html.rg .rg-bx-rev-linha b { color: #fff; text-align: right; }
html.rg .rg-bx-rev-destaque { display: flex; flex-direction: column; align-items: center; margin-top: 12px; padding: 16px; border-radius: 18px; background: linear-gradient(135deg, #7c3aed, #c026d3); }
html.rg .rg-bx-rev-destaque span { color: rgba(255, 255, 255, .85); font-weight: 700; }
html.rg .rg-bx-rev-destaque b { color: #fff; font-family: var(--rg-font-display) !important; font-size: 2rem; }
html.rg .rg-bx-rev-destaque small { color: var(--rg-gold); font-weight: 700; }
html.rg .rg-bx-rev-total { display: flex; justify-content: space-between; align-items: center; padding: 14px 4px 0; }
html.rg .rg-bx-rev-total span { color: var(--rg-ink-2); font-weight: 700; }
html.rg .rg-bx-rev-total b { color: var(--rg-gold); font-family: var(--rg-font-display) !important; font-size: 1.5rem; }

/* botões e barra de navegação */
html.rg .rg-bx-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 13px 22px; border-radius: 14px; border: 2px solid transparent;
    font-weight: 800; font-size: 1rem; cursor: pointer;
    transition: transform .12s ease, filter .15s ease, opacity .15s ease;
}
html.rg .rg-bx-btn:active:not(:disabled) { transform: scale(.97); }
html.rg .rg-bx-btn:disabled { opacity: .45; cursor: not-allowed; }
html.rg .rg-bx-btn-lima { background: var(--rg-lima); color: var(--rg-on-lima); box-shadow: 0 8px 20px color-mix(in srgb, var(--rg-lima) 25%, transparent); }
html.rg .rg-bx-btn-contorno { background: transparent; color: #fff; border-color: var(--rg-line-2); }
html.rg .rg-bx-nav {
    position: sticky; bottom: 12px; z-index: 5;
    display: flex; align-items: center; gap: 12px;
    margin-top: 16px; padding: 12px;
    border-radius: 20px;
    background: rgba(23, 14, 61, .94);
    border: 1px solid var(--rg-line-2);
    box-shadow: var(--rg-shadow-lg);
}
html.rg .rg-bx-nav-resumo { flex: 1; min-width: 0; color: var(--rg-ink-2); font-size: .9rem; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-bx-nav #rg-bx-continuar { min-width: 160px; }

@media (max-width: 767px) {
    html.rg .rg-bx { margin-top: 10px; }
    html.rg .rg-bx-passo { padding: 16px; border-radius: 20px; }
    html.rg .rg-bx-passos li { padding: 8px; justify-content: center; }
    html.rg .rg-bx-passos li b { display: none; }
    html.rg .rg-bx-passos li.atual b { display: inline; }
    html.rg .rg-bx-mods { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-bx-bichos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    html.rg .rg-bx-bicho img { width: 50px; height: 50px; }
    html.rg .rg-bx-campo { height: 64px; font-size: 1.8rem; }
    /* acima dos botões flutuantes do menu (esquerda) e do chat (direita) */
    /* fixa na tela, acima dos botões flutuantes do menu (esquerda) e do chat (direita) */
    html.rg .rg-bx-nav { position: fixed; left: 12px; right: 12px; bottom: 84px; margin: 0; padding: 10px; padding-left: var(--rg-fab-folga, 10px); z-index: 1040; }
    html.rg .rg-bx { padding-bottom: 180px; }
    html.rg .rg-bx-nav-resumo { display: none; }
    html.rg .rg-bx-nav .rg-bx-btn { flex: 1; padding: 13px 10px; font-size: .95rem; white-space: nowrap; }
    html.rg .rg-bx-valor-rapido { font-size: .95rem; white-space: nowrap; padding: 14px 2px; }
    html.rg .rg-bx-nav #rg-bx-continuar { min-width: 0; flex: 2; }
}

/* =====================================================================
   LOTERIAS - tela de jogo nova (bets/game/fluxo.blade.php, só no layout novo)
   ===================================================================== */
html.rg .rg-lj { max-width: 1080px; margin: 14px auto 0; padding-bottom: 120px; }
html.rg .rg-lj-topo {
    display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
    padding: 18px 20px; border-radius: 26px;
    background:
        radial-gradient(140% 160% at 0% 0%, color-mix(in srgb, var(--rg-lj-cor) 55%, transparent), transparent 55%),
        radial-gradient(100% 140% at 100% 100%, rgba(255, 95, 162, .18), transparent 60%),
        var(--rg-surface);
    border: 1px solid var(--rg-glass-borda);
    box-shadow: var(--rg-shadow);
}
html.rg .rg-lj-topo-img { width: 76px; height: auto; aspect-ratio: 165 / 192; border-radius: 18px; object-fit: cover; flex: none; box-shadow: 0 10px 24px rgba(0, 0, 0, .4); }
html.rg .rg-lj-topo-texto { flex: 1; min-width: 180px; }
html.rg .rg-lj-topo h1 { margin: 0; color: #fff; font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem) !important; line-height: 1.05; }
html.rg .rg-lj-topo p { margin: 6px 0 0; color: var(--rg-ink-2); font-weight: 600; }
html.rg .rg-lj-topo p b { color: var(--rg-gold); font-family: var(--rg-font-display) !important; font-variant-numeric: tabular-nums; }
html.rg .rg-lj-topo-links { display: flex; gap: 8px; flex-wrap: wrap; }
html.rg .rg-lj-topo-links a {
    padding: 8px 12px; border-radius: 12px; background: rgba(0, 0, 0, .25); border: 1px solid var(--rg-line-2);
    color: #fff !important; font-weight: 700; font-size: .85rem; text-decoration: none !important;
}
/* "Vários jogos" em destaque (o "Modo completo" fica discreto) */
html.rg .rg-lj-topo-links a:first-child {
    padding: 11px 18px; border: 0;
    background: var(--rg-gold); color: var(--rg-tinta) !important;
    font-size: .95rem; font-weight: 800;
    box-shadow: 0 8px 20px rgba(245, 197, 66, .35);
    animation: rg-chamar 2.6s ease-in-out infinite;
}
html.rg .rg-lj-topo-links a:first-child:hover { filter: brightness(1.06); }
html.rg .rg-lj-topo-links a:not(:first-child) { background: transparent; border-color: transparent; color: var(--rg-ink-3) !important; text-decoration: underline !important; font-weight: 600; }
@keyframes rg-chamar { 0%, 100% { transform: none; } 50% { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(245, 197, 66, .5); } }

/* "Apostar para": caixa com borda na cor de destaque e campo de busca grande */
html.rg .rg-lj-cliente {
    background: color-mix(in srgb, var(--rg-sky) 10%, var(--rg-bg));
    border: 2px solid var(--rg-sky);
    box-shadow: 0 0 0 4px rgba(124, 198, 247, .12);
}
html.rg .rg-lj-cliente .rg-lj-rotulo { color: var(--rg-sky); font-size: .85rem; }
html.rg .rg-lj-cliente .rg-lj-rotulo::before { content: "\f007"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 8px; }
html.rg .rg-lj-cliente .input-group { margin: 0 !important; }
html.rg .rg-lj-cliente .row > [class*="col-"] { margin-top: 0 !important; }
html.rg .rg-lj-cliente .rg-lj-rotulo { margin-bottom: 10px; }
html.rg .rg-lj-cliente .row > .col-md-12:first-child { margin-bottom: 0 !important; }
html.rg .rg-lj-cliente #author {
    height: 56px; font-size: 1.1rem !important; font-weight: 700;
    background: #fff !important; color: var(--rg-tinta) !important;
    border: 0 !important; border-radius: 14px 0 0 14px !important;
}
html.rg .rg-lj-cliente #author::placeholder { color: #6b6890 !important; }
html.rg .rg-lj-cliente .input-group-text {
    height: 56px; padding: 0 18px; border: 0 !important; border-radius: 0 14px 14px 0 !important;
    background: var(--rg-sky) !important; color: var(--rg-tinta) !important; cursor: pointer;
}
html.rg .rg-lj-cliente .list-group { margin-top: 8px; border-radius: 14px; overflow: hidden; }
html.rg .rg-lj-cliente .list-group-item { background: var(--rg-surface-2); color: #fff; border-color: var(--rg-line); }
html.rg .rg-lj-cliente .list-group-item:hover { background: var(--rg-sky); color: var(--rg-tinta); }

html.rg .rg-lj-alerta {
    display: flex; gap: 12px; align-items: flex-start; margin-top: 12px; padding: 14px 16px; border-radius: 18px;
    background: rgba(248, 113, 113, .15); border: 1px solid rgba(248, 113, 113, .5); color: #fff;
}
html.rg .rg-lj-alerta i { color: var(--rg-coral); font-size: 1.3rem; margin-top: 2px; }
html.rg .rg-lj-alerta div { display: flex; flex-direction: column; gap: 2px; }
html.rg .rg-lj-alerta span { color: var(--rg-ink-2); }
html.rg .rg-lj-editando {
    display: flex; gap: 12px; align-items: center; margin-top: 12px; padding: 12px 16px; border-radius: 18px;
    background: rgba(56, 189, 248, .12); border: 1px solid rgba(56, 189, 248, .5); color: #fff;
}
html.rg .rg-lj-editando > i { color: var(--rg-sky); font-size: 1.1rem; }
html.rg .rg-lj-editando div { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
html.rg .rg-lj-editando span { color: var(--rg-ink-2); font-size: .88rem; }
html.rg .rg-lj-editando a { flex-shrink: 0; padding: 8px 14px; border-radius: 12px; border: 1px solid var(--rg-line-2); color: #fff !important; font-weight: 700; text-decoration: none !important; }
html.rg .rg-lj-fechado { margin-top: 16px; padding: 40px 20px; border-radius: 26px; background: var(--rg-surface); text-align: center; }
html.rg .rg-lj-fechado i { font-size: 3rem; color: var(--rg-coral); }
html.rg .rg-lj-fechado h2 { color: #fff; margin: 12px 0 6px; }
html.rg .rg-lj-fechado p { color: var(--rg-ink-2); margin-bottom: 18px; }

html.rg .rg-lj-palco { margin-top: 14px; }
html.rg .rg-lj-passo {
    padding: 22px; border-radius: 26px; background: var(--rg-surface);
    border: 1px solid var(--rg-glass-borda); box-shadow: var(--rg-shadow);
    animation: rg-rise .25s ease-out both;
}
html.rg .rg-lj-passo h2 { margin: 0; color: #fff; font-size: clamp(1.3rem, 1.05rem + 1vw, 1.8rem) !important; }
html.rg .rg-lj-rotulo { display: block; margin-bottom: 8px; color: var(--rg-ink-3); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
html.rg .rg-lj-cliente { margin-bottom: 18px; padding: 14px 16px; border-radius: 18px; background: var(--rg-bg); }
html.rg .rg-lj-cliente-fixo { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #fff; font-size: 1.05rem; }
html.rg .rg-lj-link { background: none; border: 0; padding: 0; color: var(--rg-lima-texto); font-weight: 800; cursor: pointer; }

/* anel de progresso + quantidade */
html.rg .rg-lj-meta { display: flex; gap: 20px; align-items: center; margin-bottom: 18px; }
html.rg .rg-lj-anel { position: relative; flex: none; width: 120px; height: 120px; }
html.rg .rg-lj-anel svg { width: 100%; height: 100%; transform: rotate(-90deg); }
html.rg .rg-lj-anel circle { fill: none; stroke-width: 12; }
html.rg .rg-lj-anel-fundo { stroke: var(--rg-bg); }
html.rg .rg-lj-anel-valor { stroke: var(--rg-gold); stroke-linecap: round; transition: stroke-dashoffset .35s cubic-bezier(.2, .9, .3, 1.1), stroke .2s ease; }
html.rg .rg-lj-anel.festa { animation: rg-lj-festa .9s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes rg-lj-festa { 0% { transform: scale(1); } 35% { transform: scale(1.18) rotate(-6deg); } 65% { transform: scale(.96) rotate(3deg); } 100% { transform: scale(1); } }
html.rg .rg-lj-anel.ok .rg-lj-anel-valor { stroke: var(--rg-lima); filter: drop-shadow(0 0 8px color-mix(in srgb, var(--rg-lima) 60%, transparent)); }
html.rg .rg-lj-anel-texto { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
html.rg .rg-lj-anel-texto b { color: #fff; font-family: var(--rg-font-display) !important; font-size: 2.2rem; line-height: 1; }
html.rg .rg-lj-anel-texto span { color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; }
html.rg .rg-lj-meta-texto { flex: 1; min-width: 0; }
html.rg .rg-lj-meta-texto p { margin: 4px 0 10px; color: var(--rg-ink-2); }
html.rg .rg-lj-qtds { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
html.rg .rg-lj-rotulo-sorte { color: var(--rg-rosa); margin: 6px 0 8px; text-transform: none; letter-spacing: 0; font-size: .9rem; }
html.rg .rg-lj-rotulo-sorte i { margin-right: 6px; }
html.rg .rg-lj-qtd { transition: transform .12s ease, background-color .15s ease; }
html.rg .rg-lj-qtd:hover { border-color: var(--rg-rosa); color: #fff; transform: translateY(-2px); }
html.rg .rg-lj-qtd:active { transform: scale(.94); }
html.rg .rg-lj-qtd {
    min-width: 42px; padding: 7px 10px; border-radius: 12px; border: 2px solid var(--rg-line-2);
    background: var(--rg-surface-2); color: var(--rg-ink-2); font-family: var(--rg-font-display) !important; font-weight: 800; cursor: pointer;
}
html.rg .rg-lj-qtd.ativo { border-color: var(--rg-gold); color: var(--rg-gold); background: rgba(245, 197, 66, .12); }
html.rg .rg-lj-acoes-num { display: flex; gap: 16px; align-items: center; }

/* grade de números em bolinhas */
html.rg .rg-lj-grade { display: grid; grid-template-columns: repeat(var(--rg-lj-colunas), minmax(0, 72px)); justify-content: center; gap: 10px; }
html.rg .rg-lj-num {
    aspect-ratio: 1; border-radius: 50%; border: 2px solid var(--rg-line-2);
    background: var(--rg-surface-2); color: #fff;
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(.85rem, .6rem + .8vw, 1.25rem);
    cursor: pointer; touch-action: manipulation;
    transition: transform .12s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
html.rg .rg-lj-num:hover:not(:disabled) { border-color: var(--rg-lima); transform: translateY(-2px); }
html.rg .rg-lj-num:disabled { opacity: .35; cursor: not-allowed; }
html.rg .rg-lj-num.ativo {
    background: radial-gradient(circle at 35% 30%, var(--rg-lima-claro), var(--rg-lima) 55%, var(--rg-lima-escuro));
    border-color: transparent; color: var(--rg-on-lima);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--rg-lima) 35%, transparent), inset 0 -3px 0 rgba(0, 0, 0, .15);
}
html.rg .rg-lj-num.pulo { animation: rg-pop .35s cubic-bezier(.2, 1.4, .4, 1) both; }

/* valor */
html.rg .rg-lj-sub { color: var(--rg-ink-2); margin: 6px 0 14px; }
html.rg .rg-lj-valores { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
html.rg .rg-lj-valor {
    padding: 14px 4px; border-radius: 16px; border: 2px solid var(--rg-line-2); background: var(--rg-surface-2);
    color: #fff; font-family: var(--rg-font-display) !important; font-weight: 800; cursor: pointer; white-space: nowrap;
}
html.rg .rg-lj-valor.ativo { background: var(--rg-gold); border-color: var(--rg-gold); color: var(--rg-tinta); }
html.rg .rg-lj-campo { display: flex; align-items: center; gap: 8px; padding: 0 18px; border-radius: 18px; border: 2px solid var(--rg-line-2); background: var(--rg-bg); }
html.rg .rg-lj-campo:focus-within { border-color: var(--rg-lima); }
html.rg .rg-lj-campo span { color: var(--rg-ink-3); font-weight: 800; font-size: 1.3rem; }
html.rg .rg-lj-campo input { flex: 1; min-width: 0; height: 62px; border: 0 !important; background: transparent !important; box-shadow: none !important; color: #fff !important; font-family: var(--rg-font-display) !important; font-size: 1.8rem; font-weight: 800; outline: none; }
html.rg .rg-lj-premio {
    display: flex; flex-direction: column; align-items: center; gap: 2px; margin: 14px 0; padding: 18px; border-radius: 22px;
    background: linear-gradient(135deg, #7c3aed, #c026d3); text-align: center;
}
html.rg .rg-lj-premio span { color: rgba(255, 255, 255, .85); font-weight: 700; }
html.rg .rg-lj-premio b { color: #fff; font-family: var(--rg-font-display) !important; font-size: clamp(1.9rem, 1.3rem + 2.4vw, 2.8rem); line-height: 1.1; }
html.rg .rg-lj-premio small { color: var(--rg-gold); font-weight: 700; min-height: 1.2em; }
html.rg .rg-lj-teim-op { display: flex; gap: 6px; flex-wrap: wrap; }
html.rg .rg-lj-teim-btn { padding: 8px 12px; border-radius: 12px; border: 2px solid var(--rg-line-2); background: var(--rg-surface-2); color: var(--rg-ink-2); font-weight: 800; cursor: pointer; }
html.rg .rg-lj-teim-btn.ativo { border-color: var(--rg-lima); color: var(--rg-on-lima); background: var(--rg-lima); }

/* conferir: bilhete */
html.rg .rg-lj-bilhete {
    position: relative; max-width: 560px; margin: 0 auto; border-radius: 24px; overflow: hidden;
    background: var(--rg-bg); border: 1px solid var(--rg-line-2);
}
html.rg .rg-lj-bilhete-topo {
    display: flex; justify-content: space-between; gap: 10px; padding: 14px 18px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--rg-lj-cor) 80%, #000), var(--rg-violeta));
    color: #fff; font-weight: 800;
}
html.rg .rg-lj-bilhete-nums { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; padding: 18px; border-bottom: 2px dashed var(--rg-line-2); }
html.rg .rg-lj-bilhete-nums span {
    display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, var(--rg-lima-claro), var(--rg-lima) 55%, var(--rg-lima-escuro)); color: var(--rg-on-lima);
    font-family: var(--rg-font-display) !important; font-weight: 800;
}
html.rg .rg-lj-bilhete-linhas { padding: 6px 18px; }
html.rg .rg-lj-bilhete-linhas > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--rg-line); }
html.rg .rg-lj-bilhete-linhas span { color: var(--rg-ink-3); }
html.rg .rg-lj-bilhete-linhas b { color: #fff; text-align: right; }
html.rg .rg-lj-bilhete-total b { color: var(--rg-gold) !important; font-family: var(--rg-font-display) !important; font-size: 1.25rem; }
html.rg .rg-lj-bilhete-premio { display: flex; flex-direction: column; align-items: center; padding: 16px; background: linear-gradient(135deg, #7c3aed, #c026d3); }
html.rg .rg-lj-bilhete-premio span { color: rgba(255, 255, 255, .85); font-weight: 700; }
html.rg .rg-lj-bilhete-premio b { color: #fff; font-family: var(--rg-font-display) !important; font-size: 2rem; }
html.rg .rg-lj-carrinho-link {
    display: flex; align-items: center; gap: 14px; flex: 0 0 100%; width: 100%; margin: 0; padding: 12px 16px;
    border: 0; border-radius: 16px; cursor: pointer; text-align: left; color: #fff;
    background: linear-gradient(135deg, var(--rg-rosa), var(--rg-violeta));
    box-shadow: 0 10px 24px rgba(236, 72, 153, .35), inset 0 -3px 0 rgba(0, 0, 0, .18);
    transition: transform .12s, filter .12s;
}
html.rg .rg-lj-carrinho-link:hover { filter: brightness(1.08); }
html.rg .rg-lj-carrinho-link:active { transform: scale(.98); }
html.rg .rg-lj-carrinho-link > i:first-child {
    flex: 0 0 44px; height: 44px; border-radius: 12px; display: grid; place-items: center;
    background: rgba(255, 255, 255, .2); font-size: 1.2rem; animation: rg-lj-carrinho-pula 2.4s ease-in-out infinite;
}
html.rg .rg-lj-carrinho-link span { flex: 1; display: flex; flex-direction: column; min-width: 0; }
html.rg .rg-lj-carrinho-link b { font-size: 1rem; font-weight: 800; line-height: 1.2; }
html.rg .rg-lj-carrinho-link small { font-size: .78rem; opacity: .85; font-weight: 600; }
html.rg .rg-lj-carrinho-link > i:last-child { opacity: .8; }
@keyframes rg-lj-carrinho-pula { 0%, 80%, 100% { transform: none; } 88% { transform: translateY(-3px) rotate(-8deg); } 94% { transform: translateY(0) rotate(4deg); } }
@media (max-width: 575px) { html.rg .rg-lj-carrinho-link { padding: 12px 14px; gap: 10px; } html.rg .rg-lj-carrinho-link b { font-size: .9rem; } }
html.rg .rg-lj-carrinho-link[hidden] { display: none; }
html.rg .rg-lj-barra:has(.rg-lj-carrinho-link:not([hidden])) { flex-wrap: wrap; row-gap: 10px; }
@media (max-width: 767px) {
    html.rg .rg-lj-carrinho-link { padding: 10px 12px; }
    html.rg .rg-lj-carrinho-link > i:first-child { flex-basis: 38px; height: 38px; font-size: 1.05rem; }
    html.rg .rg-lj-carrinho-link small { display: none; }
}
html.rg .rg-lj-ir-carrinho {
    position: fixed; top: 92px; right: 20px; z-index: 1036; padding: 10px 16px; border-radius: 14px;
    background: var(--rg-gold); color: var(--rg-tinta) !important; font-weight: 800; text-decoration: none !important;
    box-shadow: var(--rg-shadow-lg); animation: rg-pop .35s ease both;
}

/* barra de ação */
html.rg .rg-lj-barra {
    position: sticky; bottom: 14px; z-index: 6; margin-right: 84px;
    display: flex; align-items: center; gap: 14px; margin-top: 14px; padding: 12px 12px 12px 18px;
    border-radius: 22px; background: rgba(23, 14, 61, .96); border: 1px solid var(--rg-line-2);
    box-shadow: inset 0 3px 0 var(--rg-violeta), var(--rg-shadow-lg);
}
html.rg .rg-lj-barra.pronto { box-shadow: inset 0 3px 0 var(--rg-lima), var(--rg-shadow-lg); }
html.rg .rg-lj-barra-passos { flex: 1; display: flex; gap: 14px; color: var(--rg-ink-3); font-weight: 700; font-size: .9rem; }
html.rg .rg-lj-barra-passos span { display: inline-flex; align-items: center; gap: 6px; }
html.rg .rg-lj-barra-passos i {
    display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 7px;
    background: var(--rg-surface-2); font-style: normal; font-size: .75rem; font-family: var(--rg-font-display) !important;
}
html.rg .rg-lj-barra-passos .feito { color: var(--rg-ink-2); }
html.rg .rg-lj-barra-passos .feito i { background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-lj-barra-passos .atual { color: #fff; }
html.rg .rg-lj-barra-passos .atual i { background: var(--rg-tinta); color: var(--rg-lima-texto); box-shadow: inset 0 0 0 2px var(--rg-lima); }
html.rg .rg-lj-barra-botoes { display: flex; gap: 8px; }
html.rg .rg-lj-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 13px 22px; border-radius: 14px; border: 2px solid transparent;
    font-weight: 800; font-size: 1rem; cursor: pointer; white-space: nowrap; text-decoration: none !important;
    transition: transform .12s ease, opacity .15s ease;
}
html.rg .rg-lj-btn:active:not(:disabled) { transform: scale(.97); }
html.rg .rg-lj-btn:disabled { opacity: .4; cursor: not-allowed; }
html.rg .rg-lj-btn-lima { background: var(--rg-lima); color: var(--rg-on-lima) !important; box-shadow: 0 8px 20px color-mix(in srgb, var(--rg-lima) 25%, transparent); }
html.rg .rg-lj-btn-contorno { background: transparent; color: #fff; border-color: var(--rg-line-2); }
html.rg .rg-lj-btn-sorte { background: linear-gradient(135deg, var(--rg-rosa), var(--rg-violeta)); color: #fff; padding: 11px 18px; }

@media (max-width: 767px) {
    html.rg .rg-lj { margin-top: 8px; padding-bottom: 190px; }
    html.rg .rg-lj-topo { padding: 14px; gap: 12px; border-radius: 22px; }
    html.rg .rg-lj-topo-img { width: 58px; height: auto; border-radius: 14px; }
    html.rg .rg-lj-topo-links { width: 100%; }
    html.rg .rg-lj-passo { padding: 16px; border-radius: 22px; }
    /* celular: anel + título lado a lado; surpresinha e botões descem para a largura toda */
    html.rg .rg-lj-meta { display: grid; grid-template-columns: 84px minmax(0, 1fr); column-gap: 14px; align-items: center; }
    html.rg .rg-lj-meta-texto { display: contents; }
    html.rg .rg-lj-anel { width: 84px; height: 84px; grid-row: span 2; }
    html.rg .rg-lj-meta-texto h2 { grid-column: 2; align-self: end; margin: 0; font-size: 1.3rem; }
    html.rg .rg-lj-meta-texto p { grid-column: 2; align-self: start; margin: 4px 0 0; font-size: .92rem; }
    html.rg .rg-lj-rotulo-sorte, html.rg .rg-lj-qtds, html.rg .rg-lj-acoes-num { grid-column: 1 / -1; }
    html.rg .rg-lj-rotulo-sorte { margin-top: 14px; }
    html.rg .rg-lj-acoes-num { flex-wrap: wrap; }
    html.rg .rg-lj-anel-texto b { font-size: 1.7rem; }
    html.rg .rg-lj-grade { grid-template-columns: repeat(min(var(--rg-lj-colunas), 5), minmax(0, 1fr)); gap: 7px; }
    html.rg .rg-lj-barra { margin-right: 0; }
    html.rg .rg-lj-num { font-size: 1.05rem; }
    html.rg .rg-lj-valores { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    /* barra fixa acima dos botões flutuantes do menu e do chat */
    html.rg .rg-lj-barra { position: fixed; left: 12px; right: 12px; bottom: 84px; margin: 0; padding: 10px; padding-left: var(--rg-fab-folga, 10px); z-index: 1040; }
    html.rg .rg-lj-barra-passos { display: none; }
    html.rg .rg-lj-barra-botoes { flex: 1; }
    html.rg .rg-lj-barra-botoes .rg-lj-btn { flex: 1; padding: 13px 8px; font-size: .95rem; }
    html.rg #rg-lj-continuar { flex: 2.2; }
    html.rg .rg-lj-ir-carrinho { top: auto; bottom: 160px; right: 12px; }
}

/* =====================================================================
   BILHETE - detalhe do jogo de loteria (bets/game/partials/bilhete-novo)
   ===================================================================== */
html.rg .rg-bt { max-width: 1080px; margin: 14px auto 18px; }
html.rg .rg-bt-topo {
    display: flex; align-items: center; gap: 16px; padding: 18px 20px; border-radius: 26px;
    background: radial-gradient(140% 160% at 0% 0%, color-mix(in srgb, var(--rg-bt-cor) 55%, transparent), transparent 55%), var(--rg-surface);
    border: 1px solid var(--rg-glass-borda); box-shadow: var(--rg-shadow);
}
html.rg .rg-bt-topo img { width: 76px; height: auto; aspect-ratio: 165 / 192; flex: none; border-radius: 18px; object-fit: cover; box-shadow: 0 10px 24px rgba(0, 0, 0, .4); }
html.rg .rg-bt-topo-texto { flex: 1; min-width: 0; }
html.rg .rg-bt-sobre { color: var(--rg-gold); font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-bt-topo h1 { margin: 2px 0 0; color: #fff; font-size: clamp(1.5rem, 1.1rem + 1.5vw, 2.2rem) !important; line-height: 1.05; }
html.rg .rg-bt-topo p { margin: 4px 0 0; color: var(--rg-ink-2); font-weight: 600; }
html.rg .rg-bt-nav { display: flex; gap: 8px; }
html.rg .rg-bt-nav a, html.rg .rg-bt-nav span {
    display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 14px;
    background: rgba(0, 0, 0, .3); border: 1px solid var(--rg-line-2); color: #fff !important; text-decoration: none !important;
}
html.rg .rg-bt-nav span { opacity: .3; }
html.rg .rg-bt-nav a:hover { background: var(--rg-lima); color: var(--rg-on-lima) !important; }

html.rg .rg-bt-status {
    display: flex; align-items: center; gap: 16px; margin-top: 12px; padding: 18px 20px; border-radius: 22px; color: var(--rg-tinta);
}
html.rg .rg-bt-status > i { font-size: 2rem; }
html.rg .rg-bt-status > div:not(.rg-bt-contagem) { flex: 1; display: flex; flex-direction: column; }
html.rg .rg-bt-status b { font-family: var(--rg-font-display) !important; font-size: clamp(1.2rem, 1rem + 1vw, 1.6rem); }
html.rg .rg-bt-status span { font-weight: 700; opacity: .85; }
html.rg .rg-bt-status-aguardando { background: linear-gradient(135deg, var(--rg-gold), #f59e0b); }
html.rg .rg-bt-status-ganhou { background: linear-gradient(135deg, var(--rg-lima), #22c55e); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 20%, transparent), 0 16px 40px color-mix(in srgb, var(--rg-lima) 30%, transparent); }
html.rg .rg-bt-status-analise { background: linear-gradient(135deg, var(--rg-sky), #38bdf8); }
html.rg .rg-bt-status-perdeu { background: var(--rg-surface-2); color: #fff; }
html.rg .rg-bt-status-perdeu > i { color: var(--rg-coral); }
html.rg .rg-bt-contagem { text-align: right; }
html.rg .rg-bt-contagem small { display: block; font-weight: 800; opacity: .75; }
html.rg .rg-bt-contagem b { font-variant-numeric: tabular-nums; }

html.rg .rg-bt-grade { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 12px; margin-top: 12px; align-items: start; }
html.rg .rg-bt-cartao, html.rg .rg-bt-lado {
    padding: 20px; border-radius: 24px; background: var(--rg-surface); border: 1px solid var(--rg-glass-borda); box-shadow: var(--rg-shadow);
}
html.rg .rg-bt-cartao-topo { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
html.rg .rg-bt-cartao h2 { margin: 0; color: #fff; font-size: 1.25rem !important; }
html.rg .rg-bt-cartao-topo span { color: var(--rg-ink-2); font-weight: 600; }
html.rg .rg-bt-cartao-topo b { color: var(--rg-lima-texto); }
html.rg .rg-bt-bolas { display: flex; flex-wrap: wrap; gap: 8px; }
html.rg .rg-bt-bola {
    display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%;
    background: var(--rg-surface-2); border: 2px solid var(--rg-line-2); color: #fff;
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.05rem;
}
html.rg .rg-bt-bola.acerto { background: radial-gradient(circle at 35% 30%, var(--rg-lima-claro), var(--rg-lima) 55%, var(--rg-lima-escuro)); border-color: transparent; color: var(--rg-on-lima); box-shadow: 0 6px 14px color-mix(in srgb, var(--rg-lima) 35%, transparent); }
html.rg .rg-bt-bola.errou { background: var(--rg-coral); border-color: transparent; color: var(--rg-tinta); }
html.rg .rg-bt-bolas-p .rg-bt-bola { width: 42px; height: 42px; font-size: .95rem; }
html.rg .rg-bt-sorteados { margin-top: 18px; padding-top: 16px; border-top: 2px dashed var(--rg-line-2); }
html.rg .rg-bt-sorteados h3 { margin: 0 0 10px; color: #fff; font-size: 1rem !important; font-family: var(--rg-font) !important; font-weight: 800; }
html.rg .rg-bt-legenda { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 12px 0 0; color: var(--rg-ink-3); font-size: .85rem; }
html.rg .rg-bt-legenda span { display: inline-block; width: 12px; height: 12px; border-radius: 50%; margin-left: 6px; }
html.rg .rg-bt-legenda .acerto { background: var(--rg-lima); }
html.rg .rg-bt-legenda .errou { background: var(--rg-coral); }

html.rg .rg-bt-valores { display: grid; gap: 8px; }
html.rg .rg-bt-valores > div { display: flex; flex-direction: column; padding: 14px 16px; border-radius: 18px; background: var(--rg-bg); }
html.rg .rg-bt-valores span { color: var(--rg-ink-3); font-weight: 700; font-size: .85rem; }
html.rg .rg-bt-valores b { color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.4rem; }
html.rg .rg-bt-valores .rg-bt-premio { background: linear-gradient(135deg, #7c3aed, #c026d3); }
html.rg .rg-bt-valores .rg-bt-premio span { color: rgba(255, 255, 255, .85); }
html.rg .rg-bt-valores .rg-bt-premio b { font-size: 1.8rem; }
html.rg .rg-bt-info { margin: 14px 0; }
html.rg .rg-bt-info > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--rg-line); }
html.rg .rg-bt-info dt { color: var(--rg-ink-3); font-weight: 600; }
html.rg .rg-bt-info dd { margin: 0; color: #fff; font-weight: 700; text-align: right; }
html.rg .rg-bt-acoes { display: grid; gap: 8px; }
html.rg .rg-bt-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
    padding: 13px 16px; border-radius: 14px; border: 2px solid transparent; font-weight: 800; cursor: pointer; text-decoration: none !important;
}
html.rg .rg-bt-btn-lima { background: var(--rg-lima); color: var(--rg-on-lima) !important; }
html.rg .rg-bt-btn-contorno { background: transparent; color: #fff !important; border-color: var(--rg-line-2); }
html.rg .rg-bt-btn-sorte { background: linear-gradient(135deg, var(--rg-rosa), var(--rg-violeta)); color: #fff !important; }

@media (max-width: 991px) { html.rg .rg-bt-grade { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
    html.rg .rg-bt-topo { padding: 14px; gap: 12px; }
    html.rg .rg-bt-topo img { width: 58px; height: auto; border-radius: 14px; }
    html.rg .rg-bt-nav a, html.rg .rg-bt-nav span { width: 40px; height: 40px; }
    html.rg .rg-bt-status { flex-wrap: wrap; padding: 14px 16px; }
    html.rg .rg-bt-contagem { width: 100%; text-align: left; }
    html.rg .rg-bt-cartao, html.rg .rg-bt-lado { padding: 16px; }
    html.rg .rg-bt-bola { width: 44px; height: 44px; font-size: .95rem; }
}

/* =====================================================================
   VER MINHAS APOSTAS (bets/game/partials/minhas-apostas-topo) + lista
   ===================================================================== */
html.rg .rg-ma { margin-bottom: 16px; }
html.rg .rg-ma-premio {
    display: flex; align-items: center; gap: 14px; margin-bottom: 12px; padding: 16px 18px; border-radius: 20px;
    background: linear-gradient(135deg, var(--rg-lima), #22c55e); color: var(--rg-on-lima);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 20%, transparent), 0 16px 40px color-mix(in srgb, var(--rg-lima) 30%, transparent); animation: rg-pop .5s ease both;
}
html.rg .rg-ma-premio > i { font-size: 1.8rem; }
html.rg .rg-ma-premio div { flex: 1; display: flex; flex-direction: column; }
html.rg .rg-ma-premio b { font-family: var(--rg-font-display) !important; font-size: 1.25rem; }
html.rg .rg-ma-premio-fechar { background: rgba(0, 0, 0, .15); border: 0; width: 34px; height: 34px; border-radius: 50%; font-size: 1.3rem; color: var(--rg-tinta); cursor: pointer; }
html.rg .rg-ma-hero {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
    padding: 22px 24px; border-radius: 26px;
    background: radial-gradient(120% 160% at 0% 0%, rgba(255, 95, 162, .35), transparent 55%), radial-gradient(120% 160% at 100% 100%, rgba(139, 92, 246, .45), transparent 60%), var(--rg-surface);
    border: 1px solid var(--rg-glass-borda); box-shadow: var(--rg-shadow);
}
html.rg .rg-ma-sobre { color: var(--rg-gold); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-ma-hero h1 { margin: 4px 0 0; color: #fff; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.3rem) !important; line-height: 1.1; }
html.rg .rg-ma-hero p { margin: 6px 0 0; color: var(--rg-ink-2); font-size: 1.05rem; }
html.rg .rg-ma-hero p b { color: var(--rg-lima-texto); font-family: var(--rg-font-display) !important; }
html.rg .rg-ma-contagem { display: flex; flex-direction: column; align-items: flex-end; padding: 12px 18px; border-radius: 18px; background: rgba(0, 0, 0, .3); }
html.rg .rg-ma-contagem span { color: var(--rg-ink-2); font-weight: 700; font-size: .85rem; }
html.rg .rg-ma-contagem b { color: var(--rg-gold); font-family: var(--rg-font-display) !important; font-size: 1.8rem; font-variant-numeric: tabular-nums; }
html.rg .rg-ma-contagem b.urgente { color: var(--rg-coral); animation: rg-pulse 1.2s ease-in-out infinite; }
html.rg .rg-ma-jogar { padding: 13px 20px; border-radius: 14px; background: var(--rg-lima); color: var(--rg-on-lima) !important; font-weight: 800; text-decoration: none !important; }

html.rg .rg-ma-numeros { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
html.rg .rg-ma-num { display: flex; flex-direction: column; padding: 14px 16px; border-radius: 18px; color: var(--rg-tinta); }
html.rg .rg-ma-num span { font-size: .78rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; opacity: .8; }
html.rg .rg-ma-num b { font-family: var(--rg-font-display) !important; font-size: clamp(1.2rem, 1rem + .9vw, 1.6rem); line-height: 1.15; }
html.rg .rg-ma-num small { font-weight: 700; opacity: .8; }
html.rg .rg-ma-num-1 { background: var(--rg-lima); }
html.rg .rg-ma-num-2 { background: var(--rg-gold); }
html.rg .rg-ma-num-3 { background: var(--rg-violeta); color: #fff; }
html.rg .rg-ma-num-4 { background: var(--rg-sky); }

html.rg .rg-ma-sorte { margin-top: 16px; }
html.rg .rg-ma-sorte h2 { margin: 0 0 10px; color: #fff; font-size: 1.2rem !important; }
html.rg .rg-ma-sorte h2 span { margin-left: 8px; color: var(--rg-ink-3); font-family: var(--rg-font) !important; font-size: .82rem; font-weight: 600; }
html.rg .rg-ma-sorte-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
html.rg .rg-ma-sorte-topo h2 { margin: 0; }
html.rg .rg-ma-setas { display: flex; gap: 6px; flex-shrink: 0; }
html.rg .rg-ma-setas[hidden] { display: none; }
html.rg .rg-ma-setas button {
    width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--rg-glass-borda); background: var(--rg-surface); color: #fff;
    display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background .15s ease, opacity .15s ease;
}
html.rg .rg-ma-setas button:hover:not(:disabled) { background: var(--rg-surface-2); }
html.rg .rg-ma-setas button:disabled { opacity: .35; cursor: default; }
/* carrossel: arrasta para o lado, com barrinha de rolagem visível */
html.rg .rg-ma-cards {
    display: flex; gap: 10px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
    padding: 4px 2px 12px; scrollbar-width: thin; scrollbar-color: var(--rg-lima) var(--rg-surface);
}
html.rg .rg-ma-cards::-webkit-scrollbar { height: 8px; }
html.rg .rg-ma-cards::-webkit-scrollbar-track { background: var(--rg-surface); border-radius: 999px; }
html.rg .rg-ma-cards::-webkit-scrollbar-thumb { background: var(--rg-lima); border-radius: 999px; }
html.rg .rg-ma-cards > .rg-ma-card { flex: 0 0 300px; scroll-snap-align: start; }
html.rg .rg-ma-card-mais { align-items: center; justify-content: center; text-align: center; cursor: pointer; color: var(--rg-ink-2); font: inherit; }
html.rg .rg-ma-card-mais b { color: var(--rg-lima-texto); font-family: var(--rg-font-display) !important; font-size: 2rem; }
html.rg .rg-ma-card {
    display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 20px; text-decoration: none !important;
    background: var(--rg-surface); border: 1px solid var(--rg-glass-borda); box-shadow: inset 0 4px 0 var(--rg-ma-cor), var(--rg-shadow);
    transition: transform .18s ease, border-color .18s ease;
}
html.rg .rg-ma-card:hover { transform: translateY(-3px); border-color: var(--rg-ma-cor); }
html.rg .rg-ma-card-topo { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
html.rg .rg-ma-card-topo b { color: #fff; font-family: var(--rg-font-display) !important; }
html.rg .rg-ma-card-topo span { padding: 3px 9px; border-radius: 999px; background: var(--rg-bg); color: var(--rg-gold); font-family: var(--rg-font-display) !important; font-weight: 700; font-size: .8rem; font-variant-numeric: tabular-nums; }
html.rg .rg-ma-card-topo span.urgente { color: var(--rg-coral); }
html.rg .rg-ma-card-bolas { display: flex; flex-wrap: wrap; gap: 4px; }
html.rg .rg-ma-card-bolas i {
    display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, var(--rg-lima-claro), var(--rg-lima) 55%, var(--rg-lima-escuro)); color: var(--rg-on-lima);
    font-style: normal; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: .72rem;
}
html.rg .rg-ma-card-bolas i.mais { background: var(--rg-surface-2); color: var(--rg-ink-2); width: auto; padding: 0 8px; border-radius: 999px; }
html.rg .rg-ma-card-rodape { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 8px; color: var(--rg-ink-3); font-size: .85rem; }
html.rg .rg-ma-card-rodape > * { white-space: nowrap; }
html.rg .rg-ma-card-rodape b { color: var(--rg-lima-texto); }

/* lista (DataTables) da mesma tela: status em etiquetas coloridas e "Ver bilhete" destacado */
html.rg #game_table .game-pending, html.rg #game_table .game-premiado {
    display: inline-block; padding: 4px 10px; border-radius: 999px; font-weight: 800; font-size: .78rem; white-space: nowrap;
    background: rgba(245, 197, 66, .15); color: var(--rg-gold); border: 1px solid rgba(245, 197, 66, .4);
}
html.rg #game_table .game-premiado { background: var(--rg-lima); color: var(--rg-on-lima); border-color: transparent; box-shadow: 0 0 14px color-mix(in srgb, var(--rg-lima) 45%, transparent); }
html.rg #game_table a.btn, html.rg #game_table .btn { border-radius: 10px !important; font-weight: 800 !important; }

@media (max-width: 767px) {
    html.rg .rg-ma-hero { padding: 16px; border-radius: 22px; }
    html.rg .rg-ma-contagem { width: 100%; align-items: flex-start; }
    html.rg .rg-ma-numeros { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    html.rg .rg-ma-num-3 { grid-column: 1 / -1; }
    html.rg .rg-ma-cards > .rg-ma-card { flex-basis: 84%; }
    html.rg .rg-ma-setas { display: none; }
}

/* =====================================================================
   FAZER VÁRIOS JOGOS (copia e cola: partials/varios-topo + Livewire copiacola)
   ===================================================================== */
html.rg .rg-vj {
    padding: 20px; border-radius: 26px;
    background: radial-gradient(140% 160% at 0% 0%, color-mix(in srgb, var(--rg-vj-cor) 50%, transparent), transparent 55%), radial-gradient(120% 160% at 100% 100%, rgba(124, 198, 247, .25), transparent 60%), var(--rg-surface);
    border: 1px solid var(--rg-glass-borda); box-shadow: var(--rg-shadow);
}
html.rg .rg-vj-topo { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
html.rg .rg-vj-topo img { width: 76px; height: auto; aspect-ratio: 165 / 192; border-radius: 18px; object-fit: cover; flex: none; box-shadow: 0 10px 24px rgba(0, 0, 0, .4); }
html.rg .rg-vj-texto { flex: 1; min-width: 180px; }
html.rg .rg-vj-sobre { color: var(--rg-sky); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-vj h1 { margin: 2px 0 0; color: #fff; font-size: clamp(1.5rem, 1.1rem + 1.5vw, 2.2rem) !important; line-height: 1.05; }
html.rg .rg-vj-texto p { margin: 6px 0 0; color: var(--rg-ink-2); font-weight: 600; }
html.rg .rg-vj-texto p b { color: var(--rg-gold); font-family: var(--rg-font-display) !important; font-variant-numeric: tabular-nums; }
html.rg .rg-vj-um { padding: 10px 14px; border-radius: 12px; background: rgba(0, 0, 0, .28); border: 1px solid var(--rg-line-2); color: #fff !important; font-weight: 700; font-size: .88rem; text-decoration: none !important; }
html.rg .rg-vj-passos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; list-style: none; margin: 16px 0 0; padding: 0; }
html.rg .rg-vj-passos li { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: var(--rg-bg); color: var(--rg-ink-3); transition: box-shadow .2s ease; }
html.rg .rg-vj-passos li span {
    display: inline-flex; align-items: center; justify-content: center; flex: none; width: 34px; height: 34px; border-radius: 11px;
    background: var(--rg-surface-2); color: var(--rg-ink-2); font-family: var(--rg-font-display) !important; font-weight: 800;
}
html.rg .rg-vj-passos li div { display: flex; flex-direction: column; min-width: 0; }
html.rg .rg-vj-passos li b { color: inherit; }
html.rg .rg-vj-passos li small { font-size: .78rem; opacity: .8; }
html.rg .rg-vj-passos li.atual { color: #fff; box-shadow: inset 0 0 0 2px var(--rg-sky); }
html.rg .rg-vj-passos li.atual span { background: var(--rg-sky); color: var(--rg-tinta); animation: rg-pulse 1.6s ease-in-out infinite; }
html.rg .rg-vj-passos li.feito { color: var(--rg-ink-2); }
html.rg .rg-vj-passos li.feito span { background: var(--rg-lima); color: var(--rg-on-lima); font-size: 0; }
html.rg .rg-vj-passos li.feito span::before { content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: .9rem; }
html.rg .rg-vj-dica { margin-top: 12px; color: var(--rg-ink-2); }
html.rg .rg-vj-dica summary { cursor: pointer; color: var(--rg-gold); font-weight: 800; }
html.rg .rg-vj-dica p { margin: 8px 0; }
html.rg .rg-vj-dica pre { margin: 0; padding: 10px 12px; border-radius: 12px; background: var(--rg-bg); color: var(--rg-lima-texto); font-size: .82rem; white-space: pre-wrap; word-break: break-all; }

/* formulário do copia e cola (mesma tela, novo visual) */
html.rg .rg-vj ~ * .card-info > .card-header,
html.rg body:has(.rg-vj) .card-info > .card-header { display: none; }
html.rg body:has(.rg-vj) .card-info { box-shadow: var(--rg-shadow) !important; }
html.rg body:has(.rg-vj) .editor-container {
    border: 2px solid var(--rg-sky) !important; border-radius: 18px !important; overflow: hidden;
    background: var(--rg-bg) !important; box-shadow: 0 0 0 4px rgba(124, 198, 247, .1);
}
html.rg body:has(.rg-vj) .line-numbers { background: rgba(124, 198, 247, .08) !important; color: var(--rg-sky) !important; border-right: 1px solid var(--rg-line-2) !important; }
html.rg body:has(.rg-vj) .textarea-editor { background: transparent !important; color: #fff !important; font-weight: 700; }
html.rg body:has(.rg-vj) .line-actions { background: rgba(124, 198, 247, .08) !important; border-left: 1px solid var(--rg-line-2) !important; }
html.rg body:has(.rg-vj) label[for="dezena"] { color: var(--rg-sky); font-weight: 800; font-size: .9rem; letter-spacing: .04em; text-transform: uppercase; }
html.rg body:has(.rg-vj) .copiacola-groups-scroll .card {
    border-radius: 20px !important; background: var(--rg-bg) !important;
    box-shadow: inset 0 4px 0 var(--rg-gold), var(--rg-shadow) !important; animation: rg-pop .4s ease both;
}
html.rg body:has(.rg-vj) .copiacola-groups-scroll .card-title { color: var(--rg-gold) !important; font-family: var(--rg-font-display) !important; }
html.rg body:has(.rg-vj) .btn-preset-value { border-radius: 12px !important; font-family: var(--rg-font-display) !important; padding: 9px 10px !important; }
html.rg body:has(.rg-vj) .btn-copiacola-secondary { border-radius: 14px !important; padding: 13px 24px !important; font-size: 1rem !important; color: var(--rg-sky) !important; border-color: var(--rg-sky) !important; }
html.rg body:has(.rg-vj) .btn-copiacola-primary { border-radius: 16px !important; padding: 15px 40px !important; font-size: 1.1rem !important; animation: rg-chamar 2.4s ease-in-out infinite; }
html.rg body:has(.rg-vj) .mt-4 > h5 { display: inline-flex; gap: 8px; align-items: center; margin: 4px 10px 4px 0; padding: 10px 14px; border-radius: 14px; background: var(--rg-bg); color: var(--rg-ink-2); }
html.rg body:has(.rg-vj) .mt-4 > h5 span { color: var(--rg-lima-texto); font-family: var(--rg-font-display) !important; font-size: 1.15rem; }

@media (max-width: 767px) {
    html.rg .rg-vj { padding: 14px; border-radius: 22px; }
    html.rg .rg-vj-topo img { width: 58px; height: auto; border-radius: 14px; }
    html.rg .rg-vj-um { width: 100%; text-align: center; }
    html.rg .rg-vj-passos { gap: 6px; }
    html.rg .rg-vj-passos li { flex-direction: column; text-align: center; gap: 6px; padding: 10px 6px; }
    html.rg .rg-vj-passos li small { display: none; }
    html.rg .rg-vj-passos li b { font-size: .8rem; line-height: 1.15; }
    html.rg .rg-vj-passos li span { width: 30px; height: 30px; }
    html.rg .rg-vj-um { padding: 8px 12px; }
}

/* =====================================================================
   BARRA DO TOPO: "cápsula da carteira" — saldo + sacar + depositar viram
   uma peça só (estilo app de banco), seguida do perfil e do sino.
   Os botões e links são os mesmos de antes; só a ordem visual e o desenho mudam.
   ===================================================================== */
html.rg .main-header .navbar-nav.ml-auto { gap: 0; flex-wrap: nowrap; align-items: center; }
html.rg .main-header .navbar-nav.ml-auto > .nav-item { margin: 0 !important; order: 10; }
html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(.btn-money) { order: 1; }
html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(.btn-despositar[href*="withdraw"]),
html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(button.btn-despositar) { order: 2; }
html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(.btn-despositar[href*="deposito"]) { order: 3; margin-right: 12px !important; }
html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(> .rg-som-btn) { order: 0; margin-right: 10px !important; }
html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(.btn-config) { margin-left: 8px !important; }

/* a cápsula: fundo único em volta das três partes */
html.rg .main-header .nav-item:has(.btn-money),
html.rg .main-header .nav-item:has(.btn-despositar) {
    background: #0e0726; border-top: 1px solid var(--rg-line-2); border-bottom: 1px solid var(--rg-line-2);
    height: 48px; display: flex; align-items: center;
}
html.rg .main-header .nav-item:has(.btn-money) { border-left: 1px solid var(--rg-line-2); border-radius: 999px 0 0 999px; padding-left: 5px; }
html.rg .main-header .nav-item:has(.btn-despositar[href*="deposito"]) { border-right: 1px solid var(--rg-line-2); border-radius: 0 999px 999px 0; padding-right: 5px; }

/* saldo: rótulo pequeno + valor grande */
html.rg .main-header .btn-money {
    height: 38px !important; display: inline-flex !important; flex-direction: column; align-items: flex-start; justify-content: center;
    padding: 0 12px 0 46px !important; position: relative;
    background: transparent !important; border: 0 !important; box-shadow: none !important;
    font-family: var(--rg-font-display) !important; font-size: 1.05rem !important; line-height: 1.05; color: #fff !important;
}
html.rg .main-header .btn-money::before {
    content: "\f555"; font-family: "Font Awesome 5 Free"; font-weight: 900;
    position: absolute; left: 0; top: 50%; transform: translateY(-50%);
    width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--rg-gold), #f59e0b); color: var(--rg-tinta); font-size: .9rem;
}
html.rg .main-header .btn-money::after {
    content: "Saldo"; order: -1; font-family: var(--rg-font) !important; font-size: .62rem; font-weight: 800;
    letter-spacing: .08em; text-transform: uppercase; color: var(--rg-ink-3);
}
html.rg .main-header .nav-item:has(.btn-money) .cont-pix,
html.rg .main-header .nav-item:has(.btn-despositar) .cont-pix { display: none !important; }

/* sacar: pílula com texto "Sacar" (público leigo precisa ler o nome) */
html.rg .main-header .btn-despositar[href*="withdraw"], html.rg .main-header button.btn-despositar {
    height: 38px !important; padding: 0 14px !important; margin: 0 6px; border-radius: 999px !important;
    display: inline-flex !important; align-items: center; gap: 6px; white-space: nowrap;
    font-size: .9rem !important; font-weight: 800; color: #fff !important;
    background: var(--rg-surface-2) !important; border: 1.5px solid var(--rg-line-2) !important; box-shadow: none !important;
}
html.rg .main-header .btn-despositar[href*="withdraw"]::before, html.rg .main-header button.btn-despositar::before {
    content: "\f062"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: .78rem; color: var(--rg-gold);
}
html.rg .main-header .btn-despositar[href*="withdraw"]:hover { background: var(--rg-surface-3) !important; border-color: var(--rg-gold) !important; }

/* depositar: pílula verde-limão com "+" em bolinha, pulsando para chamar o clique */
html.rg .main-header .btn-despositar[href*="deposito"] {
    height: 38px !important; padding: 0 16px 0 6px !important; border-radius: 999px !important;
    display: inline-flex !important; align-items: center; gap: 8px; white-space: nowrap; position: relative;
    background: var(--rg-lima) !important; border: 0 !important; color: var(--rg-on-lima) !important;
    font-size: .92rem !important; font-weight: 800;
    animation: rg-deposito-pulso 1.8s ease-out infinite;
}
html.rg .main-header .btn-despositar[href*="deposito"]::before {
    content: "\f067"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: .75rem;
    width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    background: var(--rg-tinta); color: var(--rg-lima-texto);
}
html.rg .main-header .btn-despositar[href*="deposito"]:hover { animation-play-state: paused; filter: brightness(1.08); transform: scale(1.04); }
@keyframes rg-deposito-pulso {
    0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--rg-lima) 75%, transparent), 0 6px 18px color-mix(in srgb, var(--rg-lima) 35%, transparent); transform: scale(1); }
    15% { transform: scale(1.06); }
    30% { transform: scale(1); }
    70% { box-shadow: 0 0 0 12px color-mix(in srgb, var(--rg-lima) 0%, transparent), 0 6px 18px color-mix(in srgb, var(--rg-lima) 35%, transparent); }
    100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--rg-lima) 0%, transparent), 0 6px 18px color-mix(in srgb, var(--rg-lima) 35%, transparent); transform: scale(1); }
}

/* sino e som: botões redondos no mesmo tamanho do perfil */
html.rg .main-header .btn-config:not(:has(.rg-avatar)):not(:has(.icon-config img)):not(.rg-sino),
html.rg .main-header .rg-som-btn {
    width: 42px !important; height: 42px !important; padding: 0 !important; border-radius: 50% !important;
    background: #0e0726 !important; border: 1px solid var(--rg-line-2) !important;
    display: inline-flex !important; align-items: center; justify-content: center;
}
html.rg .main-header .dropdown-toggle::after { display: none !important; }
html.rg .main-header .LogoNavBar { max-height: 44px; max-width: 150px; width: auto; height: auto; object-fit: contain; }
/* computador: o navbar antigo amplia o logo com scale(1.7), o que passava do cabeçalho e o menu lateral
   (que fica por cima) cortava a parte de baixo. Sem a ampliação, no maior tamanho que cabe no cabeçalho. */
@media (min-width: 768px) {
    html.rg .main-header .brand-link { display: inline-flex; align-items: center; padding-top: 0 !important; padding-bottom: 0 !important; }
    html.rg .main-header .LogoNavBar { transform: none; max-height: 60px; max-width: 160px; }
}

@media (max-width: 767px) {
    html.rg .main-header { padding-left: 8px !important; padding-right: 8px !important; }
    html.rg .main-header .LogoNavBar { max-width: 36px; max-height: 30px; font-size: 0; }
    html.rg .main-header .brand-link { padding: 0 !important; margin: 0 !important; display: inline-flex; }
    html.rg .main-header > .d-flex { flex: 0 1 auto; min-width: 0; overflow: hidden; }
    html.rg .main-header .nav-item:has(.btn-money), html.rg .main-header .nav-item:has(.btn-despositar) { height: 42px; }
    html.rg .main-header .nav-item:has(.btn-money) { padding-left: 10px; }
    html.rg .main-header .nav-item:has(.btn-despositar[href*="deposito"]) { padding-right: 4px; margin-right: 6px !important; }
    html.rg .main-header .btn-money { height: 34px !important; padding: 0 4px 0 0 !important; font-size: .82rem !important; }
    html.rg .main-header .btn-money::before { display: none; }
    html.rg .main-header .btn-money::after { font-size: .52rem; }
    html.rg .main-header .btn-despositar[href*="withdraw"], html.rg .main-header button.btn-despositar { height: 32px !important; padding: 0 9px !important; margin: 0 4px; font-size: .72rem !important; gap: 4px; }
    html.rg .main-header .btn-despositar[href*="withdraw"]::before { font-size: .66rem; }
    html.rg .main-header .btn-despositar[href*="deposito"] { height: 34px !important; padding: 0 10px 0 4px !important; font-size: .74rem !important; gap: 5px; }
    html.rg .main-header .btn-despositar[href*="deposito"]::before { width: 24px; height: 24px; font-size: .68rem; }
    html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(.btn-config) { margin-left: 4px !important; }
    html.rg .main-header .btn-config:not(:has(.rg-avatar)):not(:has(.icon-config img)) { width: 32px !important; height: 32px !important; }
    html.rg .rg-avatar { width: 32px; height: 32px; min-width: 32px; max-height: 32px; }
    html.rg .rg-avatar svg { width: 16px; height: 16px; }
    html.rg .main-header .icon-config img { width: 32px !important; height: 32px !important; }
}
@media (max-width: 390px) {
    html.rg .main-header .brand-link { display: none !important; }
}
@media (max-width: 365px) {
    html.rg .main-header { padding-left: 4px !important; padding-right: 4px !important; }
    html.rg .main-header .nav-item:has(.btn-money) { padding-left: 8px; }
    html.rg .main-header .btn-money { font-size: .74rem !important; }
    html.rg .main-header .btn-despositar[href*="withdraw"], html.rg .main-header button.btn-despositar { padding: 0 7px !important; margin: 0 3px; font-size: .66rem !important; }
    html.rg .main-header .btn-despositar[href*="withdraw"]::before { display: none; }
    html.rg .main-header .btn-despositar[href*="deposito"] { padding: 0 8px 0 3px !important; font-size: .68rem !important; gap: 4px; }
    html.rg .main-header .btn-despositar[href*="deposito"]::before { width: 20px; height: 20px; font-size: .6rem; }
    html.rg .main-header .nav-item:has(.btn-despositar[href*="deposito"]) { margin-right: 4px !important; }
    html.rg .main-header .btn-config:not(:has(.rg-avatar)):not(:has(.icon-config img)) { width: 30px !important; height: 30px !important; }
    html.rg .rg-avatar { width: 30px; height: 30px; min-width: 30px; max-height: 30px; }
}

/* avatar do perfil na barra do topo (iniciais) */
html.rg .rg-avatar {
    display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%;
    background: linear-gradient(135deg, var(--rg-rosa), var(--rg-violeta));
    color: #fff;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, .9), 0 6px 16px rgba(139, 92, 246, .45);
    transition: transform .15s ease, box-shadow .15s ease;
}
html.rg .rg-avatar svg { width: 20px; height: 20px; }
html.rg .main-header .btn-config:hover .rg-avatar { transform: scale(1.06); box-shadow: 0 0 0 2px var(--rg-lima), 0 6px 18px color-mix(in srgb, var(--rg-lima) 35%, transparent); }
html.rg .main-header .btn-config:has(.rg-avatar), html.rg .main-header .btn-config:has(.icon-config img) { background: transparent !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; width: auto !important; height: auto !important; min-width: 0 !important; }
html.rg .rg-avatar { flex: none; min-width: 38px; max-height: 38px; aspect-ratio: 1; line-height: 1; }
html.rg .main-header .icon-config:has(.rg-avatar) { width: auto !important; height: auto !important; display: inline-flex; }
html.rg .main-header .icon-config img { box-shadow: 0 0 0 2px var(--rg-lima), 0 4px 12px rgba(0, 0, 0, .35); border: 0 !important; width: 38px !important; height: 38px !important; }

/* celular: "Sacar" sai da barra (vai para o menu do perfil) para caber perfil e sino sem cortar */
@media (max-width: 767px) {
    html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(.btn-despositar[href*="withdraw"]),
    html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(button.btn-despositar) { display: none !important; }
    html.rg .main-header .btn-despositar[href*="deposito"] { margin-left: 6px; }
}
@media (min-width: 360px) and (max-width: 767px) {
    html.rg .main-header .btn-money { padding-left: 36px !important; font-size: .9rem !important; }
    html.rg .main-header .btn-money::before { display: flex; width: 30px; height: 30px; font-size: .78rem; }
    html.rg .main-header .nav-item:has(.btn-money) { padding-left: 5px; }
}

/* =====================================================================
   MENU DO PERFIL: cartão com nome + saldo + Sacar/Depositar, itens com
   ícone em chip, chave de som e "Sair" em vermelho. Links são os mesmos.
   ===================================================================== */
html.rg .main-header .dropdown-menu:has(.rg-perfil-topo) {
    width: 300px; max-width: calc(100vw - 16px); padding: 8px !important; border-radius: 22px !important;
    background: linear-gradient(180deg, #23144f, #180d3a) !important;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .06) inset !important;
    animation: rg-menu-entra .18s ease-out both;
}
@keyframes rg-menu-entra { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }
html.rg .rg-perfil-topo {
    padding: 14px; margin-bottom: 6px; border-radius: 16px; color: #fff;
    background: radial-gradient(120% 140% at 100% 0%, rgba(255, 255, 255, .18), transparent 55%), linear-gradient(135deg, var(--rg-violeta), var(--rg-rosa));
}
html.rg .rg-perfil-quem { display: flex; align-items: center; gap: 10px; min-width: 0; }
html.rg .rg-perfil-ini {
    flex: none; width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    background: rgba(255, 255, 255, .22); box-shadow: 0 0 0 2px rgba(255, 255, 255, .55);
    font-family: var(--rg-font-display); font-size: 1.05rem;
}
html.rg .rg-perfil-nome { min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
html.rg .rg-perfil-nome strong, html.rg .rg-perfil-nome small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-perfil-nome strong { font-size: .98rem; font-weight: 800; }
html.rg .rg-perfil-nome small { font-size: .74rem; opacity: .85; }
html.rg .rg-perfil-saldo {
    display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 12px; padding: 10px 12px;
    border-radius: 12px; background: rgba(14, 7, 38, .35); color: #fff !important; text-decoration: none !important;
}
html.rg .rg-perfil-saldo small { font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; opacity: .8; }
html.rg .rg-perfil-saldo strong { font-family: var(--rg-font-display); font-size: 1.25rem; line-height: 1; }
html.rg .rg-perfil-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
html.rg .rg-perfil-acoes a {
    height: 40px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    font-size: .88rem; font-weight: 800; text-decoration: none !important; transition: transform .12s ease, filter .12s ease;
}
html.rg .rg-perfil-acoes a:active { transform: scale(.96); }
html.rg .rg-perfil-sacar { background: rgba(255, 255, 255, .16); color: #fff !important; border: 1px solid rgba(255, 255, 255, .28); }
html.rg .rg-perfil-sacar i { color: var(--rg-gold); }
html.rg .rg-perfil-depositar { background: var(--rg-lima); color: var(--rg-on-lima) !important; box-shadow: 0 6px 16px color-mix(in srgb, var(--rg-lima) 30%, transparent); }

html.rg .dropdown-menu .rg-menu-item {
    display: flex !important; align-items: center; gap: 12px; width: 100%; padding: 8px 10px !important; min-height: 50px;
    border: 0; border-radius: 12px; background: transparent; color: #fff !important;
    font-family: var(--rg-font); font-size: .95rem; font-weight: 700; line-height: 1.2; text-align: left;
}
html.rg .dropdown-menu .rg-menu-item > i {
    flex: none; width: 34px; height: 34px; margin: 0 !important; border-radius: 10px;
    display: inline-flex; align-items: center; justify-content: center; font-size: .85rem;
    background: rgba(255, 255, 255, .07); color: var(--rg-lima-texto);
}
html.rg .dropdown-menu a.rg-menu-item::after {
    content: "\f054"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: .7rem; margin-left: auto; opacity: .35;
}
html.rg .dropdown-menu .rg-menu-item:hover, html.rg .dropdown-menu .rg-menu-item:focus { background: rgba(255, 255, 255, .06) !important; }
html.rg .dropdown-menu .rg-menu-sair { color: #fca5a5 !important; }
html.rg .dropdown-menu .rg-menu-sair > i { background: rgba(239, 68, 68, .14); color: #f87171; }
html.rg .dropdown-menu .rg-menu-sair::after { display: none; }
html.rg .dropdown-menu:has(.rg-perfil-topo) .dropdown-divider { border-top-color: rgba(255, 255, 255, .08); margin: 4px 6px; }
html.rg .dropdown-menu:has(.rg-perfil-topo) .rg-som-item { padding: 0; }
html.rg .main-header .rg-som-item .rg-som-btn.rg-menu-item {
    width: 100% !important; height: auto !important; border-radius: 12px !important; padding: 8px 10px !important;
    background: transparent !important; border: 0 !important; justify-content: flex-start; font-size: .95rem; cursor: pointer;
}
html.rg .rg-som-btn[aria-pressed="false"] > i { color: var(--rg-ink-3); }
html.rg .rg-chave {
    margin-left: auto; flex: none; position: relative; width: 42px; height: 24px; border-radius: 999px;
    background: rgba(255, 255, 255, .18); transition: background .18s ease;
}
html.rg .rg-chave::after {
    content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%;
    background: #fff; box-shadow: 0 2px 4px rgba(0, 0, 0, .3); transition: left .18s ease, background .18s ease;
}
html.rg .rg-som-btn[aria-pressed="true"] .rg-chave { background: var(--rg-lima); }
html.rg .rg-som-btn[aria-pressed="true"] .rg-chave::after { left: 21px; background: var(--rg-tinta); }
@media (max-width: 767px) {
    /* no celular o menu ocupa a largura toda (com margem), sem vazar pela esquerda */
    html.rg .main-header .navbar-nav.ml-auto, html.rg .main-header .navbar-nav.ml-auto > .nav-item:has(.rg-perfil-topo) { position: static !important; }
    html.rg .main-header .dropdown-menu:has(.rg-perfil-topo).show {
        position: absolute !important; top: calc(100% + 6px) !important; left: 8px !important; right: 8px !important;
        width: auto; max-width: none; transform: none !important;
    }
}

/* =====================================================================
   CARRINHO DO BICHÃO (modal #jogos-carrinho) — só visual; ids e botões são os mesmos
   ===================================================================== */
html.rg #jogos-carrinho .modal-content { background: var(--rg-surface) !important; border-radius: 26px !important; overflow: hidden; }
html.rg #jogos-carrinho .modal-header {
    padding: 18px 22px; border: 0 !important;
    background: linear-gradient(135deg, var(--rg-violeta), var(--rg-rosa));
}
html.rg #jogos-carrinho .modal-title { color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.3rem; }
html.rg #jogos-carrinho .modal-title::before { content: "\f07a"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 10px; }
html.rg #jogos-carrinho .modal-header .close { color: #fff; opacity: 1; font-size: 1.8rem; }
html.rg #jogos-carrinho .modal-body { padding: 16px 18px; }
html.rg #jogos-carrinho .modal-body > .p-2 { background: transparent !important; padding: 0 !important; }
html.rg #jogos-carrinho .modal-body > .p-2 > .row:first-child { margin-top: 0 !important; }
html.rg #jogos-carrinho .modal-body h4.text-center { text-align: left !important; color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.05rem; margin: 0 0 10px; }
html.rg #jogos-carrinho .modal-body h4.text-center::before,
html.rg #jogos-carrinho label[for="selecionar-estado-bichao"]::before,
html.rg #jogos-carrinho .estado-sorteio > p::before {
    display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; margin-right: 10px; border-radius: 8px;
    background: var(--rg-lima); color: var(--rg-on-lima); font-family: var(--rg-font-display) !important; font-size: .85rem; font-weight: 800;
}
html.rg #jogos-carrinho .modal-body h4.text-center::before { content: "1"; }
html.rg #jogos-carrinho label[for="selecionar-estado-bichao"]::before { content: "2"; }
html.rg #jogos-carrinho .estado-sorteio > p::before { content: "3"; }

/* cada jogo do carrinho: card com número em bolinha, jogo em destaque e lixeira */
html.rg #jogos-carrinho .chart-item {
    display: flex; align-items: center; margin-bottom: 10px !important; border-radius: 18px !important;
    background: var(--rg-bg) !important; border: 1px solid var(--rg-line-2); overflow: hidden; animation: rg-rise .25s ease both;
}
html.rg #jogos-carrinho .chart-item-number {
    flex: none; width: 40px; height: 40px; margin: 0 4px 0 14px; padding: 0 !important; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--rg-gold), #f59e0b); color: var(--rg-tinta);
    font-family: var(--rg-font-display) !important; font-size: 1rem !important;
}
html.rg #jogos-carrinho .chart-item-description { padding: 12px 10px !important; display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
html.rg #jogos-carrinho .chart-item-description p { margin: 0; font-size: .82rem !important; color: var(--rg-ink-2); padding: 3px 9px; border-radius: 999px; background: var(--rg-surface-2); }
html.rg #jogos-carrinho .chart-item-description p b { color: var(--rg-ink-3); font-weight: 700; }
html.rg #jogos-carrinho .chart-item-description p:first-child {
    flex: 1 1 100%; padding: 0; background: transparent; color: #fff; font-size: 1.15rem !important;
    font-family: var(--rg-font-display) !important; font-weight: 800; letter-spacing: .02em;
}
html.rg #jogos-carrinho .chart-item-description p:first-child b { color: var(--rg-lima-texto); font-family: var(--rg-font) !important; font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; margin-right: 4px; }
html.rg #jogos-carrinho .chart-item-description p:nth-child(3) { background: color-mix(in srgb, var(--rg-lima) 14%, transparent); color: var(--rg-lima-texto); }
html.rg #jogos-carrinho .chart-item-description p:nth-child(3) b { color: var(--rg-lima-texto); }
html.rg #jogos-carrinho .chart-item-button { align-self: stretch; display: flex; align-items: center; padding: 0 12px; background: transparent !important; }
html.rg #jogos-carrinho .chart-remove-item {
    width: 38px; height: 38px; border-radius: 12px; display: inline-flex !important; align-items: center; justify-content: center;
    background: rgba(240, 112, 90, .15) !important; color: var(--rg-coral) !important; font-size: 0 !important; text-decoration: none !important;
    transition: background-color .15s ease, transform .12s ease;
}
html.rg #jogos-carrinho .chart-remove-item::before { content: "\f2ed"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: .95rem; }
html.rg #jogos-carrinho .chart-remove-item:hover { background: var(--rg-coral) !important; color: var(--rg-tinta) !important; transform: scale(1.05); }
html.rg #jogos-carrinho .clear-chart-container { text-align: right; }
html.rg #jogos-carrinho #clear-all-chart { background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--rg-coral) !important; padding: 4px 0 !important; text-decoration: underline; font-size: .88rem !important; }

/* estado e horário */
html.rg #jogos-carrinho .card-master { text-align: left !important; padding: 14px 16px !important; border-radius: 18px !important; background: var(--rg-bg) !important; border: 1px solid var(--rg-line-2) !important; box-shadow: none !important; }
html.rg #jogos-carrinho label[for="selecionar-estado-bichao"] { display: flex; align-items: center; color: #fff; font-size: 1rem !important; margin-bottom: 10px; }
html.rg #jogos-carrinho #selecionar-estado-bichao { height: 52px; font-size: 1rem !important; font-weight: 700; border: 2px solid var(--rg-sky) !important; border-radius: 14px !important; }
html.rg #jogos-carrinho #estado-sorteio { margin-top: 12px; }
html.rg #jogos-carrinho .estado-sorteio { padding: 14px 16px; border-radius: 18px; background: var(--rg-bg); border: 1px solid var(--rg-line-2); }
html.rg #jogos-carrinho .estado-sorteio > p { display: flex; align-items: center; color: #fff; margin-bottom: 10px !important; }
html.rg #jogos-carrinho #horarios-resultados { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
html.rg #jogos-carrinho #horarios-resultados > p { grid-column: 1 / -1; color: var(--rg-coral); margin: 0; }
html.rg #jogos-carrinho #horarios-resultados .form-check { position: relative; margin: 0 !important; padding: 0 !important; }
html.rg #jogos-carrinho #horarios-resultados .form-check-input { position: absolute; opacity: 0; pointer-events: none; }
html.rg #jogos-carrinho #horarios-resultados .form-check-label {
    display: block; padding: 11px 12px; border-radius: 14px; border: 2px solid var(--rg-line-2); background: var(--rg-surface-2);
    color: #fff; font-weight: 700; font-size: .85rem; text-align: center; cursor: pointer; transition: border-color .15s ease, background-color .15s ease;
}
html.rg #jogos-carrinho #horarios-resultados .form-check-label:hover { border-color: var(--rg-lima); }
html.rg #jogos-carrinho #horarios-resultados .form-check-input:checked + .form-check-label { background: var(--rg-lima); border-color: var(--rg-lima); color: var(--rg-on-lima); box-shadow: 0 6px 16px color-mix(in srgb, var(--rg-lima) 30%, transparent); }

/* total + cadastrar: barra de fechamento */
html.rg #jogos-carrinho .col.text-center.mt-4.p-4 { margin-top: 14px !important; padding: 16px !important; border-radius: 18px; background: linear-gradient(135deg, #7c3aed, #c026d3); }
html.rg #jogos-carrinho .col.text-center.mt-4.p-4 h5 { margin: 0; color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.5rem; }
html.rg #jogos-carrinho #cadastrar-jogos {
    width: 100%; margin-top: 12px; padding: 16px !important; border-radius: 16px !important; font-size: 1.1rem !important; font-weight: 800 !important;
    background: var(--rg-lima) !important; border: 0 !important; color: var(--rg-on-lima) !important;
    animation: rg-deposito-pulso 1.8s ease-out infinite;
}
html.rg #jogos-carrinho #cadastrar-jogos::before { content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 8px; }
html.rg #jogos-carrinho .modal-body .row:last-child .col { color: var(--rg-ink-3); font-size: .78rem; }
html.rg #jogos-carrinho .modal-footer { border: 0 !important; padding: 0 18px 16px; }
html.rg #jogos-carrinho .modal-footer .btn-secondary { background: transparent !important; border: 1px solid var(--rg-line-2) !important; border-radius: 12px !important; }

@media (max-width: 767px) {
    html.rg #jogos-carrinho .modal-dialog { margin: 8px; }
    html.rg #jogos-carrinho .chart-item-number { width: 34px; height: 34px; margin-left: 10px; }
    html.rg #jogos-carrinho #horarios-resultados { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    html.rg #jogos-carrinho .chart-item-description p:not(:first-child) { white-space: nowrap; font-size: .76rem !important; }
    html.rg #jogos-carrinho .modal-header { background: linear-gradient(135deg, var(--rg-violeta), var(--rg-rosa)) !important; }
}

/* =====================================================================
   CARRINHO DAS LOTERIAS (pages/cart.blade.php) — só visual; formulários e links iguais
   ===================================================================== */
html.rg .cart-page { max-width: 1000px; margin: 16px auto; padding: 0 12px 30px; }
html.rg .cart-page-head {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
    padding: 20px 22px; border-radius: 24px; margin-bottom: 14px;
    background: linear-gradient(135deg, var(--rg-violeta), var(--rg-rosa)); box-shadow: var(--rg-shadow);
}
html.rg .cart-page-head h2 { margin: 0; color: #fff !important; font-family: var(--rg-font-display) !important; font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2rem) !important; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
html.rg .cart-page-head h2::before { content: "\f07a"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: .85em; }
html.rg .cart-page-count { padding: 5px 12px; border-radius: 999px; background: rgba(0, 0, 0, .25); color: #fff; font-family: var(--rg-font) !important; font-size: .85rem; font-weight: 800; }
html.rg .cart-head-actions { display: flex; gap: 8px; }
html.rg .cart-head-actions .btn { border-radius: 12px !important; font-weight: 800 !important; }
html.rg .cart-clear-all { background: transparent !important; border: 1px solid rgba(255, 255, 255, .6) !important; color: #fff !important; }
html.rg .cart-back { background: rgba(0, 0, 0, .25) !important; border: 0 !important; color: #fff !important; }

html.rg .cart-empty { padding: 40px 20px; border-radius: 24px; background: var(--rg-surface); text-align: center; color: var(--rg-ink-2); }
html.rg .cart-empty::before { content: "\f07a"; display: block; margin-bottom: 10px; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 2.6rem; color: var(--rg-violeta); }
html.rg .cart-empty .btn { border-radius: 14px !important; padding: 12px 22px !important; font-weight: 800 !important; }

html.rg .cart-item {
    --rg-ci: var(--rg-lima);
    margin-bottom: 12px; padding: 16px 18px; border-radius: 22px;
    background: var(--rg-surface) !important; border: 1px solid var(--rg-glass-borda) !important;
    box-shadow: inset 4px 0 0 var(--rg-ci), var(--rg-shadow) !important; animation: rg-rise .25s ease both;
}
html.rg .cart-item:nth-of-type(4n+2) { --rg-ci: var(--rg-gold); }
html.rg .cart-item:nth-of-type(4n+3) { --rg-ci: var(--rg-sky); }
html.rg .cart-item:nth-of-type(4n+4) { --rg-ci: var(--rg-rosa); }
html.rg .cart-item-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
html.rg .cart-item-title { margin: 0; color: #fff !important; font-family: var(--rg-font-display) !important; font-size: 1.15rem !important; }
html.rg .cart-item-actions { display: flex; gap: 6px; }
html.rg .cart-edit, html.rg .cart-remove {
    display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 12px;
    font-weight: 800; font-size: .82rem; text-decoration: none !important; transition: background-color .15s ease;
}
html.rg .cart-edit { background: rgba(124, 198, 247, .14); color: var(--rg-sky) !important; }
html.rg .cart-edit:hover { background: var(--rg-sky); color: var(--rg-tinta) !important; }
html.rg .cart-remove { background: rgba(240, 112, 90, .14); color: var(--rg-coral) !important; }
html.rg .cart-remove:hover { background: var(--rg-coral); color: var(--rg-tinta) !important; }
html.rg .cart-item-client { margin: 8px 0 0; color: var(--rg-ink-3); font-size: .88rem; }
html.rg .cart-item-client::before { content: "\f007"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 6px; }
html.rg .cart-teimosinha { display: inline-block; margin-top: 8px; padding: 4px 10px; border-radius: 999px; background: rgba(139, 92, 246, .2); color: #d8ccff; font-weight: 700; font-size: .8rem; }
html.rg .cart-item-numbers { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
html.rg .cart-chip {
    display: inline-flex !important; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 6px; border-radius: 50% !important;
    background: radial-gradient(circle at 35% 30%, var(--rg-lima-claro), var(--rg-lima) 55%, var(--rg-lima-escuro)) !important; color: var(--rg-on-lima) !important; border: 0 !important;
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: .85rem;
}
html.rg .cart-item-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding-top: 12px; border-top: 1px dashed var(--rg-line-2); color: var(--rg-ink-2); }
html.rg .cart-item-foot strong { color: #fff; font-family: var(--rg-font-display) !important; }
html.rg .cart-premio { padding: 6px 12px; border-radius: 999px; background: color-mix(in srgb, var(--rg-lima) 14%, transparent); color: var(--rg-lima-texto) !important; font-weight: 800; }
html.rg .cart-premio::before { content: "\f091"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 6px; }

/* fechamento */
html.rg .cart-checkout {
    position: sticky; bottom: 14px; z-index: 5; margin-top: 16px; padding: 18px 20px; border-radius: 24px;
    background: rgba(23, 14, 61, .97) !important; border: 1px solid var(--rg-line-2) !important;
    box-shadow: inset 0 3px 0 var(--rg-lima), var(--rg-shadow-lg) !important; margin-right: 84px;
}
html.rg .cart-checkout-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; color: var(--rg-ink-2); }
html.rg .cart-checkout-row:first-child span:first-child { color: #fff; font-weight: 800; }
html.rg .cart-checkout-total { color: var(--rg-gold) !important; font-family: var(--rg-font-display) !important; font-size: 1.7rem !important; }
html.rg .cart-checkout .alert-warning { margin: 10px 0 !important; border-radius: 14px !important; background: rgba(245, 197, 66, .14) !important; border: 1px solid rgba(245, 197, 66, .5) !important; color: var(--rg-gold) !important; }
html.rg .cart-checkout .btn-block { margin-top: 10px; padding: 16px !important; border-radius: 16px !important; font-size: 1.1rem !important; font-weight: 800 !important; border: 0 !important; }
html.rg #cartCheckoutBtn { background: var(--rg-lima) !important; color: var(--rg-on-lima) !important; animation: rg-deposito-pulso 1.8s ease-out infinite; }
html.rg #cartCheckoutBtn::before { content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 8px; }
html.rg .cart-checkout .btn-warning { background: linear-gradient(135deg, var(--rg-gold), #f59e0b) !important; color: var(--rg-tinta) !important; }
html.rg .cart-checkout .btn-warning::before { content: "\f067"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 8px; }

@media (max-width: 767px) {
    html.rg .cart-page { padding-bottom: 200px; }
    html.rg .cart-page-head { padding: 16px; border-radius: 20px; }
    html.rg .cart-item { padding: 14px; }
    html.rg .cart-edit span, html.rg .cart-remove span { display: none; }
    html.rg .cart-chip { min-width: 32px; height: 32px; font-size: .78rem; }
    html.rg .cart-checkout { position: fixed; left: 12px; right: 12px; bottom: 84px; margin: 0; padding: 14px; padding-left: var(--rg-fab-folga, 14px); z-index: 1040; }
    html.rg .cart-checkout-total { font-size: 1.35rem !important; }
}

/* =====================================================================
   MENU LATERAL: selos vivos e atalho do próximo sorteio (partials/roupagem-sidebar)
   ===================================================================== */
html.rg .rg-sb-prox { list-style: none; margin: 4px 10px 12px; }
html.rg .rg-sb-prox a {
    display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; text-decoration: none !important;
    background: #0e0726; border: 1px solid var(--rg-line-2);
}
html.rg .rg-sb-prox-vivo { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--rg-coral); box-shadow: 0 0 0 0 rgba(240, 112, 90, .7); animation: rg-sb-vivo 1.6s ease-out infinite; }
html.rg .rg-sb-prox-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.15; }
html.rg .rg-sb-prox-txt small { color: var(--rg-ink-3); font-size: .7rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-sb-prox-txt b { color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.05rem; font-variant-numeric: tabular-nums; }
html.rg .rg-sb-prox-txt b.urgente { color: var(--rg-coral); }
html.rg .rg-sb-prox-jogar { flex: none; padding: 6px 10px; border-radius: 10px; background: var(--rg-lima); color: var(--rg-on-lima); font-weight: 800; font-size: .78rem; }
@keyframes rg-sb-vivo { 0% { box-shadow: 0 0 0 0 rgba(240, 112, 90, .7); } 70% { box-shadow: 0 0 0 8px rgba(240, 112, 90, 0); } 100% { box-shadow: 0 0 0 0 rgba(240, 112, 90, 0); } }

html.rg .rg-sb-selo {
    flex: none; display: inline-flex; align-items: center; gap: 5px; margin-left: 8px; padding: 2px 8px; border-radius: 999px;
    font-family: var(--rg-font) !important; font-size: .68rem !important; font-weight: 800; letter-spacing: 0; text-transform: none; line-height: 1.5; white-space: nowrap;
}
html.rg .rg-sb-selo-lima { background: var(--rg-lima); color: var(--rg-on-lima) !important; }
html.rg .rg-sb-selo-ouro { background: var(--rg-gold); color: var(--rg-tinta) !important; }
html.rg .rg-sb-selo-quente { background: #fff; color: #c2410c !important; animation: rg-sb-pula 2.4s ease-in-out infinite; }
html.rg .rg-sb-selo-vivo { background: rgba(240, 112, 90, .16); color: var(--rg-coral) !important; }
html.rg .rg-sb-selo-vivo::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--rg-coral); animation: rg-vivo 1.2s ease-in-out infinite; }
@keyframes rg-sb-pula { 0%, 80%, 100% { transform: none; } 88% { transform: translateY(-2px) scale(1.06); } }

/* progresso no menu: dias seguidos + nível (Estrelas / Carreira) */
html.rg .rg-sb-prog { list-style: none; display: flex; gap: 8px; margin: 0 10px 12px; }
html.rg .rg-sb-fogo {
    flex: none; width: 64px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 8px 4px;
    border-radius: 14px; background: #0e0726; border: 1px solid rgba(240, 112, 90, .45); line-height: 1.05;
}
html.rg .rg-sb-fogo span { font-size: 1.1rem; }
html.rg .rg-sb-fogo b { color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.1rem; }
html.rg .rg-sb-fogo small { color: var(--rg-coral); font-size: .65rem; font-weight: 800; }
html.rg .rg-sb-nivel {
    flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; padding: 9px 11px; border-radius: 14px;
    background: #0e0726; border: 1px solid var(--rg-line-2); text-decoration: none !important;
}
html.rg .rg-sb-nivel-topo { display: flex; align-items: center; gap: 6px; min-width: 0; }
html.rg .rg-sb-nivel-topo b { color: var(--rg-gold); font-family: var(--rg-font-display) !important; font-size: .9rem; }
html.rg .rg-sb-nivel-topo span { color: #fff; font-weight: 700; font-size: .78rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-sb-nivel-barra { height: 6px; border-radius: 999px; background: rgba(255, 255, 255, .1); overflow: hidden; }
html.rg .rg-sb-nivel-barra span { display: block; height: 100%; border-radius: 999px; background: var(--rg-gold); }
html.rg .rg-sb-nivel small { color: var(--rg-ink-3); font-size: .66rem; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* botões configurados pela banca (Tela principal, Roleta, Tabelas...): grade 2 colunas, chapados */
html.rg .main-sidebar .nav-sidebar { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; column-gap: 8px; padding: 0 10px !important; }
html.rg .main-sidebar .nav-sidebar > * { flex: 0 0 calc(100% + 20px); width: calc(100% + 20px); margin-left: -10px !important; margin-right: -10px !important; box-sizing: border-box; border-bottom: 1px solid rgba(255, 255, 255, .06) !important; }
html.rg .main-sidebar .nav-sidebar > * li, html.rg .main-sidebar .nav-sidebar > * .nav-item { border: 0 !important; }
html.rg .main-sidebar .nav-sidebar > li.rg-sb-prog, html.rg .main-sidebar .nav-sidebar > li.rg-sb-prox { flex-basis: 100%; width: 100%; margin-left: 0 !important; margin-right: 0 !important; border: 0 !important; }
html.rg .main-sidebar .nav-sidebar > li:has(> a.d-none) { display: none !important; }
html.rg .main-sidebar .nav-sidebar > li:has(> a > .btn-side):not(:has(> a.d-none)) { flex: 1 1 28%; min-width: 0; width: auto !important; max-width: none !important; margin: 0 0 8px !important; padding: 0 !important; border: 0 !important; }
html.rg .main-sidebar .nav-sidebar > li:has(> a > .btn-side):not(:has(> a.d-none)) > a { display: block; width: 100% !important; margin: 0 !important; padding: 0 !important; }
html.rg .main-sidebar .nav-sidebar > li:has(> a > .btn-side) + :not(li:has(> a > .btn-side)), html.rg .main-sidebar .nav-sidebar > li:has(> a > .btn-side) + li:has(> a.d-none) + * { margin-top: 4px !important; border-top: 1px solid rgba(255, 255, 255, .06) !important; }
html.rg .main-sidebar .btn-side { width: 100% !important; max-width: none !important; margin: 0 !important; }
html.rg .main-sidebar .btn-side {
    height: 56px !important; padding: 0 8px !important; border-radius: 12px !important; position: relative;
    display: flex !important; flex-direction: column; align-items: center !important; justify-content: center !important; gap: 2px;
    box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .2) !important; transition: filter .15s ease;
}
html.rg .main-sidebar .btn-side:hover { filter: brightness(1.1); }
html.rg .main-sidebar .btn-side p { margin: 0; color: #fff !important; font-weight: 800; font-size: .66rem; letter-spacing: .02em; line-height: 1.1; text-align: center; white-space: normal; max-width: 100%; }
html.rg .main-sidebar .btn-side > div { display: none; }
html.rg .main-sidebar .btn-side::before { font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 1rem; color: rgba(255, 255, 255, .92); }
html.rg .main-sidebar a[href*="/home"] > .btn-side::before { content: "\f015"; }
html.rg .main-sidebar a[href*="roleta"] > .btn-side::before { content: "\f1ce"; }
html.rg .main-sidebar a[href*="tabela"] > .btn-side::before, html.rg .main-sidebar a[href*="drive.google"] > .btn-side::before { content: "\f0ce"; }
html.rg .main-sidebar a[href*="youtube"] > .btn-side::before, html.rg .main-sidebar a[href*="ao-vivo"] > .btn-side::before { content: "\f03d"; }
html.rg .main-sidebar a.rg-sb-tem-giro > .btn-side::before { display: inline-block; animation: rg-sb-gira 3s linear infinite; }
@keyframes rg-sb-gira { to { transform: rotate(360deg); } }
html.rg .main-sidebar .btn-side .rg-sb-selo { position: absolute; top: -6px; right: -4px; margin: 0; }

/* =====================================================================
   CHAT "Fale com seu consultor" (components/chat-widget) - mais visível
   Só tamanho, cor e animação do botão; posição e lógica continuam as do chat.
   ===================================================================== */
html.rg .ch-fab-wrapper { width: 64px; height: 64px; }
html.rg #ch-btn {
    width: 64px;
    height: 64px;
    background: linear-gradient(135deg, var(--rg-rosa), var(--rg-violeta));
    color: #fff;
    font-size: 26px;
    border: 3px solid rgba(255, 255, 255, .9);
    animation: rg-chat-pulso 2.4s ease-out infinite;
}
html.rg #ch-btn:hover { transform: scale(1.07); }
html.rg #ch-btn .ch-btn-icon { color: #fff; }
html.rg .ch-fab-arc { width: 126px; height: 126px; }
html.rg .ch-fab-arc text {
    font-family: var(--rg-font) !important;
    font-size: 10.5px;
    font-weight: 800;
    fill: var(--rg-lima);
    /* contorno escuro atrás das letras: legível em cima de banner, card ou fundo */
    paint-order: stroke;
    stroke: #0f0828;
    stroke-width: 3.5px;
    stroke-linejoin: round;
}
html.rg .ch-badge {
    min-width: 24px;
    height: 24px;
    border-radius: 12px;
    background: var(--rg-coral);
    color: var(--rg-tinta);
    font-size: 12px;
    font-weight: 800;
    border: 2px solid #0f0828;
    animation: rg-pop .4s ease both;
}
html.rg .ch-panel-header { background: linear-gradient(90deg, var(--rg-violeta), var(--rg-rosa)) !important; }
html.rg .ch-panel-title { color: #fff !important; font-weight: 800; }
@keyframes rg-chat-pulso {
    0% { box-shadow: 0 10px 28px rgba(255, 95, 162, .45), 0 0 0 0 rgba(255, 95, 162, .6); }
    70% { box-shadow: 0 10px 28px rgba(255, 95, 162, .45), 0 0 0 18px rgba(255, 95, 162, 0); }
    100% { box-shadow: 0 10px 28px rgba(255, 95, 162, .45), 0 0 0 0 rgba(255, 95, 162, 0); }
}
@media (max-width: 767px) {
    html.rg .ch-fab-wrapper { width: 54px; height: 54px; }
    html.rg #ch-btn { width: 54px; height: 54px; font-size: 22px; }
    html.rg .ch-fab-arc { width: 106px; height: 106px; }
    html.rg .ch-fab-arc text { font-size: 10px; }
}

/* =====================================================================
   CARTELA (loterias) - números viram "bolinhas" de jogo
   Tamanho continua o da tela; só muda a aparência.
   ===================================================================== */
html.rg .table-responsive.responsive-bet {
    background: var(--rg-surface) !important;
    border: 1px solid var(--rg-glass-borda) !important;
    border-radius: var(--rg-radius) !important;
    padding: 6px !important;
}
html.rg .table-responsive.responsive-bet table.table,
html.rg .table-responsive.responsive-bet table.table td { background: transparent !important; border: 0 !important; }

html.rg .table-responsive.responsive-bet button.btn.btn-number-default,
html.rg .lw-matrix .lw-num-btn {
    background: var(--rg-surface-2) !important;
    border: 1px solid var(--rg-line-2) !important;
    color: #fff !important;
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .25) !important;
    border-radius: 12px !important;
}
html.rg .table-responsive.responsive-bet button.btn.btn-number-default:hover,
html.rg .lw-matrix .lw-num-btn:hover {
    border-color: var(--rg-accent) !important;
    color: #fff !important;
    transform: translateY(-1px) !important;
}
/* selecionado e quantidade válida: preenchido na cor da banca */
html.rg .table-responsive.responsive-bet button.btn.btn-beat-number,
html.rg .lw-matrix .lw-num-btn.lw-num-selected {
    background: var(--rg-accent) !important;
    border: 1px solid color-mix(in srgb, var(--rg-accent) 70%, #000) !important;
    color: var(--rg-on-accent) !important;
    border-radius: 12px !important;
    box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .2), 0 0 14px color-mix(in srgb, var(--rg-accent) 45%, transparent) !important;
    animation: rg-pop .34s cubic-bezier(.2, 1.4, .4, 1) both;
}
/* selecionado mas a quantidade ainda não fecha um jogo: laranja (mesma regra de antes) */
html.rg .table-responsive.responsive-bet button.btn.btn-number-invalid {
    background: var(--rg-warn) !important;
    border: 1px solid #c2410c !important;
    color: #fff !important;
    border-radius: 12px !important;
    box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .2), 0 0 14px rgba(251, 146, 60, .45) !important;
    animation: rg-pop .34s cubic-bezier(.2, 1.4, .4, 1) both;
}

/* quando fecha a quantidade: onda de brilho passando pela cartela (coluna por coluna) */
html.rg.rg-completo .responsive-bet .btn-beat-number,
html.rg.rg-completo .lw-matrix .lw-num-selected { animation: rg-wave .7s ease both; }
html.rg.rg-completo .responsive-bet td:nth-child(2) .btn-beat-number { animation-delay: .04s; }
html.rg.rg-completo .responsive-bet td:nth-child(3) .btn-beat-number { animation-delay: .08s; }
html.rg.rg-completo .responsive-bet td:nth-child(4) .btn-beat-number { animation-delay: .12s; }
html.rg.rg-completo .responsive-bet td:nth-child(5) .btn-beat-number { animation-delay: .16s; }
html.rg.rg-completo .responsive-bet td:nth-child(6) .btn-beat-number { animation-delay: .20s; }
html.rg.rg-completo .responsive-bet td:nth-child(7) .btn-beat-number { animation-delay: .24s; }
html.rg.rg-completo .responsive-bet td:nth-child(8) .btn-beat-number { animation-delay: .28s; }
html.rg.rg-completo .responsive-bet td:nth-child(9) .btn-beat-number { animation-delay: .32s; }
html.rg.rg-completo .responsive-bet td:nth-child(10) .btn-beat-number { animation-delay: .36s; }

/* surpresinha: a cartela "embaralha" por um instante */
html.rg.rg-embaralhando .responsive-bet .btn-number-default,
html.rg.rg-embaralhando .lw-matrix .lw-num-btn:not(.lw-num-selected) { animation: rg-shuffle .55s steps(6) both; }

/* contador "Quantidade selecionada (x/y)" ganha barra de progresso e dica do que falta */
html.rg #number-counter {
    position: relative;
    font-weight: 800;
    padding-bottom: 16px;
}
html.rg #number-counter::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 8px;
    border-radius: 999px;
    background:
        linear-gradient(90deg, var(--rg-accent), color-mix(in srgb, var(--rg-accent) 60%, var(--rg-gold))) 0 0 / calc(var(--rg-prog) * 100%) 100% no-repeat,
        var(--rg-surface-2);
    transition: background-size .35s cubic-bezier(.2, .9, .3, 1.2);
}
html.rg[data-rg-falta] #number-counter::before {
    content: var(--rg-falta-txt, "");
    float: right;
    margin-left: 8px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    color: #fff;
    background: var(--rg-accent-soft);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--rg-accent) 60%, transparent);
    animation: rg-pulse 1.2s ease-in-out infinite;
}
html.rg[data-rg-falta="0"] #number-counter::before { color: #fff; background: #15803d; animation: rg-pop .4s ease both; }

/* contador do site */
html.rg .lw-count-badge { border-radius: 999px; transition: transform .2s ease; }
html.rg .lw-count-badge.lw-count-full { animation: rg-pop .4s ease both; }

/* botões da cartela */
html.rg .btn-surpresinha,
html.rg .lw-random-btn {
    border-radius: 12px !important;
    font-weight: 800 !important;
    transition: transform .12s ease, box-shadow .18s ease;
}
html.rg .btn-surpresinha:active,
html.rg .lw-random-btn:active,
html.rg .btn-clear-numbers:active { transform: scale(.94); }
html.rg .btn-clear-numbers,
html.rg .btn-surpresinha {
    border-radius: 12px !important;
    background: var(--rg-surface-2) !important;
    border: 1px solid var(--rg-line-2) !important;
    color: #fff !important;
}
html.rg .btn-surpresinha.btn-surpresinha-active {
    background: var(--rg-accent) !important;
    color: var(--rg-on-accent) !important;
}
html.rg .newTeimosinha {
    background: var(--rg-surface) !important;
    border: 1px solid var(--rg-glass-borda) !important;
    border-radius: var(--rg-radius) !important;
    color: var(--rg-ink) !important;
}

/* =====================================================================
   BICHÃO - cartas dos bichos
   ===================================================================== */
html.rg label.animal-container-choose {
    background: var(--rg-surface-2) !important;
    border: 1px solid var(--rg-line-2) !important;
    border-radius: 16px !important;
    color: var(--rg-ink) !important;
    transition: transform .15s ease, border-color .2s ease;
}
html.rg label.animal-container-choose:hover { transform: translateY(-2px); border-color: var(--rg-accent) !important; }
html.rg label.animal-container-choose.active {
    background: var(--rg-accent-soft) !important;
    color: #fff !important;
    border: 2px solid var(--rg-accent) !important;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-accent) 18%, transparent) !important;
    animation: rg-pop .34s cubic-bezier(.2, 1.4, .4, 1) both;
}

/* =====================================================================
   Botão de som (inserido pelo JS na navbar) e confete
   ===================================================================== */
html.rg .rg-som-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid var(--rg-line-2);
    background: var(--rg-surface);
    color: #fff;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}
html.rg .rg-som-btn:active { transform: scale(.92); }
/* no menu do avatar (celular): vira um item do menu, sem apertar a barra do topo */
html.rg .rg-som-item .rg-som-btn {
    display: flex;
    width: 100%;
    height: auto;
    justify-content: flex-start;
    gap: 8px;
    padding: 10px 16px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    font-size: 16px;
    font-weight: 700;
}

/* impressão: sem roupagem (o JS também tira a classe antes de imprimir) */
@media print {
    html.rg .wrapper, html.rg .content-wrapper, html.rg body { background: #fff !important; }
}
.rg-confete {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none; /* nunca bloqueia clique */
    z-index: 2147483000;
}

/* =====================================================================
   Celular
   ===================================================================== */
@media (max-width: 767px) {
    html.rg .card,
    html.rg .card-master { border-radius: 16px !important; }
    /* cartões de saldo (extrato, carteira, afiliado): tinham largura mínima de 300px lado a lado e vazavam da tela */
    html.rg .d-flex:has(> .card-master-bottom) { flex-direction: column; align-items: stretch; width: 100%; }
    html.rg .card-master-bottom { min-width: 0 !important; width: 100%; margin-left: 0 !important; margin-right: 0 !important; padding: 18px !important; }
    html.rg .card-master-bottom + .card-master-bottom { margin-top: 10px; }
    /* botão "gerar relatório" do Bichão (minhas apostas / resultados) cabe na coluna estreita */
    html.rg #bichao-buscar-resultados { white-space: normal; width: 100%; padding-left: 6px; padding-right: 6px; }
    /* afiliados: as estrelas de nível quebram linha em vez de passar da tela */
    html.rg .progress-stars { flex-wrap: wrap; gap: 6px; justify-content: center !important; }
    html.rg .modal-content { border-radius: 20px !important; }
    html.rg .table thead th { font-size: .7rem; }
    html.rg .table-responsive.responsive-bet { padding: 2px !important; }
    html.rg .table-responsive.responsive-bet button.btn,
    html.rg .lw-matrix .lw-num-btn {
        letter-spacing: -.06em;
        border-radius: 10px !important;
    }
    /* atalhos: o slide é estreito no celular; chip e texto menores para caber sem cortar */
    html.rg .category-info > a { padding: 8px 2px 6px; border-radius: 14px; margin: 0 2px; }
    html.rg .category-info .icon-container { width: 40px; height: 40px; border-radius: 12px; margin-bottom: 4px; }
    html.rg .category-info .icon-container img { width: 32px !important; height: 32px; }
    html.rg .category-info .txtnav {
        font-size: .68rem !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    html.rg .box-imgs { margin: 4px; padding: 6px !important; }
    /* inputs com 16px evitam o zoom automático do iPhone ao tocar */
    html.rg .form-control,
    html.rg .custom-select { font-size: 16px; }
}

/* =====================================================================
   Animações
   ===================================================================== */
@keyframes rg-pop {
    0% { transform: scale(.82); }
    60% { transform: scale(1.12); }
    100% { transform: scale(1); }
}
@keyframes rg-wave {
    0% { transform: scale(1); filter: brightness(1); }
    40% { transform: scale(1.16) translateY(-2px); filter: brightness(1.25) saturate(1.2); }
    100% { transform: scale(1); filter: brightness(1); }
}
@keyframes rg-shuffle {
    0%, 100% { transform: none; }
    20% { transform: translateY(-2px) rotate(-4deg); }
    40% { transform: translateY(1px) rotate(3deg); background: var(--rg-accent-soft); }
    60% { transform: translateY(-1px) rotate(-2deg); }
    80% { transform: translateY(1px) rotate(1deg); }
}
@keyframes rg-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.06); }
}
@keyframes rg-rise {
    /* só opacidade: transform em card prenderia modais/popups fixos que vivem dentro dele */
    from { opacity: 0; }
    to { opacity: 1; }
}

/* quem pede menos movimento no aparelho não recebe animação */
@media (prefers-reduced-motion: reduce) {
    html.rg *, html.rg *::before, html.rg *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}
html.rg .main-sidebar .rg-sb-nivel small { white-space: normal !important; overflow-wrap: anywhere; font-size: .7rem !important; text-overflow: clip; }

/* ==========================================================================
   Roleta (Gire e ganhe) — layout novo
   ========================================================================== */
html.rg .rg-rl { position: relative; padding: 4px 0 24px; }
html.rg .rg-rl::before {
    content: ""; position: absolute; inset: 0 0 auto; height: 520px; z-index: -1; pointer-events: none;
    background: radial-gradient(420px 300px at 30% 30%, rgba(139, 92, 246, .35), transparent 70%),
                radial-gradient(360px 260px at 75% 20%, rgba(255, 95, 162, .22), transparent 70%);
}
html.rg .rg-rl-topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
html.rg .rg-rl-sobre { color: var(--rg-rosa); font-weight: 800; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; }
html.rg .rg-rl-topo h1 { margin: 2px 0 2px; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.7rem, 1.2rem + 2vw, 2.6rem); color: #fff; line-height: 1.05; }
html.rg .rg-rl-topo p { margin: 0; color: var(--rg-ink-2); }
html.rg .rg-rl-topo-dir { display: flex; align-items: center; gap: 10px; }
html.rg .rg-rl-musica {
    width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--rg-line-2); background: var(--rg-surface);
    color: var(--rg-ink-2); font-size: 1.05rem; cursor: pointer;
}
html.rg .rg-rl-musica.tocando { color: var(--rg-lima-texto); border-color: var(--rg-lima); }
html.rg .rg-rl-giros {
    display: flex; align-items: center; gap: 12px; padding: 10px 18px 10px 12px; border-radius: 18px;
    background: var(--rg-surface); border: 1px solid var(--rg-line-2);
}
html.rg .rg-rl-giros > i { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--rg-surface-2); color: var(--rg-ink-3); font-size: 1.1rem; }
html.rg .rg-rl-giros span { display: block; color: var(--rg-ink-3); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-rl-giros b { display: block; font-family: var(--rg-font-display) !important; font-size: 1.7rem; line-height: 1; color: #fff; }
html.rg .rg-rl-giros.tem { border-color: var(--rg-lima); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 12%, transparent); }
html.rg .rg-rl-giros.tem > i { background: var(--rg-lima); color: var(--rg-on-lima); animation: rg-sb-gira 4s linear infinite; }
html.rg .rg-rl-giros.tem b { color: var(--rg-lima-texto); }

html.rg .rg-rl-grade { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, 1fr); gap: 18px; align-items: start; }
html.rg .rg-rl-palco {
    padding: 34px 20px 22px; border-radius: 26px; text-align: center;
    background: radial-gradient(circle at 50% 42%, rgba(139, 92, 246, .28), transparent 62%), var(--rg-surface);
    border: 1px solid var(--rg-line);
}

/* roda */
html.rg .rg-rl-roda-wrap { display: flex; justify-content: center; padding: 14px 0 6px; }
html.rg .rg-rl-roda { position: relative; width: min(100%, 470px); aspect-ratio: 1; }
html.rg .rg-rl-roda canvas {
    position: relative; z-index: 2; display: block; width: 100%; height: 100%; border-radius: 50%;
    border: 10px solid #2b2068; box-shadow: 0 0 0 4px rgba(255, 255, 255, .12), 0 20px 50px rgba(4, 2, 16, .6), 0 0 60px rgba(139, 92, 246, .35);
    transition: transform 6s cubic-bezier(.1, 0, .1, 1); transform-origin: 50% 50%;
}
html.rg .rg-rl-luzes { position: absolute; inset: -14px; border-radius: 50%; z-index: 1; background: linear-gradient(145deg, #3a2a8a, #1a1240); box-shadow: 0 0 0 2px rgba(255, 255, 255, .08); }
html.rg .rg-rl-luzes i {
    position: absolute; width: 10px; height: 10px; border-radius: 50%; transform: translate(-50%, -50%);
    margin-left: 0; background: #fff6c8; box-shadow: 0 0 10px #ffd84d; animation: rg-rl-luz 0.8s ease-in-out infinite alternate;
}
html.rg .rg-rl-luzes i:nth-child(3n) { background: #ffd1e6; box-shadow: 0 0 10px var(--rg-rosa); }
html.rg .rg-rl-luzes i:nth-child(3n+1) { background: #efffc0; box-shadow: 0 0 10px var(--rg-lima); }
@keyframes rg-rl-luz { from { opacity: .35; } to { opacity: 1; } }
body.rg-rl-girando .rg-rl-luzes i { animation-duration: .18s; }
/* o anel de luzes fica fora do canvas: as bolinhas ficam sobre a moldura */
html.rg .rg-rl-luzes i { left: 50%; top: 50%; }

html.rg .rg-rl-ponteiro { position: absolute; top: -26px; left: 50%; z-index: 5; width: 54px; height: 64px; transform: translateX(-50%); transform-origin: 50% 20%; transition: transform .05s ease-out; filter: drop-shadow(0 6px 6px rgba(0, 0, 0, .5)); }
html.rg .rg-rl-ponteiro span { display: block; width: 100%; height: 100%; background: linear-gradient(180deg, #fff 0%, var(--rg-lima) 35%, #8fbf10 100%); clip-path: polygon(50% 100%, 0 22%, 12% 0, 88% 0, 100% 22%); }
html.rg .rg-rl-ponteiro.tique { transform: translateX(-50%) rotate(-18deg); }

html.rg .rg-rl-centro {
    position: absolute; z-index: 4; top: 50%; left: 50%; width: 24%; height: 24%; transform: translate(-50%, -50%);
    border-radius: 50%; border: 6px solid #fff; cursor: pointer; padding: 0;
    background: radial-gradient(circle at 35% 30%, #efffb0, var(--rg-lima) 45%, #86b40c);
    box-shadow: 0 0 0 6px rgba(20, 16, 46, .55), 0 10px 26px rgba(0, 0, 0, .5), 0 0 30px color-mix(in srgb, var(--rg-lima) 55%, transparent);
    animation: rg-rl-centro 1.6s ease-in-out infinite;
}
html.rg .rg-rl-centro span { font-family: Anton, Impact, sans-serif !important; color: var(--rg-tinta); font-size: clamp(1rem, 3.2vw, 1.6rem); letter-spacing: .04em; }
html.rg .rg-rl-centro:active { transform: translate(-50%, -50%) scale(.94); }
html.rg .rg-rl-centro.sem { animation: none; filter: grayscale(.8) brightness(.8); }
body.rg-rl-girando .rg-rl-centro { animation: none; pointer-events: none; opacity: .85; }
@keyframes rg-rl-centro { 0%, 100% { box-shadow: 0 0 0 6px rgba(20, 16, 46, .55), 0 10px 26px rgba(0, 0, 0, .5), 0 0 22px color-mix(in srgb, var(--rg-lima) 45%, transparent); } 50% { box-shadow: 0 0 0 6px rgba(20, 16, 46, .55), 0 10px 26px rgba(0, 0, 0, .5), 0 0 44px color-mix(in srgb, var(--rg-lima) 80%, transparent); } }

/* ações abaixo da roda */
html.rg .rg-rl-acao { max-width: 470px; margin: 22px auto 0; display: flex; flex-direction: column; gap: 12px; }
html.rg .rg-rl-acao[hidden] { display: none; }
html.rg .rg-rl-btn-girar, html.rg .rg-rl-btn-ganhar {
    width: 100%; padding: 16px; border: 0; border-radius: 16px; cursor: pointer;
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.15rem;
    background: var(--rg-lima); color: var(--rg-on-lima); box-shadow: 0 10px 26px color-mix(in srgb, var(--rg-lima) 30%, transparent), inset 0 -4px 0 rgba(0, 0, 0, .15);
}
html.rg .rg-rl-btn-girar:active, html.rg .rg-rl-btn-ganhar:active { transform: scale(.98); }
body.rg-rl-girando .rg-rl-btn-girar { opacity: .5; pointer-events: none; }
html.rg .rg-rl-btn-ganhar { animation: rg-rl-pulsa 1.4s ease-in-out infinite; }
@keyframes rg-rl-pulsa { 0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--rg-lima) 55%, transparent); } 60% { box-shadow: 0 0 0 14px color-mix(in srgb, var(--rg-lima) 0%, transparent); } }
html.rg .rg-rl-sem { padding: 18px; border-radius: 18px; background: rgba(20, 16, 46, .6); border: 1px dashed var(--rg-line-2); }
html.rg .rg-rl-sem b { color: #fff; font-size: 1.15rem; }
html.rg .rg-rl-sem span { color: var(--rg-ink-2); }
html.rg .rg-rl-sem strong { color: var(--rg-lima-texto); }

html.rg .rg-rl-auto { display: flex; align-items: center; gap: 8px; padding: 8px 8px 8px 14px; border-radius: 14px; background: rgba(20, 16, 46, .6); border: 1px solid var(--rg-line); }
html.rg .rg-rl-auto > span { color: var(--rg-ink-3); font-weight: 700; font-size: .82rem; white-space: nowrap; }
html.rg .rg-rl-auto-qtds { flex: 1; display: flex; gap: 6px; min-width: 0; }
html.rg .rg-rl-auto-qtds.travado { opacity: .45; pointer-events: none; }
html.rg .rg-rl-auto-qtds button {
    flex: 1; min-width: 0; padding: 8px 4px; border-radius: 10px; border: 1px solid var(--rg-line-2);
    background: transparent; color: #fff; font-weight: 800; font-size: .85rem; cursor: pointer; white-space: nowrap;
}
html.rg .rg-rl-auto-qtds button.ativo { background: var(--rg-violeta); border-color: var(--rg-violeta); }
html.rg .rg-rl-auto-btn { padding: 9px 16px; border: 0; border-radius: 10px; background: var(--rg-gold); color: var(--rg-tinta); font-weight: 800; cursor: pointer; }
html.rg .rg-rl-auto-btn.parar { background: var(--rg-bad); color: #fff; }
html.rg .rg-rl-auto-btn.retomar { background: var(--rg-good); color: var(--rg-tinta); }
html.rg .rg-rl-auto-prog div { height: 8px; border-radius: 99px; background: rgba(255, 255, 255, .1); overflow: hidden; }
html.rg .rg-rl-auto-prog span { display: block; height: 100%; width: 0; border-radius: 99px; background: linear-gradient(90deg, var(--rg-violeta), var(--rg-rosa)); transition: width .4s; }
html.rg .rg-rl-auto-prog small { color: var(--rg-ink-2); font-weight: 700; }

/* coluna lateral */
html.rg .rg-rl-lado { display: flex; flex-direction: column; gap: 14px; }
html.rg .rg-rl-card { padding: 18px; border-radius: 22px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-rl-card h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-family: var(--rg-font-display) !important; font-size: 1.05rem !important; font-weight: 800; color: #fff; }
html.rg .rg-rl-card h2 > i { color: var(--rg-gold); }
html.rg .rg-rl-card-sub { margin: 0 0 12px; color: var(--rg-ink-3); font-size: .9rem; }
html.rg .rg-rl-regras { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
html.rg .rg-rl-regras li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, .04); }
html.rg .rg-rl-regras li[hidden] { display: none; }
html.rg .rg-rl-regras li span { color: #fff; font-weight: 800; min-width: 64px; }
html.rg .rg-rl-regras li i { color: var(--rg-ink-3); font-size: .8rem; }
html.rg .rg-rl-regras li b { color: var(--rg-lima-texto); font-weight: 800; }
html.rg .rg-rl-regras li em { margin-left: auto; font-style: normal; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; padding: 3px 8px; border-radius: 99px; background: var(--rg-rosa); color: #fff; }
html.rg .rg-rl-regras li.sugerida { background: rgba(255, 95, 162, .12); box-shadow: inset 0 0 0 1.5px var(--rg-rosa); }
html.rg .rg-rl-mais { margin-top: 8px; background: none; border: 0; padding: 0; color: var(--rg-ink-2); font-weight: 700; text-decoration: underline; cursor: pointer; }
html.rg .rg-rl-btn-depositar {
    width: 100%; margin-top: 12px; padding: 13px; border: 0; border-radius: 14px; cursor: pointer;
    background: linear-gradient(135deg, var(--rg-rosa), var(--rg-violeta)); color: #fff; font-weight: 800; font-size: 1rem;
    box-shadow: 0 8px 20px rgba(255, 95, 162, .3);
}
html.rg .rg-rl-vivo { width: 10px; height: 10px; border-radius: 50%; background: var(--rg-bad); box-shadow: 0 0 0 0 rgba(248, 113, 113, .7); animation: rg-rl-vivo 1.4s infinite; }
@keyframes rg-rl-vivo { 70% { box-shadow: 0 0 0 8px rgba(248, 113, 113, 0); } 100% { box-shadow: 0 0 0 0 rgba(248, 113, 113, 0); } }
html.rg .rg-rl-ganhadores { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; max-height: 260px; overflow-y: auto; }
html.rg .rg-rl-ganhadores li { display: flex; align-items: center; gap: 10px; padding: 8px 4px; border-bottom: 1px solid var(--rg-line); }
html.rg .rg-rl-ganhadores li > i { flex: 0 0 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: rgba(245, 197, 66, .15); color: var(--rg-gold); }
html.rg .rg-rl-ganhadores li div { flex: 1; min-width: 0; color: var(--rg-ink-2); font-size: .9rem; line-height: 1.3; }
html.rg .rg-rl-ganhadores li b { color: #fff; }
html.rg .rg-rl-ganhadores li strong { color: var(--rg-lima-texto); }
html.rg .rg-rl-ganhadores li small { color: var(--rg-ink-3); font-size: .75rem !important; white-space: nowrap; }
html.rg .rg-rl-premios { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
html.rg .rg-rl-premio { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 6px; border-radius: 14px; background: rgba(255, 255, 255, .04); text-align: center; }
html.rg .rg-rl-premio img { width: 48px; height: 48px; object-fit: contain; }
html.rg .rg-rl-premio > i { width: 48px; height: 48px; display: grid; place-items: center; font-size: 1.5rem; color: var(--rg-gold); }
html.rg .rg-rl-premio b { color: #fff; font-size: .82rem; line-height: 1.2; word-break: break-word; }
html.rg .rg-rl-premio small { color: var(--rg-ink-3); font-size: .66rem !important; font-weight: 800; letter-spacing: .06em; }
html.rg .rg-rl-meus { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 12px; padding: 11px; border-radius: 12px; border: 1px solid var(--rg-line-2); color: #fff !important; font-weight: 800; text-decoration: none !important; }

/* modais */
html.rg .rg-rl-modal { position: fixed; inset: 0; z-index: 1060; display: grid; place-items: center; padding: 16px; background: rgba(8, 5, 24, .78); backdrop-filter: blur(6px); opacity: 0; transition: opacity .25s; }
html.rg .rg-rl-modal[hidden] { display: none; }
html.rg .rg-rl-modal.aberto { opacity: 1; }
html.rg .rg-rl-modal-caixa {
    position: relative; width: 100%; max-width: 380px; padding: 28px 22px 20px; border-radius: 26px; text-align: center;
    background: radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--rg-lima) 25%, transparent), transparent 60%), #1c1446;
    border: 1px solid color-mix(in srgb, var(--rg-lima) 40%, transparent); box-shadow: 0 30px 80px rgba(0, 0, 0, .6);
    transform: scale(.9); transition: transform .25s;
}
html.rg .rg-rl-modal.aberto .rg-rl-modal-caixa { transform: scale(1); }
html.rg .rg-rl-modal-caixa.perdeu { background: radial-gradient(circle at 50% 0%, rgba(139, 92, 246, .25), transparent 60%), #1c1446; border-color: var(--rg-line-2); }
html.rg .rg-rl-modal-x { position: absolute; top: 10px; right: 12px; width: 34px; height: 34px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .08); color: #fff; font-size: 1.3rem; cursor: pointer; }
html.rg .rg-rl-modal-sobre { display: block; color: var(--rg-lima-texto); font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.25rem; }
html.rg .rg-rl-modal-caixa.perdeu .rg-rl-modal-sobre { color: var(--rg-ink-2); }
html.rg .rg-rl-modal-img { display: grid; place-items: center; height: 120px; margin: 12px 0; }
html.rg .rg-rl-modal-img img { max-width: 120px; max-height: 120px; object-fit: contain; animation: rg-rl-pula 1.2s ease-in-out infinite; }
html.rg .rg-rl-modal-img i { font-size: 4rem; color: var(--rg-gold); }
html.rg .rg-rl-modal-caixa.perdeu .rg-rl-modal-img i { color: var(--rg-ink-3); }
@keyframes rg-rl-pula { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
html.rg .rg-rl-modal-premio { display: block; font-family: Anton, Impact, sans-serif !important; font-size: 2.2rem; line-height: 1.05; color: #fff; text-transform: uppercase; }
html.rg .rg-rl-modal-caixa.perdeu .rg-rl-modal-premio { font-size: 1.6rem; color: var(--rg-ink-2); }
html.rg .rg-rl-modal-caixa > small { display: block; margin-top: 6px; color: var(--rg-ink-3); font-weight: 700; }
html.rg .rg-rl-modal-btn {
    display: block; width: 100%; margin-top: 18px; padding: 14px; border: 0; border-radius: 14px; cursor: pointer; text-decoration: none !important;
    background: var(--rg-lima); color: var(--rg-on-lima) !important; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.05rem;
}
html.rg .rg-rl-modal-link { display: block; width: 100%; margin-top: 10px; background: none; border: 0; color: var(--rg-ink-2); font-weight: 700; text-decoration: underline; cursor: pointer; }
html.rg .rg-rl-modal-link[hidden] { display: none; }
html.rg .rg-rl-resumo-num { margin: 8px 0 12px; color: var(--rg-ink-2); }
html.rg .rg-rl-resumo-num b { color: #fff; }
html.rg .rg-rl-resumo-num b.verde { color: var(--rg-lima-texto); }
html.rg .rg-rl-resumo-lista { list-style: none; margin: 0; padding: 0; max-height: 40vh; overflow-y: auto; text-align: left; display: flex; flex-direction: column; gap: 6px; }
html.rg .rg-rl-resumo-lista li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; background: rgba(255, 255, 255, .05); border-left: 3px solid var(--rg-lima); }
html.rg .rg-rl-resumo-lista li.vazio { border-left-color: var(--rg-line-2); color: var(--rg-ink-2); }
html.rg .rg-rl-resumo-lista img { width: 36px; height: 36px; object-fit: contain; }
html.rg .rg-rl-resumo-lista li > i { width: 36px; text-align: center; color: var(--rg-gold); }
html.rg .rg-rl-resumo-lista b { display: block; color: #fff; }
html.rg .rg-rl-resumo-lista small { color: var(--rg-ink-3); }
html.rg .rg-rl-aviso {
    position: fixed; left: 50%; top: 40%; z-index: 1055; transform: translate(-50%, -50%) scale(.9); opacity: 0; pointer-events: none;
    padding: 16px 26px; border-radius: 18px; background: rgba(20, 16, 46, .92); border: 1px solid var(--rg-line-2);
    font-family: Anton, Impact, sans-serif !important; font-size: 1.6rem; color: var(--rg-ink-2); text-transform: uppercase; transition: opacity .25s, transform .25s;
}
html.rg .rg-rl-aviso.mostra { opacity: 1; transform: translate(-50%, -50%) scale(1); }
html.rg .rg-rl-aviso.ganhou { color: var(--rg-lima-texto); border-color: var(--rg-lima); box-shadow: 0 0 40px color-mix(in srgb, var(--rg-lima) 30%, transparent); }

@media (max-width: 991px) {
    html.rg .rg-rl-grade { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575px) {
    html.rg .rg-rl-topo { align-items: center; }
    html.rg .rg-rl-topo p { display: none; }
    html.rg .rg-rl-palco { padding: 26px 12px 16px; border-radius: 22px; }
    html.rg .rg-rl-ponteiro { width: 42px; height: 50px; top: -20px; }
    html.rg .rg-rl-luzes { inset: -10px; }
    html.rg .rg-rl-luzes i { width: 7px; height: 7px; }
    html.rg .rg-rl-roda canvas { border-width: 7px; }
    html.rg .rg-rl-centro { border-width: 4px; }
    html.rg .rg-rl-auto { flex-wrap: wrap; }
    html.rg .rg-rl-auto > span { width: 100%; }
    html.rg .rg-rl-premios { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ==========================================================================
   Extrato financeiro (dashboard) — layout novo
   ========================================================================== */
html.rg .rg-ex { position: relative; display: flex; flex-direction: column; gap: 14px; }
html.rg .rg-ex-carregando { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 2000; overflow: hidden; }
html.rg .rg-ex-carregando span { display: block; height: 100%; width: 40%; background: linear-gradient(90deg, transparent, var(--rg-lima), transparent); animation: rg-ex-carrega 1s linear infinite; }
@keyframes rg-ex-carrega { from { transform: translateX(-100%); } to { transform: translateX(260%); } }

html.rg .rg-ex-topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
html.rg .rg-ex-sobre { color: var(--rg-lima-texto); font-weight: 800; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; }
html.rg .rg-ex-topo h1 { margin: 2px 0 0; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.1rem); color: #fff; }
html.rg .rg-ex-exportar { display: flex; gap: 8px; }
html.rg .rg-ex-btn {
    display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 12px; cursor: pointer;
    border: 1px solid var(--rg-line-2); background: var(--rg-surface); color: #fff !important; font-weight: 700; text-decoration: none !important;
}
html.rg .rg-ex-btn:hover { border-color: var(--rg-ink-3); }
html.rg .rg-ex-btn:disabled { opacity: .7; cursor: wait; }
html.rg .rg-ex-btn-pronto, html.rg .rg-ex-btn-lima { background: var(--rg-lima); border-color: var(--rg-lima); color: var(--rg-on-lima) !important; }
html.rg .rg-ex-alerta { padding: 12px 16px; border-radius: 12px; background: rgba(251, 146, 60, .15); border: 1px solid var(--rg-warn); color: #fff; }

html.rg .rg-ex-periodos { display: flex; gap: 6px; flex-wrap: wrap; padding: 5px; border-radius: 14px; background: var(--rg-surface); border: 1px solid var(--rg-line); align-self: flex-start; }
html.rg .rg-ex-periodos button { padding: 9px 16px; border: 0; border-radius: 10px; background: transparent; color: var(--rg-ink-2); font-weight: 700; cursor: pointer; }
html.rg .rg-ex-periodos button.ativo { background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-ex-datas { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
html.rg .rg-ex-datas.d-none { display: none !important; }
html.rg .rg-ex-datas .form-control { max-width: 170px; }
html.rg .rg-ex-datas span { color: var(--rg-ink-3); }

html.rg .rg-ex-filtros { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 8px; }
html.rg .rg-ex-busca { position: relative; }
html.rg .rg-ex-busca > i { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--rg-ink-3); z-index: 1; }
html.rg .rg-ex-busca .form-control { padding-left: 38px; }
html.rg .rg-ex-lista { position: absolute; z-index: 30; top: calc(100% + 4px); left: 0; right: 0; list-style: none; margin: 0; padding: 6px; border-radius: 12px; background: #1c1446; border: 1px solid var(--rg-line-2); box-shadow: var(--rg-shadow-lg); max-height: 280px; overflow-y: auto; }
html.rg .rg-ex-lista li { padding: 9px 12px; border-radius: 8px; color: #fff; cursor: pointer; }
html.rg .rg-ex-lista li:hover { background: rgba(255, 255, 255, .08); }
html.rg .rg-ex-lista li.vazio { color: var(--rg-ink-3); cursor: default; }
html.rg .rg-ex-chip { display: flex; align-items: center; gap: 8px; height: 100%; min-height: 44px; padding: 0 8px 0 14px; border-radius: 12px; background: color-mix(in srgb, var(--rg-lima) 12%, transparent); border: 1px solid var(--rg-lima); color: #fff; font-weight: 700; }
html.rg .rg-ex-chip i { color: var(--rg-lima-texto); }
html.rg .rg-ex-chip button { margin-left: auto; width: 30px; height: 30px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; font-size: 1.2rem; line-height: 1; cursor: pointer; }

/* resultado */
html.rg .rg-ex-resultado {
    display: grid; grid-template-columns: minmax(220px, .9fr) minmax(0, 1.4fr) minmax(220px, .9fr); gap: 18px; align-items: center;
    padding: 20px 22px; border-radius: 22px; border: 1px solid var(--rg-line);
    background: radial-gradient(500px 220px at 0% 0%, color-mix(in srgb, var(--rg-lima) 14%, transparent), transparent 70%), var(--rg-surface);
}
html.rg .rg-ex-resultado-num span { color: var(--rg-ink-3); font-weight: 800; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-ex-resultado-num b { display: block; margin: 4px 0; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.4rem); color: var(--rg-lima-texto); line-height: 1.05; }
html.rg .rg-ex-resultado-num b.neg { color: var(--rg-bad); }
html.rg .rg-ex-resultado-num small { color: var(--rg-ink-3); font-size: .8rem !important; }
html.rg .rg-ex-barra { display: flex; height: 14px; border-radius: 99px; overflow: hidden; background: rgba(255, 255, 255, .08); gap: 2px; }
html.rg .rg-ex-barra span { height: 100%; min-width: 2px; }
html.rg .rg-ex-legenda { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
html.rg .rg-ex-legenda div { display: flex; align-items: center; gap: 8px; color: var(--rg-ink-2); }
html.rg .rg-ex-legenda i { width: 10px; height: 10px; border-radius: 3px; }
html.rg .rg-ex-legenda b { margin-left: auto; color: #fff; font-variant-numeric: tabular-nums; }
html.rg .rg-ex .verde { background: var(--rg-good); }
html.rg .rg-ex .ouro { background: var(--rg-gold); }
html.rg .rg-ex .rosa { background: var(--rg-rosa); }
html.rg .rg-ex-saldos { display: flex; flex-direction: column; gap: 8px; }
html.rg .rg-ex-saldos div { padding: 12px 14px; border-radius: 14px; background: rgba(20, 16, 46, .55); border: 1px solid var(--rg-line); }
html.rg .rg-ex-saldos span { display: block; color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; }
html.rg .rg-ex-saldos span i { color: var(--rg-sky); margin-right: 4px; }
html.rg .rg-ex-saldos b { color: #fff; font-size: 1.15rem; font-variant-numeric: tabular-nums; }

/* grupos */
html.rg .rg-ex-grupos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: start; }
html.rg .rg-ex-grupo { --cor: var(--rg-violeta); padding: 14px; border-radius: 20px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-top: 3px solid var(--cor); }
html.rg .rg-ex-grupo.rg-ex-verde { --cor: var(--rg-good); }
html.rg .rg-ex-grupo.rg-ex-ouro { --cor: var(--rg-gold); }
html.rg .rg-ex-grupo.rg-ex-coral { --cor: var(--rg-coral); }
html.rg .rg-ex-grupo.rg-ex-rosa { --cor: var(--rg-rosa); }
html.rg .rg-ex-grupo.rg-ex-ceu { --cor: var(--rg-sky); }
html.rg .rg-ex-grupo > header { display: flex; align-items: center; gap: 10px; padding: 2px 4px 10px; }
html.rg .rg-ex-grupo > header i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in srgb, var(--cor) 20%, transparent); color: var(--cor); }
html.rg .rg-ex-grupo > header h2 { margin: 0; font-size: 1rem !important; font-weight: 800; color: #fff; }
html.rg .rg-ex-grupo > header b { margin-left: auto; color: var(--cor); font-weight: 800; font-variant-numeric: tabular-nums; }
html.rg .rg-ex-grupo ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
html.rg .rg-ex-grupo li > button, html.rg .rg-ex-grupo li > div {
    display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px; border: 0; border-radius: 12px;
    background: transparent; color: inherit; text-align: left;
}
html.rg .rg-ex-grupo li > button { cursor: pointer; }
html.rg .rg-ex-grupo li > button:hover { background: rgba(255, 255, 255, .05); }
html.rg .rg-ex-grupo li span { flex: 1; min-width: 0; color: var(--rg-ink-2); font-size: .92rem; }
html.rg .rg-ex-grupo li span small { display: block; color: var(--rg-ink-3); font-size: .74rem !important; }
html.rg .rg-ex-grupo li b { color: #fff; font-variant-numeric: tabular-nums; white-space: nowrap; }
html.rg .rg-ex-grupo li > button i { color: var(--rg-ink-3); font-size: .7rem; }
html.rg .rg-ex-grupo li.zero span, html.rg .rg-ex-grupo li.zero b { opacity: .5; }
html.rg .rg-ex-grupo li.ativo > button { background: color-mix(in srgb, var(--cor) 18%, transparent); box-shadow: inset 0 0 0 1.5px var(--cor); }
html.rg .rg-ex-grupo li.ativo span, html.rg .rg-ex-grupo li.ativo b { opacity: 1; color: #fff; }
html.rg .rg-ex-mais { width: 100%; margin-top: 8px; padding: 10px; border-radius: 12px; border: 1px dashed var(--rg-line-2); background: transparent; color: var(--rg-gold); font-weight: 700; cursor: pointer; }

/* resumo por assunto (cartões) + detalhe aberto */
html.rg .rg-ex-resumo { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-ex-kpi {
    --cor: var(--rg-violeta); position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
    padding: 14px; border-radius: 18px; border: 1px solid var(--rg-line); background: var(--rg-surface); color: inherit; text-align: left; cursor: pointer;
    transition: transform .12s, border-color .12s, background .12s;
}
html.rg .rg-ex-kpi:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--cor) 60%, transparent); }
html.rg .rg-ex-kpi > i { width: 32px; height: 32px; margin-bottom: 6px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in srgb, var(--cor) 20%, transparent); color: var(--cor); }
html.rg .rg-ex-kpi span { color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; line-height: 1.2; }
html.rg .rg-ex-kpi b { color: #fff; font-size: 1.15rem; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
html.rg .rg-ex-kpi small { margin-top: 4px; color: var(--cor); font-size: .72rem !important; font-weight: 700; }
html.rg .rg-ex-kpi.zero b { color: var(--rg-ink-3); }
html.rg .rg-ex-kpi.ativo { background: color-mix(in srgb, var(--cor) 14%, var(--rg-surface)); border-color: var(--cor); box-shadow: 0 0 0 1px var(--cor); }
html.rg .rg-ex-kpi.ativo::after { content: ""; position: absolute; left: 50%; bottom: -9px; width: 14px; height: 14px; transform: translateX(-50%) rotate(45deg); background: inherit; border-right: 1px solid var(--cor); border-bottom: 1px solid var(--cor); }
html.rg .rg-ex-kpi.rg-ex-verde, html.rg .rg-ex-detalhe.rg-ex-verde { --cor: var(--rg-good); }
html.rg .rg-ex-kpi.rg-ex-ouro, html.rg .rg-ex-detalhe.rg-ex-ouro { --cor: var(--rg-gold); }
html.rg .rg-ex-kpi.rg-ex-coral, html.rg .rg-ex-detalhe.rg-ex-coral { --cor: var(--rg-coral); }
html.rg .rg-ex-kpi.rg-ex-rosa, html.rg .rg-ex-detalhe.rg-ex-rosa { --cor: var(--rg-rosa); }
html.rg .rg-ex-kpi.rg-ex-ceu, html.rg .rg-ex-detalhe.rg-ex-ceu { --cor: var(--rg-sky); }
html.rg .rg-ex-detalhe { --cor: var(--rg-violeta); padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid color-mix(in srgb, var(--cor) 50%, transparent); animation: rg-ex-abre .18s ease-out; }
@keyframes rg-ex-abre { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
html.rg .rg-ex-detalhe-linhas { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
html.rg .rg-ex-detalhe-linhas > button, html.rg .rg-ex-detalhe-linhas > div {
    display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 14px; border-radius: 14px;
    border: 1px solid var(--rg-line); background: rgba(20, 16, 46, .5); color: inherit; text-align: left;
}
html.rg .rg-ex-detalhe-linhas > button { cursor: pointer; }
html.rg .rg-ex-detalhe-linhas > button:hover { border-color: var(--cor); }
html.rg .rg-ex-detalhe-linhas > button.ativo { border-color: var(--cor); box-shadow: inset 0 0 0 1px var(--cor); background: color-mix(in srgb, var(--cor) 12%, transparent); }
html.rg .rg-ex-detalhe-linhas span { color: var(--rg-ink-2); font-size: .85rem; }
html.rg .rg-ex-detalhe-linhas b { color: #fff; font-size: 1.1rem; font-variant-numeric: tabular-nums; }
html.rg .rg-ex-detalhe-linhas small { color: var(--rg-ink-3); font-size: .74rem !important; }
html.rg .rg-ex-detalhe-linhas em { margin-top: 4px; font-style: normal; color: var(--cor); font-size: .74rem; font-weight: 700; }
html.rg .rg-ex-detalhe-vazio, html.rg .rg-ex-detalhe-zerados { margin: 0; color: var(--rg-ink-3); font-size: .85rem; }
html.rg .rg-ex-detalhe-zerados { margin-top: 10px; }
@media (max-width: 1199px) { html.rg .rg-ex-resumo { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 575px) { html.rg .rg-ex-resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); } html.rg .rg-ex-kpi.ativo::after { display: none; } }

/* tabela */
html.rg .rg-ex-tabela { padding: 16px; border-radius: 22px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-ex-tabela > header { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
html.rg .rg-ex-tabela h2 { margin: 0; font-family: var(--rg-font-display) !important; font-size: 1.15rem !important; font-weight: 800; color: #fff; }
html.rg .rg-ex-tabela > header span { color: var(--rg-ink-3); font-size: .9rem; }
html.rg .rg-ex-tabela > header span button { background: none; border: 0; padding: 0; color: var(--rg-lima-texto); font-weight: 700; text-decoration: underline; cursor: pointer; }
html.rg .rg-ex-tabela > header select { max-width: 180px; }
html.rg .rg-ex-tabela .table { margin: 0; }
html.rg .rg-ex-tabela .table th { border-top: 0; color: var(--rg-ink-3); font-size: .78rem !important; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }
html.rg .rg-ex-tabela .table td { vertical-align: middle; border-color: var(--rg-line); color: var(--rg-ink-2); }
html.rg .rg-ex-valor { color: #fff !important; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
html.rg .rg-ex-tag { display: inline-block; max-width: 260px; padding: 3px 10px; border-radius: 99px; background: rgba(139, 92, 246, .18); color: #e3d9ff; font-size: .78rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
html.rg .rg-ex-vazio td { text-align: center; padding: 28px !important; color: var(--rg-ink-3) !important; }
html.rg .rg-ex-paginas { margin-top: 10px; }
html.rg .rg-ex-paginas nav > div:first-child { display: none; }
html.rg .rg-ex-paginas .pagination { flex-wrap: wrap; gap: 4px 0; } /* muitas páginas: quebra linha em vez de vazar no celular */

@media (max-width: 1199px) {
    html.rg .rg-ex-resultado { grid-template-columns: 1fr 1fr; }
    html.rg .rg-ex-resultado-partes { grid-column: 1 / -1; order: 3; }
    html.rg .rg-ex-grupos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    html.rg .rg-ex-filtros { grid-template-columns: 1fr 1fr; }
    html.rg .rg-ex-busca { grid-column: 1 / -1; }
    html.rg .rg-ex-resultado { grid-template-columns: 1fr; padding: 16px; }
    html.rg .rg-ex-grupos { grid-template-columns: 1fr; }
    html.rg .rg-ex-periodos { align-self: stretch; overflow-x: auto; flex-wrap: nowrap; }
    html.rg .rg-ex-periodos button { flex: 1 0 auto; }
    html.rg .rg-ex-exportar { width: 100%; }
    html.rg .rg-ex-exportar .rg-ex-btn { flex: 1; justify-content: center; }
    /* tabela vira lista de cartões */
    html.rg .rg-ex-tabela .table thead { display: none; }
    html.rg .rg-ex-tabela .table, html.rg .rg-ex-tabela .table tbody, html.rg .rg-ex-tabela .table tr, html.rg .rg-ex-tabela .table td { display: block; width: 100%; }
    html.rg .rg-ex-tabela .table tr { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; margin-bottom: 10px; padding: 12px; border-radius: 14px; background: rgba(20, 16, 46, .55); border: 1px solid var(--rg-line); }
    html.rg .rg-ex-tabela .table td { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 1px; padding: 0; border: 0; text-align: left !important; min-width: 0; font-size: .88rem; overflow-wrap: anywhere; }
    html.rg .rg-ex-tabela .table td::before { content: attr(data-rotulo); color: var(--rg-ink-3); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
    html.rg .rg-ex-tabela .table td[data-rotulo="Tipo"] { grid-column: 1 / -1; }
    html.rg .rg-ex-tabela .table td[data-rotulo="Valor"] { font-size: 1.05rem; }
    html.rg .rg-ex-tabela .rg-ex-tag { max-width: 100%; white-space: normal; }
    html.rg .rg-ex-tabela .rg-ex-vazio { display: block !important; }
    html.rg .rg-ex-tabela .table-responsive { margin: 0 !important; padding: 0 !important; }
    html.rg .rg-ex-tabela .rg-ex-vazio td::before { content: none; }
    html.rg .rg-ex-tabela .rg-ex-vazio td { justify-content: center; }
}

/* ==========================================================================
   Extrato da carteira e de afiliado — layout novo (mesmo padrão do extrato financeiro: rg-ex-*)
   ========================================================================== */
html.rg .rg-ext .rg-ex-periodos button i { margin-right: 6px; }
html.rg .rg-ext .rg-ex-ceu { --cor: var(--rg-sky); }
html.rg .rg-ext .rg-ex-rosa { --cor: var(--rg-rosa); }
html.rg .rg-ext .rg-ex-lima { --cor: var(--rg-lima); }

html.rg .rg-ext-saldos { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
html.rg .rg-ext-saldo {
    --cor: var(--rg-violeta); display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 2px 12px;
    padding: 14px 16px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-left: 3px solid var(--cor);
}
html.rg .rg-ext-saldo > i { grid-row: span 2; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, var(--cor) 18%, transparent); color: var(--cor); }
html.rg .rg-ext-saldo span { color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; line-height: 1.25; }
html.rg .rg-ext-saldo b { color: #fff; font-size: 1.3rem; font-weight: 800; font-variant-numeric: tabular-nums; }

html.rg .rg-ext-filtros {
    display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.3fr) minmax(0, .9fr) minmax(0, .9fr) auto; gap: 10px; align-items: end;
    padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line);
}
html.rg .rg-ext-filtros-afiliado { grid-template-columns: minmax(0, 1.6fr) minmax(0, .9fr) minmax(0, .9fr) auto; }
html.rg .rg-ext-campo { display: flex; flex-direction: column; gap: 4px; margin: 0; min-width: 0; }
html.rg .rg-ext-campo > span { color: var(--rg-ink-3); font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
html.rg .rg-ext-acoes { display: flex; gap: 8px; }
html.rg .rg-ext-acoes .rg-ex-btn { justify-content: center; white-space: nowrap; min-height: 44px; }

/* cartões por assunto (mesmo componente visual do extrato financeiro: rg-ex-kpi / rg-ex-detalhe) */
html.rg .rg-ext-resumo { grid-template-columns: repeat(5, minmax(0, 1fr)); }
html.rg .rg-ext-resumo-afiliado { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html.rg .rg-ext-calculando { font-style: normal; font-size: .85rem; font-weight: 600; color: var(--rg-ink-3); }
html.rg .rg-ext-filtros-sem-datas { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; }
html.rg .rg-ext .rg-ex-periodos[aria-label] { align-self: flex-start; }

html.rg .rg-ext-tabela .rg-ext-data { white-space: nowrap; color: var(--rg-ink-3) !important; font-size: .88rem; }
html.rg .rg-ext-tabela .rg-ext-desc { color: #fff !important; min-width: 220px; text-align: left; }
html.rg .rg-ext-tabela .table th, html.rg .rg-ext-tabela .table td { text-align: left; }
html.rg .rg-ext-tabela .table th.text-right, html.rg .rg-ext-tabela .table td.text-right { text-align: right; }
html.rg .rg-ext-carteira {
    --cor: var(--rg-violeta); display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 99px;
    background: color-mix(in srgb, var(--cor) 16%, transparent); color: color-mix(in srgb, var(--cor) 70%, #fff); font-size: .76rem; font-weight: 700; line-height: 1.3; white-space: nowrap;
}
html.rg .rg-ext-entrada { color: var(--rg-good) !important; }
html.rg .rg-ext-saida { color: var(--rg-bad) !important; }
html.rg .rg-ext-saldo-mov { white-space: nowrap; font-variant-numeric: tabular-nums; }
html.rg .rg-ext-saldo-mov span { color: var(--rg-ink-3); }
html.rg .rg-ext-saldo-mov i { margin: 0 4px; color: var(--rg-ink-3); font-size: .7rem; }
html.rg .rg-ext-saldo-mov b { color: #fff; }

@media (max-width: 1199px) { html.rg .rg-ext-resumo { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991px) {
    html.rg .rg-ext-filtros, html.rg .rg-ext-filtros-afiliado, html.rg .rg-ext-filtros-sem-datas { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-ext-campo-largo, html.rg .rg-ext-acoes { grid-column: 1 / -1; }
    html.rg .rg-ext-acoes .rg-ex-btn { flex: 1; }
}
@media (max-width: 767px) {
    html.rg .rg-ext .rg-ex-topo { align-items: flex-start; }
    html.rg .rg-ext .rg-ex-periodos { width: 100%; }
    html.rg .rg-ext-saldos { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-ext-saldo { padding: 12px 14px; }
    html.rg .rg-ext-saldo b { font-size: 1.15rem; }
    html.rg .rg-ext-filtros { padding: 12px; }
    html.rg .rg-ext-tabela { padding: 12px; }
    /* cartão da movimentação: descrição em cima, valor em destaque, saldo e carteira embaixo */
    html.rg .rg-ext-tabela .rg-ext-desc { min-width: 0; grid-column: 1 / -1; order: -1; font-weight: 700; }
    html.rg .rg-ext-tabela .rg-ext-desc::before { content: none !important; }
    html.rg .rg-ext-tabela .table td[data-rotulo="Carteira"] { grid-column: 1 / -1; }
    html.rg .rg-ext-tabela .rg-ext-saldo-mov { white-space: normal; }
    html.rg .rg-ext-resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    html.rg .rg-ext-resumo > :last-child:nth-child(odd) { grid-column: 1 / -1; } /* 5 cartões: o último ocupa a linha toda */
    html.rg .rg-ext .rg-ex-periodos[aria-label] { align-self: stretch; flex-wrap: wrap; overflow-x: visible; }
    html.rg .rg-ext .rg-ex-periodos[aria-label] button { flex: 1 1 auto; padding: 9px 10px; }
}

/* ==========================================================================
   Relatório de pontos (Meus pontos) — layout novo
   ========================================================================== */
html.rg .rg-pt { display: flex; flex-direction: column; gap: 14px; padding: 4px 0 20px; }
html.rg .rg-pt-sobre { color: var(--rg-gold); font-weight: 800; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; }
html.rg .rg-pt-topo h1 { margin: 2px 0 0; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.1rem); color: #fff; }

html.rg .rg-pt-faixa {
    display: grid; grid-template-columns: minmax(240px, .8fr) minmax(0, 1.6fr); gap: 22px; align-items: center;
    padding: 22px; border-radius: 24px; border: 1px solid var(--rg-line);
    background: radial-gradient(520px 240px at 0% 0%, color-mix(in srgb, var(--rg-pt-cor) 30%, transparent), transparent 70%), var(--rg-surface);
}
html.rg .rg-pt-faixa-atual { display: flex; align-items: center; gap: 16px; }
html.rg .rg-pt-selo {
    flex: 0 0 76px; height: 76px; border-radius: 22px; display: grid; place-items: center; overflow: hidden;
    background: var(--rg-pt-cor); color: #fff; font-size: 2rem; box-shadow: 0 10px 26px color-mix(in srgb, var(--rg-pt-cor) 45%, transparent);
}
html.rg .rg-pt-selo img { width: 100%; height: 100%; object-fit: cover; }
html.rg .rg-pt-faixa-atual span { display: block; color: var(--rg-ink-3); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-pt-faixa-atual b { display: block; font-family: var(--rg-font-display) !important; font-size: 1.5rem; line-height: 1.1; color: #fff; }
html.rg .rg-pt-faixa-atual small { display: block; margin-top: 4px; color: var(--rg-ink-2); font-size: .82rem !important; }

html.rg .rg-pt-caminho { padding: 16px 18px; border-radius: 18px; background: rgba(20, 16, 46, .55); border: 1px solid var(--rg-line); }
html.rg .rg-pt-caminho-topo { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; color: var(--rg-ink-2); }
html.rg .rg-pt-caminho-topo span b { color: #fff; }
html.rg .rg-pt-caminho-topo > b { font-family: var(--rg-font-display) !important; font-size: 1.4rem; color: var(--rg-lima-texto); }
html.rg .rg-pt-barra { height: 14px; margin: 10px 0 14px; border-radius: 99px; background: rgba(255, 255, 255, .08); overflow: hidden; }
html.rg .rg-pt-barra span { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--rg-pt-cor), var(--rg-pt-prox)); box-shadow: 0 0 14px color-mix(in srgb, var(--rg-pt-prox) 60%, transparent); }
html.rg .rg-pt-falta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-pt-falta div { padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, .04); }
html.rg .rg-pt-falta span { display: block; color: var(--rg-ink-3); font-size: .75rem; font-weight: 700; }
html.rg .rg-pt-falta b { color: #fff; font-size: 1.1rem; font-variant-numeric: tabular-nums; }
html.rg .rg-pt-falta small { display: block; color: var(--rg-warn); font-size: .74rem !important; font-weight: 700; }
html.rg .rg-pt-falta small.ok { color: var(--rg-good); }
html.rg .rg-pt-falta .destaque { background: color-mix(in srgb, var(--rg-lima) 10%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rg-lima) 45%, transparent); }
html.rg .rg-pt-falta .destaque b { color: var(--rg-lima-texto); font-size: 1.3rem; }
html.rg .rg-pt-topo-max { display: flex; align-items: center; gap: 14px; }
html.rg .rg-pt-topo-max i { font-size: 2rem; color: var(--rg-gold); }
html.rg .rg-pt-topo-max b { display: block; color: #fff; font-size: 1.1rem; }
html.rg .rg-pt-topo-max span { color: var(--rg-ink-2); }

html.rg .rg-pt-saldos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
html.rg .rg-pt-saldo { --cor: var(--rg-violeta); display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto auto; column-gap: 12px; padding: 16px; border-radius: 20px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-top: 3px solid var(--cor); }
html.rg .rg-pt-saldo.rg-pt-ouro { --cor: var(--rg-gold); }
html.rg .rg-pt-saldo.rg-pt-rosa { --cor: var(--rg-rosa); }
html.rg .rg-pt-saldo.rg-pt-lima { --cor: var(--rg-lima); }
html.rg .rg-pt-saldo > i { grid-row: 1 / 4; width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; background: color-mix(in srgb, var(--cor) 20%, transparent); color: var(--cor); font-size: 1.1rem; align-self: center; }
html.rg .rg-pt-saldo span { color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; }
html.rg .rg-pt-saldo b { font-family: var(--rg-font-display) !important; font-size: 1.5rem; color: #fff; line-height: 1.15; font-variant-numeric: tabular-nums; }
html.rg .rg-pt-saldo small { color: var(--rg-ink-3); font-size: .75rem !important; }

html.rg .rg-pt-hist { padding: 16px; border-radius: 22px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-pt-hist > header { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 8px; }
html.rg .rg-pt-hist h2 { margin: 0; font-family: var(--rg-font-display) !important; font-size: 1.15rem !important; font-weight: 800; color: #fff; }
html.rg .rg-pt-hist > header span { color: var(--rg-ink-3); font-size: .85rem; }
html.rg .rg-pt-lista { list-style: none; margin: 0; padding: 0; }
html.rg .rg-pt-lista li { display: flex; align-items: center; gap: 12px; padding: 12px 6px; border-bottom: 1px solid var(--rg-line); }
html.rg .rg-pt-lista li:last-child { border-bottom: 0; }
html.rg .rg-pt-ico { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 1rem; }
html.rg .rg-pt-ico.pessoal { background: rgba(245, 197, 66, .16); color: var(--rg-gold); }
html.rg .rg-pt-ico.rede { background: rgba(255, 95, 162, .16); color: var(--rg-rosa); }
html.rg .rg-pt-lista-txt { flex: 1; min-width: 0; }
html.rg .rg-pt-lista-txt b { display: block; color: #fff; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-pt-lista-txt span { color: var(--rg-ink-3); font-size: .82rem; }
html.rg .rg-pt-lista-txt em { font-style: normal; font-weight: 700; }
html.rg .rg-pt-lista-txt em.pessoal { color: var(--rg-gold); }
html.rg .rg-pt-lista-txt em.rede { color: var(--rg-rosa); }
html.rg .rg-pt-lista strong { color: var(--rg-lima-texto); font-size: 1.05rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
html.rg .rg-pt-vazio { justify-content: center; color: var(--rg-ink-3); padding: 26px !important; }
html.rg .rg-pt-paginas { display: flex; justify-content: flex-end; margin-top: 10px; }

@media (max-width: 991px) {
    html.rg .rg-pt-faixa { grid-template-columns: 1fr; }
}
@media (max-width: 575px) {
    html.rg .rg-pt-faixa { padding: 16px; }
    html.rg .rg-pt-falta { grid-template-columns: 1fr 1fr; }
    html.rg .rg-pt-falta .destaque { grid-column: 1 / -1; }
    html.rg .rg-pt-saldos { grid-template-columns: 1fr; }
    html.rg .rg-pt-lista-txt b { white-space: normal; }
}

/* ==========================================================================
   Carteira › Saque — layout novo (só visual; formulário, máscaras e modais intactos)
   ========================================================================== */
html.rg .saque-root { background: transparent !important; min-height: 0; padding: 4px 0 30px; color: var(--rg-ink); }
html.rg .saque-root > div:first-child, html.rg .saque-grid, html.rg .saque-root .alert-horario { max-width: 980px !important; }
html.rg .saque-section-label { color: var(--rg-lima-texto); font-family: var(--rg-font) !important; font-size: .75rem; letter-spacing: .14em; }
html.rg .saque-heading { font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.1rem); color: #fff; margin-bottom: 18px; text-transform: none; }
html.rg .saque-grid { gap: 14px; }
html.rg .saque-form-row { gap: 14px; }

html.rg .saque-root .glass-card { background: var(--rg-surface); border: 1px solid var(--rg-line); border-radius: 22px; padding: 20px; }
html.rg .saque-root .glass-card:hover { background: var(--rg-surface); border-color: var(--rg-line-2); }
html.rg .saque-root .glass-card::before { display: none; }
html.rg .saque-root .card-icon { width: 40px; height: 40px; border-radius: 12px; }
html.rg .saque-root .card-label { color: var(--rg-ink-3); font-size: .78rem; letter-spacing: .1em; }
html.rg .saque-root .card-sub { color: var(--rg-ink-3); font-size: .88rem; }
html.rg .saque-root .card-value { font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.2rem); }
html.rg .saque-root .divider { background: var(--rg-line); }

/* os dois saldos: o que dá para sacar ganha destaque; o de "só jogar" fica discreto */
html.rg .saque-grid > .glass-card:nth-child(1) { background: rgba(20, 16, 46, .55); }
html.rg .saque-grid > .glass-card:nth-child(1) .card-value { color: #fff; }
html.rg .saque-grid > .glass-card:nth-child(1) .card-icon { background: rgba(255, 255, 255, .06); }
html.rg .saque-grid > .glass-card:nth-child(1) .card-icon svg { stroke: var(--rg-ink-3); }
html.rg .saque-grid > .glass-card:nth-child(2) {
    order: -1; border-color: color-mix(in srgb, var(--rg-lima) 55%, transparent);
    background: radial-gradient(420px 200px at 0% 0%, color-mix(in srgb, var(--rg-lima) 18%, transparent), transparent 70%), var(--rg-surface);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--rg-lima) 25%, transparent), 0 14px 36px color-mix(in srgb, var(--rg-lima) 8%, transparent);
}
html.rg .saque-grid > .glass-card:nth-child(2) .card-label { color: var(--rg-lima-texto); }
html.rg .saque-grid > .glass-card:nth-child(2) .card-value { color: var(--rg-lima-texto); }
html.rg .saque-grid > .glass-card:nth-child(2) .card-icon { background: var(--rg-lima); }
html.rg .saque-grid > .glass-card:nth-child(2) .card-icon svg { stroke: var(--rg-tinta); }
html.rg .saque-grid > .glass-card:nth-child(2)::after {
    content: "Disponível para saque"; position: absolute; top: 18px; right: 18px; padding: 4px 10px; border-radius: 99px;
    background: var(--rg-lima); color: var(--rg-on-lima); font-size: .7rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
}

/* formulário: "Valor a retirar" vem primeiro (é a ação), recebedor ao lado */
html.rg .saque-form-row .glass-card:nth-of-type(2) { order: -1; }
html.rg .saque-form-row .glass-card:nth-of-type(2) .card-icon { background: rgba(245, 197, 66, .18); }
html.rg .saque-root .info-row { font-size: .95rem; }
html.rg .saque-root .info-label { color: var(--rg-ink-3); }
html.rg .saque-root .info-val { color: #fff; }
html.rg .saque-root .pix-badge { background: color-mix(in srgb, var(--rg-lima) 12%, transparent); border-color: color-mix(in srgb, var(--rg-lima) 35%, transparent); color: var(--rg-lima-texto); }
html.rg .saque-root .pix-dot { background: var(--rg-lima); }
html.rg .saque-root .type-pill { background: rgba(139, 92, 246, .18); border-color: rgba(139, 92, 246, .4); color: #d9ccff; }

html.rg .saque-root .glass-select, html.rg .saque-root .glass-input-field {
    background-color: rgba(20, 16, 46, .6); border: 1px solid var(--rg-line-2); border-radius: 12px; color: #fff; font-family: var(--rg-font) !important;
}
html.rg .saque-root .glass-select option { background: #1c1446; }
html.rg .saque-root .glass-select:focus, html.rg .saque-root .glass-input-field:focus { border-color: var(--rg-lima); box-shadow: 0 0 0 3px color-mix(in srgb, var(--rg-lima) 15%, transparent); }
html.rg .saque-root .glass-input-field::placeholder { color: var(--rg-ink-3); }

html.rg .saque-root .min-hint { color: var(--rg-ink-2); }
html.rg .saque-root .min-hint strong { color: var(--rg-lima-texto) !important; }
html.rg .saque-root .min-dot { background: var(--rg-lima); }
html.rg .saque-root .input-amount-wrap { border-radius: 16px; background: rgba(20, 16, 46, .7); border: 2px solid var(--rg-line-2); transition: border-color .15s, box-shadow .15s; }
html.rg .saque-root .input-amount-wrap:focus-within { border-color: var(--rg-lima); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 15%, transparent); }
html.rg .saque-root .input-prefix { color: var(--rg-ink-3); font-weight: 800; }
html.rg .saque-root .glass-input-amount { background: transparent !important; border: 0 !important; box-shadow: none !important; color: #fff; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 2rem; }
html.rg .saque-root .glass-input-amount::placeholder { color: rgba(255, 255, 255, .22); }

html.rg .saque-root .btn-solicitar {
    background: var(--rg-lima); color: var(--rg-on-lima); border-radius: 16px; padding: 16px; font-family: var(--rg-font-display) !important;
    font-weight: 800; font-size: 1.05rem; letter-spacing: .02em; box-shadow: 0 10px 26px color-mix(in srgb, var(--rg-lima) 28%, transparent), inset 0 -4px 0 rgba(0, 0, 0, .15);
}
html.rg .saque-root .btn-solicitar:hover:not(:disabled) { background: var(--rg-lima-hover); }
html.rg .saque-root .btn-trocar, html.rg .saque-root .btn-voltar { border-radius: 12px; border-color: var(--rg-line-2); color: var(--rg-ink-2); background: transparent; }
html.rg .saque-root .btn-trocar:hover, html.rg .saque-root .btn-voltar:hover { color: #fff; border-color: var(--rg-ink-3); }

html.rg .saque-root .alert-horario {
    margin: 14px auto 0; border-radius: 16px; background: rgba(245, 197, 66, .1); border: 1px solid rgba(245, 197, 66, .35); color: var(--rg-ink-2);
}
html.rg .saque-root .alert-horario strong { color: var(--rg-gold); }
html.rg .saque-root .alert-icon { color: var(--rg-gold); }

/* modais do PIX/CPF */
html.rg .saque-root .modal-glass { background: #1c1446; border: 1px solid var(--rg-line-2); border-radius: 22px; }
html.rg .saque-root .modal-glass::before { display: none; }
html.rg .saque-root .modal-glass-title { font-family: var(--rg-font-display) !important; color: #fff; }
html.rg .saque-root .modal-glass-body { color: var(--rg-ink-2); }
html.rg .saque-root .modal-warn { border-radius: 12px; }
html.rg .saque-root .btn-modal-accent { background: var(--rg-lima); color: var(--rg-on-lima); border-radius: 12px; font-weight: 800; }
html.rg .saque-root .pix-backdrop { background: rgba(8, 5, 24, .78); backdrop-filter: blur(6px); }

@media (max-width: 600px) {
    html.rg .saque-grid > .glass-card:nth-child(2)::after { position: static; display: inline-block; margin-bottom: 10px; }
    html.rg .saque-grid > .glass-card:nth-child(2) { display: flex; flex-direction: column; }
    html.rg .saque-grid > .glass-card:nth-child(2)::after { order: -1; align-self: flex-start; }
}
html.rg .saque-root .alert-horario { display: block !important; line-height: 1.5; text-align: left; }
html.rg .saque-root .alert-horario .alert-icon { display: inline-block; vertical-align: -3px; margin-right: 6px; }

/* ==========================================================================
   Tutoriais — layout novo
   ========================================================================== */
html.rg .rg-tu { display: flex; flex-direction: column; gap: 16px; padding: 4px 0 24px; }
html.rg .rg-tu-hero {
    display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(280px, 1fr); gap: 20px; align-items: center;
    padding: 24px; border-radius: 26px; border: 1px solid var(--rg-line);
    background: radial-gradient(520px 260px at 0% 0%, rgba(255, 95, 162, .25), transparent 70%),
                radial-gradient(420px 240px at 100% 100%, color-mix(in srgb, var(--rg-lima) 14%, transparent), transparent 70%), var(--rg-surface);
}
html.rg .rg-tu-sobre { color: var(--rg-rosa); font-weight: 800; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; }
html.rg .rg-tu-hero h1 { margin: 4px 0 6px; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.3rem); color: #fff; line-height: 1.1; }
html.rg .rg-tu-hero p { margin: 0 0 14px; color: var(--rg-ink-2); }
html.rg .rg-tu-continuar {
    display: inline-flex; align-items: center; gap: 10px; max-width: 100%; padding: 13px 20px; border: 0; border-radius: 14px; cursor: pointer;
    background: var(--rg-lima); color: var(--rg-on-lima); font-weight: 800; font-size: 1rem; box-shadow: 0 10px 26px color-mix(in srgb, var(--rg-lima) 30%, transparent);
    animation: rg-rl-pulsa 1.8s ease-in-out infinite;
}
html.rg .rg-tu-continuar span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-tu-continuar[hidden] { display: none; }
html.rg .rg-tu-progresso { display: flex; align-items: center; gap: 18px; padding: 16px; border-radius: 20px; background: rgba(20, 16, 46, .55); border: 1px solid var(--rg-line); }
html.rg .rg-tu-anel {
    flex: 0 0 104px; height: 104px; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center;
    background: radial-gradient(closest-side, #1c1446 79%, transparent 80% 100%), conic-gradient(var(--rg-lima) calc(var(--p) * 1%), rgba(255, 255, 255, .1) 0);
    transition: background .4s;
}
html.rg .rg-tu-anel b { font-family: var(--rg-font-display) !important; font-size: 1.5rem; color: #fff; line-height: 1; }
html.rg .rg-tu-anel small { color: var(--rg-ink-3); font-size: .7rem !important; font-weight: 700; }
html.rg .rg-tu-progresso-txt b { display: block; color: #fff; font-size: 1.1rem; }
html.rg .rg-tu-progresso-txt > span { display: block; color: var(--rg-ink-2); font-size: .88rem; margin-bottom: 10px; }
html.rg .rg-tu-medalhas { display: flex; gap: 8px; }
html.rg .rg-tu-medalhas i {
    width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; font-style: normal;
    background: rgba(255, 255, 255, .06); color: rgba(255, 255, 255, .25); border: 1px dashed rgba(255, 255, 255, .2); transition: all .3s;
}
html.rg .rg-tu-medalhas i.ganha { background: linear-gradient(135deg, var(--rg-gold), #ff9d2e); color: var(--rg-tinta); border: 0; box-shadow: 0 0 16px rgba(245, 197, 66, .55); animation: rg-tu-medalha .6s ease-out; }
@keyframes rg-tu-medalha { 0% { transform: scale(.4) rotate(-30deg); } 70% { transform: scale(1.2); } 100% { transform: none; } }

html.rg .rg-tu-abas { display: flex; gap: 8px; }
html.rg .rg-tu-abas button { display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; border-radius: 14px; border: 1px solid var(--rg-line-2); background: var(--rg-surface); color: var(--rg-ink-2); font-weight: 800; cursor: pointer; }
html.rg .rg-tu-abas button em { font-style: normal; padding: 1px 8px; border-radius: 99px; background: rgba(255, 255, 255, .1); font-size: .78rem; }
html.rg .rg-tu-abas button.ativo { background: var(--rg-lima); border-color: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-tu-abas button.ativo em { background: rgba(20, 16, 46, .15); }
html.rg .rg-tu-painel[hidden] { display: none; }
html.rg .rg-tu-painel { display: flex; flex-direction: column; gap: 22px; }

html.rg .rg-tu-grupo { --cor: var(--rg-violeta); }
html.rg .rg-tu-grupo.rg-tu-lima { --cor: var(--rg-lima); }
html.rg .rg-tu-grupo.rg-tu-rosa { --cor: var(--rg-rosa); }
html.rg .rg-tu-grupo.rg-tu-ceu { --cor: var(--rg-sky); }
html.rg .rg-tu-grupo > header { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
html.rg .rg-tu-grupo > header > i { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; background: color-mix(in srgb, var(--cor) 20%, transparent); color: var(--cor); font-size: 1.1rem; }
html.rg .rg-tu-grupo h2 { margin: 0; font-family: var(--rg-font-display) !important; font-size: 1.15rem !important; font-weight: 800; color: #fff; }
html.rg .rg-tu-grupo > header span { color: var(--rg-ink-3); font-size: .85rem; }
html.rg .rg-tu-grupo-cont { margin-left: auto; font-style: normal; padding: 4px 12px; border-radius: 99px; background: rgba(255, 255, 255, .06); color: var(--rg-ink-2); font-weight: 800; font-size: .85rem; }
html.rg .rg-tu-grupo-cont.completo { background: var(--cor); color: var(--rg-tinta); }
html.rg .rg-tu-grupo-cont.completo::before { content: "✓ "; }

html.rg .rg-tu-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
html.rg .rg-tu-card {
    position: relative; border-radius: 18px; overflow: hidden; cursor: pointer; background: var(--rg-surface); border: 1px solid var(--rg-line);
    transition: transform .15s, border-color .15s, box-shadow .15s; outline: none;
}
html.rg .rg-tu-card:hover, html.rg .rg-tu-card:focus-visible { transform: translateY(-4px); border-color: var(--cor); box-shadow: 0 14px 30px rgba(4, 2, 16, .5), 0 0 0 1px var(--cor); }
html.rg .rg-tu-thumb { position: relative; aspect-ratio: 16 / 10; background: radial-gradient(circle at 50% 40%, color-mix(in srgb, var(--cor) 35%, #1c1446), #120c33); overflow: hidden; }
html.rg .rg-tu-thumb video { width: 100%; height: 100%; object-fit: cover; opacity: .55; transition: opacity .2s, transform .3s; pointer-events: none; }
html.rg .rg-tu-card:hover .rg-tu-thumb video { opacity: .8; transform: scale(1.04); }
html.rg .rg-tu-play {
    position: absolute; top: 50%; left: 50%; width: 56px; height: 56px; transform: translate(-50%, -50%); border-radius: 50%; display: grid; place-items: center;
    background: var(--cor); color: var(--rg-tinta); font-size: 1.1rem; box-shadow: 0 0 0 8px color-mix(in srgb, var(--cor) 25%, transparent), 0 10px 24px rgba(0, 0, 0, .4);
    transition: transform .15s;
}
html.rg .rg-tu-play i { margin-left: 3px; }
html.rg .rg-tu-card:hover .rg-tu-play { transform: translate(-50%, -50%) scale(1.12); }
html.rg .rg-tu-visto { position: absolute; top: 10px; left: 10px; display: none; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 99px; background: var(--rg-good); color: #062b1c; font-size: .72rem; font-weight: 800; }
html.rg .rg-tu-card.visto .rg-tu-visto { display: inline-flex; }
html.rg .rg-tu-card.visto .rg-tu-play { background: rgba(255, 255, 255, .9); box-shadow: 0 10px 24px rgba(0, 0, 0, .4); }
html.rg .rg-tu-dur, html.rg .rg-tu-cod { position: absolute; bottom: 8px; padding: 2px 8px; border-radius: 8px; background: rgba(8, 5, 24, .8); color: #fff; font-size: .72rem; font-weight: 700; }
html.rg .rg-tu-dur { right: 8px; }
html.rg .rg-tu-dur[hidden] { display: none; }
html.rg .rg-tu-cod { left: 8px; color: var(--rg-ink-3); }
html.rg .rg-tu-card-txt { padding: 12px 14px 14px; }
html.rg .rg-tu-card-txt b { display: block; color: #fff; font-size: .98rem; line-height: 1.3; }
html.rg .rg-tu-card-txt small { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; color: var(--rg-ink-3); font-size: .75rem !important; }
html.rg .rg-tu-excluir { position: absolute; top: 8px; right: 8px; z-index: 2; width: 30px; height: 30px; border: 0; border-radius: 50%; background: rgba(248, 113, 113, .9); color: #fff; cursor: pointer; }
html.rg .rg-tu-vazio { color: var(--rg-ink-3); text-align: center; padding: 30px; }

html.rg .rg-tu-player { position: fixed; inset: 0; z-index: 1060; display: grid; place-items: center; padding: 16px; background: rgba(8, 5, 24, .85); backdrop-filter: blur(6px); opacity: 0; transition: opacity .2s; }
html.rg .rg-tu-player[hidden] { display: none; }
html.rg .rg-tu-player.aberto { opacity: 1; }
html.rg .rg-tu-player-caixa { width: min(100%, 860px); border-radius: 22px; overflow: hidden; background: #1c1446; border: 1px solid var(--rg-line-2); box-shadow: 0 30px 80px rgba(0, 0, 0, .6); }
html.rg .rg-tu-player-caixa > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; }
html.rg .rg-tu-player-caixa > header b { color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.05rem; }
html.rg .rg-tu-fechar { flex: 0 0 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; font-size: 1.4rem; line-height: 1; cursor: pointer; }
html.rg .rg-tu-player-video { position: relative; background: #000; }
html.rg .rg-tu-player-video video { display: block; width: 100%; max-height: 72vh; background: #000; }
html.rg .rg-tu-fim { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 20px; text-align: center; background: rgba(20, 16, 46, .92); }
html.rg .rg-tu-fim[hidden] { display: none; }
html.rg .rg-tu-fim > i { font-size: 3.2rem; color: var(--rg-lima-texto); animation: rg-tu-medalha .6s ease-out; }
html.rg .rg-tu-fim b { color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.4rem; }
html.rg .rg-tu-fim span { color: var(--rg-ink-2); }
html.rg .rg-tu-fim-acoes { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-top: 12px; }
html.rg .rg-tu-btn-lima, html.rg .rg-tu-btn-contorno, html.rg .rg-tu-btn-perigo { display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 14px; font-weight: 800; cursor: pointer; }
html.rg .rg-tu-btn-lima { border: 0; background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-tu-btn-lima[hidden] { display: none; }
html.rg .rg-tu-btn-contorno { border: 1px solid var(--rg-line-2); background: transparent; color: #fff; }
html.rg .rg-tu-btn-perigo { border: 0; background: var(--rg-bad); color: #fff; }
html.rg .rg-tu-confirma { max-width: 440px; padding-bottom: 18px; }
html.rg .rg-tu-confirma p { padding: 0 18px; color: var(--rg-ink-2); }

@media (max-width: 991px) { html.rg .rg-tu-hero { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575px) {
    html.rg .rg-tu-hero { padding: 18px; }
    html.rg .rg-tu-anel { flex-basis: 84px; height: 84px; }
    html.rg .rg-tu-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    html.rg .rg-tu-play { width: 44px; height: 44px; font-size: .9rem; }
    html.rg .rg-tu-card-txt { padding: 10px; }
    html.rg .rg-tu-card-txt b { font-size: .88rem; }
    html.rg .rg-tu-continuar { width: 100%; justify-content: center; }
    html.rg .rg-tu-progresso { gap: 12px; padding: 12px; }
    html.rg .rg-tu-progresso-txt { min-width: 0; }
    html.rg .rg-tu-medalhas { flex-wrap: wrap; gap: 6px; }
    html.rg .rg-tu-medalhas i { width: 32px; height: 32px; }
    html.rg .rg-tu-abas { flex-wrap: wrap; }
    html.rg .rg-tu-abas button { flex: 1 1 auto; justify-content: center; padding: 10px 12px; }
}

/* copia e cola (equipe): a caixa cinza da busca de cliente vira um cartão do layout novo */
html.rg .card-alert-pai {
    max-width: none; padding: 18px !important; border-radius: 20px !important; text-align: left !important;
    background: radial-gradient(420px 180px at 0% 0%, rgba(124, 198, 247, .12), transparent 70%), var(--rg-surface) !important;
    border: 1px solid var(--rg-line) !important; box-shadow: var(--rg-shadow);
}
html.rg .card-alert-pai::before {
    content: "Para quem é o jogo?"; display: block; margin-bottom: 10px; color: var(--rg-sky);
    font-weight: 800; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase;
}
html.rg .card-alert-pai .input-group { margin-bottom: 0 !important; border-radius: 14px; box-shadow: 0 0 0 1px var(--rg-line-2); }
html.rg .card-alert-pai #author { height: 50px; padding-left: 16px; font-size: 1rem; background: rgba(20, 16, 46, .7) !important; border: 0 !important; border-radius: 14px 0 0 14px !important; color: #fff !important; }
html.rg .card-alert-pai #author:focus { box-shadow: 0 0 0 2px var(--rg-sky) inset !important; }
html.rg .card-alert-pai .input-group-text { height: 50px; padding: 0 16px; border: 0 !important; border-radius: 0 14px 14px 0 !important; background: rgba(124, 198, 247, .14) !important; color: var(--rg-sky) !important; cursor: pointer; }
html.rg .card-alert-pai .input-group-text:hover { background: rgba(248, 113, 113, .2) !important; color: var(--rg-bad) !important; }
html.rg .card-alert-pai #list_group { margin: 8px 0 0 !important; max-height: 220px !important; }
html.rg .card-alert-pai #list_group:empty, html.rg .card-alert-pai #list_group .col-md-12:empty { display: none; }
html.rg .card-alert-pai .list-group { border-radius: 14px; overflow: hidden; border: 1px solid var(--rg-line-2); }
html.rg .card-alert-pai .list-group-item { background: #1c1446 !important; color: var(--rg-ink-2) !important; border-color: var(--rg-line) !important; text-align: left; font-size: .92rem; }
html.rg .card-alert-pai .list-group-item:hover { background: rgba(124, 198, 247, .14) !important; color: #fff !important; }
html.rg .card-alert-pai ~ label[for="dezena"], html.rg .card-alert-pai + * label[for="dezena"] { display: block; margin-top: 18px; }
html.rg .btn-voltar-copiacola { color: var(--rg-tinta) !important; font-weight: 800 !important; border-radius: 12px !important; }

/* ==========================================================================
   Bilhete: conferência animada do sorteio
   ========================================================================== */
/* suspense: esconde o resultado até as bolas caírem */
html.rg .rg-bt-suspense .rg-bt-status,
html.rg .rg-bt-suspense .rg-bt-sorteados,
html.rg .rg-bt-suspense .rg-bt-cartao-topo b,
html.rg .rg-bt-suspense .rg-bt-premio > span { visibility: hidden; }
html.rg .rg-bt-suspense .rg-bt-status, html.rg .rg-bt-suspense .rg-bt-sorteados { display: none; }
html.rg .rg-bt-suspense .rg-bt-cartao > .rg-bt-bolas .rg-bt-bola.acerto:not(.revelada) {
    background: rgba(255, 255, 255, .06); color: #fff; border-color: var(--rg-line-2); box-shadow: none;
}
html.rg .rg-bt-cartao > .rg-bt-bolas .rg-bt-bola.revelada { animation: rg-bt-acende .55s cubic-bezier(.2, 1.6, .4, 1); }
@keyframes rg-bt-acende { 0% { transform: scale(.6); } 60% { transform: scale(1.25); box-shadow: 0 0 0 10px color-mix(in srgb, var(--rg-lima) 25%, transparent); } 100% { transform: none; } }

/* bloco da conferência: aparece só quando ainda não foi conferido (ou logo depois de conferir) */
html.rg .rg-bt:not(.rg-bt-suspense) .rg-bt-conf:not(.fim) { display: none; }
html.rg .rg-bt:has(.rg-bt-conf.fim) .rg-bt-sorteados > :not(.rg-bt-rever) { display: none; }
html.rg .rg-bt:has(.rg-bt-conf.fim) .rg-bt-sorteados { margin-top: 10px; padding-top: 0; border-top: 0; }
html.rg .rg-bt-conf {
    margin-top: 18px; padding: 16px; border-radius: 20px; text-align: center;
    background: radial-gradient(400px 160px at 50% 0%, rgba(139, 92, 246, .3), transparent 70%), rgba(20, 16, 46, .6);
    border: 1px solid var(--rg-line-2);
}
html.rg .rg-bt-conf-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
html.rg .rg-bt-conf-topo b { color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.15rem; }
html.rg .rg-bt-conf-cont { padding: 6px 14px; border-radius: 99px; background: color-mix(in srgb, var(--rg-lima) 14%, transparent); color: var(--rg-lima-texto); font-weight: 800; }
html.rg .rg-bt-conf-cont em { font-style: normal; font-family: var(--rg-font-display) !important; font-size: 1.2rem; display: inline-block; }
html.rg .rg-bt-conf.pulso .rg-bt-conf-cont em { animation: rg-bt-conta .45s ease-out; }
@keyframes rg-bt-conta { 0% { transform: scale(1); } 40% { transform: scale(1.6); color: #fff; } 100% { transform: scale(1); } }
html.rg .rg-bt-conf-bolas { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; min-height: 64px; }
html.rg .rg-bt-conf-slot {
    width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center;
    background: rgba(255, 255, 255, .05); border: 2px dashed var(--rg-line-2); color: var(--rg-ink-3);
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.1rem;
}
html.rg .rg-bt-conferindo .rg-bt-conf-slot:not(.caiu) { animation: rg-bt-espera 1s ease-in-out infinite; animation-delay: calc(var(--i) * .1s); }
@keyframes rg-bt-espera { 50% { border-color: var(--rg-violeta); color: #fff; } }
html.rg .rg-bt-conf-slot.caiu { border-style: solid; animation: rg-bt-cai .6s cubic-bezier(.3, 1.5, .5, 1) both; }
@keyframes rg-bt-cai { 0% { transform: translateY(-70px) rotate(-200deg); opacity: 0; } 70% { transform: translateY(6px) rotate(10deg); opacity: 1; } 100% { transform: none; } }
html.rg .rg-bt-conf-slot.acerto { background: radial-gradient(circle at 35% 30%, var(--rg-lima-claro), var(--rg-lima) 55%, var(--rg-lima-escuro)); border-color: transparent; color: var(--rg-on-lima); box-shadow: 0 0 18px color-mix(in srgb, var(--rg-lima) 55%, transparent); }
html.rg .rg-bt-conf-slot.fora { background: var(--rg-surface-2); border-color: var(--rg-line-2); color: var(--rg-ink-2); }
html.rg .rg-bt-conf-btn, html.rg .rg-bt-rever { margin-top: 14px; padding: 12px 22px; border-radius: 14px; font-weight: 800; cursor: pointer; }
html.rg .rg-bt-conf-btn { border: 0; background: var(--rg-lima); color: var(--rg-on-lima); animation: rg-rl-pulsa 1.6s ease-in-out infinite; }
html.rg .rg-bt-conf-btn[hidden] { display: none; }
html.rg .rg-bt-rever { border: 1px solid var(--rg-line-2); background: transparent; color: var(--rg-ink-2); }
html.rg .rg-bt-conf.fim .rg-bt-conf-topo b { color: var(--rg-lima-texto); }
html.rg .rg-bt-conf.quase { border-color: rgba(245, 197, 66, .6); background: radial-gradient(400px 160px at 50% 0%, rgba(245, 197, 66, .22), transparent 70%), rgba(20, 16, 46, .6); }
html.rg .rg-bt-conf.quase .rg-bt-conf-topo b { color: var(--rg-gold); }
html.rg .rg-bt-conf.quase .rg-bt-conf-slot.fora { border: 2px solid var(--rg-gold); animation: rg-bt-cai .6s both, rg-bt-treme .5s .7s 2; }
@keyframes rg-bt-treme { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
@media (max-width: 575px) { html.rg .rg-bt-conf-slot { width: 46px; height: 46px; font-size: .95rem; } }
/* "Vários jogos" sem concurso aberto: aparece desligado, sem clique */
html.rg .rg-lj-link-off {
    display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 14px;
    background: rgba(255, 255, 255, .06); border: 1px dashed var(--rg-line-2); color: var(--rg-ink-3) !important;
    font-weight: 800; cursor: not-allowed; user-select: none;
}
html.rg .rg-lj-topo-links .rg-lj-link-off + a { background: transparent; border-color: transparent; color: var(--rg-ink-3) !important; text-decoration: underline !important; font-weight: 600; }

/* ==========================================================================
   Popup de depósito — layout novo (components/popups/depositar-rg) e etapa do PIX (SweetAlert com #input_output)
   ========================================================================== */
html.rg .x-popups-depositar.rg-dp {
    display: none; position: fixed; inset: 0; z-index: 999999; align-items: center; justify-content: center; padding: 16px;
    background: rgba(8, 4, 24, .72); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
html.rg .swal2-container { z-index: 9999999 !important; }
html.rg .rg-dp-caixa {
    position: relative; width: min(440px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; overflow-x: hidden;
    padding: 22px 20px 18px; border-radius: 28px; border: 1px solid color-mix(in srgb, var(--rg-lima) 28%, transparent);
    background: radial-gradient(420px 220px at 100% 0%, rgba(139, 92, 246, .35), transparent 70%),
                radial-gradient(360px 240px at 0% 100%, color-mix(in srgb, var(--rg-lima) 14%, transparent), transparent 70%), #1a1240;
    box-shadow: 0 30px 80px rgba(4, 2, 16, .7), 0 0 0 1px rgba(255, 255, 255, .04) inset, 0 0 60px color-mix(in srgb, var(--rg-lima) 12%, transparent);
    animation: rg-dp-entra .45s cubic-bezier(.2, 1.3, .4, 1) both;
}
@keyframes rg-dp-entra { from { opacity: 0; transform: translateY(24px) scale(.92); } to { opacity: 1; transform: none; } }
html.rg .rg-dp-brilho {
    position: absolute; top: -120px; left: 50%; width: 320px; height: 220px; margin-left: -160px; pointer-events: none;
    background: radial-gradient(closest-side, color-mix(in srgb, var(--rg-lima) 35%, transparent), transparent); filter: blur(10px); animation: rg-dp-respira 3.2s ease-in-out infinite;
}
@keyframes rg-dp-respira { 0%, 100% { opacity: .55; transform: scale(1); } 50% { opacity: 1; transform: scale(1.12); } }
html.rg .rg-dp-fechar {
    position: absolute; top: 14px; right: 14px; z-index: 2; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--rg-line-2);
    background: rgba(255, 255, 255, .06); color: var(--rg-ink-2); display: grid; place-items: center; cursor: pointer;
}
html.rg .rg-dp-fechar:hover { color: #fff; background: rgba(255, 255, 255, .12); }
html.rg .rg-dp-banner { position: relative; display: block; width: calc(100% + 40px); max-height: 140px; margin: -22px -20px 16px; object-fit: cover; border-radius: 28px 28px 0 0; }

html.rg .rg-dp-topo { position: relative; display: flex; align-items: center; gap: 14px; padding-right: 44px; margin-bottom: 16px; }
html.rg .rg-dp-icone {
    flex: none; width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; font-size: 1.35rem;
    background: linear-gradient(135deg, var(--rg-lima), #8fdc1e); color: var(--rg-on-lima); box-shadow: 0 10px 26px color-mix(in srgb, var(--rg-lima) 40%, transparent);
    animation: rg-dp-raio 2.4s ease-in-out infinite;
}
@keyframes rg-dp-raio { 0%, 100% { transform: rotate(0); } 8% { transform: rotate(-12deg) scale(1.08); } 16% { transform: rotate(8deg); } 24% { transform: rotate(0); } }
html.rg .rg-dp-topo h2 { margin: 0; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.45rem; color: #fff; line-height: 1.1; }
html.rg .rg-dp-topo p { margin: 4px 0 0; color: var(--rg-ink-2); font-size: .88rem; line-height: 1.35; }
html.rg .rg-dp-pix { display: inline-block; margin-right: 4px; padding: 1px 8px; border-radius: 99px; background: #32bcad; color: #04221f; font-weight: 800; font-size: .72rem; letter-spacing: .04em; vertical-align: 1px; }

html.rg .rg-dp-aviso {
    display: flex; gap: 10px; align-items: flex-start; margin-bottom: 14px; padding: 12px 14px; border-radius: 16px;
    background: rgba(245, 197, 66, .12); border: 1px solid rgba(245, 197, 66, .45); color: #fff; font-size: .9rem; line-height: 1.35;
}
html.rg .rg-dp-aviso i { color: var(--rg-gold); margin-top: 2px; }
html.rg .rg-dp-aviso b { color: var(--rg-gold); }

html.rg .rg-dp-valor { display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 0 0 14px; padding: 16px 12px 14px; border-radius: 22px; background: rgba(10, 6, 30, .55); border: 1px solid var(--rg-line); cursor: text; transition: border-color .2s, box-shadow .2s; }
html.rg .rg-dp-valor:focus-within, html.rg .rg-dp-valor.tem { border-color: color-mix(in srgb, var(--rg-lima) 60%, transparent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 10%, transparent), 0 0 30px color-mix(in srgb, var(--rg-lima) 15%, transparent); }
html.rg .rg-dp-rotulo { color: var(--rg-ink-3); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
html.rg .rg-dp-numero { display: flex; align-items: baseline; justify-content: center; gap: 6px; max-width: 100%; }
html.rg .rg-dp-numero em { font-style: normal; color: var(--rg-lima-texto); font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.4rem; }
html.rg .rg-dp-numero input {
    width: auto; max-width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: #fff; text-align: center; field-sizing: content;
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 2.7rem; line-height: 1.1; caret-color: var(--rg-lima); box-shadow: none !important;
}
html.rg .rg-dp-numero input::placeholder { color: rgba(255, 255, 255, .22); }

html.rg .rg-dp-atalhos { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
html.rg .rg-dp-atalho {
    position: relative; height: 54px; border-radius: 16px; border: 2px solid var(--rg-line-2); background: rgba(255, 255, 255, .05); color: #fff; cursor: pointer;
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.2rem; transition: transform .12s, border-color .15s, background .15s, box-shadow .15s;
}
html.rg .rg-dp-atalho small { margin-right: 3px; font-size: .7rem; color: var(--rg-ink-3); font-family: var(--rg-font) !important; }
html.rg .rg-dp-atalho:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--rg-lima) 55%, transparent); }
html.rg .rg-dp-atalho:active { transform: scale(.94); }
html.rg .rg-dp-atalho.ativo {
    background: linear-gradient(135deg, var(--rg-lima), var(--rg-lima-escuro-2)); border-color: var(--rg-lima); color: var(--rg-on-lima);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--rg-lima) 35%, transparent); animation: rg-dp-pop .35s cubic-bezier(.2, 1.6, .4, 1);
}
html.rg .rg-dp-atalho.ativo small { color: rgba(20, 16, 46, .65); }
@keyframes rg-dp-pop { 0% { transform: scale(.9); } 60% { transform: scale(1.08); } 100% { transform: none; } }
html.rg .rg-dp-quente {
    position: absolute; top: -10px; left: 50%; transform: translateX(-50%); padding: 2px 8px; border-radius: 99px; white-space: nowrap;
    background: linear-gradient(90deg, var(--rg-rosa), var(--rg-gold)); color: #1a0f00; font-family: var(--rg-font) !important; font-size: .62rem; font-weight: 800;
    box-shadow: 0 4px 12px rgba(255, 95, 162, .4); animation: rg-dp-quente 1.6s ease-in-out infinite;
}
@keyframes rg-dp-quente { 0%, 100% { transform: translateX(-50%); } 50% { transform: translateX(-50%) translateY(-2px); } }

html.rg .rg-dp-depois {
    display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 10px; margin-bottom: 14px;
    padding: 12px 14px; border-radius: 18px; background: rgba(52, 211, 153, .08); border: 1px solid rgba(52, 211, 153, .3);
    animation: rg-dp-pop .35s cubic-bezier(.2, 1.4, .4, 1);
}
html.rg .rg-dp-depois span { display: block; color: var(--rg-ink-3); font-size: .72rem; font-weight: 700; }
html.rg .rg-dp-depois b { display: block; color: var(--rg-ink-2); font-size: 1rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
html.rg .rg-dp-depois .novo { text-align: right; }
html.rg .rg-dp-depois .novo b { color: var(--rg-good); font-size: 1.2rem; }
html.rg .rg-dp-depois > i { color: var(--rg-good); animation: rg-dp-seta 1.2s ease-in-out infinite; }
@keyframes rg-dp-seta { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(4px); } }

html.rg .rg-dp-enviar { padding: 0 !important; display: block !important; }
html.rg .rg-dp-botao {
    position: relative; overflow: hidden; width: 100%; height: 58px; border: 0; border-radius: 18px; cursor: pointer;
    background: linear-gradient(135deg, var(--rg-lima), var(--rg-lima-escuro-2)); color: var(--rg-on-lima); font-weight: 800; font-size: 1.1rem;
    box-shadow: 0 14px 32px color-mix(in srgb, var(--rg-lima) 40%, transparent); transition: transform .12s, box-shadow .2s;
}
html.rg .rg-dp-botao b { font-family: var(--rg-font-display) !important; }
html.rg .rg-dp-botao::after {
    content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; transform: skewX(-20deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent); animation: rg-dp-brilha 2.6s ease-in-out infinite;
}
@keyframes rg-dp-brilha { 0%, 55% { left: -60%; } 100% { left: 130%; } }
html.rg .rg-dp-botao:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 18px 40px color-mix(in srgb, var(--rg-lima) 50%, transparent); }
html.rg .rg-dp-botao:active:not(:disabled) { transform: scale(.98); }
html.rg .rg-dp-botao:disabled { background: rgba(255, 255, 255, .08); color: var(--rg-ink-3); box-shadow: none; cursor: not-allowed; }
html.rg .rg-dp-botao:disabled::after { display: none; }
html.rg .rg-dp-seguro { margin: 10px 0 0; text-align: center; color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-dp-seguro i { margin-right: 4px; color: var(--rg-good); }

@media (max-width: 400px) {
    html.rg .rg-dp-caixa { padding: 18px 14px 14px; border-radius: 24px; }
    html.rg .rg-dp-banner { width: calc(100% + 28px); margin: -18px -14px 14px; border-radius: 24px 24px 0 0; }
    html.rg .rg-dp-numero input { font-size: 2.2rem; }
    html.rg .rg-dp-atalhos { gap: 8px; }
    html.rg .rg-dp-atalho { height: 50px; font-size: 1.05rem; }
}

/* etapa do PIX: SweetAlert montado pelo componente (mesmo HTML em todos os gateways: #input_output) */
html.rg .swal2-popup:has(#input_output) {
    width: min(420px, calc(100% - 32px)) !important; padding: 22px 18px 18px !important; border-radius: 28px !important; color: #fff !important;
    border: 1px solid rgba(50, 188, 173, .4); box-shadow: 0 30px 80px rgba(4, 2, 16, .7), 0 0 50px rgba(50, 188, 173, .15) !important;
    background: radial-gradient(380px 200px at 50% 0%, rgba(50, 188, 173, .25), transparent 70%), #1a1240 !important;
}
html.rg .swal2-popup:has(#input_output) .swal2-icon { display: none !important; }
html.rg .swal2-popup:has(#input_output) .swal2-title { margin: 0 0 4px !important; padding: 0 !important; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.4rem !important; color: #fff !important; }
html.rg .swal2-popup:has(#input_output) .swal2-html-container { margin: 6px 0 0 !important; color: var(--rg-ink-2) !important; font-size: .92rem !important; line-height: 1.4; }
html.rg .swal2-popup:has(#input_output) .input-group { flex-wrap: nowrap; gap: 8px; margin: 10px 0 !important; }
html.rg .swal2-popup:has(#input_output) #input_output {
    min-width: 0; height: 48px; border-radius: 14px !important; border: 1px solid var(--rg-line-2) !important; background: rgba(10, 6, 30, .7) !important;
    color: var(--rg-ink-2) !important; font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important; font-size: .78rem !important;
}
html.rg .swal2-popup:has(#input_output) #copyPix {
    flex: none; height: 48px; padding: 0 18px; border-radius: 14px !important; border: 0 !important;
    background: linear-gradient(135deg, #32bcad, #26d9c5) !important; color: #04221f !important; font-weight: 800; box-shadow: 0 8px 20px rgba(50, 188, 173, .35);
}
html.rg .swal2-popup:has(#input_output) #copyPix:active { transform: scale(.96); }
html.rg .swal2-popup:has(#input_output) img[src^="data:image"] {
    display: block; width: min(230px, 100%); height: auto; margin: 4px auto !important; padding: 12px; border-radius: 20px; background: #fff;
    box-shadow: 0 0 0 6px rgba(50, 188, 173, .25), 0 16px 40px rgba(0, 0, 0, .45);
}
html.rg .swal2-popup:has(#input_output) #payment-status {
    display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; padding: 8px 14px; border-radius: 99px;
    background: rgba(255, 255, 255, .06); color: var(--rg-ink-2); font-weight: 700; font-size: .85rem;
}
html.rg .swal2-popup:has(#input_output) #payment-status:not(:has(.alert))::before {
    content: ""; width: 9px; height: 9px; border-radius: 50%; background: #32bcad; box-shadow: 0 0 0 0 rgba(50, 188, 173, .7); animation: rg-dp-aguarda 1.4s ease-out infinite;
}
@keyframes rg-dp-aguarda { 0% { box-shadow: 0 0 0 0 rgba(50, 188, 173, .7); } 100% { box-shadow: 0 0 0 12px rgba(50, 188, 173, 0); } }
html.rg .swal2-popup:has(#input_output) #payment-status:has(.alert) { display: block; padding: 0; background: none; }
html.rg .swal2-popup:has(#input_output) #payment-status .alert-success {
    margin: 0; padding: 14px; border: 0; border-radius: 16px; background: linear-gradient(135deg, var(--rg-good), #10b981); color: #032a1c;
    font-weight: 800; font-size: 1rem; animation: rg-dp-pop .45s cubic-bezier(.2, 1.6, .4, 1);
}
html.rg .swal2-popup:has(#input_output) .swal2-actions { margin-top: 14px !important; }
html.rg .swal2-popup:has(#input_output) .swal2-confirm { border-radius: 14px !important; background: rgba(255, 255, 255, .1) !important; color: #fff !important; font-weight: 700 !important; box-shadow: none !important; }

/* ==========================================================================
   Login e cadastro (modal da home) — layout novo (auth/login-rg e auth/register-rg)
   ========================================================================== */
html.rg #exampleModalCenter .modal-dialog:has(.rg-au) { max-width: 440px; margin-left: auto; margin-right: auto; padding: 0 12px; }
html.rg #exampleModalCenter .modal-content:has(.rg-au) { background: transparent !important; border: 0 !important; box-shadow: none !important; }
html.rg .rg-au {
    position: relative; overflow: hidden; border-radius: 28px; border: 1px solid color-mix(in srgb, var(--rg-lima) 22%, transparent); color: #fff;
    background: radial-gradient(420px 220px at 100% 0%, rgba(139, 92, 246, .35), transparent 70%),
                radial-gradient(360px 240px at 0% 100%, color-mix(in srgb, var(--rg-lima) 12%, transparent), transparent 70%), #1a1240;
    box-shadow: 0 30px 80px rgba(4, 2, 16, .7), 0 0 60px color-mix(in srgb, var(--rg-lima) 10%, transparent);
    animation: rg-dp-entra .45s cubic-bezier(.2, 1.3, .4, 1) both;
}
html.rg .rg-au-fechar {
    position: absolute; top: 14px; right: 14px; z-index: 3; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--rg-line-2);
    background: rgba(10, 6, 30, .55); color: var(--rg-ink-2); display: grid; place-items: center; cursor: pointer;
}
html.rg .rg-au-fechar:hover { color: #fff; }
html.rg .rg-au-banner { display: block; width: 100%; max-height: 150px; object-fit: cover; }
html.rg .rg-au-corpo { display: flex; flex-direction: column; gap: 14px; padding: 22px 22px 20px; }
html.rg .rg-au-logo { display: block; max-height: 46px; max-width: 160px; margin: 0 auto; object-fit: contain; }
html.rg .rg-au-banner + .rg-au-corpo .rg-au-abas, html.rg .rg-au-logo + .rg-au-abas { margin-right: 0; } /* com banner ou logo, o X fica acima das abas */
/* modal aberto: o botão flutuante do menu não fica por cima do formulário */
html.rg body.modal-open #menu-floating-btn { display: none !important; }

html.rg .rg-au-abas { margin-right: 44px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 16px; background: rgba(10, 6, 30, .6); border: 1px solid var(--rg-line); }
html.rg .rg-au-abas button { height: 42px; border: 0; border-radius: 12px; background: transparent; color: var(--rg-ink-2); font-weight: 800; cursor: pointer; transition: background .15s, color .15s; }
html.rg .rg-au-abas button:hover:not(.ativo) { color: #fff; background: rgba(255, 255, 255, .05); }
html.rg .rg-au-abas button.ativo { background: linear-gradient(135deg, var(--rg-lima), var(--rg-lima-escuro-2)); color: var(--rg-on-lima); box-shadow: 0 6px 18px color-mix(in srgb, var(--rg-lima) 30%, transparent); cursor: default; }

html.rg .rg-au-titulo h2 { margin: 0; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.35rem; line-height: 1.2; color: #fff; text-wrap: balance; }
html.rg .rg-au-titulo h2 i { color: var(--rg-lima-texto); margin-right: 6px; }
html.rg .rg-au-titulo p { margin: 4px 0 0; color: var(--rg-ink-2); font-size: .9rem; }
html.rg .rg-au-titulo p b { color: #fff; }

html.rg .rg-au-aviso { display: flex; gap: 8px; align-items: flex-start; padding: 11px 14px; border-radius: 14px; font-size: .88rem; line-height: 1.35; }
html.rg .rg-au-aviso-ok { background: rgba(52, 211, 153, .12); border: 1px solid rgba(52, 211, 153, .4); color: #d1fae5; }
html.rg .rg-au-aviso-ok i { color: var(--rg-good); }
html.rg .rg-au-aviso-erro { background: rgba(248, 113, 113, .12); border: 1px solid rgba(248, 113, 113, .45); color: #fee2e2; }
html.rg .rg-au-aviso-erro i { color: var(--rg-bad); }
html.rg .rg-au-aviso i { margin-top: 2px; }

html.rg .rg-au-form { display: flex; flex-direction: column; gap: 12px; margin: 0; }
html.rg .rg-au-campo { display: flex; flex-direction: column; gap: 6px; margin: 0; min-width: 0; }
html.rg .rg-au-campo > span:first-child, html.rg .rg-au-telefone .phone-input-wrapper > label {
    color: var(--rg-ink-2); font-size: .8rem; font-weight: 700; letter-spacing: 0;
}
html.rg .rg-au-campo > small { color: var(--rg-ink-3); font-size: .76rem; }
html.rg .rg-au-entrada {
    position: relative; display: flex; align-items: center; height: 50px; border-radius: 14px;
    background: rgba(10, 6, 30, .6); border: 1.5px solid var(--rg-line-2); transition: border-color .15s, box-shadow .15s;
}
html.rg .rg-au-entrada:focus-within { border-color: var(--rg-lima); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 12%, transparent); }
html.rg .rg-au-entrada > i { width: 44px; flex: none; text-align: center; color: var(--rg-ink-3); font-size: .9rem; }
html.rg .rg-au-entrada:focus-within > i { color: var(--rg-lima-texto); }
html.rg .rg-au-entrada input {
    flex: 1; min-width: 0; height: 100%; padding: 0 14px 0 0; border: 0 !important; outline: 0; background: transparent !important;
    color: #fff; font-size: 16px; box-shadow: none !important; /* 16px evita o zoom do iPhone ao tocar no campo */
}
html.rg .rg-au-entrada input::placeholder { color: rgba(255, 255, 255, .3); }
html.rg .rg-au-entrada input:-webkit-autofill { -webkit-text-fill-color: #fff; transition: background-color 9999s ease-in-out 0s; }
html.rg .rg-au-entrada:has(input.is-invalid) { border-color: var(--rg-bad); }
html.rg .rg-au-erro { color: #fca5a5; font-size: .8rem; font-weight: 600; }

/* senha do login: a máscara (bolinhas + último caractere) fica por cima do campo, alinhada ao texto */
html.rg .rg-au-senha input { padding-right: 48px; }
html.rg .rg-au-senha input.rg-au-mascarado { color: transparent; caret-color: #fff; }
html.rg .rg-au-senha input.rg-au-mascarado:-webkit-autofill { -webkit-text-fill-color: transparent !important; }
html.rg .rg-au-mascara { position: absolute; left: 44px; right: 48px; top: 50%; transform: translateY(-50%); color: #fff; font-size: 16px; letter-spacing: .12em; white-space: nowrap; overflow: hidden; pointer-events: none; }
html.rg .rg-au-olho { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: var(--rg-ink-3); cursor: pointer; }
html.rg .rg-au-olho:hover, html.rg .rg-au-olho:focus-visible { color: #fff; background: rgba(255, 255, 255, .06); outline: none; }

html.rg .rg-au-esqueci { align-self: flex-end; margin-top: -4px; color: var(--rg-lima-texto) !important; font-size: .84rem; font-weight: 700; text-decoration: none !important; }
html.rg .rg-au-esqueci:hover { text-decoration: underline !important; }

html.rg .rg-au-dupla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
html.rg .rg-au-regra { display: flex; align-items: center; gap: 5px; transition: color .15s; }
html.rg .rg-au-regra i { font-size: .45rem; }
html.rg .rg-au-regra.ok { color: var(--rg-good) !important; }
html.rg .rg-au-regra.ok i, html.rg .rg-au-regra.falta i { font-size: .75rem; }
html.rg .rg-au-regra.falta { color: #fca5a5 !important; }

/* telefone (x-phone-input / intl-tel-input) no mesmo padrão dos outros campos */
html.rg .rg-au-telefone .phone-input-wrapper { display: flex; flex-direction: column; gap: 6px; padding: 0 !important; margin: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; height: auto !important; }
html.rg .rg-au-telefone .phone-input-wrapper > label { position: static; transform: none; margin: 0; font-size: .8rem !important; color: var(--rg-ink-2) !important; font-weight: 700 !important; }
html.rg .rg-au-telefone .iti { display: flex; width: 100%; height: 50px; border-radius: 14px; background: rgba(10, 6, 30, .6); border: 1.5px solid var(--rg-line-2); transition: border-color .15s, box-shadow .15s; }
html.rg .rg-au-telefone .iti:focus-within { border-color: var(--rg-lima); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 12%, transparent); }
html.rg .rg-au-telefone .iti input[type="tel"] { height: 100%; width: 100%; padding-right: 14px !important; color: #fff !important; font-size: 16px; }
html.rg .rg-au-telefone .iti__selected-country, html.rg .rg-au-telefone .iti__selected-flag { border-radius: 14px 0 0 14px; }
html.rg .rg-au-telefone .iti__dropdown-content { background: #1c1446 !important; border: 1px solid var(--rg-line-2); border-radius: 12px; color: #fff; }

html.rg .rg-au-botao {
    position: relative; overflow: hidden; width: 100%; height: 54px; margin-top: 4px; border: 0; border-radius: 16px; cursor: pointer;
    background: linear-gradient(135deg, var(--rg-lima), var(--rg-lima-escuro-2)); color: var(--rg-on-lima); font-weight: 800; font-size: 1.05rem;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--rg-lima) 35%, transparent); transition: transform .12s, box-shadow .2s, opacity .2s;
}
html.rg .rg-au-botao::after {
    content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; transform: skewX(-20deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent); animation: rg-dp-brilha 2.8s ease-in-out infinite;
}
html.rg .rg-au-botao:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 16px 36px color-mix(in srgb, var(--rg-lima) 45%, transparent); }
html.rg .rg-au-botao:active:not(:disabled) { transform: scale(.98); }
html.rg .rg-au-botao:disabled { background: rgba(255, 255, 255, .08); color: var(--rg-ink-3); box-shadow: none; cursor: not-allowed; }
html.rg .rg-au-botao:disabled::after { display: none; }

html.rg .rg-au-ou { display: flex; align-items: center; gap: 12px; color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; }
html.rg .rg-au-ou::before, html.rg .rg-au-ou::after { content: ""; flex: 1; height: 1px; background: var(--rg-line-2); }
html.rg .rg-au-google {
    display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 50px; border: 0; border-radius: 16px; cursor: pointer;
    background: #fff; color: #1f1f1f; font-weight: 700; font-size: .98rem; box-shadow: 0 6px 18px rgba(0, 0, 0, .25); transition: transform .12s;
}
html.rg .rg-au-google svg { width: 22px; height: 22px; }
html.rg .rg-au-google:hover { transform: translateY(-1px); }
html.rg .rg-au-rodape { margin: 0; text-align: center; color: var(--rg-ink-2); font-size: .9rem; }
html.rg .rg-au-link { padding: 0; border: 0; background: none; color: var(--rg-lima-texto); font-weight: 800; cursor: pointer; }
html.rg .rg-au-link:hover { text-decoration: underline; }
html.rg .rg-au-secundario { display: flex; align-items: center; justify-content: center; gap: 6px; height: 46px; border-radius: 14px; border: 1px solid var(--rg-line-2); color: var(--rg-ink-2) !important; font-weight: 700; text-decoration: none !important; }
html.rg .rg-au-codigo {
    width: 100%; height: 64px; border-radius: 16px; border: 2px solid var(--rg-lima); background: rgba(10, 6, 30, .6); color: #fff; outline: 0;
    text-align: center; font-family: var(--rg-font-display) !important; font-size: 1.8rem; font-weight: 800; letter-spacing: .4em;
}

@media (max-width: 400px) {
    html.rg .rg-au-corpo { padding: 18px 16px 16px; gap: 12px; }
    html.rg .rg-au-dupla { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-au-titulo h2 { font-size: 1.2rem; }
}

/* login/cadastro: ganhadores ao vivo (mesmo letreiro da home, compacto) */
html.rg .rg-au-ganhadores:empty { display: none; }
html.rg .rg-au-ganhadores .rg-letreiro { margin: 0; border-radius: 12px; box-shadow: 0 6px 18px rgba(124, 58, 237, .3); }
html.rg .rg-au-ganhadores .rg-letreiro-rotulo { padding: 0 10px; font-size: .62rem; gap: 6px; }
html.rg .rg-au-ganhadores .rg-letreiro-ponto { width: 7px; height: 7px; }
html.rg .rg-au-ganhadores .rg-letreiro-item { padding: 8px 16px; font-size: .82rem; }
html.rg .rg-au-ganhadores .rg-letreiro-item::before { width: 6px; height: 6px; margin-right: 2px; }
html.rg .rg-au-ganhadores .rg-letreiro-valor { font-size: .74rem; padding: 1px 8px; }
html.rg .rg-au-ganhadores .rg-letreiro-trilho { animation-duration: 45s; }

/* login/cadastro: aposta que o visitante montou e está esperando por ele */
html.rg .rg-au-guardada {
    display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border-radius: 18px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--rg-lima) 14%, transparent), color-mix(in srgb, var(--rg-lima) 4%, transparent)); border: 1.5px solid color-mix(in srgb, var(--rg-lima) 55%, transparent);
    box-shadow: 0 0 24px color-mix(in srgb, var(--rg-lima) 12%, transparent); animation: rg-au-guardada 2.4s ease-in-out infinite;
}
@keyframes rg-au-guardada { 0%, 100% { box-shadow: 0 0 18px color-mix(in srgb, var(--rg-lima) 10%, transparent); } 50% { box-shadow: 0 0 30px color-mix(in srgb, var(--rg-lima) 28%, transparent); } }
html.rg .rg-au-guardada header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; color: #fff; font-size: .95rem; }
html.rg .rg-au-guardada header i { color: var(--rg-lima-texto); }
html.rg .rg-au-guardada header span { color: var(--rg-ink-2); font-size: .82rem; }
html.rg .rg-au-guardada-item { display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 14px; background: rgba(10, 6, 30, .55); }
html.rg .rg-au-guardada-item > i { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in srgb, var(--rg-lima) 16%, transparent); color: var(--rg-lima-texto); }
html.rg .rg-au-guardada-item > div { flex: 1; min-width: 0; }
html.rg .rg-au-guardada-item b { display: block; color: #fff; font-size: .92rem; }
html.rg .rg-au-guardada-item small { display: block; color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-au-guardada-item > strong { flex: none; color: var(--rg-lima-texto); font-family: var(--rg-font-display) !important; font-size: .95rem; white-space: nowrap; }
html.rg .rg-au-guardada-nums { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
html.rg .rg-au-guardada-nums em { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: .68rem; font-weight: 800; color: var(--rg-on-lima); background: linear-gradient(135deg, var(--rg-lima), var(--rg-lima-escuro-2)); }
html.rg .rg-au-guardada-nums em.mais { width: auto; padding: 0 8px; border-radius: 99px; background: rgba(255, 255, 255, .12); color: #fff; }

/* conta recém-criada: aviso de comemoração (criado pelo roupagem.js, some sozinho) */
html.rg .rg-boasvindas { position: fixed; inset: 0; z-index: 2147482000; display: grid; place-items: center; padding: 16px; background: rgba(8, 4, 24, .55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); animation: rg-boasvindas-entra .3s ease-out both; }
html.rg .rg-boasvindas.saindo { animation: rg-boasvindas-sai .3s ease-in both; }
@keyframes rg-boasvindas-entra { from { opacity: 0; } to { opacity: 1; } }
@keyframes rg-boasvindas-sai { to { opacity: 0; } }
html.rg .rg-boasvindas-caixa {
    display: flex; flex-direction: column; align-items: center; gap: 6px; width: min(340px, 100%); padding: 26px 22px 20px; border-radius: 26px; text-align: center;
    background: radial-gradient(300px 160px at 50% 0%, color-mix(in srgb, var(--rg-lima) 30%, transparent), transparent 70%), #1a1240; border: 1px solid color-mix(in srgb, var(--rg-lima) 45%, transparent);
    box-shadow: 0 30px 80px rgba(4, 2, 16, .7), 0 0 60px color-mix(in srgb, var(--rg-lima) 20%, transparent); animation: rg-dp-entra .5s cubic-bezier(.2, 1.4, .4, 1) both;
}
html.rg .rg-boasvindas-emoji { display: block; font-size: 3.4rem !important; line-height: 1; animation: rg-dp-raio 1.6s ease-in-out infinite; }
html.rg .rg-boasvindas-caixa b { font-family: var(--rg-font-display) !important; font-size: 1.5rem; color: #fff; }
html.rg .rg-boasvindas-caixa span { color: var(--rg-ink-2); font-size: .95rem; }
html.rg .rg-boasvindas-caixa button { margin-top: 10px; width: 100%; height: 50px; border: 0; border-radius: 16px; background: linear-gradient(135deg, var(--rg-lima), var(--rg-lima-escuro-2)); color: var(--rg-on-lima); font-weight: 800; font-size: 1rem; cursor: pointer; box-shadow: 0 10px 26px color-mix(in srgb, var(--rg-lima) 35%, transparent); }

/* visitante sem menu lateral (body.rg-sem-menu, ver master): conteúdo, topo e rodapé ocupam a largura toda */
html.rg body.rg-sem-menu .content-wrapper,
html.rg body.rg-sem-menu .main-header,
html.rg body.rg-sem-menu .main-footer { margin-left: 0 !important; }
html.rg body.rg-sem-menu .main-sidebar { display: none !important; }

/* Fazer vários jogos — layout novo: adiciona um jogo em cima, lista embaixo com editar/excluir (como os palpites do Bichão) */
html.rg .rg-cc-oculto { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap; }
html.rg .rg-cc { display: flex; flex-direction: column; gap: 8px; margin-bottom: 6px; }
html.rg .rg-cc-rotulo { margin: 0; color: var(--rg-sky); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
html.rg .rg-cc-add { display: flex; gap: 8px; align-items: flex-start; }
html.rg .rg-cc-add textarea {
    flex: 1; min-width: 0; min-height: 80px; max-height: 168px; padding: 14px 16px; resize: none; overflow-y: auto; line-height: 1.5; font-family: inherit; border-radius: 14px; border: 1.5px solid var(--rg-line-2); outline: 0;
    background: rgba(10, 6, 30, .7); color: #fff; font-size: 16px; letter-spacing: .04em; transition: border-color .15s, box-shadow .15s;
}
html.rg .rg-cc-add textarea:focus { border-color: var(--rg-lima); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 12%, transparent); }
html.rg .rg-cc-add textarea.erro { border-color: var(--rg-bad); animation: rg-cc-treme .35s; }
@keyframes rg-cc-treme { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
html.rg .rg-cc-btn-add {
    flex: none; height: 52px; padding: 0 18px; border: 0; border-radius: 14px; cursor: pointer;
    background: linear-gradient(135deg, var(--rg-lima), var(--rg-lima-escuro-2)); color: var(--rg-on-lima); font-weight: 800; box-shadow: 0 8px 20px color-mix(in srgb, var(--rg-lima) 30%, transparent);
}
html.rg .rg-cc-btn-add:active { transform: scale(.97); }
html.rg .rg-cc-dica { color: var(--rg-ink-3); font-size: .8rem; }
html.rg .rg-cc-mais { align-self: center; margin-top: 4px; padding: 10px 18px; border-radius: 12px; border: 1px dashed var(--rg-line-2); background: transparent; color: var(--rg-lima-texto); font-weight: 800; cursor: pointer; }
html.rg .rg-cc-mais[hidden] { display: none; }
html.rg .rg-cc-lista-topo { display: flex; align-items: center; justify-content: space-between; margin-top: 6px; color: #fff; font-size: .95rem; }
html.rg .rg-cc-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; max-height: 420px; overflow-y: auto; overscroll-behavior: contain; }
html.rg .rg-cc-item {
    display: flex; align-items: center; gap: 10px; padding: 10px 10px 10px 12px; border-radius: 16px;
    background: rgba(10, 6, 30, .6); border: 1px solid var(--rg-line);
}
html.rg .rg-cc-item.novo { animation: rg-dp-pop .35s cubic-bezier(.2, 1.5, .4, 1); border-color: color-mix(in srgb, var(--rg-lima) 50%, transparent); }
html.rg .rg-cc-item.editando { border-color: var(--rg-lima); box-shadow: 0 0 0 3px color-mix(in srgb, var(--rg-lima) 12%, transparent); }
html.rg .rg-cc-n { flex: none; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: rgba(255, 255, 255, .08); color: var(--rg-ink-2); font-size: .75rem; font-weight: 800; }
html.rg .rg-cc-bolas { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 5px; }
html.rg .rg-cc-bolas i {
    width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: .76rem; font-weight: 800;
    background: linear-gradient(135deg, var(--rg-gold), #f0b429); color: var(--rg-tinta); box-shadow: 0 2px 6px rgba(245, 197, 66, .25);
}
html.rg .rg-cc-conta { flex: none; color: var(--rg-ink-3); font-size: .74rem; }
html.rg .rg-cc-acao {
    flex: none; width: 38px; height: 38px; border-radius: 12px; border: 1px solid var(--rg-line-2); cursor: pointer;
    background: rgba(255, 255, 255, .05); color: var(--rg-ink-2); display: grid; place-items: center;
}
html.rg .rg-cc-acao:hover { color: #fff; background: rgba(255, 255, 255, .1); }
html.rg .rg-cc-acao.apaga:hover { color: var(--rg-bad); border-color: rgba(248, 113, 113, .5); }
html.rg .rg-cc-acao.ok { background: var(--rg-lima); border-color: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-cc-edita { flex: 1; min-width: 0; min-height: 42px; padding: 9px 12px; resize: none; line-height: 1.5; font-family: inherit; border-radius: 12px; border: 1.5px solid var(--rg-lima); outline: 0; background: rgba(10, 6, 30, .8); color: #fff; font-size: 16px; }
@media (max-width: 575px) {
    html.rg .rg-cc-add { flex-direction: column; align-items: stretch; }
    html.rg .rg-cc-add textarea { min-height: 104px; } /* o exemplo quebra em 3 linhas no celular */
    html.rg .rg-cc-btn-add { width: 100%; padding: 0 14px; }
    html.rg .rg-cc-item { flex-wrap: wrap; }
    html.rg .rg-cc-bolas { order: 3; flex-basis: 100%; }
    html.rg .rg-cc-item.editando .rg-cc-edita { order: 3; flex-basis: 100%; }
    html.rg .rg-cc-item.editando .rg-cc-acao:first-of-type { margin-left: auto; }
    html.rg .rg-cc-conta { margin-left: auto; }
    html.rg .rg-cc-bolas i { width: 28px; height: 28px; font-size: .72rem; }
}

/* Fazer vários jogos: erro do Computar — linha e bola marcadas na lista e modal com Corrigir/Excluir */
html.rg .rg-cc-item.erro { border-color: rgba(248, 113, 113, .75); background: rgba(248, 113, 113, .08); box-shadow: 0 0 0 3px rgba(248, 113, 113, .15); }
html.rg .rg-cc-item.erro .rg-cc-n { background: var(--rg-bad); color: #fff; }
/* motivo da linha com problema (conferido na hora, antes do Computar) */
html.rg .rg-cc-item.erro { flex-wrap: wrap; }
html.rg .rg-cc-motivo { order: 10; flex-basis: 100%; padding-left: 36px; color: #fca5a5; font-size: .8rem !important; font-weight: 700; line-height: 1.35; }
html.rg .rg-cc-motivo i { margin-right: 4px; }
html.rg .rg-cc-problemas { padding: 3px 10px; border-radius: 99px; background: rgba(248, 113, 113, .16); color: #fca5a5; font-size: .78rem; font-weight: 800; }
html.rg .rg-cc-problemas[hidden] { display: none; }
html.rg body.rg-cc-vazio .rg-cc-computar { display: none !important; }
html.rg body.rg-cc-com-problema #submit_game { display: none !important; }
html.rg .rg-cc-previa { display: flex; flex-direction: column; gap: 6px; padding: 8px 12px; border-radius: 14px; border: 1px dashed var(--rg-line-2); background: rgba(10, 6, 30, .45); max-height: 260px; overflow-y: auto; }
html.rg .rg-cc-previa[hidden] { display: none; }
html.rg .rg-cc-previa-linha { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
html.rg .rg-cc-previa-linha + .rg-cc-previa-linha { padding-top: 6px; border-top: 1px dashed var(--rg-line); }
html.rg .rg-cc-previa .rg-cc-n { width: 22px; height: 22px; font-size: .7rem; }
html.rg .rg-cc-previa .rg-cc-bolas i { width: 26px; height: 26px; font-size: .7rem; }
html.rg .rg-cc-previa small { color: var(--rg-ink-3); font-size: .78rem !important; font-weight: 700; }
html.rg .rg-cc-previa-linha.erro .rg-cc-n { background: var(--rg-bad); color: #fff; }
html.rg .rg-cc-previa-linha.erro small { color: #fca5a5; }
@media (max-width: 575px) { html.rg .rg-cc-motivo { padding-left: 0; } html.rg .rg-cc-previa-linha small { order: 4; } }
html.rg .rg-cc-bolas i.ruim, html.rg .rg-cc-modal-jogo i.ruim {
    background: linear-gradient(135deg, #f87171, #dc2626) !important; color: #fff !important; box-shadow: 0 0 0 3px rgba(248, 113, 113, .35);
    animation: rg-cc-pisca 1s ease-in-out infinite;
}
@keyframes rg-cc-pisca { 50% { transform: scale(1.12); box-shadow: 0 0 0 6px rgba(248, 113, 113, .15); } }
html.rg .rg-cc-modal { position: fixed; inset: 0; z-index: 2147482500; display: grid; place-items: center; padding: 16px; background: rgba(8, 4, 24, .65); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); animation: rg-boasvindas-entra .2s ease-out both; }
html.rg .rg-cc-modal.saindo { animation: rg-boasvindas-sai .2s ease-in both; }
html.rg .rg-cc-modal-caixa {
    position: relative; display: flex; flex-direction: column; align-items: center; gap: 10px; width: min(420px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto;
    padding: 26px 20px 18px; border-radius: 26px; text-align: center; color: #fff;
    background: radial-gradient(320px 160px at 50% 0%, rgba(248, 113, 113, .28), transparent 70%), #1a1240; border: 1px solid rgba(248, 113, 113, .45);
    box-shadow: 0 30px 80px rgba(4, 2, 16, .7); animation: rg-dp-entra .4s cubic-bezier(.2, 1.3, .4, 1) both;
}
html.rg .rg-cc-modal-x { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--rg-line-2); background: rgba(255, 255, 255, .06); color: var(--rg-ink-2); display: grid; place-items: center; cursor: pointer; }
html.rg .rg-cc-modal-icone { width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; font-size: 1.5rem; color: #fff; background: linear-gradient(135deg, #f87171, #dc2626); box-shadow: 0 10px 26px rgba(220, 38, 38, .45); animation: rg-cc-treme .5s .2s; }
html.rg .rg-cc-modal-caixa h3 { margin: 4px 0 0; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.25rem; color: #fff; text-wrap: balance; }
html.rg .rg-cc-modal-caixa > p { margin: 0; color: var(--rg-ink-2); font-size: .93rem; line-height: 1.45; }
html.rg .rg-cc-modal-jogo { width: 100%; padding: 12px; border-radius: 16px; background: rgba(10, 6, 30, .6); border: 1px solid var(--rg-line); }
html.rg .rg-cc-modal-jogo > span { display: block; margin-bottom: 8px; color: var(--rg-ink-3); font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
html.rg .rg-cc-modal-jogo > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
html.rg .rg-cc-modal-jogo i { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: .74rem; font-weight: 800; background: linear-gradient(135deg, var(--rg-gold), #f0b429); color: var(--rg-tinta); }
html.rg .rg-cc-modal-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; margin-top: 4px; }
html.rg .rg-cc-modal-acoes:has(> :only-child) { grid-template-columns: 1fr; }
html.rg .rg-cc-modal-btn { height: 48px; border-radius: 14px; border: 0; cursor: pointer; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
html.rg .rg-cc-modal-btn.principal { background: linear-gradient(135deg, var(--rg-lima), var(--rg-lima-escuro-2)); color: var(--rg-on-lima); box-shadow: 0 10px 24px color-mix(in srgb, var(--rg-lima) 30%, transparent); }
html.rg .rg-cc-modal-btn.perigo { background: rgba(248, 113, 113, .14); color: #fecaca; border: 1px solid rgba(248, 113, 113, .5); }
html.rg .rg-cc-modal-link { padding: 4px; border: 0; background: none; color: var(--rg-ink-3); font-size: .85rem; text-decoration: underline; cursor: pointer; }
@media (max-width: 400px) { html.rg .rg-cc-modal-acoes { grid-template-columns: 1fr; } }

/* Minhas apostas: acertou no sorteio e aguarda a baixa do prêmio */
html.rg .rg-ma-acertou {
    display: flex; align-items: center; gap: 14px; margin-bottom: 14px; padding: 16px 18px; border-radius: 22px; color: #fff;
    background: linear-gradient(135deg, rgba(245, 197, 66, .28), rgba(255, 95, 162, .18)); border: 1.5px solid rgba(245, 197, 66, .7);
    box-shadow: 0 0 30px rgba(245, 197, 66, .2); animation: rg-au-guardada 2.4s ease-in-out infinite;
}
html.rg .rg-ma-acertou-icone { font-size: 2.4rem; line-height: 1; animation: rg-dp-raio 2s ease-in-out infinite; }
html.rg .rg-ma-acertou b { display: block; font-family: var(--rg-font-display) !important; font-size: 1.2rem; }
html.rg .rg-ma-acertou span { color: var(--rg-ink-2); font-size: .9rem; }
@media (max-width: 575px) { html.rg .rg-ma-acertou { padding: 14px; gap: 10px; } html.rg .rg-ma-acertou-icone { font-size: 2rem; } }

/* Minhas apostas: cartões e faixa "acertou" viram botões que filtram a tabela */
html.rg button.rg-ma-num { align-items: flex-start; text-align: left; border: 0; cursor: pointer; transition: transform .12s, box-shadow .15s; font: inherit; }
html.rg button.rg-ma-num:hover { transform: translateY(-2px); }
html.rg button.rg-ma-num.ativo { box-shadow: 0 0 0 3px #fff, 0 10px 24px rgba(0, 0, 0, .35); }
html.rg .rg-ma-ver { margin-top: auto; padding-top: 6px; font-style: normal; font-size: .74rem; font-weight: 800; opacity: .75; }
html.rg button.rg-ma-acertou { width: 100%; text-align: left; cursor: pointer; font: inherit; }
html.rg button.rg-ma-acertou > div { flex: 1; min-width: 0; }
html.rg button.rg-ma-acertou .rg-ma-ver { margin: 0; padding: 0; color: var(--rg-gold); opacity: 1; white-space: nowrap; }
html.rg button.rg-ma-acertou.ativo { box-shadow: 0 0 0 3px var(--rg-gold), 0 0 30px rgba(245, 197, 66, .35); }
html.rg .game-premiado { white-space: nowrap; }
@media (max-width: 575px) { html.rg button.rg-ma-acertou { flex-wrap: wrap; } html.rg button.rg-ma-acertou .rg-ma-ver { flex-basis: 100%; } }

/* Relatório de ganhos — layout novo (mesmo padrão do extrato financeiro: rg-ex-*) */
html.rg .rg-gn-filtros { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; align-items: center; }
html.rg .rg-gn-filtros-so-status { grid-template-columns: auto; justify-content: start; }
html.rg .rg-gn .rg-gn-status { align-self: auto; }
html.rg .rg-gn .rg-ex-lista small { display: block; color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-gn-cpf { display: block; color: var(--rg-ink-3); font-size: .76rem !important; }
html.rg .rg-gn-tag { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 99px; font-size: .76rem; font-weight: 800; white-space: nowrap; }
html.rg .rg-gn-tag.pago { background: rgba(52, 211, 153, .16); color: #a7f3d0; }
html.rg .rg-gn-tag.aberto { background: rgba(245, 197, 66, .16); color: #fde68a; }
html.rg .rg-gn .rg-ex-saldos span i { color: var(--rg-lima-texto); }
@media (max-width: 767px) {
    html.rg .rg-gn-filtros { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-gn .rg-gn-status { width: 100%; }
    /* período: quebra linha em vez de rolar para o lado (o "Personalizado" ficava cortado) */
    html.rg .rg-gn .rg-ex-periodos { flex-wrap: wrap; overflow-x: visible; }
    html.rg .rg-gn .rg-ex-periodos button { flex: 1 1 auto; padding: 9px 10px; }
    html.rg .rg-gn .rg-gn-status button { flex: 1 1 auto; }
    /* cartão de venda compacto: 3 colunas; cliente e usuário na linha toda; o % fica de fora (já está no ganho) */
    html.rg .rg-gn .rg-ex-tabela .table tr { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 10px; padding: 10px 12px; }
    html.rg .rg-gn .rg-ex-tabela .table td[data-rotulo="Cliente"],
    html.rg .rg-gn .rg-ex-tabela .table td[data-rotulo="Usuário"] { grid-column: 1 / -1; flex-direction: row; align-items: baseline; gap: 6px; flex-wrap: wrap; }
    html.rg .rg-gn .rg-ex-tabela .table td[data-rotulo="%"] { display: none; }
    html.rg .rg-gn .rg-ex-tabela .table td[data-rotulo="Comissão"] { grid-column: span 2; }
    html.rg .rg-gn .rg-gn-cpf { display: inline; }
}

html.rg .rg-gn-situacao { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html.rg .rg-gn-filtros-so-status { display: none; }
@media (max-width: 575px) { html.rg .rg-gn-situacao { grid-template-columns: minmax(0, 1fr); } html.rg .rg-gn-situacao .rg-ex-kpi { flex-direction: row; flex-wrap: wrap; align-items: center; column-gap: 10px; } html.rg .rg-gn-situacao .rg-ex-kpi > i { margin: 0; } html.rg .rg-gn-situacao .rg-ex-kpi b { margin-left: auto; } html.rg .rg-gn-situacao .rg-ex-kpi small { flex-basis: 100%; } }

/* Bichão — Minhas apostas (layout novo): cartões por situação e lista com palpites e ações */
html.rg .rg-bm { margin-top: 10px; }
html.rg .rg-bm-filtros { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, .8fr) minmax(0, .7fr) minmax(0, 1.4fr); gap: 10px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-bm-cartoes { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html.rg .rg-bm-cartoes .rg-ex-kpi b { font-size: 1.5rem; }
html.rg .rg-bm .rg-ex-tabela td small { display: block; color: var(--rg-ink-3); font-size: .74rem !important; }
html.rg .rg-bm-id { color: #fff !important; font-weight: 800; white-space: nowrap; }
html.rg .rg-bm-palpites { display: inline-flex; flex-wrap: wrap; gap: 4px; }
html.rg .rg-bm-palpites i { min-width: 30px; height: 26px; padding: 0 8px; border-radius: 99px; display: inline-grid; place-items: center; font-style: normal; font-weight: 800; font-size: .78rem; background: linear-gradient(135deg, var(--rg-gold), #f0b429); color: var(--rg-tinta); }
html.rg .rg-bm-perdeu { background: rgba(240, 112, 90, .14); color: #fecaca; }
html.rg .rg-bm-acoes { display: inline-flex; gap: 6px; justify-content: flex-end; flex-wrap: nowrap; }
html.rg .rg-bm-acao { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; border: 1px solid var(--rg-line-2); background: rgba(255, 255, 255, .05); color: var(--rg-ink-2) !important; text-decoration: none !important; transition: background .12s, color .12s; }
html.rg .rg-bm-acao:hover { background: rgba(255, 255, 255, .12); color: #fff !important; }
html.rg .rg-bm-acao.lima { background: var(--rg-lima); border-color: var(--rg-lima); color: var(--rg-on-lima) !important; }
html.rg .rg-bm-acao.zap { background: #25d366; border-color: #25d366; color: #fff !important; }
html.rg .rg-bm .rg-ex-tabela > header span a { color: var(--rg-lima-texto); font-weight: 700; text-decoration: underline; }
@media (max-width: 991px) {
    html.rg .rg-bm-filtros { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-bm-cliente { grid-column: 1 / -1; }
    html.rg .rg-bm-cartoes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    html.rg .rg-bm .rg-ex-tabela .table tr { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-bm .rg-ex-tabela .table td[data-rotulo="Palpites"],
    html.rg .rg-bm .rg-ex-tabela .table td[data-rotulo="Ações"],
    html.rg .rg-bm .rg-ex-tabela .table td[data-rotulo="Situação"] { grid-column: 1 / -1; }
    html.rg .rg-bm .rg-ex-tabela .table td[data-rotulo="Ações"]::before { content: none; }
    html.rg .rg-bm-acoes { width: 100%; justify-content: stretch; }
    html.rg .rg-bm-acao { flex: 1; height: 40px; }
}
@media (max-width: 400px) { html.rg .rg-bm-filtros { grid-template-columns: minmax(0, 1fr); } }
html.rg .rg-bm .rg-ex-tabela .table th, html.rg .rg-bm .rg-ex-tabela .table td { text-align: left; }
html.rg .rg-bm .rg-ex-tabela .table th.text-right, html.rg .rg-bm .rg-ex-tabela .table td.text-right { text-align: right; }
html.rg .rg-bm .rg-ex-tabela .table td[data-rotulo="Sorteio"] { min-width: 150px; }
@media (min-width: 768px) {
    html.rg .rg-bm-acoes { gap: 4px; }
    html.rg .rg-bm-acao { width: 32px; height: 32px; border-radius: 10px; font-size: .9rem; }
    html.rg .rg-bm .rg-ex-tabela .table th, html.rg .rg-bm .rg-ex-tabela .table td { padding-left: 8px; padding-right: 8px; }
}

/* Minhas apostas do Bichão em notebook/tablet (768–1399px): 8 colunas não cabem; a lista vira cartões em 2 colunas */
@media (min-width: 768px) and (max-width: 1399px) {
    html.rg .rg-bm .rg-ex-tabela .table thead { display: none; }
    html.rg .rg-bm .rg-ex-tabela .table, html.rg .rg-bm .rg-ex-tabela .table tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: 100%; }
    html.rg .rg-bm .rg-ex-tabela .table { display: block; }
    html.rg .rg-bm .rg-ex-tabela .table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 12px; padding: 12px; border-radius: 14px; background: rgba(20, 16, 46, .55); border: 1px solid var(--rg-line); }
    html.rg .rg-bm .rg-ex-tabela .table td { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 0 !important; border: 0; text-align: left !important; min-width: 0 !important; font-size: .88rem; overflow-wrap: anywhere; }
    html.rg .rg-bm .rg-ex-tabela .table td::before { content: attr(data-rotulo); color: var(--rg-ink-3); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
    html.rg .rg-bm .rg-ex-tabela .table td[data-rotulo="Palpites"], html.rg .rg-bm .rg-ex-tabela .table td[data-rotulo="Situação"], html.rg .rg-bm .rg-ex-tabela .table td[data-rotulo="Ações"] { grid-column: 1 / -1; }
    html.rg .rg-bm .rg-ex-tabela .table td[data-rotulo="Ações"]::before { content: none; }
    html.rg .rg-bm-acoes { width: 100%; }
    html.rg .rg-bm-acao { flex: 1; height: 38px; }
    html.rg .rg-bm .rg-ex-tabela .rg-ex-vazio { grid-column: 1 / -1; display: block; }
    html.rg .rg-bm .rg-ex-tabela .rg-ex-vazio td::before { content: none; }
    html.rg .rg-bm .rg-ex-tabela .table-responsive { overflow: visible; }
}

/* Bichão — Resultados (layout novo) */
html.rg .rg-br { margin-top: 10px; }
html.rg .rg-br-filtros { display: flex; flex-direction: column; gap: 10px; }
html.rg .rg-br-data { position: relative; display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 0 12px; border-radius: 10px; color: var(--rg-ink-2); cursor: pointer; }
html.rg .rg-br-data.ativo { background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-br-data input { width: 130px; height: 38px; padding: 0; border: 0; outline: 0; background: transparent; color: inherit; font-weight: 700; color-scheme: dark; }
html.rg .rg-br-data.ativo input { color-scheme: light; }
html.rg .rg-br-estados { display: flex; flex-wrap: wrap; gap: 6px; }
html.rg .rg-br-estados button { padding: 8px 14px; border-radius: 99px; border: 1px solid var(--rg-line-2); background: var(--rg-surface); color: var(--rg-ink-2); font-weight: 700; cursor: pointer; }
html.rg .rg-br-estados button.ativo { background: var(--rg-violeta); border-color: var(--rg-violeta); color: #fff; box-shadow: 0 6px 16px rgba(139, 92, 246, .35); }
html.rg .rg-br-titulo { color: var(--rg-ink-2); font-size: .95rem; }
html.rg .rg-br-titulo b { color: #fff; }
html.rg .rg-br-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
html.rg .rg-br-card { padding: 14px; border-radius: 20px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-br-card header { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
html.rg .rg-br-card header b { color: #fff; font-size: 1rem; min-width: 0; }
html.rg .rg-br-hora { flex: none; padding: 4px 10px; border-radius: 10px; background: color-mix(in srgb, var(--rg-lima) 14%, transparent); color: var(--rg-lima-texto); font-family: var(--rg-font-display) !important; font-weight: 800; font-size: .9rem; }
html.rg .rg-br-card ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
html.rg .rg-br-card li { display: grid; grid-template-columns: 34px 74px minmax(0, 1fr); align-items: center; gap: 10px; padding: 7px 8px; border-radius: 12px; }
html.rg .rg-br-card li:nth-child(odd) { background: rgba(255, 255, 255, .03); }
html.rg .rg-br-card li.primeiro { background: linear-gradient(135deg, rgba(245, 197, 66, .2), rgba(245, 197, 66, .06)); border: 1px solid rgba(245, 197, 66, .45); }
html.rg .rg-br-lugar { color: var(--rg-ink-3); font-weight: 800; font-size: .85rem; }
html.rg .rg-br-card li.primeiro .rg-br-lugar { color: var(--rg-gold); }
html.rg .rg-br-milhar { font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.2rem; color: #fff; letter-spacing: .04em; font-variant-numeric: tabular-nums; }
html.rg .rg-br-card li.primeiro .rg-br-milhar { color: var(--rg-gold); font-size: 1.35rem; }
html.rg .rg-br-bicho { display: flex; align-items: center; gap: 8px; min-width: 0; }
html.rg .rg-br-bicho img { width: 34px; height: 34px; flex: none; border-radius: 10px; object-fit: cover; background: rgba(255, 255, 255, .06); }
html.rg .rg-br-bicho b { display: block; color: #fff; font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-br-bicho small { display: block; color: var(--rg-ink-3); font-size: .74rem !important; }
html.rg .rg-br-card.carregando { display: flex; flex-direction: column; gap: 10px; min-height: 260px; }
html.rg .rg-br-card.carregando span { height: 34px; border-radius: 10px; background: linear-gradient(90deg, rgba(255,255,255,.04), rgba(255,255,255,.1), rgba(255,255,255,.04)); background-size: 200% 100%; animation: rg-br-brilho 1.2s linear infinite; }
html.rg .rg-br-card.carregando span:first-child { width: 50%; }
@keyframes rg-br-brilho { from { background-position: 200% 0; } to { background-position: -200% 0; } }
html.rg .rg-br-vazio { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 34px 20px; border-radius: 20px; background: var(--rg-surface); border: 1px dashed var(--rg-line-2); text-align: center; }
html.rg .rg-br-vazio > i { font-size: 2rem; color: var(--rg-sky); }
html.rg .rg-br-vazio p { margin: 0; max-width: 46ch; color: var(--rg-ink-2); }
@media (max-width: 767px) {
    html.rg .rg-br .rg-ex-periodos { align-self: stretch; flex-wrap: wrap; overflow-x: visible; }
    html.rg .rg-br .rg-ex-periodos > * { flex: 1 1 auto; justify-content: center; }
    html.rg .rg-br-estados { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
    html.rg .rg-br-estados button { flex: none; }
    html.rg .rg-br-grade { grid-template-columns: minmax(0, 1fr); }
}

/* menu do Bichão: a página atual fica em destaque */
html.rg .btn.rg-bm-menu-atual { background: var(--rg-lima) !important; border-color: var(--rg-lima) !important; color: var(--rg-on-lima) !important; box-shadow: 0 6px 18px color-mix(in srgb, var(--rg-lima) 35%, transparent) !important; }

/* Bichão — Cotação (layout novo) */
html.rg .rg-bc { margin-top: 10px; }
html.rg .rg-bc-topo { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; }
html.rg .rg-bc-topo h1 { margin: 2px 0 0; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.1rem); color: #fff; }
html.rg .rg-bc-topo p { margin: 4px 0 0; color: var(--rg-ink-2); }
html.rg .rg-bc-simula { display: flex; align-items: center; gap: 6px; padding: 5px 5px 5px 12px; border-radius: 14px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-bc-simula span { color: var(--rg-ink-3); font-size: .82rem; font-weight: 700; margin-right: 4px; }
html.rg .rg-bc-simula button { padding: 8px 12px; border: 0; border-radius: 10px; background: transparent; color: var(--rg-ink-2); font-weight: 800; cursor: pointer; }
html.rg .rg-bc-simula button.ativo { background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-bc-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
html.rg .rg-bc-card { display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 20px; background: var(--rg-surface); border: 1px solid var(--rg-line); transition: transform .12s, border-color .15s; }
html.rg .rg-bc-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--rg-lima) 40%, transparent); }
html.rg .rg-bc-card.quente { border-color: rgba(245, 197, 66, .45); background: radial-gradient(260px 120px at 100% 0%, rgba(245, 197, 66, .14), transparent 70%), var(--rg-surface); }
html.rg .rg-bc-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
html.rg .rg-bc-card h2 { margin: 0; font-size: 1.08rem !important; font-weight: 800; color: #fff; }
html.rg .rg-bc-selo { flex: none; padding: 2px 8px; border-radius: 99px; background: linear-gradient(90deg, var(--rg-rosa), var(--rg-gold)); color: #1a0f00; font-size: .66rem; font-weight: 800; white-space: nowrap; }
html.rg .rg-bc-desc { margin: 0; color: var(--rg-ink-3); font-size: .86rem; line-height: 1.4; }
html.rg .rg-bc-faixas { display: grid; gap: 8px; }
html.rg .rg-bc-faixas:has(> :nth-child(2)) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
html.rg .rg-bc-faixa { min-width: 0; }
@media (max-width: 360px) { html.rg .rg-bc-faixas:has(> :nth-child(2)) { grid-template-columns: minmax(0, 1fr); } }
html.rg .rg-bc-faixa { padding: 10px 12px; border-radius: 14px; background: rgba(10, 6, 30, .55); }
html.rg .rg-bc-faixa > span { display: block; color: var(--rg-ink-3); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
html.rg .rg-bc-faixa b { display: block; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.55rem; color: var(--rg-lima-texto); line-height: 1.15; }
html.rg .rg-bc-card.quente .rg-bc-faixa b { color: var(--rg-gold); }
html.rg .rg-bc-faixa b em { font-style: normal; font-family: var(--rg-font) !important; font-size: .78rem; font-weight: 700; color: var(--rg-ink-3); margin-right: 2px; }
html.rg .rg-bc-faixa small { display: block; color: var(--rg-ink-2); font-size: .8rem !important; }
html.rg .rg-bc-faixa small i { font-style: normal; font-weight: 800; color: #fff; }
html.rg .rg-bc-faixa small.pulo i[data-mult] { display: inline-block; animation: rg-dp-pop .35s cubic-bezier(.2, 1.5, .4, 1); }
html.rg .rg-bc-jogar { margin-top: auto; display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; border-radius: 12px; background: color-mix(in srgb, var(--rg-lima) 12%, transparent); border: 1px solid color-mix(in srgb, var(--rg-lima) 45%, transparent); color: var(--rg-lima-texto) !important; font-weight: 800; text-decoration: none !important; transition: background .15s, color .15s; }
html.rg .rg-bc-jogar:hover { background: var(--rg-lima); color: var(--rg-on-lima) !important; }
@media (max-width: 575px) {
    html.rg .rg-bc-simula { width: 100%; justify-content: space-between; }
    html.rg .rg-bc-simula button { flex: 1; padding: 8px 4px; }
    html.rg .rg-bc-grade { grid-template-columns: minmax(0, 1fr); }
}

/* Página de cadastro por indicação (/register) — layout novo */
html.rg body.login-page:has(.rg-cd) { display: block; height: auto; min-height: 100vh; background: radial-gradient(700px 400px at 15% 0%, rgba(139, 92, 246, .35), transparent 70%), radial-gradient(600px 400px at 100% 100%, color-mix(in srgb, var(--rg-lima) 12%, transparent), transparent 70%), var(--rg-bg) !important; }
html.rg .rg-cd { display: flex; flex-direction: column; align-items: center; gap: 18px; min-height: 100vh; padding: 28px 16px 40px; }
html.rg .rg-cd-logo { max-height: 56px; max-width: 200px; object-fit: contain; }
html.rg .rg-cd-caixa { width: min(480px, 100%); }
html.rg .rg-cd-convite { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: linear-gradient(135deg, color-mix(in srgb, var(--rg-lima) 16%, transparent), rgba(139, 92, 246, .16)); border: 1px solid color-mix(in srgb, var(--rg-lima) 45%, transparent); }
html.rg .rg-cd-convite-icone { font-size: 1.7rem; line-height: 1; }
html.rg .rg-cd-convite small { display: block; color: var(--rg-ink-2); font-size: .78rem !important; }
html.rg .rg-cd-convite b { display: block; color: #fff; font-size: 1.05rem; }
html.rg .rg-cd .g-recaptcha { transform-origin: left top; }
@media (max-width: 400px) { html.rg .rg-cd .g-recaptcha { transform: scale(.88); } }

/* Plano de carreira — aba "Minha Carreira" (layout novo, só apresentação) */
html.rg .rg-cr-aviso { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 14px; padding: 12px 14px; border-radius: 14px; background: rgba(245, 158, 11, .12); border: 1px solid rgba(245, 158, 11, .4); color: #fde68a; }
html.rg .rg-cr-hero { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 14px; padding: 22px; border-radius: 24px; border: 1px solid color-mix(in srgb, var(--rg-cr-cor) 45%, transparent);
    background: radial-gradient(500px 240px at 0% 0%, color-mix(in srgb, var(--rg-cr-cor) 30%, transparent), transparent 70%), var(--rg-surface); }
html.rg .rg-cr-hero-txt { min-width: 0; }
html.rg .rg-cr-ola { color: var(--rg-ink-2); font-weight: 700; }
html.rg .rg-cr-hero h2 { margin: 4px 0 10px; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.2rem); color: #fff; line-height: 1.1; text-wrap: balance; }
html.rg .rg-cr-chips { display: flex; flex-wrap: wrap; gap: 6px; }
html.rg .rg-cr-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 99px; background: rgba(255, 255, 255, .08); color: var(--rg-ink-2); font-size: .82rem; font-weight: 700; }
html.rg .rg-cr-chip.ouro { background: rgba(245, 197, 66, .16); color: var(--rg-gold); }
html.rg .rg-cr-hero p { margin: 12px 0 0; color: var(--rg-ink-2); }
html.rg .rg-cr-hero p b { color: #fff; }
html.rg .rg-cr-anel { position: relative; flex: none; width: 150px; height: 150px; }
html.rg .rg-cr-anel svg { width: 100%; height: 100%; transform: rotate(-90deg); }
html.rg .rg-cr-anel circle { fill: none; stroke-width: 11; }
html.rg .rg-cr-anel .fundo { stroke: rgba(255, 255, 255, .08); }
html.rg .rg-cr-anel .valor { stroke: var(--rg-lima); stroke-linecap: round; filter: drop-shadow(0 0 8px color-mix(in srgb, var(--rg-lima) 50%, transparent)); }
html.rg .rg-cr-anel > div { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 18px; }
html.rg .rg-cr-anel b { font-family: var(--rg-font-display) !important; font-size: 1.7rem; color: #fff; line-height: 1; }
html.rg .rg-cr-anel small { color: var(--rg-ink-3); font-size: .72rem !important; font-weight: 700; margin-top: 4px; }
html.rg .rg-cr-premio { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; padding: 16px; border-radius: 22px; border: 1.5px solid rgba(245, 197, 66, .5); background: linear-gradient(135deg, rgba(245, 197, 66, .16), rgba(255, 95, 162, .08)); }
html.rg .rg-cr-premio-foto { flex: none; width: 96px; height: 96px; border-radius: 18px; display: grid; place-items: center; overflow: hidden; background: rgba(10, 6, 30, .5); font-size: 2.6rem; }
html.rg .rg-cr-premio-foto img { width: 100%; height: 100%; object-fit: cover; }
html.rg .rg-cr-premio-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
html.rg .rg-cr-premio-txt > b { font-family: var(--rg-font-display) !important; font-size: 1.5rem; color: var(--rg-gold); line-height: 1.15; }
html.rg .rg-cr-premio-txt small { color: var(--rg-ink-2); font-size: .82rem !important; }
html.rg .rg-cr-barra { height: 12px; margin: 8px 0 4px; border-radius: 99px; background: rgba(255, 255, 255, .08); overflow: hidden; }
html.rg .rg-cr-barra span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--rg-gold), var(--rg-lima)); box-shadow: 0 0 12px color-mix(in srgb, var(--rg-lima) 50%, transparent); }
html.rg .rg-cr-pontos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
html.rg .rg-cr-pontos.tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html.rg .rg-cr-ponto { display: flex; flex-direction: column; gap: 4px; padding: 16px; border-radius: 20px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-cr-ponto > span { color: var(--rg-ink-3); font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
html.rg .rg-cr-ponto > span i { color: var(--rg-lima-texto); margin-right: 4px; }
html.rg .rg-cr-ponto b { font-family: var(--rg-font-display) !important; font-size: 1.8rem; color: #fff; }
html.rg .rg-cr-ponto small { color: var(--rg-ink-2); font-size: .84rem !important; line-height: 1.4; }
html.rg .rg-cr-ponto small em.ok { font-style: normal; color: var(--rg-good); font-weight: 800; margin-left: 4px; }
html.rg .rg-cr-conquistas { display: flex; align-items: center; gap: 12px; width: 100%; margin-bottom: 14px; padding: 14px 16px; border-radius: 18px; border: 1.5px solid rgba(245, 197, 66, .55); background: rgba(245, 197, 66, .1); color: #fff; text-align: left; cursor: pointer; font: inherit; }
html.rg .rg-cr-conquistas > span { font-size: 1.8rem; }
html.rg .rg-cr-conquistas > div { flex: 1; min-width: 0; }
html.rg .rg-cr-conquistas b { display: block; }
html.rg .rg-cr-conquistas small { color: var(--rg-ink-2); }
html.rg .rg-cr-conquistas em { font-style: normal; color: var(--rg-gold); font-weight: 800; white-space: nowrap; }
html.rg .rg-cr-jornada { margin-bottom: 14px; padding: 18px; border-radius: 22px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-cr-jornada header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 14px; }
html.rg .rg-cr-jornada h3 { margin: 0; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.2rem !important; color: #fff; }
html.rg .rg-cr-jornada header span { color: var(--rg-ink-3); font-size: .88rem; }
html.rg .rg-cr-estrada { list-style: none; margin: 0; padding: 22px 4px 6px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(150px, 1fr); gap: 12px; overflow-x: auto; scrollbar-width: thin; }
html.rg .rg-cr-etapa { position: relative; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 14px 10px 12px; border-radius: 18px; text-align: center; background: rgba(10, 6, 30, .55); border: 1px solid var(--rg-line); }
html.rg .rg-cr-etapa.atual { border-color: var(--rg-lima); box-shadow: 0 0 0 3px color-mix(in srgb, var(--rg-lima) 15%, transparent), 0 10px 26px color-mix(in srgb, var(--rg-lima) 15%, transparent); }
html.rg .rg-cr-etapa.feito { border-color: color-mix(in srgb, var(--rg-cr-etapa) 60%, transparent); }
html.rg .rg-cr-etapa.futuro { opacity: .75; }
html.rg .rg-cr-aqui { position: absolute; top: -12px; padding: 2px 10px; border-radius: 99px; background: var(--rg-lima); color: var(--rg-on-lima); font-size: .68rem; font-weight: 800; white-space: nowrap; }
html.rg .rg-cr-no { width: 60px; height: 60px; border-radius: 16px; display: grid; place-items: center; overflow: hidden; margin-bottom: 4px; font-size: 1.3rem;
    background: color-mix(in srgb, var(--rg-cr-etapa) 22%, transparent); color: var(--rg-cr-etapa); border: 2px solid color-mix(in srgb, var(--rg-cr-etapa) 60%, transparent); }
html.rg .rg-cr-no img { width: 100%; height: 100%; object-fit: cover; }
html.rg .rg-cr-etapa b { color: #fff; font-size: .98rem; }
html.rg .rg-cr-etapa small { color: var(--rg-ink-3); font-size: .76rem !important; }
html.rg .rg-cr-etapa em { font-style: normal; color: var(--rg-gold); font-weight: 800; font-size: .85rem; min-height: 1.2em; }
html.rg .rg-cr-mini { width: 100%; height: 6px; margin-top: 6px; border-radius: 99px; background: rgba(255, 255, 255, .08); overflow: hidden; }
html.rg .rg-cr-mini span { display: block; height: 100%; background: var(--rg-cr-etapa); }
html.rg .rg-cr-etapa small.pct { font-weight: 800; color: var(--rg-ink-2); }
html.rg .rg-cr-etapa.feito small.pct { color: var(--rg-good); }
@media (max-width: 767px) {
    html.rg .rg-cr-hero { flex-direction: column-reverse; align-items: stretch; padding: 18px; }
    html.rg .rg-cr-anel { width: 128px; height: 128px; align-self: center; }
    html.rg .rg-cr-premio { padding: 14px; gap: 12px; }
    html.rg .rg-cr-premio-foto { width: 72px; height: 72px; }
    html.rg .rg-cr-premio-txt > b { font-size: 1.2rem; }
    html.rg .rg-cr-pontos, html.rg .rg-cr-pontos.tres { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-cr-estrada { grid-auto-columns: 140px; }
    html.rg .rg-cr-conquistas { flex-wrap: wrap; }
}

/* Lista de ganhadores — layout novo */
html.rg .rg-gh-filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
html.rg .rg-gh-filtros .rg-ex-periodos { align-self: auto; }
html.rg .rg-gh-filtros select { width: auto; min-width: 220px; height: 46px; border-radius: 14px; }
html.rg .rg-gh-copiar:disabled { opacity: .55; cursor: wait; }
html.rg .rg-gh-resumo { grid-template-columns: minmax(0, 1fr) minmax(220px, .8fr); }
html.rg .rg-gh-resumo .rg-ex-resultado-num b { color: var(--rg-gold); }
html.rg .rg-gh-top { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 22px; color: #fff;
    background: linear-gradient(135deg, rgba(245, 197, 66, .28), rgba(255, 95, 162, .14)); border: 1.5px solid rgba(245, 197, 66, .7); box-shadow: 0 0 30px rgba(245, 197, 66, .2); }
html.rg .rg-gh-coroa { font-size: 2.4rem; line-height: 1; animation: rg-dp-raio 2.2s ease-in-out infinite; }
html.rg .rg-gh-top > div { flex: 1; min-width: 0; }
html.rg .rg-gh-top small { display: block; color: var(--rg-gold); font-weight: 800; font-size: .74rem !important; text-transform: uppercase; letter-spacing: .08em; }
html.rg .rg-gh-top b { display: block; font-family: var(--rg-font-display) !important; font-size: 1.35rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-gh-top span { color: var(--rg-ink-2); font-size: .88rem; }
html.rg .rg-gh-top strong { font-family: var(--rg-font-display) !important; font-size: 1.7rem; color: var(--rg-gold); white-space: nowrap; }
html.rg .rg-gh-lista > header { align-items: center; }
html.rg .rg-gh-busca { margin: 0; min-width: 240px; }
html.rg .rg-gh-itens { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
html.rg .rg-gh-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: rgba(10, 6, 30, .5); border: 1px solid var(--rg-line); }
html.rg .rg-gh-pos { flex: none; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: rgba(255, 255, 255, .06); color: var(--rg-ink-2); font-weight: 800; font-size: .88rem; }
html.rg .rg-gh-item.p2 .rg-gh-pos { background: linear-gradient(135deg, #e5e7eb, #9ca3af); color: #111; }
html.rg .rg-gh-item.p3 .rg-gh-pos { background: linear-gradient(135deg, #f59e0b, #b45309); color: #fff; }
html.rg .rg-gh-quem { flex: 1; min-width: 0; }
html.rg .rg-gh-quem b { display: block; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-gh-quem small { display: block; color: var(--rg-ink-3); font-size: .8rem !important; }
html.rg .rg-gh-item strong { flex: none; color: var(--rg-lima-texto); font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.1rem; }
html.rg .rg-gh-item.carregando { height: 64px; padding: 0; overflow: hidden; }
html.rg .rg-gh-item.carregando span { flex: 1; height: 100%; background: linear-gradient(90deg, rgba(255,255,255,.03), rgba(255,255,255,.08), rgba(255,255,255,.03)); background-size: 200% 100%; animation: rg-br-brilho 1.2s linear infinite; }
html.rg .rg-gh-vazio { padding: 28px; text-align: center; color: var(--rg-ink-3); }
@media (max-width: 767px) {
    html.rg .rg-gh .rg-ex-topo .rg-gh-copiar { width: 100%; justify-content: center; }
    html.rg .rg-gh-filtros .rg-ex-periodos { width: 100%; flex-wrap: wrap; overflow-x: visible; }
    html.rg .rg-gh-filtros .rg-ex-periodos > * { flex: 1 1 auto; justify-content: center; }
    html.rg .rg-gh-filtros select { width: 100%; }
    html.rg .rg-gh-resumo { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-gh-busca { min-width: 0; width: 100%; }
    html.rg .rg-gh-top { flex-wrap: wrap; }
    html.rg .rg-gh-top strong { width: 100%; font-size: 1.5rem; }
    html.rg .rg-gh-item strong { font-size: 1rem; }
}

/* sininho de notificações (topo) — mesmo padrão dos botões redondos do topo */
html.rg .main-header .btn-config.rg-sino { width: 42px !important; height: 42px !important; min-width: 42px !important; padding: 0 !important; border-radius: 50% !important;
    background: var(--rg-surface) !important; border: 1px solid var(--rg-line-2) !important; box-shadow: none !important; transition: background .15s, transform .12s; }
html.rg .main-header .btn-config.rg-sino::after { display: none !important; } /* sem a setinha do dropdown */
html.rg .main-header .btn-config.rg-sino:hover { background: rgba(255, 255, 255, .1) !important; transform: translateY(-1px); }
html.rg .main-header .btn-config.rg-sino[aria-expanded="true"] { border-color: var(--rg-lima) !important; }
html.rg .rg-sino .rg-sino-svg { width: 22px !important; height: 22px !important; padding: 0 !important; background: transparent !important; fill: none !important; color: var(--rg-ink-2) !important; display: block; }
html.rg .rg-sino.tem-novas .rg-sino-svg { color: var(--rg-lima-texto) !important; filter: drop-shadow(0 0 6px color-mix(in srgb, var(--rg-lima) 45%, transparent)); transform-origin: 50% 8%; animation: rg-sino-toca 4s ease-in-out infinite; }
@keyframes rg-sino-toca { 0%, 82%, 100% { transform: rotate(0); } 85% { transform: rotate(16deg); } 88% { transform: rotate(-14deg); } 91% { transform: rotate(10deg); } 94% { transform: rotate(-6deg); } 97% { transform: rotate(2deg); } }
html.rg .rg-sino .notifications-count { top: -10px !important; right: -11px !important; min-width: 19px; height: 19px; padding: 0 5px !important; border-radius: 99px !important; display: grid; place-items: center;
    background: linear-gradient(135deg, #ff5f7a, #e11d48) !important; color: #fff !important; font-size: 10.5px !important; font-weight: 800; line-height: 1 !important; box-shadow: 0 0 0 2px var(--rg-bg), 0 4px 10px rgba(225, 29, 72, .45) !important; }
@media (prefers-reduced-motion: reduce) { html.rg .rg-sino.tem-novas .rg-sino-svg { animation: none; } }
@media (max-width: 767px) { html.rg .main-header .btn-config.rg-sino { width: 36px !important; height: 36px !important; min-width: 36px !important; } html.rg .rg-sino .rg-sino-svg { width: 19px !important; height: 19px !important; } }
/* topo: o último botão (sininho) e o contador não encostam na borda da tela */
html.rg .main-header .navbar-nav.ml-auto { padding-right: 14px; }
@media (max-width: 767px) { html.rg .main-header .navbar-nav.ml-auto { padding-right: 12px; } }

/* sininho v2: sino cheio, botão com anel em degradê e brilho quando há novidade */
html.rg .main-header .btn-config.rg-sino { position: relative; overflow: visible;
    background: radial-gradient(circle at 30% 25%, rgba(255, 255, 255, .14), transparent 60%), linear-gradient(145deg, #2a1f63, #170f3d) !important;
    border: 1px solid rgba(255, 255, 255, .12) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 6px 16px rgba(4, 2, 16, .45) !important; }
html.rg .rg-sino-ico { width: 22px; height: 22px; display: block; overflow: visible; }
html.rg .rg-sino-ico .corpo { fill: #c9c3e6; }
html.rg .rg-sino-ico .badalo { fill: #c9c3e6; }
html.rg .rg-sino-ico .brilho { fill: none; stroke: rgba(255, 255, 255, .55); stroke-width: 1.4; stroke-linecap: round; }
html.rg .main-header .btn-config.rg-sino.tem-novas { border-color: transparent !important;
    background: radial-gradient(circle at 30% 25%, rgba(255, 255, 255, .35), transparent 55%), linear-gradient(145deg, #d9ff5a, #8fdc1e) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), 0 0 0 3px color-mix(in srgb, var(--rg-lima) 18%, transparent), 0 8px 22px color-mix(in srgb, var(--rg-lima) 40%, transparent) !important; }
html.rg .rg-sino.tem-novas .rg-sino-ico .corpo, html.rg .rg-sino.tem-novas .rg-sino-ico .badalo { fill: #14102e; }
html.rg .rg-sino.tem-novas .rg-sino-ico .brilho { stroke: rgba(255, 255, 255, .7); }
html.rg .rg-sino.tem-novas .rg-sino-ico { transform-origin: 50% 12%; animation: rg-sino-toca 4s ease-in-out infinite; }
html.rg .rg-sino.tem-novas .rg-sino-ico .badalo { transform-origin: 50% 0; animation: rg-sino-badalo 4s ease-in-out infinite; }
@keyframes rg-sino-badalo { 0%, 82%, 100% { transform: translateX(0); } 86% { transform: translateX(-1.2px); } 90% { transform: translateX(1.2px); } 94% { transform: translateX(-.6px); } }
/* onda que sai do botão quando há novidade */
html.rg .rg-sino.tem-novas::before { content: ""; position: absolute; inset: -1px; border-radius: 50%; border: 2px solid color-mix(in srgb, var(--rg-lima) 60%, transparent); animation: rg-sino-onda 2.4s ease-out infinite; pointer-events: none; }
@keyframes rg-sino-onda { 0% { transform: scale(1); opacity: .8; } 70%, 100% { transform: scale(1.55); opacity: 0; } }
html.rg .main-header .btn-config.rg-sino:hover { transform: translateY(-1px) scale(1.04); }
html.rg .main-header .rg-sino .notifications-count { top: -12px !important; right: -13px !important; min-width: 18px; height: 18px; font-size: 10px !important; border: 0; animation: rg-dp-pop .5s cubic-bezier(.2, 1.6, .4, 1); }
@media (prefers-reduced-motion: reduce) { html.rg .rg-sino.tem-novas .rg-sino-ico, html.rg .rg-sino.tem-novas .rg-sino-ico .badalo, html.rg .rg-sino.tem-novas::before { animation: none; } }
@media (max-width: 767px) { html.rg .rg-sino-ico { width: 19px; height: 19px; } }

/* Chat (cliente, layout novo): prévia presa ao botão, botão vivo com não lidas e conversa vazia com respostas prontas */
html.rg #chat-hub.ch-tem-nao-lidas #ch-btn { animation: rg-ch-pula 2.6s ease-in-out infinite; box-shadow: 0 0 0 3px color-mix(in srgb, var(--rg-lima) 55%, transparent), 0 10px 26px color-mix(in srgb, var(--rg-lima) 35%, transparent) !important; }
html.rg #chat-hub.ch-tem-nao-lidas .ch-fab-wrapper::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid color-mix(in srgb, var(--rg-lima) 65%, transparent); animation: rg-sino-onda 2s ease-out infinite; pointer-events: none; }
html.rg #chat-hub .ch-fab-wrapper { position: relative; }
@keyframes rg-ch-pula { 0%, 70%, 100% { transform: none; } 76% { transform: translateY(-6px) rotate(-6deg); } 84% { transform: translateY(0) rotate(4deg); } 90% { transform: translateY(-2px); } }
html.rg #chat-hub.ch-tem-nao-lidas #ch-badge { min-width: 22px; height: 22px; font-size: 12px; font-weight: 800; background: linear-gradient(135deg, #ff5f7a, #e11d48) !important; box-shadow: 0 0 0 2px var(--rg-bg); }

html.rg #ch-previa {
    position: absolute; right: 0; bottom: calc(100% + 14px); width: min(300px, calc(100vw - 24px)); padding: 14px 14px 12px; border-radius: 20px; cursor: pointer; text-align: left; color: #fff;
    background: radial-gradient(260px 120px at 0% 0%, color-mix(in srgb, var(--rg-lima) 18%, transparent), transparent 70%), #1f1650; border: 1.5px solid color-mix(in srgb, var(--rg-lima) 55%, transparent);
    box-shadow: 0 18px 44px rgba(4, 2, 16, .6), 0 0 30px color-mix(in srgb, var(--rg-lima) 15%, transparent);
    opacity: 0; transform: translateY(12px) scale(.94); transform-origin: 90% 100%; pointer-events: none; transition: opacity .25s, transform .35s cubic-bezier(.2, 1.4, .4, 1); z-index: 2;
}
html.rg #ch-previa.ch-previa-show { opacity: 1; transform: none; pointer-events: auto; }
html.rg #ch-previa::after { content: ""; position: absolute; right: 26px; bottom: -8px; width: 14px; height: 14px; transform: rotate(45deg); background: #1f1650; border-right: 1.5px solid color-mix(in srgb, var(--rg-lima) 55%, transparent); border-bottom: 1.5px solid color-mix(in srgb, var(--rg-lima) 55%, transparent); }
html.rg .ch-previa-fechar { position: absolute; top: 6px; right: 6px; width: 28px; height: 28px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .08); color: var(--rg-ink-2); font-size: 1rem; line-height: 1; cursor: pointer; }
html.rg .ch-previa-topo { display: flex; align-items: center; gap: 10px; padding-right: 26px; }
html.rg .ch-previa-topo img, html.rg .ch-previa-ini { width: 40px; height: 40px; flex: none; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: var(--rg-lima); color: var(--rg-on-lima); font-weight: 800; box-shadow: 0 0 0 2px #1f1650, 0 0 0 4px var(--rg-good); }
html.rg .ch-previa-topo b { display: block; font-size: .98rem; }
html.rg .ch-previa-topo small { display: block; color: var(--rg-ink-3); font-size: .74rem; }
html.rg #ch-previa p { margin: 10px 0 8px; color: var(--rg-ink); font-size: .95rem; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
html.rg .ch-previa-responder { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 99px; background: var(--rg-lima); color: var(--rg-on-lima); font-weight: 800; font-size: .85rem; }

html.rg .cw-empty.cw-empty-rg { padding: 16px 14px; text-align: center; }
html.rg .cw-empty-ola { display: block; font-size: 2.2rem; margin-bottom: 6px; animation: rg-dp-raio 2.4s ease-in-out infinite; }
html.rg .cw-empty-rg p { color: var(--rg-ink-2); font-size: .88rem; line-height: 1.4; }
html.rg .cw-empty-rg p b { display: block; color: #fff; font-size: 1rem; margin-bottom: 2px; }
html.rg .cw-prontas { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 12px; }
html.rg .cw-pronta { padding: 8px 12px; border-radius: 99px; border: 1px solid color-mix(in srgb, var(--rg-lima) 50%, transparent); background: color-mix(in srgb, var(--rg-lima) 10%, transparent); color: var(--rg-lima-texto); font-weight: 700; font-size: .82rem; cursor: pointer; transition: background .15s, color .15s; }
html.rg .cw-pronta:hover { background: var(--rg-lima); color: var(--rg-on-lima); }
@media (prefers-reduced-motion: reduce) { html.rg #chat-hub.ch-tem-nao-lidas #ch-btn, html.rg #chat-hub.ch-tem-nao-lidas .ch-fab-wrapper::after, html.rg .cw-empty-ola { animation: none; } }

/* Relatório de combos cadastrados — layout novo */
html.rg .rg-cb-filtros { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr); gap: 10px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-cb-cartoes { grid-template-columns: repeat(5, minmax(0, 1fr)); }
html.rg .rg-cb-cartoes .rg-ex-kpi b { font-size: 1.5rem; }
html.rg .rg-cb-resumo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
html.rg .rg-cb-resumo .rg-ex-resultado-num b { color: var(--rg-lima-texto); }
html.rg .rg-cb .rg-ex-tabela .table th, html.rg .rg-cb .rg-ex-tabela .table td { text-align: left; }
html.rg .rg-cb .rg-ex-tabela .table th.text-right, html.rg .rg-cb .rg-ex-tabela .table td.text-right { text-align: right; }
html.rg .rg-cb .rg-ex-tabela td small { display: block; color: var(--rg-ink-3); font-size: .74rem !important; }
html.rg .rg-cb-id { color: #fff !important; font-weight: 800; white-space: nowrap; }
html.rg .rg-cb .rg-ex-ouro { --cor: var(--rg-gold); }
html.rg .rg-cb .rg-ex-coral { --cor: var(--rg-coral); }
@media (max-width: 1199px) { html.rg .rg-cb-cartoes { grid-template-columns: repeat(3, minmax(0, 1fr)); } html.rg .rg-cb-resumo { grid-template-columns: 1fr 1fr; } html.rg .rg-cb-resumo .rg-ex-resultado-num { grid-column: 1 / -1; } }
@media (max-width: 767px) {
    html.rg .rg-cb-filtros { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-cb-mod { grid-column: 1 / -1; }
    html.rg .rg-cb-cartoes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    html.rg .rg-cb-cartoes > :first-child { grid-column: 1 / -1; }
    html.rg .rg-cb-resumo { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-cb .rg-ex-tabela .table td[data-rotulo="Combo"], html.rg .rg-cb .rg-ex-tabela .table td[data-rotulo="Consultor"] { grid-column: 1 / -1; }
    html.rg .rg-cb .rg-ex-tabela .table td.text-right { text-align: left !important; }
}
@media (max-width: 767px) {
    html.rg .rg-cb-cartoes { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    html.rg .rg-cb-cartoes .rg-ex-kpi { flex-direction: row; flex-wrap: wrap; align-items: center; column-gap: 10px; padding: 10px 12px; }
    html.rg .rg-cb-cartoes .rg-ex-kpi > i { margin: 0; width: 30px; height: 30px; }
    html.rg .rg-cb-cartoes .rg-ex-kpi span { font-size: .9rem; }
    html.rg .rg-cb-cartoes .rg-ex-kpi b { margin-left: auto; font-size: 1.25rem; }
    html.rg .rg-cb-cartoes .rg-ex-kpi small { flex-basis: 100%; margin-top: 2px; }
    html.rg .rg-cb-cartoes .rg-ex-kpi.ativo::after { display: none; }
}

/* Relatório de jogos dos combos com compradores — layout novo (reaproveita rg-cb) */
html.rg .rg-jc-filtros { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1.4fr) minmax(0, .8fr); }
html.rg .rg-jc-cartoes { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html.rg .rg-jc-nome { color: #fff !important; font-weight: 700; overflow-wrap: anywhere; }
html.rg .rg-jc .rg-ext-carteira.rg-ex-verde { --cor: var(--rg-good); }
html.rg .rg-jc-combo b { display: block; color: #fff; font-weight: 800; white-space: nowrap; }
html.rg .rg-jc .rg-ex-tabela td[data-rotulo="Valor"] .rg-ext-carteira { margin-top: 4px; }
html.rg .rg-jc .rg-ex-tabela td[data-rotulo="Valor"] > span:first-child { display: block; white-space: nowrap; }
html.rg .rg-jc-contato small { overflow-wrap: anywhere; }
@media (min-width: 768px) { html.rg .rg-jc-contato { min-width: 220px; } html.rg .rg-jc-contato small { overflow-wrap: normal; word-break: break-all; } }
@media (max-width: 767px) { html.rg .rg-jc .rg-ex-tabela td[data-rotulo="Valor"] > span:first-child { display: inline; margin-right: 8px; } }
html.rg .rg-jc-nome .rg-ext-carteira { margin-left: 6px; vertical-align: middle; }
html.rg .rg-jc-contato i { width: 14px; color: var(--rg-ink-3); font-size: .72rem; }
html.rg .rg-jc-jogos > span { display: block; color: #fff; font-weight: 700; white-space: nowrap; }
html.rg .rg-jc-acoes { display: flex; gap: 6px; margin-top: 4px; flex-wrap: wrap; }
html.rg .rg-jc-ver, html.rg .rg-jc-pdf { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; font-size: .76rem; font-weight: 700; border: 1px solid var(--rg-line); background: rgba(255,255,255,.04); color: var(--rg-ink-2, #cbd5e1); text-decoration: none; cursor: pointer; white-space: nowrap; }
html.rg .rg-jc-ver { border-color: color-mix(in srgb, var(--rg-lima) 45%, transparent); color: var(--rg-lima-texto); }
html.rg .rg-jc-ver:hover { background: color-mix(in srgb, var(--rg-lima) 14%, transparent); }
html.rg .rg-jc-pdf:hover { color: #fff; text-decoration: none; border-color: var(--rg-coral); }
html.rg .rg-jc-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(5, 8, 20, .72); backdrop-filter: blur(4px); }
html.rg .rg-jc-modal[hidden] { display: none; }
html.rg .rg-jc-caixa { width: 100%; max-width: 560px; max-height: calc(100vh - 32px); display: flex; flex-direction: column; border-radius: 22px; background: var(--rg-surface); border: 1px solid var(--rg-line); box-shadow: 0 24px 60px rgba(0,0,0,.5); animation: rg-jc-entra .22s ease-out; }
html.rg .rg-jc-caixa > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 18px 12px; border-bottom: 1px solid var(--rg-line); }
html.rg .rg-jc-caixa h3 { margin: 2px 0 0; color: #fff; font-size: 1.15rem; font-weight: 800; overflow-wrap: anywhere; }
html.rg .rg-jc-caixa header small { color: var(--rg-ink-3); }
html.rg .rg-jc-fechar { flex: none; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--rg-line); background: rgba(255,255,255,.05); color: #fff; }
html.rg .rg-jc-bilhetes { list-style: none; margin: 0; padding: 12px 18px; overflow-y: auto; display: grid; gap: 10px; }
html.rg .rg-jc-bilhetes li { padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--rg-line); }
html.rg .rg-jc-num { display: block; margin-bottom: 6px; color: var(--rg-ink-3); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
html.rg .rg-jc-bolas { display: flex; flex-wrap: wrap; gap: 6px; }
html.rg .rg-jc-bolas span { width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff 0, #e2e8f0 60%, #cbd5e1 100%); color: #111827; font-weight: 800; font-size: .82rem; box-shadow: 0 2px 6px rgba(0,0,0,.35); }
html.rg .rg-jc-caixa > footer { padding: 12px 18px 18px; border-top: 1px solid var(--rg-line); }
html.rg .rg-jc-caixa > footer .rg-jc-pdf { width: 100%; justify-content: center; padding: 10px; font-size: .88rem; }
body.rg-jc-travado { overflow: hidden; }
@keyframes rg-jc-entra { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 1199px) { html.rg .rg-jc-filtros { grid-template-columns: repeat(3, minmax(0, 1fr)); } html.rg .rg-jc-cartoes { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 767px) {
    html.rg .rg-jc-filtros { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-jc-filtros .rg-ext-campo:nth-of-type(4) { grid-column: 1 / -1; order: 1; }
    html.rg .rg-jc-cartoes { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-jc .rg-ex-tabela .table td[data-rotulo="Comprador"], html.rg .rg-jc .rg-ex-tabela .table td[data-rotulo="Contato"], html.rg .rg-jc .rg-ex-tabela .table td[data-rotulo="Jogos"] { grid-column: 1 / -1; }
    html.rg .rg-jc-modal { align-items: flex-end; padding: 0; }
    html.rg .rg-jc-caixa { max-width: none; max-height: 88vh; border-radius: 22px 22px 0 0; }
    html.rg .rg-jc-bolas span { width: 30px; height: 30px; font-size: .78rem; }
}
@media (prefers-reduced-motion: reduce) { html.rg .rg-jc-caixa { animation: none; } }

/* Tabelas de jogos (config) e Categorias — layout novo */
html.rg .rg-tb-topo-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
html.rg .rg-tb-topo-acoes .rg-ex-btn { text-decoration: none; }
html.rg .rg-tb-abas { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--rg-surface); border: 1px solid var(--rg-line); max-width: 100%; }
html.rg .rg-tb-abas a { display: inline-flex; align-items: center; gap: 7px; padding: 8px 18px; border-radius: 999px; color: var(--rg-ink-2); font-weight: 700; font-size: .9rem; text-decoration: none; white-space: nowrap; }
html.rg .rg-tb-abas a:hover { color: #fff; }
html.rg .rg-tb-abas a.ativo, html.rg .rg-tb-abas a.ativo i { background: var(--rg-lima); color: var(--rg-on-lima) !important; }
html.rg .rg-tb-abas a.ativo i { background: none; }
html.rg .rg-tb-abas a:not(.ativo) { color: var(--rg-ink-2) !important; }
html.rg .rg-tb-curto { display: none; }
html.rg .rg-tb-painel { display: grid; grid-template-columns: minmax(0, 2.2fr) repeat(3, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-tb-painel-cat { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); }
html.rg .rg-tb-chave { display: flex; align-items: center; gap: 12px; margin: 0; padding: 14px 16px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); transition: border-color .2s, background .2s; }
html.rg .rg-tb-chave.ligada { border-color: color-mix(in srgb, var(--rg-good) 55%, transparent); background: color-mix(in srgb, var(--rg-good) 9%, var(--rg-surface)); }
html.rg .rg-tb-chave-icone { flex: none; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: rgba(255,255,255,.06); color: var(--rg-ink-3); font-size: 1.15rem; }
html.rg .rg-tb-chave.ligada .rg-tb-chave-icone { color: var(--rg-good); background: color-mix(in srgb, var(--rg-good) 16%, transparent); }
html.rg .rg-tb-chave > div { flex: 1; min-width: 0; }
html.rg .rg-tb-chave b { display: block; color: #fff; font-size: .95rem; }
html.rg .rg-tb-chave small { color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-tb-switch { flex: none; position: relative; width: 50px; height: 28px; margin: 0; cursor: pointer; }
html.rg .rg-tb-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 1; }
html.rg .rg-tb-switch span { position: absolute; inset: 0; border-radius: 999px; background: rgba(255,255,255,.14); transition: background .2s; }
html.rg .rg-tb-switch span::after { content: ''; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.3); transition: transform .2s; }
html.rg .rg-tb-switch input:checked + span { background: var(--rg-good); }
html.rg .rg-tb-switch input:checked + span::after { transform: translateX(22px); }
html.rg .rg-tb-switch input:focus-visible + span { outline: 2px solid var(--rg-lima); outline-offset: 2px; }
html.rg .rg-tb-switch input:disabled + span { opacity: .6; }
html.rg .rg-tb-num { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 12px 16px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-tb-num i { color: var(--rg-violeta); font-size: .9rem; }
html.rg .rg-tb-num b { color: #fff; font-size: 1.45rem; line-height: 1.1; }
html.rg .rg-tb-num small { color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-tb-num.alerta i, html.rg .rg-tb-num.alerta b { color: var(--rg-gold); }
html.rg .rg-tb-filtros { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 10px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); margin: 0; }
html.rg .rg-tb-filtros-cat { grid-template-columns: minmax(0, 1fr); padding: 10px 14px; }
html.rg .rg-tb-busca-campo { position: relative; display: block; }
html.rg .rg-tb-busca-campo i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--rg-ink-3); font-size: .85rem; pointer-events: none; }
html.rg .rg-tb-busca-campo input { padding-left: 34px; }
html.rg .rg-tb-cabeca { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; color: var(--rg-ink-3); font-size: .85rem; }
html.rg .rg-tb-cabeca a { color: var(--rg-lima-texto); font-weight: 700; text-decoration: none; }
html.rg .rg-tb-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
html.rg .rg-tb-card { display: flex; flex-direction: column; min-width: 0; border-radius: 18px; overflow: hidden; background: var(--rg-surface); border: 1px solid var(--rg-line); transition: transform .15s, border-color .15s, box-shadow .15s; }
html.rg .rg-tb-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--rg-violeta) 55%, transparent); box-shadow: 0 12px 28px rgba(0,0,0,.3); }
html.rg .rg-tb-capa { position: relative; display: block; width: 100%; aspect-ratio: 4 / 3; padding: 0; border: 0; background: linear-gradient(135deg, rgba(139,92,246,.18), rgba(255,255,255,.03)); cursor: pointer; overflow: hidden; }
html.rg .rg-tb-capa img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
html.rg .rg-tb-capa-vazia { position: absolute; inset: 0; display: none; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; }
html.rg .rg-tb-capa-vazia i { font-size: 1.8rem; opacity: .7; }
html.rg .rg-tb-capa.sem .rg-tb-capa-vazia { display: flex; }
html.rg .rg-tb-capa-trocar { position: absolute; left: 50%; bottom: 10px; transform: translate(-50%, 6px); padding: 6px 12px; border-radius: 999px; background: rgba(8,5,24,.78); color: #fff; font-size: .76rem; font-weight: 700; white-space: nowrap; opacity: 0; transition: opacity .15s, transform .15s; }
html.rg .rg-tb-capa:hover .rg-tb-capa-trocar, html.rg .rg-tb-capa:focus-visible .rg-tb-capa-trocar { opacity: 1; transform: translate(-50%, 0); }
@media (hover: none) { html.rg .rg-tb-capa-trocar { opacity: 1; transform: translate(-50%, 0); } }
html.rg .rg-tb-info { flex: 1; padding: 12px 14px 4px; min-width: 0; }
html.rg .rg-tb-info h2 { margin: 0 0 8px; color: #fff; font-size: .98rem; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; }
html.rg .rg-tb-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
html.rg .rg-tb-meta .rg-ext-carteira { max-width: 100%; overflow: hidden; text-overflow: ellipsis; text-decoration: none; }
html.rg .rg-tb-meta a.rg-ext-carteira:hover { filter: brightness(1.25); }
html.rg .rg-tb-meta small { color: var(--rg-ink-3); font-size: .76rem; white-space: nowrap; }
html.rg .rg-tb-semcat { --cor: var(--rg-gold); }
html.rg .rg-tb-acoes { display: flex; gap: 8px; padding: 12px 14px 14px; }
html.rg .rg-tb-acoes form { margin: 0; }
html.rg .rg-tb-editar { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 12px; border-radius: 12px; background: color-mix(in srgb, var(--rg-lima) 14%, transparent); border: 1px solid color-mix(in srgb, var(--rg-lima) 40%, transparent); color: var(--rg-lima-texto); font-weight: 800; font-size: .85rem; text-decoration: none; }
html.rg .rg-tb-editar:hover { background: var(--rg-lima); color: var(--rg-on-lima); text-decoration: none; }
html.rg .rg-tb-excluir { width: 40px; height: 100%; min-height: 38px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--rg-coral) 40%, transparent); background: color-mix(in srgb, var(--rg-coral) 10%, transparent); color: var(--rg-coral); }
html.rg .rg-tb-excluir:hover { background: var(--rg-coral); color: #fff; }
html.rg .rg-tb-vazio { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 40px 16px; border-radius: 18px; border: 1px dashed var(--rg-line); color: var(--rg-ink-3); text-align: center; }
html.rg .rg-tb-vazio > i { font-size: 2rem; }
html.rg .rg-tb-vazio b { color: #fff; }
html.rg .rg-tb-vazio .rg-ex-btn { text-decoration: none; }
/* categorias em linhas */
html.rg .rg-tb-lista-cat { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-tb-cat { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: var(--rg-surface); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-tb-cat-icone { flex: none; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: color-mix(in srgb, var(--rg-violeta) 18%, transparent); color: var(--rg-violeta); }
html.rg .rg-tb-cat-info { flex: 1; min-width: 0; }
html.rg .rg-tb-cat-info h2 { margin: 0; color: #fff; font-size: .95rem; font-weight: 800; overflow-wrap: anywhere; }
html.rg .rg-tb-cat-info small { color: var(--rg-ink-3); font-size: .76rem; }
html.rg .rg-tb-cat-qtd { flex: none; display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 999px; background: color-mix(in srgb, var(--rg-good) 14%, transparent); color: var(--rg-good); font-size: .78rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
html.rg a.rg-tb-cat-qtd:hover { background: var(--rg-good); color: var(--rg-tinta); text-decoration: none; }
html.rg .rg-tb-cat-qtd.vazia { background: rgba(255,255,255,.05); color: var(--rg-ink-3); font-weight: 600; }
html.rg .rg-tb-cat .rg-tb-acoes { padding: 0; flex: none; }
html.rg .rg-tb-cat .rg-tb-editar { flex: none; padding: 8px 12px; }
/* modal de trocar imagem (reaproveita a caixa rg-jc) */
html.rg .rg-tb-modal-corpo { padding: 16px 18px; overflow-y: auto; display: grid; gap: 14px; }
html.rg .rg-tb-previas { display: flex; gap: 12px; justify-content: center; }
html.rg .rg-tb-previas:not(:has(figure:not([hidden]))) { display: none; }
html.rg .rg-tb-previas figure { margin: 0; flex: 1; max-width: 220px; text-align: center; }
html.rg .rg-tb-previas img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; border: 1px solid var(--rg-line); }
html.rg .rg-tb-previas figcaption { margin-top: 4px; color: var(--rg-ink-3); font-size: .74rem; font-weight: 700; text-transform: uppercase; }
html.rg .rg-tb-previas [data-nova] img { border-color: var(--rg-lima); }
html.rg .rg-tb-soltar { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 0; padding: 22px 14px; border-radius: 16px; border: 2px dashed var(--rg-line); color: var(--rg-ink-3); text-align: center; cursor: pointer; transition: border-color .15s, background .15s; }
html.rg .rg-tb-soltar:hover, html.rg .rg-tb-soltar.arrastando { border-color: var(--rg-lima); background: color-mix(in srgb, var(--rg-lima) 7%, transparent); }
html.rg .rg-tb-soltar input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
html.rg .rg-tb-soltar > i { font-size: 1.8rem; color: var(--rg-lima-texto); }
html.rg .rg-tb-soltar b { color: #fff; font-size: .92rem; overflow-wrap: anywhere; }
html.rg .rg-tb-soltar small { font-size: .76rem; }
html.rg .rg-tb-modal .rg-jc-caixa > footer .rg-ex-btn { width: 100%; justify-content: center; }
@media (max-width: 1199px) { html.rg .rg-tb-painel { grid-template-columns: repeat(3, minmax(0, 1fr)); } html.rg .rg-tb-chave { grid-column: 1 / -1; } html.rg .rg-tb-lista-cat { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
    html.rg .rg-tb-topo-acoes { width: 100%; }
    html.rg .rg-tb-topo-acoes .rg-ex-btn { flex: 1; justify-content: center; white-space: nowrap; }
    html.rg .rg-tb-longo { display: none; }
    html.rg .rg-tb-curto { display: inline; }
    html.rg .rg-tb-chave { padding: 12px; gap: 10px; }
    html.rg .rg-tb-chave-icone { display: none; }
    html.rg .rg-tb-chave b { font-size: .9rem; }
    html.rg .rg-tb-abas { display: flex; }
    html.rg .rg-tb-abas a { flex: 1; justify-content: center; }
    html.rg .rg-tb-painel { gap: 8px; }
    html.rg .rg-tb-painel-cat { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-tb-painel-cat .rg-tb-filtros { grid-column: 1 / -1; }
    html.rg .rg-tb-num { padding: 10px 12px; }
    html.rg .rg-tb-num b { font-size: 1.2rem; }
    html.rg .rg-tb-filtros { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-tb-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    html.rg .rg-tb-info { padding: 10px 10px 2px; }
    html.rg .rg-tb-info h2 { font-size: .86rem; }
    html.rg .rg-tb-meta small { display: none; }
    html.rg .rg-tb-acoes { padding: 10px; gap: 6px; }
    html.rg .rg-tb-editar { padding: 8px; font-size: .8rem; }
    html.rg .rg-tb-excluir { width: 36px; }
    html.rg .rg-tb-capa-trocar { font-size: .68rem; padding: 4px 9px; bottom: 6px; }
    html.rg .rg-tb-cat { flex-wrap: wrap; }
    html.rg .rg-tb-cat-info { flex-basis: calc(100% - 52px); }
    html.rg .rg-tb-cat-qtd { margin-left: 52px; }
    html.rg .rg-tb-cat .rg-tb-acoes { margin-left: auto; }
}
@media (max-width: 359px) { html.rg .rg-tb-chave small { display: none; } html.rg .rg-tb-painel { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } html.rg .rg-tb-painel > .rg-tb-num:last-child:nth-child(4) { grid-column: 1 / -1; } }
/* números das Categorias viram filtro */
html.rg .rg-tb-num-link { position: relative; text-decoration: none !important; cursor: pointer; transition: border-color .15s, transform .15s, background .15s; }
html.rg .rg-tb-num-link:hover { transform: translateY(-2px); border-color: var(--rg-ink-3); }
html.rg .rg-tb-num-link.ativo { border-color: var(--rg-violeta); background: color-mix(in srgb, var(--rg-violeta) 14%, var(--rg-surface)); box-shadow: 0 0 0 1px var(--rg-violeta) inset; }
html.rg .rg-tb-num-link.alerta.ativo { border-color: var(--rg-gold); background: color-mix(in srgb, var(--rg-gold) 12%, var(--rg-surface)); box-shadow: 0 0 0 1px var(--rg-gold) inset; }
html.rg .rg-tb-num-link.ativo small { color: #fff; }

/* Gerenciamento de Cotações — layout novo */
html.rg .rg-qt-sub { margin: 4px 0 0; color: var(--rg-ink-3); font-size: .9rem; }
html.rg .rg-qt-cartoes { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html.rg .rg-qt .rg-ex-ouro { --cor: var(--rg-gold); }
html.rg .rg-qt .rg-ex-coral { --cor: var(--rg-coral); }
html.rg .rg-qt .rg-ext-carteira.rg-ex-verde { --cor: var(--rg-good); }
html.rg .rg-qt-barra { display: flex; align-items: center; gap: 12px; }
html.rg .rg-qt-busca { flex: 1; max-width: 420px; margin: 0; }
html.rg .rg-qt-conta { color: var(--rg-ink-3); font-size: .85rem; white-space: nowrap; }
html.rg .rg-qt-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
html.rg .rg-qt-card { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-left: 4px solid var(--rg-qt-cor, var(--rg-line)); color: inherit; text-decoration: none !important; min-width: 0; transition: transform .15s, border-color .15s, box-shadow .15s; }
html.rg .rg-qt-card[hidden] { display: none; }
html.rg .rg-qt-card:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0,0,0,.28); border-color: color-mix(in srgb, var(--rg-qt-cor, var(--rg-violeta)) 60%, transparent); }
html.rg .rg-qt-ativa { --rg-qt-cor: var(--rg-good); }
html.rg .rg-qt-desligada { --rg-qt-cor: var(--rg-gold); }
html.rg .rg-qt-sem { --rg-qt-cor: var(--rg-coral); }
html.rg .rg-qt-topo { display: flex; align-items: center; gap: 12px; min-width: 0; }
html.rg .rg-qt-img { position: relative; flex: none; width: 46px; height: 46px; border-radius: 12px; overflow: hidden; display: grid; place-items: center; background: color-mix(in srgb, var(--rg-violeta) 18%, transparent); color: var(--rg-violeta); }
html.rg .rg-qt-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
html.rg .rg-qt-nome { min-width: 0; }
html.rg .rg-qt-nome h2 { margin: 0 0 4px; color: #fff; font-size: 1rem; font-weight: 800; overflow-wrap: anywhere; }
html.rg .rg-qt-trecho { flex: 1; margin: 0; color: var(--rg-ink-2); font-size: .84rem; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
html.rg .rg-qt-sem .rg-qt-trecho { color: var(--rg-ink-3); font-style: italic; }
html.rg .rg-qt-rodape { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 10px; border-top: 1px solid var(--rg-line); }
html.rg .rg-qt-rodape small { color: var(--rg-ink-3); font-size: .76rem !important; line-height: 1.3; }
html.rg .rg-qt-editar { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: color-mix(in srgb, var(--rg-lima) 14%, transparent); color: var(--rg-lima-texto); font-weight: 800; font-size: .8rem; white-space: nowrap; }
html.rg .rg-qt-card:hover .rg-qt-editar { background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-qt-sem .rg-qt-editar { background: var(--rg-lima); color: var(--rg-on-lima); }
@media (max-width: 1199px) { html.rg .rg-qt-cartoes { grid-template-columns: repeat(2, minmax(0, 1fr)); } html.rg .rg-qt-cartoes > :first-child { grid-column: auto; } }
@media (max-width: 767px) {
    html.rg .rg-qt-cartoes { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-qt-busca { max-width: none; }
    html.rg .rg-qt-grade { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    html.rg .rg-qt-trecho { -webkit-line-clamp: 2; }
}

/* Venda Rápida — Pedidos (reaproveita rg-cb / rg-jc) */
html.rg .rg-vr-filtros { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html.rg .rg-vr-filtros.com-consultor { grid-template-columns: repeat(5, minmax(0, 1fr)); }
html.rg .rg-vr-id { color: #fff !important; font-weight: 800; white-space: nowrap; }
html.rg .rg-vr-jogo b { display: block; color: #fff; font-weight: 800; }
html.rg .rg-vr-bolas { margin-top: 6px; gap: 4px; }
html.rg .rg-vr-bolas span { width: 26px; height: 26px; font-size: .7rem; }
html.rg .rg-vr td[data-rotulo="Valor"] > span:first-child { display: block; white-space: nowrap; }
html.rg .rg-vr-tags { display: flex; flex-wrap: nowrap; gap: 4px; justify-content: flex-end; margin-top: 4px; }
html.rg .rg-vr .rg-ext-carteira.rg-ex-verde { --cor: var(--rg-good); }
html.rg .rg-vr .rg-ext-carteira.rg-ex-ouro { --cor: var(--rg-gold); }
html.rg .rg-vr .rg-ext-carteira.rg-ex-coral { --cor: var(--rg-coral); }
html.rg .rg-vr-acao { text-align: right; white-space: nowrap; }
html.rg .rg-vr-acao .rg-jc-ver { text-decoration: none; }
html.rg .rg-vr-sem { color: var(--rg-ink-3); }
html.rg .rg-vr .rg-ex-topo .rg-ex-sobre i { margin-right: 4px; }
@media (max-width: 1199px) { html.rg .rg-vr-filtros, html.rg .rg-vr-filtros.com-consultor { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) {
    html.rg .rg-vr-filtros, html.rg .rg-vr-filtros.com-consultor { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-vr-filtros .rg-ext-campo:nth-of-type(4), html.rg .rg-vr-filtros .rg-ext-campo:nth-of-type(5) { grid-column: 1 / -1; }
    html.rg .rg-vr .rg-ex-tabela .table td[data-rotulo="Jogo"], html.rg .rg-vr .rg-ex-tabela .table td[data-rotulo="Comprovante"], html.rg .rg-vr .rg-ex-tabela .table td[data-rotulo="Cliente"] { grid-column: 1 / -1; }
    html.rg .rg-vr-id { white-space: normal; }
    html.rg .rg-vr-tags { display: flex; flex-direction: row; }
    html.rg .rg-vr td[data-rotulo="Valor"] > span:first-child { display: inline; margin-right: 6px; }
    html.rg .rg-vr-tags { justify-content: flex-start; }
    html.rg .rg-vr .rg-ex-tabela .table td[data-rotulo="Comprovante"]::before { display: none; }
    html.rg .rg-vr-acao .rg-jc-ver { width: 100%; justify-content: center; padding: 8px; }
    html.rg .rg-vr-sem { display: none; }
}

/* Editar Cotação — layout novo */
html.rg .rg-qe-topo { align-items: center; }
html.rg .rg-qe-titulo { display: flex; align-items: center; gap: 12px; min-width: 0; }
html.rg .rg-qe-titulo h1 { overflow-wrap: anywhere; }
html.rg .rg-qe-voltar { flex: none; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--rg-line); background: var(--rg-surface); color: #fff !important; text-decoration: none !important; }
html.rg .rg-qe-voltar:hover { border-color: var(--rg-lima); color: var(--rg-lima-texto) !important; }
html.rg .rg-qe-topo-acoes { display: flex; gap: 8px; }
html.rg .rg-qe-chave { cursor: pointer; }
html.rg .rg-qe-chave .rg-tb-switch { pointer-events: none; }
html.rg .rg-qe-editor { padding: 16px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-qe-editor > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
html.rg .rg-qe-editor h2 { margin: 0; color: #fff; font-size: 1.05rem; font-weight: 800; }
html.rg .rg-qe-estado { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px; font-size: .78rem; font-weight: 700; background: color-mix(in srgb, var(--rg-good) 14%, transparent); color: var(--rg-good); }
html.rg .rg-qe-estado.sujo { background: color-mix(in srgb, var(--rg-gold) 16%, transparent); color: var(--rg-gold); }
html.rg .rg-qe-estado.sujo i { font-size: .5rem; animation: rg-qe-pisca 1.2s infinite; }
@keyframes rg-qe-pisca { 50% { opacity: .3; } }
html.rg .rg-qe-dica { display: block; margin-top: 10px; color: var(--rg-ink-3); font-size: .8rem; }
html.rg .rg-qe-dica i { color: var(--rg-gold); margin-right: 4px; }
/* CKEditor no tema escuro */
html.rg .rg-qe .ck.ck-editor { width: 100% !important; }
html.rg .rg-qe .ck.ck-toolbar { background: #2a2350 !important; border-color: var(--rg-line) !important; border-radius: 12px 12px 0 0 !important; }
html.rg .rg-qe .ck.ck-toolbar .ck-button, html.rg .rg-qe .ck.ck-toolbar .ck-dropdown__button { color: #e6e1ff !important; }
html.rg .rg-qe .ck.ck-toolbar .ck-button:hover:not(.ck-disabled), html.rg .rg-qe .ck.ck-toolbar .ck-button.ck-on { background: rgba(255,255,255,.1) !important; }
html.rg .rg-qe .ck.ck-toolbar .ck-toolbar__separator { background: var(--rg-line) !important; }
html.rg .rg-qe .ck.ck-editor__main > .ck-editor__editable { background: #120d2b !important; color: #e9e6f7 !important; border-color: var(--rg-line) !important; border-radius: 0 0 12px 12px !important; min-height: 380px; max-height: 65vh; overflow-y: auto; padding: 8px 18px !important; }
html.rg .rg-qe .ck.ck-editor__main > .ck-editor__editable.ck-focused { border-color: var(--rg-lima) !important; box-shadow: none !important; }
html.rg .rg-qe-conteudo, html.rg .rg-qe .ck-content { font-size: .95rem; line-height: 1.55; }
html.rg .rg-qe .ck-content strong, html.rg .rg-qe-conteudo strong { color: #fff; }
html.rg .rg-qe .ck-content a, html.rg .rg-qe-conteudo a { color: var(--rg-lima-texto); }
html.rg .rg-qe .ck-content .table, html.rg .rg-qe-conteudo .table { margin: 12px 0; }
html.rg .rg-qe .ck-content table, html.rg .rg-qe-conteudo table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--rg-line) !important; border-radius: 12px; overflow: hidden; background: rgba(255,255,255,.02) !important; }
html.rg .rg-qe .ck-content table th, html.rg .rg-qe-conteudo table th { background: #2a2350 !important; color: #fff !important; font-weight: 800; text-align: left; padding: 9px 12px !important; border: 0 !important; border-bottom: 1px solid var(--rg-line) !important; }
html.rg .rg-qe .ck-content table td, html.rg .rg-qe-conteudo table td { background: transparent !important; color: #e9e6f7 !important; padding: 8px 12px !important; border: 0 !important; border-bottom: 1px solid rgba(255,255,255,.06) !important; text-align: left; }
html.rg .rg-qe .ck-content table tr:last-child td, html.rg .rg-qe-conteudo table tr:last-child td { border-bottom: 0 !important; }
html.rg .rg-qe .ck-content table td:last-child, html.rg .rg-qe-conteudo table td:last-child { color: var(--rg-lima-texto) !important; font-weight: 700; }
html.rg .rg-qe .ck-content blockquote, html.rg .rg-qe-conteudo blockquote { border-left: 4px solid var(--rg-violeta); margin: 12px 0; padding: 6px 14px; background: rgba(139,92,246,.08); border-radius: 0 10px 10px 0; font-style: normal; }
/* botões dos menus do editor (tabela, título) legíveis */
html.rg .ck.ck-dropdown__panel, html.rg .ck.ck-balloon-panel { background: #2a2350 !important; border-color: var(--rg-line) !important; }
html.rg .ck.ck-list { background: #2a2350 !important; }
html.rg .ck.ck-list__item .ck-button { color: #e6e1ff !important; }
html.rg .ck.ck-list__item .ck-button:hover:not(.ck-disabled) { background: rgba(255,255,255,.1) !important; }
html.rg .rg-qe-barra { display: none; }
html.rg .rg-qe-previa-corpo { padding: 14px 18px 18px; overflow-y: auto; color: #e9e6f7; }
html.rg .rg-qe-modal .rg-jc-caixa { max-width: 720px; }
html.rg .rg-qe-vazio { color: var(--rg-ink-3); font-style: italic; }
@media (max-width: 767px) {
    html.rg .rg-qe-topo-acoes { display: none; }
    html.rg .rg-qe-editor { padding: 12px; }
    html.rg .rg-qe .ck.ck-editor__main > .ck-editor__editable { min-height: 300px; padding: 6px 12px !important; }
    html.rg .rg-qe .ck-content table th, html.rg .rg-qe .ck-content table td, html.rg .rg-qe-conteudo table th, html.rg .rg-qe-conteudo table td { padding: 7px 8px !important; font-size: .85rem; }
    html.rg .rg-qe { padding-bottom: 150px; }
    html.rg .rg-qe-barra { display: flex; gap: 8px; position: fixed; left: 12px; right: 12px; bottom: 84px; z-index: 1040; padding: 10px; padding-left: var(--rg-fab-folga, 10px); border-radius: 18px; background: rgba(18, 13, 43, .94); border: 1px solid var(--rg-line); backdrop-filter: blur(8px); box-shadow: 0 10px 30px rgba(0,0,0,.45); }
    html.rg .rg-qe-barra .rg-ex-btn { justify-content: center; white-space: nowrap; }
    html.rg .rg-qe-barra .rg-qe-salvar { flex: 1; }
    html.rg .rg-qe-barra .rg-ex-btn { min-width: 0; }
}
@media (max-width: 400px) {
    html.rg .rg-qe-barra .rg-qe-rot { display: none; }
    html.rg .rg-qe.sujo .rg-qe-barra { border-color: var(--rg-gold); }
}

/* Venda Rápida — Indicadores (layout novo) */
html.rg .rg-vi-filtros { display: flex; flex-direction: column; gap: 10px; }
html.rg .rg-vi-periodos a { padding: 8px 14px; border-radius: 10px; color: var(--rg-ink-2) !important; font-weight: 700; font-size: .88rem; text-decoration: none !important; white-space: nowrap; }
html.rg .rg-vi-periodos a:hover { color: #fff !important; }
html.rg .rg-vi-periodos a.ativo { background: var(--rg-lima); color: var(--rg-on-lima) !important; }
html.rg .rg-vi-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html.rg .rg-vi-form.com-consultor { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.6fr); }
html.rg .rg-vi-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); align-items: center; }
html.rg .rg-vi-hero .rg-ex-resultado-num b { color: var(--rg-lima-texto); }
html.rg .rg-vi-divisao { display: grid; gap: 12px; }
html.rg .rg-vi-barra { display: flex; height: 14px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.08); }
html.rg .rg-vi-barra span { height: 100%; transition: width .6s ease; }
html.rg .rg-vi-barra .pix, html.rg .rg-vi-legenda i.pix { background: #32bcad; }
html.rg .rg-vi-barra .saldo, html.rg .rg-vi-legenda i.saldo { background: var(--rg-violeta); }
html.rg .rg-vi-legenda { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
html.rg .rg-vi-legenda > div { display: grid; grid-template-columns: auto 1fr auto; align-items: center; column-gap: 8px; padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid var(--rg-line); }
html.rg .rg-vi-legenda i { width: 10px; height: 10px; border-radius: 50%; }
html.rg .rg-vi-legenda span { color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; text-align: left; }
html.rg .rg-vi-legenda small { color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-vi-legenda b { grid-column: 1 / -1; color: #fff; font-size: 1.1rem; }
html.rg .rg-vi-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-vi-kpis .rg-tb-num b { font-size: 1.25rem; overflow-wrap: anywhere; }
html.rg .rg-vi-verde i, html.rg .rg-vi-verde b { color: var(--rg-good) !important; }
html.rg .rg-vi-ouro i, html.rg .rg-vi-ouro b { color: var(--rg-gold) !important; }
html.rg .rg-vi-bloco { padding: 16px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-vi-bloco > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
html.rg .rg-vi-bloco h2 { margin: 0; color: #fff; font-size: 1.02rem; font-weight: 800; }
html.rg .rg-vi-bloco h2 i { color: var(--rg-violeta); margin-right: 6px; }
html.rg .rg-vi-chip { padding: 4px 11px; border-radius: 999px; background: color-mix(in srgb, var(--rg-gold) 14%, transparent); color: var(--rg-gold); font-size: .78rem; font-weight: 700; }
html.rg .rg-vi-conta { min-width: 26px; padding: 2px 8px; border-radius: 999px; background: rgba(255,255,255,.07); color: var(--rg-ink-2); font-size: .78rem; font-weight: 700; text-align: center; }
html.rg .rg-vi-vazio { padding: 28px 12px; text-align: center; color: var(--rg-ink-3); border: 1px dashed var(--rg-line); border-radius: 14px; }
html.rg .rg-vi-vazio i { display: block; font-size: 1.6rem; margin-bottom: 6px; opacity: .7; }
/* gráfico */
html.rg .rg-vi-grafico { display: flex; align-items: flex-end; gap: 3px; height: 190px; padding-top: 34px; overflow-x: auto; overflow-y: visible; }
html.rg .rg-vi-col { position: relative; flex: 1 0 14px; min-width: 14px; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 4px; outline: none; }
html.rg .rg-vi-haste { width: 100%; max-width: 34px; border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, var(--rg-lima), color-mix(in srgb, var(--rg-lima) 45%, var(--rg-violeta))); transition: filter .15s; }
html.rg .rg-vi-col.zero .rg-vi-haste { height: 3px !important; background: rgba(255,255,255,.08); }
html.rg .rg-vi-col small { color: var(--rg-ink-3); font-size: .64rem; line-height: 1; }
html.rg .rg-vi-col.fds small { color: var(--rg-ink-2); font-weight: 700; }
html.rg .rg-vi-dica { position: absolute; bottom: calc(100% - 26px); left: 50%; transform: translateX(-50%); padding: 6px 9px; border-radius: 10px; background: #0d0920; border: 1px solid var(--rg-line); color: var(--rg-ink-2); font-size: .72rem; white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity .12s; z-index: 2; }
html.rg .rg-vi-dica b { display: block; color: #fff; }
html.rg .rg-vi-col:hover .rg-vi-dica, html.rg .rg-vi-col:focus .rg-vi-dica { opacity: 1; }
html.rg .rg-vi-col:hover .rg-vi-haste, html.rg .rg-vi-col:focus .rg-vi-haste { filter: brightness(1.2); }
html.rg .rg-vi-col:first-child .rg-vi-dica { left: 0; transform: none; }
html.rg .rg-vi-col:last-child .rg-vi-dica { left: auto; right: 0; transform: none; }
/* rankings */
html.rg .rg-vi-duplo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
html.rg .rg-vi-rank { display: flex; align-items: center; gap: 12px; padding: 10px 8px; border-radius: 12px; color: inherit; text-decoration: none !important; }
html.rg .rg-vi-rank + .rg-vi-rank { border-top: 1px solid rgba(255,255,255,.05); }
html.rg a.rg-vi-rank:hover { background: rgba(255,255,255,.04); }
html.rg .rg-vi-pos { flex: none; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.06); color: var(--rg-ink-2); font-weight: 800; font-size: .85rem; }
html.rg .rg-vi-pos.top1, html.rg .rg-vi-pos.top2, html.rg .rg-vi-pos.top3 { background: transparent; font-size: 1.3rem; }
html.rg .rg-vi-rank-info { flex: 1; min-width: 0; display: grid; gap: 5px; }
html.rg .rg-vi-rank-info > div { display: flex; justify-content: space-between; gap: 10px; }
html.rg .rg-vi-rank-info b { color: #fff; font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-vi-rank-info > div span { color: var(--rg-lima-texto); font-weight: 800; font-size: .9rem; white-space: nowrap; }
html.rg .rg-vi-trilho { display: block; height: 6px; border-radius: 999px; background: rgba(255,255,255,.07); overflow: hidden; }
html.rg .rg-vi-trilho span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--rg-violeta), var(--rg-lima)); }
html.rg .rg-vi-rank-mod .rg-vi-trilho span { background: linear-gradient(90deg, #32bcad, var(--rg-lima)); }
html.rg .rg-vi-rank-info small { color: var(--rg-ink-3); font-size: .74rem; }
@media (max-width: 1199px) { html.rg .rg-vi-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } html.rg .rg-vi-hero { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 991px) { html.rg .rg-vi-duplo { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
    html.rg .rg-vi-periodos { display: flex; flex-wrap: nowrap; overflow-x: auto; align-self: stretch; scrollbar-width: none; }
    html.rg .rg-vi-periodos::-webkit-scrollbar { display: none; }
    html.rg .rg-vi-form, html.rg .rg-vi-form.com-consultor { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-vi-form .rg-ext-campo:nth-of-type(3) { grid-column: 1 / -1; }
    html.rg .rg-vi-kpis { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
    html.rg .rg-vi-kpis > :first-child { grid-column: 1 / -1; }
    html.rg .rg-vi-kpis .rg-tb-num b { font-size: 1.05rem; }
    html.rg .rg-vi-legenda { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-vi-bloco { padding: 12px; }
    html.rg .rg-vi-grafico { height: 170px; scrollbar-width: thin; padding-bottom: 4px; }
    html.rg .rg-vi-col { flex: 1 0 24px; min-width: 24px; }
    html.rg .rg-vi-col small { font-size: .68rem; }
}

/* Bichão: aviso do "milhar da sorte" vindo da home */
html.rg .rg-bx-sorte { display: flex; align-items: center; gap: 12px; margin: 4px 0 14px; padding: 12px 14px; border-radius: 16px; background: linear-gradient(135deg, color-mix(in srgb, var(--rg-lima-brilho) 16%, transparent), color-mix(in srgb, var(--rg-lima-brilho) 4%, transparent)); border: 1px solid color-mix(in srgb, var(--rg-lima) 55%, transparent); animation: rg-sv-surge .45s cubic-bezier(.2, 1.4, .4, 1); text-align: left; }
html.rg .rg-bx-sorte[hidden] { display: none; }
html.rg .rg-bx-sorte-trevo { flex: none; font-size: 1.7rem; line-height: 1; }
html.rg .rg-bx-sorte > div { flex: 1; min-width: 0; }
html.rg .rg-bx-sorte b { display: block; color: #fff; font-size: .98rem; }
html.rg .rg-bx-sorte b em { font-style: normal; color: var(--rg-lima-texto); letter-spacing: .06em; }
html.rg .rg-bx-sorte small { color: var(--rg-ink-2); font-size: .82rem; }
html.rg .rg-bx-sorte-ir { flex: none; display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border: 0; border-radius: 12px; background: var(--rg-lima); color: var(--rg-on-lima); font-weight: 800; font-size: .86rem; white-space: nowrap; cursor: pointer; }
html.rg .rg-bx-chip.sorte { background: var(--rg-lima) !important; color: var(--rg-on-lima) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--rg-lima-brilho) 25%, transparent), 0 0 18px color-mix(in srgb, var(--rg-lima-brilho) 45%, transparent); }
@media (max-width: 575px) { html.rg .rg-bx-sorte { flex-wrap: wrap; } html.rg .rg-bx-sorte > div { flex-basis: calc(100% - 50px); } html.rg .rg-bx-sorte-ir { flex: 1 1 100%; justify-content: center; } }

/* Resultados das loterias (selectresult) — layout novo */
html.rg .rg-rs-banner { display: block; width: 100%; max-height: 150px; object-fit: cover; border-radius: 18px; }
html.rg .rg-rs-periodos { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
html.rg .rg-rs-periodos::-webkit-scrollbar { display: none; }
html.rg .rg-rs-resumo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-rs-resumo > div { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; padding: 12px 16px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-rs-resumo i { grid-row: span 2; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: color-mix(in srgb, var(--rg-violeta) 18%, transparent); color: var(--rg-violeta); }
html.rg .rg-rs-resumo b { color: #fff; font-size: 1.4rem; line-height: 1.1; }
html.rg .rg-rs-resumo small { color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-rs-resumo .rg-rs-dourado i { background: color-mix(in srgb, var(--rg-gold) 18%, transparent); color: var(--rg-gold); }
html.rg .rg-rs-resumo .rg-rs-dourado b { color: var(--rg-gold); }
html.rg .rg-rs-titulo { display: flex; align-items: center; gap: 8px; margin: 6px 0 12px; color: #fff; font-size: 1.1rem; font-weight: 800; }
html.rg .rg-rs-ponto { width: 10px; height: 10px; border-radius: 50%; }
html.rg .rg-rs-ponto.verde { background: var(--rg-good); box-shadow: 0 0 10px var(--rg-good); }
html.rg .rg-rs-ponto.ouro { background: var(--rg-gold); box-shadow: 0 0 10px var(--rg-gold); }
html.rg .rg-rs-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
html.rg .rg-rs-card { display: flex; flex-direction: column; gap: 12px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); color: inherit; text-decoration: none !important; min-width: 0; transition: transform .15s, border-color .15s, box-shadow .15s; }
html.rg .rg-rs-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--rg-lima) 45%, transparent); box-shadow: 0 12px 26px rgba(0,0,0,.28); }
html.rg .rg-rs-card-topo { display: flex; align-items: center; gap: 12px; min-width: 0; }
html.rg .rg-rs-card-topo > div { flex: 1; min-width: 0; }
html.rg .rg-rs-card-topo h3 { margin: 0; color: #fff; font-size: 1rem; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-rs-card-topo small { color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-rs-mais { flex: none; padding: 3px 9px; border-radius: 999px; background: rgba(255,255,255,.07); color: var(--rg-ink-2); font-size: .74rem; font-weight: 700; }
html.rg .rg-rs-bolas { display: flex; flex-wrap: wrap; gap: 6px; }
html.rg .rg-rs-bolas span { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff 0, #e2e8f0 60%, #cbd5e1 100%); color: #111827; font-weight: 800; font-size: .84rem; box-shadow: 0 2px 6px rgba(0,0,0,.35); }
html.rg .rg-rs-card-rodape { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 10px; border-top: 1px solid var(--rg-line); margin-top: auto; }
html.rg .rg-rs-ganhou { white-space: nowrap; padding: 4px 10px; border-radius: 999px; background: color-mix(in srgb, var(--rg-gold) 16%, transparent); color: var(--rg-gold); font-size: .8rem; font-weight: 800; }
html.rg .rg-rs-nada { color: var(--rg-ink-3); font-size: .8rem; }
html.rg .rg-rs-ver { color: var(--rg-lima-texto); font-size: .82rem; font-weight: 800; white-space: nowrap; }
html.rg .rg-rs-espera { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
html.rg .rg-rs-item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 16px; background: var(--rg-surface); border: 1px solid var(--rg-line); color: inherit; text-decoration: none !important; min-width: 0; }
html.rg .rg-rs-item:hover { border-color: var(--rg-ink-3); }
html.rg .rg-rs-item > div { flex: 1; min-width: 0; }
html.rg .rg-rs-item b { display: block; color: #fff; font-size: .92rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-rs-item small { color: var(--rg-ink-3); font-size: .76rem; }
html.rg .rg-rs-item .rg-qt-img { width: 40px; height: 40px; }
html.rg .rg-rs-conta { flex: none; padding: 4px 9px; border-radius: 10px; background: rgba(255,255,255,.06); color: var(--rg-ink-2); font-size: .8rem; font-weight: 800; font-variant-numeric: tabular-nums; }
html.rg .rg-rs-conta.urgente { background: color-mix(in srgb, var(--rg-coral) 18%, transparent); color: var(--rg-coral); }
html.rg .rg-rs-seta { color: var(--rg-ink-3); }
html.rg .rg-rs-item[hidden] { display: none; }
html.rg .rg-rs-vermais { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 10px; padding: 11px; border-radius: 14px; border: 1px dashed var(--rg-line); background: transparent; color: var(--rg-lima-texto); font-weight: 800; font-size: .88rem; cursor: pointer; }
html.rg .rg-rs-vermais:hover { border-color: var(--rg-lima); }
html.rg .rg-rs .rg-tb-vazio span { font-size: .85rem; }
@media (max-width: 767px) {
    html.rg .rg-rs-resumo { grid-template-columns: minmax(0, 1fr); gap: 6px; }
    html.rg .rg-rs-resumo > div { grid-template-columns: auto auto 1fr; padding: 8px 12px; }
    html.rg .rg-rs-resumo i { grid-row: auto; width: 32px; height: 32px; }
    html.rg .rg-rs-resumo b { font-size: 1.1rem; }
    html.rg .rg-rs-grade, html.rg .rg-rs-espera { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-rs-bolas span { width: 30px; height: 30px; font-size: .78rem; }
}

/* Roleta (admin): configuração, giros enviados, ganhadores físicos e giros ganhos — layout novo */
html.rg .rg-ro-abas { overflow-x: auto; scrollbar-width: none; }
html.rg .rg-ro-abas::-webkit-scrollbar { display: none; }
html.rg .rg-ro-topo { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
html.rg .rg-ro .rg-tb-chave { cursor: default; }
html.rg .rg-ro-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 12px; }
html.rg .rg-ro-roda-caixa { position: relative; width: 210px; height: 210px; margin: 4px auto 14px; }
html.rg .rg-ro-roda { width: 100%; height: 100%; border-radius: 50%; border: 6px solid #f5c542; box-shadow: 0 0 0 4px rgba(245, 197, 66, .18), 0 12px 30px rgba(0,0,0,.45), inset 0 0 24px rgba(0,0,0,.35); display: grid; place-items: center; animation: rg-ro-gira 18s linear infinite; }
html.rg .rg-ro-roda span { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: #1a1338; border: 3px solid #f5c542; color: #f5c542; }
@keyframes rg-ro-gira { to { transform: rotate(360deg); } }
html.rg .rg-ro-ponteiro { position: absolute; top: -8px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 22px solid #fff; filter: drop-shadow(0 2px 3px rgba(0,0,0,.5)); }
html.rg .rg-ro-legenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
html.rg .rg-ro-legenda li { display: flex; align-items: center; gap: 8px; font-size: .88rem; color: var(--rg-ink-2); }
html.rg .rg-ro-legenda i { flex: none; width: 12px; height: 12px; border-radius: 4px; }
html.rg .rg-ro-legenda span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-ro-legenda b { color: #fff; }
html.rg .rg-ro-aviso { margin: 12px 0 0; padding: 9px 12px; border-radius: 12px; background: color-mix(in srgb, var(--rg-gold) 12%, transparent); color: var(--rg-gold); font-size: .82rem; }
html.rg .rg-ro-nota { display: block; margin-top: 10px; color: var(--rg-ink-3); font-size: .74rem; }
html.rg .rg-ro-nova-regra { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .7fr) auto; gap: 8px; align-items: end; margin-bottom: 14px; }
html.rg .rg-ro-nova-regra .rg-ex-btn { height: 40px; white-space: nowrap; }
html.rg .rg-ro-degraus { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; max-height: 380px; overflow-y: auto; }
html.rg .rg-ro-degraus li { display: flex; align-items: center; gap: 12px; padding: 8px 10px 8px 14px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--rg-line); }
html.rg .rg-ro-degraus form { margin: 0 0 0 auto; }
html.rg .rg-ro-degraus > li > i { color: var(--rg-ink-3); }
html.rg .rg-ro-degrau-valor { color: #fff; font-weight: 800; }
html.rg .rg-ro-degrau-valor small { margin-left: 5px; color: var(--rg-ink-3); font-weight: 600; font-size: .74rem; }
html.rg .rg-ro-degrau-giros { padding: 3px 10px; border-radius: 999px; background: color-mix(in srgb, var(--rg-lima) 14%, transparent); color: var(--rg-lima-texto); font-size: .84rem; font-weight: 700; white-space: nowrap; }
html.rg .rg-ro-degraus .rg-tb-excluir { width: 34px; min-height: 34px; }
html.rg .rg-ro-premios-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
html.rg .rg-ro-premios-topo .rg-rs-titulo { margin: 0; }
html.rg .rg-ro-premios { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin-top: 12px; }
html.rg .rg-ro-premio { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-top: 4px solid var(--rg-ro-cor); min-width: 0; }
html.rg .rg-ro-premio.fora { opacity: .72; border-top-style: dashed; }
html.rg .rg-ro-premio-topo { display: flex; align-items: center; gap: 12px; min-width: 0; }
html.rg .rg-ro-premio-topo > div { min-width: 0; }
html.rg .rg-ro-premio-topo h3 { margin: 0 0 4px; color: #fff; font-size: 1rem; font-weight: 800; overflow-wrap: anywhere; }
html.rg .rg-ro-premio-img { position: relative; flex: none; width: 52px; height: 52px; border-radius: 14px; overflow: hidden; display: grid; place-items: center; background: rgba(255,255,255,.06); color: var(--rg-ink-2); font-size: 1.2rem; }
html.rg .rg-ro-premio-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #fff; z-index: 1; }
html.rg .rg-ro-premio-valor { color: var(--rg-ink-2); font-size: .86rem; }
html.rg .rg-ro-premio-valor b { color: #fff; }
html.rg .rg-ro-chances { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
html.rg .rg-ro-chances > div { padding: 7px 8px; border-radius: 10px; background: rgba(255,255,255,.04); }
html.rg .rg-ro-chances small { display: block; color: var(--rg-ink-3); font-size: .72rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-ro-chances > div { min-width: 0; }
html.rg .rg-ro-chances b { display: block; color: #fff; font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-ro-chances b.real { color: var(--rg-lima-texto); }
html.rg .rg-ro-fora { margin: 0; color: var(--rg-coral); font-size: .78rem; font-weight: 700; }
html.rg .rg-ro .rg-tb-acoes { padding: 0; }
html.rg .rg-ro .rg-ext-carteira.rg-ex-verde { --cor: var(--rg-good); }
html.rg .rg-ro .rg-ext-carteira.rg-ex-ouro { --cor: var(--rg-gold); }
html.rg .rg-ro .rg-ext-carteira.rg-ex-coral { --cor: var(--rg-coral); }
html.rg .rg-ro .rg-ext-carteira.rg-ex-ceu { --cor: #3ec7d9; }
/* modal do prêmio */
html.rg .rg-ro-campos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
html.rg .rg-ro-largo { grid-column: 1 / -1; }
html.rg .rg-ro-campos [hidden] { display: none !important; }
html.rg .rg-ro-tipos, html.rg .rg-ro-etapas { display: flex; flex-wrap: wrap; gap: 6px; }
html.rg .rg-ro-tipos label, html.rg .rg-ro-etapas label { flex: 1 1 90px; margin: 0; cursor: pointer; }
html.rg .rg-ro-tipos input, html.rg .rg-ro-etapas input { position: absolute; opacity: 0; pointer-events: none; }
html.rg .rg-ro-tipos span, html.rg .rg-ro-etapas span { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 8px; border-radius: 12px; border: 1px solid var(--rg-line); background: rgba(255,255,255,.03); color: var(--rg-ink-2); font-weight: 700; font-size: .86rem; white-space: nowrap; }
html.rg .rg-ro-tipos input:checked + span, html.rg .rg-ro-etapas input:checked + span { border-color: var(--rg-lima); background: color-mix(in srgb, var(--rg-lima) 14%, transparent); color: var(--rg-lima-texto); }
html.rg .rg-ro-etapas label.cancelar input:checked + span { border-color: var(--rg-coral); background: color-mix(in srgb, var(--rg-coral) 14%, transparent); color: var(--rg-coral); }
html.rg .rg-ro-tipos input:focus-visible + span, html.rg .rg-ro-etapas input:focus-visible + span { outline: 2px solid var(--rg-lima); outline-offset: 2px; }
html.rg .rg-ro-campos .rg-tb-soltar { padding: 14px; }
html.rg .rg-ro-campos .rg-tb-soltar img { max-height: 90px; max-width: 160px; border-radius: 10px; background: #fff; object-fit: contain; }
html.rg .rg-ro-dica { margin: 0; color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-ro-dica i { color: var(--rg-violeta); margin-right: 4px; }
/* listas */
html.rg .rg-ro-lista .rg-ex-tabela header, html.rg .rg-ro-lista > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
html.rg .rg-ro-revogar { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--rg-coral) 45%, transparent); background: color-mix(in srgb, var(--rg-coral) 10%, transparent); color: var(--rg-coral); font-weight: 800; font-size: .78rem; white-space: nowrap; cursor: pointer; }
html.rg .rg-ro-revogar:hover { background: var(--rg-coral); color: #fff; }
html.rg .rg-ro-ganho { display: inline-flex; align-items: center; gap: 8px; }
html.rg .rg-ro-ganho img { width: 30px; height: 30px; border-radius: 8px; object-fit: contain; background: #fff; }
html.rg .rg-ro-ganho b { color: #fff; }
html.rg .rg-ro-cartoes { grid-template-columns: repeat(6, minmax(0, 1fr)); }
html.rg .rg-ro-ficha { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
html.rg .rg-ro-ficha > div { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.04); min-width: 0; }
html.rg .rg-ro-ficha .largo { grid-column: 1 / -1; }
html.rg .rg-ro-ficha small, html.rg .rg-ro-rotulo { color: var(--rg-ink-3); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
html.rg .rg-ro-rotulo { display: block; margin-bottom: 6px; }
html.rg .rg-ro-ficha b { color: #fff; overflow-wrap: anywhere; }
html.rg .rg-ro-ficha span { color: var(--rg-ink-2); font-size: .86rem; overflow-wrap: anywhere; }
html.rg .rg-ro-copiar { align-self: flex-start; margin-top: 6px; padding: 5px 11px; border-radius: 999px; border: 1px solid var(--rg-line); background: transparent; color: var(--rg-lima-texto); font-weight: 700; font-size: .78rem; cursor: pointer; }
@media (max-width: 1199px) { html.rg .rg-ro-grade { grid-template-columns: minmax(0, 1fr); } html.rg .rg-ro-cartoes { grid-template-columns: repeat(3, minmax(0, 1fr)); } html.rg .rg-ro-topo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } html.rg .rg-ro-topo > form { grid-column: 1 / -1; } }
@media (max-width: 767px) {
    html.rg .rg-ro-abas { display: flex; }
    html.rg .rg-ro-abas a { padding: 8px 12px; font-size: .82rem; }
    html.rg .rg-ro-nova-regra { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-ro-nova-regra .rg-ex-btn { grid-column: 1 / -1; justify-content: center; }
    html.rg .rg-ro-premios { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-ro-cartoes { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-ro-cartoes > :first-child { grid-column: 1 / -1; }
    html.rg .rg-ro-ficha { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-ro-premios-topo .rg-ex-btn { padding: 8px 12px; }
    html.rg .rg-ro .rg-ex-tabela .table td[data-rotulo="Ação"]::before { display: none; }
    html.rg .rg-ro .rg-ex-tabela .table td[data-rotulo="Ação"] { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) { html.rg .rg-ro-roda { animation: none; } }

/* Configurar Bichão (admin) — layout novo */
html.rg .rg-bs { padding-bottom: 90px; }
html.rg .rg-bs .rg-ex-topo .rg-ex-btn { text-decoration: none; }
html.rg .rg-bs-estados { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; }
html.rg .rg-bs-estado { margin: 0; cursor: pointer; }
html.rg .rg-bs-estado input { position: absolute; opacity: 0; pointer-events: none; }
html.rg .rg-bs-estado span { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 14px; border: 1px solid var(--rg-line); background: rgba(255,255,255,.03); color: var(--rg-ink-2); font-weight: 700; transition: all .15s; }
html.rg .rg-bs-estado span i { width: 22px; height: 22px; flex: none; display: grid; place-items: center; border-radius: 7px; border: 2px solid var(--rg-line); color: transparent; font-size: .7rem; }
html.rg .rg-bs-estado input:checked + span { border-color: color-mix(in srgb, var(--rg-good) 55%, transparent); background: color-mix(in srgb, var(--rg-good) 10%, transparent); color: #fff; }
html.rg .rg-bs-estado input:checked + span i { background: var(--rg-good); border-color: var(--rg-good); color: #0b2a1c; }
html.rg .rg-bs-estado input:focus-visible + span { outline: 2px solid var(--rg-lima); outline-offset: 2px; }
html.rg .rg-bs-conta { background: color-mix(in srgb, var(--rg-good) 14%, transparent); color: var(--rg-good); }
html.rg .rg-bs-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
html.rg .rg-bs-card { display: flex; flex-direction: column; gap: 12px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-bs-card:focus-within { border-color: color-mix(in srgb, var(--rg-lima) 45%, transparent); }
html.rg .rg-bs-topo { display: flex; align-items: center; gap: 12px; min-width: 0; }
html.rg .rg-bs-topo h3 { margin: 0; color: #fff; font-size: 1.02rem; font-weight: 800; }
html.rg .rg-bs-simula { color: var(--rg-ink-3); font-size: .8rem; }
html.rg .rg-bs-simula b { color: var(--rg-lima-texto); }
html.rg .rg-bs-img { position: relative; flex: none; width: 60px; height: 60px; margin: 0; border-radius: 14px; overflow: hidden; display: grid; place-items: center; background: rgba(255,255,255,.06); color: var(--rg-ink-3); font-size: 1.3rem; cursor: pointer; }
html.rg .rg-bs-img input { position: absolute; inset: 0; opacity: 0; cursor: pointer; z-index: 3; }
html.rg .rg-bs-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
html.rg .rg-bs-img-trocar { position: absolute; right: 3px; bottom: 3px; z-index: 2; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--rg-lima); color: var(--rg-on-lima); font-size: .62rem; }
html.rg .rg-bs-img.enviando::after { content: ''; position: absolute; inset: 0; z-index: 4; background: rgba(8,5,24,.6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='%23c9f53b' stroke-width='3' stroke-dasharray='40 20'/%3E%3C/svg%3E") center/26px no-repeat; animation: rg-sv-gira .8s linear infinite; }
html.rg .rg-bs-campos { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; }
html.rg .rg-bs-entrada { position: relative; display: block; }
html.rg .rg-bs-entrada em { position: absolute; top: 50%; transform: translateY(-50%); right: 12px; color: var(--rg-ink-3); font-style: normal; font-weight: 700; font-size: .82rem; pointer-events: none; }
html.rg .rg-bs-entrada input { padding-right: 34px; font-weight: 700; }
html.rg .rg-bs-entrada.rs em { right: auto; left: 12px; }
html.rg .rg-bs-entrada.rs input { padding-right: 12px; padding-left: 38px; }
html.rg .rg-bs-barra { position: sticky; bottom: 12px; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px 10px 16px; border-radius: 18px; background: rgba(18, 13, 43, .94); border: 1px solid var(--rg-line); backdrop-filter: blur(8px); box-shadow: 0 10px 30px rgba(0,0,0,.45); }
html.rg .rg-bs-barra.sujo { border-color: var(--rg-gold); }
@media (min-width: 768px) { html.rg .rg-bs-barra { margin-right: 84px; } }
html.rg .rg-bs-barra .rg-ex-btn { white-space: nowrap; }
@media (max-width: 767px) {
    html.rg .rg-bs-estados { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-bs-grade { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-bs-barra { position: fixed; left: 12px; right: 12px; bottom: 84px; padding-left: var(--rg-fab-folga, 12px); }
    html.rg .rg-bs-barra .rg-qe-estado { display: none; }
    html.rg .rg-bs-barra .rg-ex-btn { flex: 1; justify-content: center; }
    html.rg .rg-bs .rg-ex-topo .rg-ex-btn { width: 100%; justify-content: center; }
}
/* Configurar Bichão em abas */
html.rg .rg-bs-painel[hidden] { display: none; }
html.rg .rg-bs-painel { display: flex; flex-direction: column; gap: 14px; padding: 18px; border-radius: 20px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-bs-intro { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
html.rg .rg-bs-intro h2 { margin: 0; color: #fff; font-size: 1.15rem; font-weight: 800; }
html.rg .rg-bs-intro p { margin: 4px 0 0; color: var(--rg-ink-3); font-size: .86rem; }
html.rg .rg-bs-acoes-rapidas { display: flex; gap: 8px; flex-wrap: wrap; }
html.rg .rg-bs-estado span { flex-wrap: wrap; row-gap: 0; }
html.rg .rg-bs-estado span b { flex: 1; min-width: 0; color: inherit; }
html.rg .rg-bs-estado span small { flex-basis: 100%; padding-left: 32px; font-size: .72rem; font-weight: 600; color: var(--rg-ink-3); }
html.rg .rg-bs-estado input:checked + span small { color: var(--rg-good); }
html.rg .rg-bs-painel .rg-bs-card { background: rgba(255,255,255,.03); }
html.rg .rg-bs-mini { position: relative; flex: none; width: 42px; height: 42px; border-radius: 12px; overflow: hidden; display: grid; place-items: center; background: rgba(255,255,255,.06); color: var(--rg-ink-3); }
html.rg .rg-bs-mini img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
html.rg .rg-bs-campos .rg-bs-simula { display: block; margin-top: 4px; text-transform: none; letter-spacing: 0; font-weight: 600; }
html.rg .rg-bs-aplicar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-radius: 14px; border: 1px dashed var(--rg-line); color: var(--rg-ink-2); font-size: .86rem; }
html.rg .rg-bs-aplicar .rg-bs-entrada { width: 180px; }
html.rg .rg-bs-linhas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
html.rg .rg-bs-linha { display: flex; align-items: center; gap: 12px; margin: 0; padding: 8px 10px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-bs-linha b { flex: 1; min-width: 0; color: #fff; font-size: .92rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-bs-linha .rg-bs-entrada { flex: none; width: 160px; }
html.rg .rg-bs-contador { display: flex; align-items: center; gap: 8px; }
html.rg .rg-bs-contador button { flex: none; width: 46px; height: 46px; border-radius: 14px; border: 1px solid var(--rg-line); background: rgba(255,255,255,.05); color: #fff; font-size: 1rem; }
html.rg .rg-bs-contador button:hover { border-color: var(--rg-lima); color: var(--rg-lima-texto); }
html.rg .rg-bs-contador input { flex: 1; height: 46px; text-align: center; font-size: 1.4rem; font-weight: 900; }
html.rg .rg-bs-inv [data-exemplo] b { color: var(--rg-lima-texto); }
html.rg .rg-bs-imagens { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
html.rg .rg-bs-foto { position: relative; display: flex; flex-direction: column; gap: 8px; margin: 0; cursor: pointer; text-align: center; }
html.rg .rg-bs-foto input { position: absolute; inset: 0; opacity: 0; cursor: pointer; z-index: 3; }
html.rg .rg-bs-foto-img { position: relative; display: block; aspect-ratio: 1; border-radius: 16px; overflow: hidden; background: rgba(255,255,255,.05); border: 1px solid var(--rg-line); }
html.rg .rg-bs-foto-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
html.rg .rg-bs-foto-vazia { position: absolute; inset: 0; display: none; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; }
html.rg .rg-bs-foto-vazia i { font-size: 1.6rem; }
html.rg .rg-bs-foto.sem .rg-bs-foto-vazia { display: flex; }
html.rg .rg-bs-foto.sem .rg-bs-foto-img { border-style: dashed; }
html.rg .rg-bs-foto:hover .rg-tb-capa-trocar { opacity: 1; transform: translate(-50%, 0); }
html.rg .rg-bs-foto b { color: #fff; font-size: .88rem; }
html.rg .rg-bs-foto.enviando .rg-bs-foto-img::after { content: ''; position: absolute; inset: 0; background: rgba(8,5,24,.6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='%23c9f53b' stroke-width='3' stroke-dasharray='40 20'/%3E%3C/svg%3E") center/34px no-repeat; }
html.rg .rg-bs-barra[hidden] { display: none; }
@media (max-width: 991px) { html.rg .rg-bs-linhas { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
    html.rg .rg-bs-painel { padding: 14px; }
    html.rg .rg-bs-intro { flex-direction: column; }
    html.rg .rg-bs-acoes-rapidas .rg-ex-btn { flex: 1; justify-content: center; }
    html.rg .rg-bs-aplicar .rg-bs-entrada { flex: 1; width: auto; }
    html.rg .rg-bs-linha .rg-bs-entrada { width: 130px; }
    html.rg .rg-bs-imagens { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}

/* Configuração de Afiliados (admin) — layout novo: abas Afiliado / Níveis / FAQ */
html.rg .rg-af-painel[hidden] { display: none; }
html.rg .rg-af-painel > div { display: grid; gap: 16px; }
html.rg .rg-af-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin: 0; }
html.rg .rg-af-texto { margin: -6px 0 12px; color: var(--rg-ink-3); font-size: .86rem; }
html.rg .rg-af-pct { max-width: 220px; }
html.rg .rg-af-pct-caixa { position: relative; display: block; }
html.rg .rg-af-pct-caixa input { padding-right: 40px; font-size: 1.35rem; font-weight: 900; height: 52px; }
html.rg .rg-af-pct-caixa i { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); color: var(--rg-lima-texto); font-style: normal; font-weight: 900; font-size: 1.2rem; pointer-events: none; }
html.rg .rg-af-exemplo { margin: 12px 0 0; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.04); border: 1px dashed var(--rg-line); color: var(--rg-ink-2); font-size: .86rem; }
html.rg .rg-af-exemplo i { color: var(--rg-gold); margin-right: 4px; }
html.rg .rg-af-exemplo b { color: #fff; }
html.rg .rg-af-erro { display: block; margin: 6px 0 0; color: var(--rg-coral); font-size: .8rem; font-style: normal; font-weight: 700; text-transform: none; letter-spacing: 0; }
html.rg .rg-af-salvar { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 14px; flex-wrap: wrap; }
html.rg .rg-af-ok { color: var(--rg-good); font-weight: 700; font-size: .9rem; }
html.rg .rg-af-conta { margin-left: 4px; padding: 2px 10px; border-radius: 999px; background: rgba(255,255,255,.07); color: var(--rg-ink-3); font-size: .78rem !important; font-weight: 700; white-space: nowrap; }

/* Níveis */
html.rg .rg-af-topo-niveis { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 12px; align-items: stretch; }
html.rg .rg-af-topo-niveis > .rg-ex-btn { justify-content: center; padding-left: 20px; padding-right: 20px; }
html.rg .rg-af-niveis { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; margin: 14px 0 0; padding: 0; list-style: none; }
html.rg .rg-af-nivel { display: flex; flex-direction: column; min-width: 0; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); overflow: hidden; }
html.rg .rg-af-nivel:hover { border-color: color-mix(in srgb, var(--rg-gold) 45%, transparent); }
html.rg .rg-af-nivel-topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px 0; }
html.rg .rg-af-estrelas { display: inline-flex; align-items: center; gap: 3px; color: var(--rg-gold); font-size: 1rem; filter: drop-shadow(0 0 6px color-mix(in srgb, var(--rg-gold) 45%, transparent)); }
html.rg .rg-af-estrelas .far { color: var(--rg-ink-3); filter: none; }
html.rg .rg-af-estrelas b { margin-left: 2px; color: var(--rg-gold); font-size: .95rem; }
html.rg .rg-af-ordem { color: var(--rg-ink-3); font-size: .78rem; font-weight: 800; }
html.rg .rg-af-nivel h3 { margin: 6px 14px 0; color: #fff; font-size: 1.05rem; font-weight: 800; overflow-wrap: anywhere; }
html.rg .rg-af-faixa { margin: 4px 14px 0; color: var(--rg-ink-2); font-size: .86rem; font-weight: 700; }
html.rg .rg-af-faixa i { color: var(--rg-lima-texto); margin-right: 4px; }
html.rg .rg-af-faixa small { color: var(--rg-ink-3); font-size: .8rem !important; font-weight: 600; }
html.rg .rg-af-premios { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; margin: 12px 14px 0; }
html.rg .rg-af-premios > div { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 12px; background: rgba(255,255,255,.04); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-af-premios small { color: var(--rg-ink-3); font-size: .68rem !important; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; line-height: 1.25; }
html.rg .rg-af-premios b { color: var(--rg-ink-3); font-size: .98rem !important; }
html.rg .rg-af-premios .tem { border-color: color-mix(in srgb, var(--rg-good) 45%, transparent); background: color-mix(in srgb, var(--rg-good) 9%, transparent); }
html.rg .rg-af-premios .tem b { color: var(--rg-good); }
html.rg .rg-af-beneficio { flex: 1; margin: 10px 14px 0; color: var(--rg-ink-2); font-size: .84rem; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
html.rg .rg-af-nivel .rg-tb-acoes { margin-top: auto; }
html.rg .rg-af-modal-rodape { display: flex; gap: 10px; }
html.rg .rg-af-modal-rodape .rg-ex-btn { flex: 1; justify-content: center; }

/* FAQ */
html.rg .rg-af-faqs { display: grid; gap: 10px; margin: 14px 0 0; padding: 0; list-style: none; }
html.rg .rg-af-faq { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-af-faq.oculta { opacity: .62; }
html.rg .rg-af-faq-ordem { display: flex; flex-direction: column; align-items: center; gap: 2px; }
html.rg .rg-af-faq-ordem b { color: var(--rg-lima-texto); font-size: 1.05rem; line-height: 1; }
html.rg .rg-af-faq-ordem button { width: 30px; height: 24px; padding: 0; border-radius: 8px; border: 1px solid var(--rg-line); background: rgba(255,255,255,.04); color: var(--rg-ink-2); font-size: .72rem; }
html.rg .rg-af-faq-ordem button:hover:not(:disabled) { border-color: var(--rg-lima); color: var(--rg-lima-texto); }
html.rg .rg-af-faq-ordem button:disabled { opacity: .3; cursor: default; }
html.rg .rg-af-faq-texto { min-width: 0; }
html.rg .rg-af-faq-texto summary { color: #fff; font-weight: 800; font-size: .95rem; cursor: pointer; overflow-wrap: anywhere; list-style: none; }
html.rg .rg-af-faq-texto summary::-webkit-details-marker { display: none; }
html.rg .rg-af-faq-texto summary::after { content: '\f107'; font-family: 'Font Awesome 5 Free'; font-weight: 900; margin-left: 8px; color: var(--rg-ink-3); }
html.rg .rg-af-faq-texto[open] summary::after { content: '\f106'; }
html.rg .rg-af-faq-texto p { margin: 8px 0 0; color: var(--rg-ink-2); font-size: .88rem; line-height: 1.5; white-space: pre-line; overflow-wrap: anywhere; }
html.rg .rg-af-faq-texto:not([open]) summary + p { display: none; }
html.rg .rg-af-faq-lado { display: flex; align-items: center; gap: 12px; }
html.rg .rg-af-faq-status { display: inline-flex; align-items: center; gap: 8px; margin: 0; color: var(--rg-ink-3); font-size: .8rem; font-weight: 700; cursor: pointer; }
html.rg .rg-af-faq-status-form { padding: 10px 0 0; color: var(--rg-ink-2); text-transform: none; letter-spacing: 0; }
html.rg .rg-af-faq-acoes { display: flex; gap: 8px; }
html.rg .rg-af-faq-acoes .rg-tb-editar { flex: none; }

@media (max-width: 991px) {
    html.rg .rg-af-grade { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-af-topo-niveis { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
    html.rg .rg-af .rg-ro-premios-topo { flex-wrap: wrap; }
    html.rg .rg-af-salvar .rg-ex-btn { flex: 1; justify-content: center; }
    html.rg .rg-af-pct { max-width: none; }
    html.rg .rg-af-niveis { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-af-faq { grid-template-columns: auto minmax(0, 1fr); gap: 10px 12px; }
    html.rg .rg-af-faq-lado { grid-column: 1 / -1; justify-content: space-between; padding-top: 10px; border-top: 1px solid var(--rg-line); }
    html.rg .rg-af .rg-ro-campos { grid-template-columns: minmax(0, 1fr); }
}

/* jornada: barra de progresso rumo à próxima etapa */
html.rg .rg-jornada-barra { flex: 0 1 220px; min-width: 120px; display: flex; flex-direction: column; gap: 4px; }
html.rg .rg-jornada-barra-trilho { display: block; height: 8px; border-radius: 999px; background: rgba(255,255,255,.1); overflow: hidden; }
html.rg .rg-jornada-barra-trilho span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--rg-gold), var(--rg-lima)); box-shadow: 0 0 10px color-mix(in srgb, var(--rg-lima-brilho) 50%, transparent); }
html.rg .rg-jornada-barra small { color: var(--rg-ink-2); font-size: .74rem; font-weight: 700; text-align: right; }
@media (max-width: 767px) { html.rg .rg-jornada-atual { flex-wrap: wrap; } html.rg .rg-jornada-barra { flex: 1 1 100%; order: 3; } html.rg .rg-jornada-barra small { text-align: left; } }

/* ponta da linha da jornada pulsando quando está andando rumo à próxima etapa */
html.rg .rg-jornada-trilha.andando::after { --rg-min: 14px; background: linear-gradient(90deg, var(--rg-lima) 0%, var(--rg-lima) calc(100% - 26px), #f5ff9e 100%); animation: rg-jornada-brilho 1.6s ease-in-out infinite; }
@keyframes rg-jornada-brilho { 0%, 100% { box-shadow: 0 0 10px color-mix(in srgb, var(--rg-lima) 35%, transparent); } 50% { box-shadow: 0 0 22px color-mix(in srgb, var(--rg-lima) 85%, transparent); } }
@media (max-width: 767px) { html.rg .rg-jornada-trilha::after { --rg-no-meio: 20px; } }
@media (prefers-reduced-motion: reduce) { html.rg .rg-jornada-trilha.andando::after { animation: none; } }
/* teimosinha: quantidade livre (2 a 30) */
html.rg .rg-lj-teim-outro { display: inline-flex; align-items: center; gap: 4px; padding: 3px 4px 3px 12px; border-radius: 12px; border: 2px dashed var(--rg-line-2); background: var(--rg-surface-2); color: var(--rg-ink-2); font-weight: 800; }
html.rg .rg-lj-teim-outro > span { margin-right: 4px; font-size: .88rem; }
html.rg .rg-lj-teim-outro button { width: 30px; height: 30px; border: 0; border-radius: 9px; background: rgba(255,255,255,.07); color: #fff; font-weight: 900; font-size: 1rem; cursor: pointer; }
html.rg .rg-lj-teim-outro input { width: 40px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #fff; text-align: center; font-weight: 900; font-size: 1rem; }
html.rg .rg-lj-teim-outro input:focus { outline: 2px solid var(--rg-lima); }
html.rg .rg-lj-teim-outro.ativo { border-style: solid; border-color: var(--rg-lima); background: color-mix(in srgb, var(--rg-lima) 14%, var(--rg-surface-2)); color: var(--rg-lima-texto); }
html.rg .rg-lj-teim-ajuda { display: block; min-height: 1.2em; margin-top: 6px; color: var(--rg-lima-texto); font-size: .8rem; font-weight: 700; }

/* celular: botão flutuante do menu some enquanto a pessoa rola para baixo (roupagem.js) */
@media (max-width: 991px) {
    html.rg #menu-floating-btn { transition: transform .25s ease, opacity .25s ease !important; }
    html.rg.rg-fab-oculto #menu-floating-btn { transform: translateX(-90px) !important; opacity: 0; pointer-events: none; }
}
@media (prefers-reduced-motion: reduce) { html.rg #menu-floating-btn { transition: opacity .2s !important; } html.rg.rg-fab-oculto #menu-floating-btn { transform: none !important; } }

/* ajustes finos para celulares pequenos (320–359px) */
@media (max-width: 359px) {
    /* atalhos da home: texto cabe sem cortar ("BÔNUS", "CONVERTER") */
    html.rg .category-info .txtnav { font-size: .56rem !important; letter-spacing: -.02em; text-overflow: clip; }
    html.rg .category-info > a { margin: 0 1px; padding-left: 1px; padding-right: 1px; }
    /* filtros com datas: uma coluna para a data não ficar cortada */
    html.rg .rg-cb-filtros, html.rg .rg-jc-filtros, html.rg .rg-vr-filtros, html.rg .rg-vr-filtros.com-consultor, html.rg .rg-vi-form, html.rg .rg-vi-form.com-consultor { grid-template-columns: minmax(0, 1fr) !important; }
    html.rg .rg-cb-filtros .rg-ext-campo { grid-column: auto !important; }
    /* roleta: degraus de recarga sem cortar a lixeira e "Novo prêmio" numa linha */
    html.rg .rg-ro-degraus li { gap: 6px; padding: 8px; flex-wrap: wrap; }
    html.rg .rg-ro-degraus > li > i { display: none; }
    html.rg .rg-ro-degrau-valor { font-size: .88rem; }
    html.rg .rg-ro-degrau-valor small { display: none; }
    html.rg .rg-ro-premios-topo .rg-ex-btn { white-space: nowrap; padding: 8px 10px; font-size: .82rem; }
    /* configurar bichão: estados em uma coluna ("Desligado" não sai do cartão) */
    html.rg .rg-bs-estados { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-bs-linha .rg-bs-entrada { width: 112px; }
}

/* Meus prêmios da roleta (cliente) — layout novo */
html.rg .rg-mp .rg-ex-topo .rg-ex-btn { text-decoration: none; }
html.rg .rg-mp-aviso { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px; font-size: .9rem; }
html.rg .rg-mp-aviso.ok { background: color-mix(in srgb, var(--rg-good) 14%, transparent); color: var(--rg-good); }
html.rg .rg-mp-aviso.erro { background: color-mix(in srgb, var(--rg-coral) 14%, transparent); color: var(--rg-coral); }
html.rg .rg-mp-aviso.ouro { background: color-mix(in srgb, var(--rg-gold) 13%, transparent); color: var(--rg-gold); border: 1px solid color-mix(in srgb, var(--rg-gold) 40%, transparent); }
html.rg .rg-mp-aviso b { color: #fff; }
html.rg .rg-mp-resumo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-mp-resumo > div { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; padding: 12px 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-mp-resumo i { grid-row: span 2; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; background: color-mix(in srgb, var(--rg-violeta) 18%, transparent); color: var(--rg-violeta); }
html.rg .rg-mp-resumo b { color: #fff; font-size: 1.25rem; line-height: 1.1; overflow-wrap: anywhere; }
html.rg .rg-mp-resumo small { color: var(--rg-ink-3); font-size: .76rem; }
html.rg .rg-mp-resumo .rg-mp-r-verde i { background: color-mix(in srgb, var(--rg-good) 16%, transparent); color: var(--rg-good); }
html.rg .rg-mp-resumo .rg-mp-r-verde b { color: var(--rg-good); }
html.rg .rg-mp-resumo .rg-mp-r-ouro i { background: color-mix(in srgb, var(--rg-gold) 16%, transparent); color: var(--rg-gold); }
html.rg .rg-mp-resumo .rg-mp-r-ouro b { color: var(--rg-gold); }
html.rg .rg-mp-lista { display: grid; gap: 10px; }
html.rg .rg-mp-card { display: flex; align-items: center; gap: 14px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-left: 4px solid var(--rg-violeta); min-width: 0; }
html.rg .rg-mp-money { border-left-color: var(--rg-good); }
html.rg .rg-mp-physical { border-left-color: var(--rg-gold); }
html.rg .rg-mp-foto { position: relative; flex: none; width: 60px; height: 60px; border-radius: 16px; overflow: hidden; display: grid; place-items: center; background: rgba(255,255,255,.06); color: var(--rg-ink-2); font-size: 1.4rem; }
html.rg .rg-mp-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #fff; }
html.rg .rg-mp-info { flex: 1; min-width: 0; }
html.rg .rg-mp-info h2 { margin: 0 0 2px; color: #fff; font-size: 1rem; font-weight: 800; overflow-wrap: anywhere; }
html.rg .rg-mp-info small { color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-mp-acao { flex: none; }
html.rg .rg-mp-acao .rg-ex-btn { white-space: nowrap; text-decoration: none; }
html.rg .rg-mp-tag.rg-mp-t-verde { --cor: var(--rg-good); }
html.rg .rg-mp-tag.rg-mp-t-violeta { --cor: var(--rg-violeta); }
html.rg .rg-mp-tag.rg-mp-t-coral { --cor: var(--rg-coral); }
html.rg .rg-mp-etapas { list-style: none; display: flex; gap: 4px; margin: 10px 0 0; padding: 0; }
html.rg .rg-mp-etapas li { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; color: var(--rg-ink-3); font-size: .68rem; font-weight: 700; }
html.rg .rg-mp-etapas li span { display: block; height: 6px; border-radius: 999px; background: rgba(255,255,255,.1); }
html.rg .rg-mp-etapas li.feito { color: var(--rg-ink-2); }
html.rg .rg-mp-etapas li.feito span { background: var(--rg-lima); }
html.rg .rg-mp-etapas li.atual { color: var(--rg-lima-texto); }
html.rg .rg-mp-vazio-icone { font-size: 2.4rem; }
html.rg .rg-mp-cep-msg { color: var(--rg-gold); font-size: .74rem; min-height: 1em; }
@media (max-width: 767px) {
    html.rg .rg-mp .rg-ex-topo .rg-ex-btn { width: 100%; justify-content: center; }
    html.rg .rg-mp-resumo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
    html.rg .rg-mp-resumo > div:first-child { grid-column: 1 / -1; }
    html.rg .rg-mp-card { flex-wrap: wrap; }
    html.rg .rg-mp-info { flex-basis: calc(100% - 74px); }
    html.rg .rg-mp-acao { flex-basis: 100%; }
    html.rg .rg-mp-acao .rg-ex-btn { width: 100%; justify-content: center; }
}

/* Carreira: "De onde vêm seus pontos" — layout novo */
html.rg .rg-cp { display: flex; flex-direction: column; gap: 14px; padding: 18px; border-radius: 20px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-cp-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
html.rg .rg-cp-topo h2 { margin: 0; color: #fff; font-size: 1.15rem; font-weight: 800; }
html.rg .rg-cp-topo h2 i { color: var(--rg-violeta); margin-right: 6px; }
html.rg .rg-cp-topo p { margin: 4px 0 0; color: var(--rg-ink-3); font-size: .86rem; }
html.rg .rg-cp-regra { padding: 5px 12px; border-radius: 999px; background: color-mix(in srgb, var(--rg-violeta) 16%, transparent); color: #c4b5fd; font-size: .78rem; font-weight: 700; white-space: nowrap; }
html.rg .rg-cp-filtros { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
html.rg .rg-cp-busca { flex: 1 1 240px; margin: 0; }
html.rg .rg-cp-tipos { display: inline-flex; gap: 4px; padding: 4px; border-radius: 12px; background: rgba(255,255,255,.04); border: 1px solid var(--rg-line); }
html.rg .rg-cp-tipos button { padding: 7px 12px; border: 0; border-radius: 9px; background: transparent; color: var(--rg-ink-2); font-weight: 700; font-size: .84rem; cursor: pointer; white-space: nowrap; }
html.rg .rg-cp-tipos button.ativo { background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-cp-conta { color: var(--rg-ink-3); font-size: .8rem; font-weight: 600; }
html.rg .rg-cp-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
html.rg .rg-cp-lista li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-cp-icone { flex: none; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; background: color-mix(in srgb, var(--rg-good) 15%, transparent); color: var(--rg-good); }
html.rg .rg-cp-lista li.rede .rg-cp-icone { background: color-mix(in srgb, #3ec7d9 15%, transparent); color: #3ec7d9; }
html.rg .rg-cp-info { flex: 1; min-width: 0; }
html.rg .rg-cp-info b { display: block; color: #fff; font-size: .9rem; overflow-wrap: anywhere; }
html.rg .rg-cp-info small { color: var(--rg-ink-3); font-size: .76rem; }
html.rg .rg-cp-pontos { flex: none; text-align: right; }
html.rg .rg-cp-pontos b { display: block; color: var(--rg-good); font-size: 1.05rem; font-weight: 900; }
html.rg .rg-cp-pontos small { color: var(--rg-ink-3); font-size: .72rem; white-space: nowrap; }
html.rg .rg-cp .rg-tb-vazio > i { color: var(--rg-gold); }
@media (max-width: 767px) {
    html.rg .rg-cp { padding: 14px; }
    html.rg .rg-cp-tipos { width: 100%; }
    html.rg .rg-cp-tipos button { flex: 1; }
    html.rg .rg-cp-lista li { align-items: flex-start; }
}
html.rg .rg-mp-resumo > div { background: var(--rg-surface) !important; }
html.rg .rg-mp-tag { color: color-mix(in srgb, var(--cor) 75%, #fff) !important; }
@media (max-width: 767px) {
    html.rg .rg-cp-icone { display: none; }
    html.rg .rg-cp-lista li { flex-wrap: wrap; gap: 4px 10px; }
    html.rg .rg-cp-info { flex: 1 1 calc(100% - 80px); }
}

/* Vendas da Rede (ReportDay) — layout novo */
html.rg .rg-vn-pers { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; align-items: end; }
html.rg .rg-vn-pers[hidden] { display: none; }
html.rg .rg-vn-pers .rg-ex-btn { height: 40px; white-space: nowrap; }
html.rg .rg-vn-erro { margin: 0; color: var(--rg-coral); font-size: .84rem; }
html.rg .rg-vn-hero { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
html.rg .rg-vn-hero .rg-ex-resultado-num b { color: var(--rg-lima-texto); }
html.rg .rg-vn-ganhos { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-vn-ganhos .rg-tb-num b { font-size: 1.2rem; overflow-wrap: anywhere; }
html.rg .rg-vn-destaque { border-color: color-mix(in srgb, var(--rg-good) 45%, transparent); background: color-mix(in srgb, var(--rg-good) 8%, var(--rg-surface)); }
html.rg .rg-vn-destaque i, html.rg .rg-vn-destaque b { color: var(--rg-good) !important; }
html.rg .rg-vn-busca { flex: 0 1 260px; margin: 0; }
html.rg .rg-vn-lista { list-style: none; margin: 0; padding: 0; }
html.rg .rg-vn-lista li { display: flex; align-items: center; gap: 12px; padding: 10px 8px; }
html.rg .rg-vn-lista li[hidden] { display: none; }
html.rg .rg-vn-lista li + li { border-top: 1px solid rgba(255,255,255,.05); }
html.rg .rg-vn-lista small { overflow-wrap: anywhere; }
@media (max-width: 1199px) { html.rg .rg-vn-ganhos { grid-template-columns: repeat(2, minmax(0, 1fr)); } html.rg .rg-vn-hero { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
    html.rg .rg-vn-pers { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-vn-pers .rg-ex-btn { grid-column: 1 / -1; justify-content: center; }
    html.rg .rg-vn-ganhos { gap: 8px; }
    html.rg .rg-vn-ganhos > :first-child { grid-column: 1 / -1; }
    html.rg .rg-vn-ganhos .rg-tb-num b { font-size: 1.02rem; }
    html.rg .rg-vn-busca { flex-basis: 100%; }
}
@media (max-width: 359px) { html.rg .rg-vn-pers { grid-template-columns: minmax(0, 1fr); } }
/* rankings (Vendas da Rede / Indicadores): nome longo não empurra o valor para fora */
html.rg .rg-vi-rank-info > div > b { min-width: 0; }
html.rg .rg-vn-lista .rg-vi-rank-info { min-width: 0; }
@media (max-width: 767px) {
    html.rg .rg-vn-lista li { gap: 8px; padding: 10px 2px; }
    html.rg .rg-vn-lista .rg-vi-pos { width: 26px; height: 26px; font-size: .78rem; }
    html.rg .rg-vn-lista .rg-vi-pos.top1, html.rg .rg-vn-lista .rg-vi-pos.top2, html.rg .rg-vn-lista .rg-vi-pos.top3 { font-size: 1.1rem; }
}
@media (max-width: 767px) {
    html.rg .rg-vn-lista li > .rg-vi-rank-info { flex: 1 1 0; width: 0; }
    html.rg .rg-vn-lista .rg-vi-rank-info > div { flex-wrap: wrap; column-gap: 8px; row-gap: 0; }
    html.rg .rg-vn-lista .rg-vi-rank-info > div > b { white-space: normal; overflow-wrap: anywhere; }
}

/* Bônus (meus bilhetes da rifa) — layout novo */
html.rg .rg-bn .rg-ex-topo .rg-ex-btn { text-decoration: none; }
html.rg .rg-bn-hero { grid-template-columns: minmax(0, .8fr) minmax(0, 2fr); align-items: center; }
html.rg .rg-bn-hero .rg-ex-resultado-num b { color: var(--rg-lima-texto); }
html.rg .rg-bn-origens { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
html.rg .rg-bn-origem { --c: var(--rg-violeta); display: grid; grid-template-columns: auto 1fr; column-gap: 8px; align-items: center; padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-bn-origem i { grid-row: span 3; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: color-mix(in srgb, var(--c) 18%, transparent); color: var(--c); }
html.rg .rg-bn-origem span { color: var(--rg-ink-3); font-size: .72rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-bn-origem b { color: #fff; font-size: 1.1rem; line-height: 1.1; }
html.rg .rg-bn-origem small { color: var(--rg-ink-3); font-size: .7rem; }
html.rg .rg-bn-origem.zero { opacity: .55; }
html.rg .rg-bn-verde { --c: var(--rg-good); }
html.rg .rg-bn-ceu { --c: #3ec7d9; }
html.rg .rg-bn-ouro { --c: var(--rg-gold); }
html.rg .rg-bn-rosa { --c: #ff8ad8; }
html.rg .rg-bn-violeta { --c: var(--rg-violeta); }
html.rg .rg-bn-lista { display: grid; gap: 10px; }
html.rg .rg-bn-card { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-left: 4px solid var(--c, var(--rg-violeta)); min-width: 0; }
html.rg .rg-bn-icone { flex: none; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; background: color-mix(in srgb, var(--c) 18%, transparent); color: var(--c); font-size: 1.15rem; }
html.rg .rg-bn-info { flex: 1; min-width: 0; }
html.rg .rg-bn-info h2 { margin: 0; color: #fff; font-size: 1.02rem; font-weight: 800; }
html.rg .rg-bn-info small { color: var(--rg-ink-3); font-size: .8rem; }
html.rg .rg-bn-acoes { flex: none; display: flex; gap: 6px; }
html.rg .rg-bn-acoes .rg-ex-btn { padding: 8px 12px; font-size: .84rem; white-space: nowrap; text-decoration: none; }
@media (max-width: 1199px) { html.rg .rg-bn-hero { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
    html.rg .rg-bn .rg-ex-topo .rg-ex-btn { width: 100%; justify-content: center; }
    html.rg .rg-bn-origens { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-bn-card { flex-wrap: wrap; }
    html.rg .rg-bn-info { flex-basis: calc(100% - 60px); }
    html.rg .rg-bn-acoes { flex-basis: 100%; }
    html.rg .rg-bn-acoes .rg-ex-btn { flex: 1; justify-content: center; padding: 9px 6px; }
}
@media (max-width: 359px) { html.rg .rg-bn-pdf { display: none; } }

/* Configuração Sua Rifa — layout novo */
html.rg .rg-sr { padding-bottom: 90px; }
html.rg .rg-sr .rg-ex-topo .rg-ex-btn { text-decoration: none; }
html.rg .rg-sr-rifa { display: grid; gap: 12px; }
html.rg .rg-sr-rifa .rg-mp-aviso { margin: 0; }
html.rg .rg-sr-chaves { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
html.rg .rg-sr-chaves .rg-tb-chave { cursor: pointer; }
html.rg .rg-sr-chaves .rg-tb-switch { pointer-events: none; }
html.rg .rg-sr-qtd { margin-left: 4px; padding: 1px 7px; border-radius: 999px; background: rgba(0,0,0,.18); font-style: normal; font-size: .74rem; }
html.rg .rg-sr-pacotes { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
html.rg .rg-sr-pacote { display: flex; align-items: flex-end; gap: 10px; padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--rg-line); }
html.rg .rg-sr-pacote.novo { border-color: color-mix(in srgb, var(--rg-lima) 45%, transparent); }
html.rg .rg-sr-pacote .rg-ext-campo { flex: 1; min-width: 0; margin: 0; }
html.rg .rg-sr-pacote .rg-bs-entrada input { padding-right: 70px; }
html.rg .rg-sr-pacote .rg-bs-entrada.rs input { padding-right: 12px; }
html.rg .rg-sr-n { flex: none; align-self: center; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--rg-violeta) 20%, transparent); color: #c4b5fd; font-weight: 800; font-size: .82rem; }
html.rg .rg-sr-seta { flex: none; align-self: center; margin-top: 18px; color: var(--rg-ink-3); }
html.rg .rg-sr-pacote .rg-tb-excluir { flex: none; width: 40px; height: 40px; min-height: 40px; }
html.rg .rg-sr-add { align-self: flex-start; border-style: dashed; }
@media (max-width: 767px) {
    html.rg .rg-sr .rg-ex-topo .rg-ex-btn { width: 100%; justify-content: center; }
    html.rg .rg-sr-chaves { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-sr-pacote { flex-wrap: wrap; gap: 8px; }
    html.rg .rg-sr-pacote .rg-ext-campo { flex: 1 1 calc(50% - 30px); }
    html.rg .rg-sr-seta { display: none; }
    html.rg .rg-sr-n { order: -1; }
    html.rg .rg-sr-pacote .rg-tb-excluir { margin-left: auto; }
    html.rg .rg-sr-add { width: 100%; justify-content: center; }
}
@media (max-width: 359px) { html.rg .rg-sr-pacote .rg-ext-campo { flex-basis: 100%; } }
@media (max-width: 767px) {
    /* barra fixa de salvar nunca passa da largura da tela */
    html.rg .rg-bs-barra { box-sizing: border-box; max-width: calc(100vw - 24px); }
    html.rg .rg-bs-barra .rg-ex-btn { min-width: 0; }
    /* abas da Sua Rifa: duas metades, texto quebra se precisar */
    html.rg .rg-sr .rg-tb-abas a { flex: 1 1 0; min-width: 0; white-space: normal; text-align: center; line-height: 1.2; padding: 8px 6px; }
}
@media (max-width: 767px) {
    /* pacote: número e lixeira na mesma linha, campos embaixo */
    html.rg .rg-sr-n { order: -2; }
    html.rg .rg-sr-pacote .rg-tb-excluir { order: -1; width: 34px; height: 34px; min-height: 34px; }
}

/* Grupos de Consultores — layout novo */
html.rg .rg-cg .rg-qt-sub b { color: #fff; }
html.rg .rg-cg .rg-rs-titulo .rg-vi-conta { margin-left: 4px; }
html.rg .rg-cg-form { display: grid; gap: 12px; border-color: color-mix(in srgb, var(--rg-lima) 40%, transparent); }
html.rg .rg-cg-form-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 10px; }
html.rg .rg-cg-niveis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
html.rg .rg-cg-niveis .rg-bs-entrada input { padding-right: 28px; }
html.rg .rg-cg-form-acoes { display: flex; justify-content: flex-end; gap: 8px; }
html.rg .rg-cg-grupos { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
html.rg .rg-cg-grupo { display: flex; flex-direction: column; gap: 12px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-cg-grupo-topo { display: flex; align-items: center; gap: 12px; min-width: 0; }
html.rg .rg-cg-grupo-topo > div { flex: 1; min-width: 0; }
html.rg .rg-cg-grupo-topo h3 { margin: 0 0 4px; color: #fff; font-size: 1.05rem; font-weight: 800; overflow-wrap: anywhere; }
html.rg .rg-cg-avatar { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 14px; background: linear-gradient(135deg, var(--rg-violeta), #3ec7d9); color: #fff; font-weight: 900; font-size: 1.2rem; }
html.rg .rg-cg-membros { flex: none; text-align: center; color: var(--rg-ink-3); font-size: .74rem; }
html.rg .rg-cg-membros b { display: block; color: var(--rg-lima-texto); font-size: 1.3rem; line-height: 1; }
html.rg .rg-cg-pcts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; }
html.rg .rg-cg-pcts span { display: flex; flex-direction: column; align-items: center; padding: 6px 2px; border-radius: 10px; background: color-mix(in srgb, var(--rg-good) 10%, transparent); min-width: 0; }
html.rg .rg-cg-pcts span.zero { background: rgba(255,255,255,.03); }
html.rg .rg-cg-pcts small { color: var(--rg-ink-3); font-size: .64rem; font-weight: 700; }
html.rg .rg-cg-pcts b { color: var(--rg-good); font-size: .86rem; white-space: nowrap; }
html.rg .rg-cg-pcts span.zero b { color: var(--rg-ink-3); }
html.rg .rg-cg-pcts.mini { margin-top: 6px; max-width: 420px; }
html.rg .rg-cg-pcts.mini span { padding: 3px 2px; }
html.rg .rg-cg-pcts.mini b { font-size: .76rem; }
html.rg .rg-cg-grupo-acoes { display: flex; align-items: center; gap: 6px; margin-top: auto; }
html.rg .rg-cg-grupo-acoes .rg-tb-editar { flex: 1; }
html.rg .rg-cg-confirma { flex: 1; color: var(--rg-coral); font-weight: 800; font-size: .88rem; }
html.rg .rg-cg-sim { border-color: var(--rg-coral) !important; background: var(--rg-coral) !important; color: #fff !important; }
html.rg .rg-cg-dica { margin: -6px 0 12px; color: var(--rg-ink-3); font-size: .84rem; }
html.rg .rg-cg-dica b { color: #fff; }
html.rg .rg-cg-sem, html.rg .rg-cg-lista-membros { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
html.rg .rg-cg-sem > li, html.rg .rg-cg-lista-membros > li { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; padding: 12px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--rg-line); }
html.rg .rg-cg-pessoa { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
html.rg .rg-cg-pessoa > b { color: #fff; font-size: .95rem; overflow-wrap: anywhere; }
html.rg .rg-cg-pessoa > small { color: var(--rg-ink-3); font-size: .78rem; overflow-wrap: anywhere; }
html.rg .rg-cg-pessoa .rg-ext-carteira { margin-left: 6px; font-size: .68rem; vertical-align: middle; }
html.rg .rg-cg-tag-ouro { --cor: var(--rg-gold); }
html.rg .rg-cg-tag-ceu { --cor: #3ec7d9; }
html.rg .rg-cg-alerta { color: var(--rg-coral) !important; }
html.rg .rg-cg-promover { flex: 0 1 340px; display: flex; gap: 6px; }
html.rg .rg-cg-promover select { flex: 1; min-width: 0; }
html.rg .rg-cg-promover .rg-ex-btn { white-space: nowrap; }
html.rg .rg-cg-promover .rg-ex-btn:disabled { opacity: .45; cursor: not-allowed; }
html.rg .rg-cg-modal { z-index: 100000; }
html.rg .rg-cg-modal .rg-jc-caixa { max-width: 760px; }
html.rg .rg-cg-modal-filtros { display: flex; gap: 8px; flex-wrap: wrap; }
html.rg .rg-cg-modal-filtros label { flex: 1 1 220px; margin: 0; }
html.rg .rg-cg-modal-filtros select { flex: 0 0 150px; }
html.rg .rg-cg-membro-acoes { display: flex; gap: 6px; flex-wrap: wrap; }
html.rg .rg-cg-membro-acoes .rg-ex-btn { padding: 7px 11px; font-size: .82rem; }
html.rg .rg-cg-edicao { flex-basis: 100%; display: grid; gap: 8px; padding: 12px; border-radius: 12px; background: rgba(0,0,0,.2); border: 1px solid color-mix(in srgb, var(--rg-lima) 35%, transparent); }
html.rg .rg-cg-nada { justify-content: center; color: var(--rg-ink-3); }
@media (max-width: 991px) { html.rg .rg-cg-niveis { grid-template-columns: repeat(3, minmax(0, 1fr)); } html.rg .rg-cg-form-grade { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
    html.rg .rg-cg .rg-tb-topo-acoes .rg-ex-btn { flex: 1 1 100%; justify-content: center; }
    html.rg .rg-cg-grupos { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-cg-promover { flex-basis: 100%; }
    html.rg .rg-cg-membro-acoes { flex-basis: 100%; }
    html.rg .rg-cg-membro-acoes .rg-ex-btn { flex: 1; justify-content: center; }
    html.rg .rg-cg-pcts b { font-size: .76rem; }
}
@media (max-width: 359px) { html.rg .rg-cg-pcts { grid-template-columns: repeat(3, minmax(0, 1fr)); } html.rg .rg-cg-promover { flex-wrap: wrap; } html.rg .rg-cg-promover .rg-ex-btn { flex: 1; justify-content: center; } }
@media (max-width: 479px) { html.rg .rg-cg-promover { flex-wrap: wrap; } html.rg .rg-cg-promover select { flex: 1 1 100%; } html.rg .rg-cg-promover .rg-ex-btn { flex: 1; justify-content: center; } }

/* Apostas em aberto (validar jogos) — layout novo */
html.rg .rg-va .rg-ex-topo .rg-ex-btn { text-decoration: none; }
html.rg .rg-va-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
html.rg .rg-va-lista li { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 16px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-left: 4px solid var(--rg-gold); }
html.rg .rg-va-id { flex: none; padding: 6px 10px; border-radius: 10px; background: color-mix(in srgb, var(--rg-gold) 15%, transparent); color: var(--rg-gold); font-weight: 900; font-variant-numeric: tabular-nums; }
html.rg .rg-va-info { flex: 1; min-width: 0; }
html.rg .rg-va-info b { display: block; color: #fff; overflow-wrap: anywhere; }
html.rg .rg-va-info small { color: var(--rg-ink-3); font-size: .8rem; }
html.rg .rg-va-acoes { flex: none; display: flex; gap: 6px; }
html.rg .rg-va-acoes form { margin: 0; }
html.rg .rg-va-acoes .rg-tb-editar { padding: 9px 16px; }
@media (max-width: 767px) {
    html.rg .rg-va .rg-ex-topo .rg-ex-btn { width: 100%; justify-content: center; }
    html.rg .rg-va-lista li { flex-wrap: wrap; }
    html.rg .rg-va-info { flex-basis: calc(100% - 80px); }
    html.rg .rg-va-acoes { flex-basis: 100%; }
    html.rg .rg-va-acoes .rg-tb-editar { flex: 1; }
}

/* Venda Rápida — Links e vendas (layout novo) */
html.rg .rg-vl-regra { padding: 10px 14px; border-radius: 14px; background: color-mix(in srgb, var(--rg-gold) 9%, transparent); border: 1px solid color-mix(in srgb, var(--rg-gold) 30%, transparent); color: var(--rg-ink-2); font-size: .86rem; }
html.rg .rg-vl-regra summary { color: var(--rg-gold); font-weight: 700; cursor: pointer; }
html.rg .rg-vl-regra p { margin: 8px 0 0; }
html.rg .rg-vr-filtros.sem-consultor { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html.rg .rg-vl-modtopo { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
html.rg .rg-vl-modtopo .rg-rs-titulo { margin: 0; }
html.rg .rg-vl-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
html.rg .rg-vl-card { display: flex; flex-direction: column; gap: 12px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-vl-card[hidden] { display: none; }
html.rg .rg-vl-card.vendeu { border-color: color-mix(in srgb, var(--rg-good) 45%, transparent); }
html.rg .rg-vl-topo { display: flex; align-items: center; gap: 10px; min-width: 0; }
html.rg .rg-vl-topo h3 { flex: 1; min-width: 0; margin: 0; color: #fff; font-size: 1rem; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-vl-topo .rg-qt-img { width: 40px; height: 40px; }
html.rg .rg-vl-selo { padding: 3px 9px; border-radius: 999px; background: color-mix(in srgb, var(--rg-good) 16%, transparent); color: var(--rg-good); font-size: .76rem; font-weight: 800; }
html.rg .rg-vl-nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
html.rg .rg-vl-nums > div { padding: 7px 8px; border-radius: 10px; background: rgba(255,255,255,.04); min-width: 0; }
html.rg .rg-vl-nums small { display: block; color: var(--rg-ink-3); font-size: .68rem; font-weight: 700; }
html.rg .rg-vl-nums b { color: #fff; font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
html.rg .rg-vl-link { display: flex; gap: 6px; }
html.rg .rg-vl-link input { flex: 1; min-width: 0; height: 40px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--rg-line); background: rgba(0,0,0,.2); color: var(--rg-ink-2); font-size: .8rem; }
html.rg .rg-vl-link .rg-ex-btn { white-space: nowrap; }
html.rg .vr-copy-btn.copiado { background: var(--rg-good) !important; border-color: var(--rg-good) !important; }
html.rg .rg-vl-acoes { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
html.rg .rg-vl-acoes a { color: var(--rg-ink-2) !important; font-size: .82rem; font-weight: 700; text-decoration: none !important; }
html.rg .rg-vl-acoes a:first-child { color: #25d366 !important; }
html.rg .rg-vl-acoes a:hover { color: #fff !important; }
html.rg .rg-vl-off { margin: 0; color: var(--rg-ink-3); font-size: .82rem; }
@media (max-width: 767px) {
    html.rg .rg-vr-filtros.sem-consultor { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-vl-grade { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-vl-modtopo .rg-vn-busca { flex-basis: 100%; }
}

/* Monitoramento de Chat — no layout novo (só visual; o funcionamento é o chat-monitor.js) */
html.rg #chatmon {
    --cm-primary: var(--rg-lima); --cm-bg: var(--rg-bg); --cm-panel: var(--rg-surface); --cm-surface: rgba(255,255,255,.05);
    --cm-surface-2: color-mix(in srgb, var(--rg-violeta) 22%, var(--rg-surface)); --cm-border: var(--rg-line); --cm-text: #e9e6f7; --cm-muted: var(--rg-ink-3);
    margin: 16px; border-radius: 22px; font-family: var(--rg-font, inherit); box-shadow: 0 18px 40px rgba(0,0,0,.35);
}
html.rg .chatmon-header { padding: 18px 20px; background: radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--rg-violeta) 30%, transparent), transparent 60%), var(--rg-surface); }
html.rg .chatmon-header-title h1 { font-family: var(--rg-font-display) !important; font-size: 1.35rem; }
html.rg .chatmon-header-title > i { border-radius: 14px; width: 46px; height: 46px; box-shadow: 0 6px 18px color-mix(in srgb, var(--rg-lima) 30%, transparent); }
html.rg .chatmon-header-scope { box-shadow: 0 4px 12px color-mix(in srgb, var(--rg-lima) 25%, transparent); }
html.rg .chatmon-list-pane { background: color-mix(in srgb, var(--rg-surface) 85%, #000); }
html.rg .chatmon-search input { border-radius: 12px; padding-top: 10px; padding-bottom: 10px; }
html.rg .chatmon-row { margin: 4px 8px; border: 1px solid transparent; border-radius: 14px; border-bottom-color: transparent; }
html.rg .chatmon-row:hover { background: rgba(255,255,255,.05); }
html.rg .chatmon-row.active { background: color-mix(in srgb, var(--rg-lima) 10%, transparent); border-color: color-mix(in srgb, var(--rg-lima) 45%, transparent); border-left-width: 1px; padding-left: 14px; }
html.rg .chatmon-row-names { font-size: .9rem; }
html.rg .chatmon-row-count { background: color-mix(in srgb, var(--rg-violeta) 25%, transparent); color: #d9ccff; }
html.rg .chatmon-load-more { border-radius: 12px; border-style: dashed; color: var(--rg-lima-texto); }
html.rg .chatmon-empty i { font-size: 46px; color: var(--rg-violeta); opacity: .7; }
html.rg .chatmon-empty p { font-size: .95rem; }
html.rg .chatmon-thread-header { background: var(--rg-surface); }
html.rg .chatmon-participant-chip { background: rgba(255,255,255,.06); border: 1px solid var(--rg-line); }
html.rg .chatmon-messages { background: radial-gradient(circle at 20% 0%, rgba(139, 92, 246, .08), transparent 50%), var(--rg-bg); }
html.rg .chatmon-day-divider { display: flex; align-items: center; gap: 10px; }
html.rg .chatmon-day-divider::before, html.rg .chatmon-day-divider::after { content: ''; flex: 1; height: 1px; background: var(--rg-line); }
html.rg .cm-bubble { border-radius: 16px; }
html.rg .cm-msg.side-a .cm-bubble { background: rgba(255,255,255,.07); }
html.rg .cm-msg.side-b .cm-bubble { background: color-mix(in srgb, var(--rg-violeta) 30%, var(--rg-surface)); border-color: color-mix(in srgb, var(--rg-violeta) 40%, transparent); }
@media (max-width: 991.98px) { html.rg #chatmon { margin: 12px; } html.rg .chatmon-header { flex-wrap: wrap; } }
@media (max-width: 479px) { html.rg #chatmon { margin: 8px; border-radius: 18px; } html.rg .chatmon-header-title h1 { font-size: 1.1rem; } html.rg .chatmon-header-scope { font-size: .66rem; } }
/* Meus pontos: cartões de saldo filtram o histórico */
html.rg a.rg-pt-saldo { color: inherit; text-decoration: none !important; cursor: pointer; transition: transform .15s, box-shadow .15s, border-color .15s; }
html.rg a.rg-pt-saldo:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0,.3); }
html.rg a.rg-pt-saldo.ativo { box-shadow: 0 0 0 2px var(--rg-lima) inset, 0 10px 24px rgba(0,0,0,.3); }
html.rg .rg-pt-hist header a { color: var(--rg-lima-texto); font-weight: 700; }

/* Afiliados (cliente) — layout novo */
html.rg .rg-af .rg-qt-sub b { color: var(--rg-lima-texto); }
html.rg .rg-af-link { display: grid; grid-template-columns: minmax(0, 1.4fr) auto; gap: 14px; align-items: end; padding: 18px; border-radius: 20px; background: radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--rg-lima) 16%, transparent), transparent 60%), var(--rg-surface); border: 1px solid color-mix(in srgb, var(--rg-lima) 35%, transparent); }
html.rg .rg-af-link-txt b { display: block; margin-bottom: 8px; color: #fff; }
html.rg .rg-af-link-txt b i { color: var(--rg-lima-texto); margin-right: 4px; }
html.rg .rg-af-share { display: flex; gap: 6px; flex-wrap: wrap; }
html.rg .rg-af-share a { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; border-radius: 12px; font-weight: 800; font-size: .86rem; color: #fff !important; text-decoration: none !important; white-space: nowrap; }
html.rg .rg-af-share .zap { background: #25d366; }
html.rg .rg-af-share .face { background: #1877f2; }
html.rg .rg-af-share .x { background: #111; border: 1px solid var(--rg-line); }
html.rg .rg-af-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-af-kpis .rg-tb-num b { font-size: 1.2rem; }
html.rg .rg-af-nivel { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 22px; align-items: center; }
html.rg .rg-af-anel { width: 136px; height: 136px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--rg-gold) calc(var(--p) * 1%), rgba(255,255,255,.08) 0); }
html.rg .rg-af-anel > div { width: 110px; height: 110px; border-radius: 50%; display: grid; place-items: center; align-content: center; background: var(--rg-surface); text-align: center; }
html.rg .rg-af-anel b { color: #fff; font-size: 2rem; line-height: 1; font-weight: 900; }
html.rg .rg-af-anel b small { color: var(--rg-ink-3); font-size: .9rem; }
html.rg .rg-af-anel span { color: var(--rg-gold); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
html.rg .rg-af-nivel-txt h2 { margin: 2px 0 4px; color: #fff; font-size: 1.4rem; font-weight: 900; }
html.rg .rg-af-nivel-txt p { margin: 0; color: var(--rg-ink-2); }
html.rg .rg-af-nivel-txt p b { color: var(--rg-gold); }
html.rg .rg-af-estrelas { display: flex; gap: 6px; margin: 14px 0; flex-wrap: wrap; }
html.rg .rg-af-estrelas span { flex: 1 1 60px; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 4px; border-radius: 12px; background: rgba(255,255,255,.04); border: 1px solid var(--rg-line); color: var(--rg-ink-3); }
html.rg .rg-af-estrelas span i { font-size: 1.2rem; color: rgba(255,255,255,.2); }
html.rg .rg-af-estrelas span small { font-size: .68rem; font-weight: 700; white-space: nowrap; }
html.rg .rg-af-estrelas span.ok { border-color: color-mix(in srgb, var(--rg-gold) 50%, transparent); background: color-mix(in srgb, var(--rg-gold) 10%, transparent); }
html.rg .rg-af-estrelas span.ok i { color: var(--rg-gold); text-shadow: 0 0 10px rgba(245, 197, 66, .6); }
html.rg .rg-af-estrelas span.prox { border-style: dashed; border-color: var(--rg-gold); }
html.rg .rg-af-nivel-acoes { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
html.rg .rg-af-atual { color: var(--rg-good); font-size: .86rem; font-weight: 700; }
html.rg .rg-af-premio { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 18px; background: linear-gradient(135deg, color-mix(in srgb, var(--rg-good) 22%, var(--rg-surface)), var(--rg-surface)); border: 1px solid color-mix(in srgb, var(--rg-good) 45%, transparent); color: inherit; text-decoration: none !important; }
html.rg .rg-af-premio > span { font-size: 1.8rem; }
html.rg .rg-af-premio div { flex: 1; min-width: 0; }
html.rg .rg-af-premio b { display: block; color: #fff; }
html.rg .rg-af-premio small { color: var(--rg-ink-2); }
html.rg .rg-af-premio em { flex: none; font-style: normal; font-weight: 800; color: var(--rg-good); }
html.rg .rg-af-rec summary, html.rg .rg-af-faq summary { color: #fff; font-weight: 800; cursor: pointer; }
html.rg .rg-af-rec summary i { color: var(--rg-violeta); margin-right: 6px; }
html.rg .rg-af-rec-corpo { margin-top: 12px; }
html.rg .rg-af-abas { flex-wrap: nowrap; }
html.rg .rg-af-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
html.rg .rg-af-lista li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--rg-line); }
html.rg .rg-af-av { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.08); color: var(--rg-ink-2); font-weight: 900; }
html.rg .rg-af-av.on { background: color-mix(in srgb, var(--rg-good) 20%, transparent); color: var(--rg-good); }
html.rg .rg-af-pessoa { flex: 1; min-width: 0; }
html.rg .rg-af-pessoa b { display: block; color: #fff; overflow-wrap: anywhere; }
html.rg .rg-af-pessoa small { color: var(--rg-ink-3); font-size: .78rem; overflow-wrap: anywhere; }
html.rg .rg-af-nums { flex: none; display: flex; align-items: center; gap: 12px; }
html.rg .rg-af-nums small { display: block; color: var(--rg-ink-3); font-size: .68rem; font-weight: 700; }
html.rg .rg-af-nums b { color: #fff; white-space: nowrap; }
html.rg .rg-af-nums b.verde { color: var(--rg-good); }
html.rg .rg-af-on { --cor: var(--rg-good); }
html.rg .rg-af-duplo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
html.rg .rg-af-graf { position: relative; height: 240px; }
html.rg .rg-af-hist { min-width: 0; }
html.rg .rg-af-hist .card { background: var(--rg-surface) !important; border: 1px solid var(--rg-line) !important; border-radius: 18px !important; height: 100%; }
html.rg .rg-af-faq details { padding: 12px 0; border-top: 1px solid var(--rg-line); }
html.rg .rg-af-faq details:first-of-type { border-top: 0; }
html.rg .rg-af-faq p { margin: 8px 0 0; color: var(--rg-ink-2); }
html.rg .rg-af-niveis { list-style: none; margin: 0; padding: 14px 18px; display: grid; gap: 10px; overflow-y: auto; }
html.rg .rg-af-niveis li { display: flex; gap: 12px; padding: 12px; border-radius: 14px; background: rgba(255,255,255,.03); border: 1px solid var(--rg-line); }
html.rg .rg-af-niveis li.ok { border-color: color-mix(in srgb, var(--rg-gold) 45%, transparent); }
html.rg .rg-af-niveis-ic { flex: none; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.07); color: var(--rg-ink-3); }
html.rg .rg-af-niveis li.ok .rg-af-niveis-ic { background: var(--rg-gold); color: #2a1a00; }
html.rg .rg-af-niveis b { color: #fff; }
html.rg .rg-af-niveis b em { margin-left: 6px; font-style: normal; font-size: .7rem; color: var(--rg-gold); text-transform: uppercase; }
html.rg .rg-af-niveis small { display: block; color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-af-niveis p { margin: 6px 0 0; color: var(--rg-ink-2); font-size: .86rem; }
html.rg .rg-af-niveis p i { color: var(--rg-lima-texto); margin-right: 4px; }
@media (max-width: 991px) { html.rg .rg-af-link { grid-template-columns: minmax(0, 1fr); } html.rg .rg-af-duplo { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
    html.rg .rg-af-kpis { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
    html.rg .rg-af-share a { flex: 1; justify-content: center; }
    html.rg .rg-af-nivel { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
    html.rg .rg-af-nivel-txt { width: 100%; }
    html.rg .rg-af-nivel-acoes { justify-content: center; }
    html.rg .rg-af-lista li { flex-wrap: wrap; }
    html.rg .rg-af-pessoa { flex-basis: calc(100% - 52px); }
    html.rg .rg-af-nums { flex-basis: 100%; justify-content: space-between; padding-left: 52px; }
    html.rg .rg-af-premio { flex-wrap: wrap; }
}
@media (max-width: 359px) { html.rg .rg-af-share a { flex-basis: 100%; } html.rg .rg-af-nums { padding-left: 0; flex-wrap: wrap; } }
/* histórico de comissões (Livewire antigo) dentro da tela nova: a tabela rola por dentro em vez de alargar a página */
html.rg .rg-af-hist { overflow-x: auto; }
html.rg .rg-af-hist .card-body { overflow-x: auto; }
html.rg .rg-af-hist table { min-width: 0; }
/* popup de consultores (x-popups-consultores): no celular ficava mais largo que a tela */
html.rg #consultoresModal { box-sizing: border-box; max-width: 100vw; }
html.rg .x-popups-consultores-modal { box-sizing: border-box; max-width: calc(100vw - 24px); }
html.rg .x-popups-consultores-banner { max-width: 100%; height: auto; }
/* afiliados: cabeçalho dos indicados quebra em duas linhas no celular e as abas dividem a largura */
@media (max-width: 767px) {
    html.rg .rg-af .rg-vi-bloco > header { flex-wrap: wrap; }
    html.rg .rg-af-abas { display: flex; width: 100%; max-width: 100%; }
    html.rg .rg-af-abas a { flex: 1 1 0; min-width: 0; justify-content: center; padding: 8px 6px; font-size: .82rem; }
}
html.rg .rg-af-faq details, html.rg .rg-af-faq summary, html.rg .rg-af-faq p { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
html.rg .rg-af-faq { display: block !important; }
html.rg .rg-af-faq > header { margin-bottom: 6px; }

/* sorteios de hoje: miniatura da imagem da loteria */
html.rg .rg-sorteios .rg-sorteio-cor { width: 52px; height: 52px; border-radius: 12px; }
html.rg .rg-sorteios .rg-sorteio-cor img { object-fit: cover; }

/* menu lateral: cartão do nível e do próximo sorteio (revisão 2) */
html.rg .rg-sb-nivel { flex-direction: row; align-items: center; gap: 10px; padding: 10px 12px; background: linear-gradient(135deg, rgba(245, 197, 66, .14), #0e0726 65%); border-color: rgba(245, 197, 66, .35); }
html.rg .rg-sb-nivel-selo { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 35% 30%, #ffe28a, #f5c542 60%, #c8930f); color: #2a1a00; font-family: var(--rg-font-display) !important; font-weight: 900; font-size: .9rem; box-shadow: 0 0 0 3px rgba(245, 197, 66, .18), 0 4px 12px rgba(245, 197, 66, .3); }
html.rg .rg-sb-nivel-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
html.rg .rg-sb-nivel-info > b { color: #fff; font-size: .86rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-sb-nivel-info small { color: var(--rg-ink-2) !important; font-size: .66rem !important; line-height: 1.25; }
html.rg .rg-sb-nivel-info small b { color: var(--rg-gold); }

html.rg .rg-sb-prox a { gap: 10px; padding: 8px 8px 8px 8px; background: #0e0726; border: 1px solid rgba(240, 112, 90, .4); }
html.rg .rg-sb-prox-img { position: relative; flex: none; width: 46px; height: 46px; border-radius: 11px; overflow: hidden; background: rgba(255,255,255,.08); }
html.rg .rg-sb-prox-img img { width: 100%; height: 100%; object-fit: cover; }
html.rg .rg-sb-prox-img .rg-sb-prox-vivo { position: absolute; top: 4px; right: 4px; width: 9px; height: 9px; border: 2px solid #0e0726; }
html.rg .rg-sb-prox-txt { gap: 1px; }
html.rg .rg-sb-prox-txt small { color: var(--rg-ink-3) !important; font-size: .62rem !important; font-weight: 700; text-transform: none; letter-spacing: 0; }
html.rg .rg-sb-prox-nome { color: #fff !important; font-family: inherit !important; font-size: .82rem !important; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-sb-prox-txt b.rg-sb-prox-conta { color: var(--rg-coral); font-family: var(--rg-font-display) !important; font-size: .9rem; font-variant-numeric: tabular-nums; line-height: 1.1; }
html.rg .rg-sb-prox-jogar { align-self: center; padding: 8px 10px; border-radius: 10px; font-size: .74rem; }
/* Minha conta (cliente): filtro ativo tinha texto verde sobre fundo verde (cor global de links) */
html.rg .cliente-area .ca-filt { color: var(--rg-ink-2) !important; text-decoration: none !important; }
html.rg .cliente-area .ca-filt.on { color: #0a0e14 !important; }

/* =====================================================================
   TABELAS DE JOGOS do cliente (tables/index-rg)
   ===================================================================== */
html.rg .rg-tc-busca { margin: 0; }
html.rg .rg-tc-busca input { height: 46px; border-radius: 14px; }
html.rg .rg-tc-cats { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
html.rg .rg-tc-cats::-webkit-scrollbar { display: none; }
html.rg .rg-tc-cats a {
    flex: none; display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 999px; white-space: nowrap;
    background: var(--rg-surface); border: 1px solid var(--rg-line); color: var(--rg-ink-2) !important; font-weight: 700; font-size: .86rem; text-decoration: none;
}
html.rg .rg-tc-cats a:hover { border-color: var(--rg-ink-3); color: #fff !important; text-decoration: none; }
html.rg .rg-tc-cats a em { font-style: normal; padding: 1px 7px; border-radius: 999px; background: rgba(255,255,255,.08); font-size: .74rem; }
html.rg .rg-tc-cats a.ativo { background: var(--rg-lima); border-color: var(--rg-lima); color: var(--rg-on-lima) !important; }
html.rg .rg-tc-cats a.ativo em { background: rgba(0,0,0,.15); }
html.rg .rg-tc-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
html.rg .rg-tc-card { display: flex; flex-direction: column; min-width: 0; border-radius: 18px; overflow: hidden; background: var(--rg-surface); border: 1px solid var(--rg-line); transition: transform .15s, border-color .15s, box-shadow .15s; }
html.rg .rg-tc-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--rg-violeta) 55%, transparent); box-shadow: 0 12px 28px rgba(0,0,0,.3); }
html.rg .rg-tc-capa { position: relative; display: block; aspect-ratio: 3 / 4; background: linear-gradient(135deg, rgba(139,92,246,.18), rgba(255,255,255,.03)); overflow: hidden; }
html.rg .rg-tc-capa img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform .25s ease; }
html.rg .rg-tc-card:hover .rg-tc-capa img { transform: scale(1.03); }
html.rg .rg-tc-capa.sem .rg-tb-capa-vazia { display: flex; }
html.rg .rg-tc-lupa { position: absolute; right: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 999px; background: rgba(8,5,24,.78); color: #fff; font-size: .76rem; font-weight: 700; }
html.rg .rg-tc-acoes { display: flex; gap: 8px; padding: 10px 14px 14px; }
html.rg .rg-tc-baixar { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 12px; border-radius: 12px; background: var(--rg-lima); color: var(--rg-on-lima) !important; font-weight: 800; font-size: .88rem; text-decoration: none; }
html.rg .rg-tc-baixar:hover { filter: brightness(1.08); text-decoration: none; }
html.rg .rg-tc .rg-tb-meta small { display: inline-flex; align-items: center; gap: 5px; font-size: .76rem !important; }
html.rg .rg-tc .rg-tb-topo-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
html.rg .rg-tc-enviar { flex: none; width: 44px; border-radius: 12px; border: 1px solid color-mix(in srgb, #25d366 45%, transparent); background: color-mix(in srgb, #25d366 14%, transparent); color: #25d366; font-size: 1.15rem; cursor: pointer; }
html.rg .rg-tc-enviar:hover { background: #25d366; color: #fff; }
@media (max-width: 767px) {
    html.rg .rg-tc-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    html.rg .rg-tc-acoes { padding: 8px 10px 10px; gap: 6px; }
    html.rg .rg-tc-baixar { padding: 9px 6px; font-size: .8rem; }
    html.rg .rg-tc-enviar { width: 38px; }
    html.rg .rg-tc-lupa { right: 6px; bottom: 6px; padding: 4px 8px; font-size: .68rem; }
}

/* =====================================================================
   JOGO AVULSO — Venda Rápida (site/venda-rapida/layout + livewire landing)
   Só visual: a página tem CSS próprio (tema claro da banca); aqui vira o tema escuro gamificado.
   ===================================================================== */
html.rg .vr-pagina { background: radial-gradient(ellipse 90% 45% at 50% -10%, rgba(139, 92, 246, .28), transparent), var(--rg-bg) !important; color: var(--rg-ink); font-family: var(--rg-font) !important; }
html.rg .vr-pagina .shell { background: transparent; }
html.rg .vr-pagina .header { background: rgba(15, 8, 40, .82); border-bottom: 1px solid var(--rg-line); backdrop-filter: blur(10px); }
html.rg .vr-pagina .back-btn { color: #fff; background: var(--rg-surface); border: 1px solid var(--rg-line); margin-left: 0; }
html.rg .vr-pagina .step-dot { background: var(--rg-line-2) !important; }
html.rg .vr-pagina .step-dot[style*="brand-purple"] { background: var(--rg-lima) !important; box-shadow: 0 0 8px color-mix(in srgb, var(--rg-lima) 50%, transparent); }
html.rg .vr-pagina .h1 { color: #fff; font-family: var(--rg-font-display) !important; font-weight: 800; letter-spacing: -.01em; }
html.rg .vr-pagina .sub, html.rg .vr-pagina .muted, html.rg .vr-pagina .field-hint { color: var(--rg-ink-3); }
html.rg .vr-pagina .main > .center > p { color: var(--rg-lima-texto) !important; }
html.rg .vr-pagina .field-label { color: var(--rg-ink-2); font-weight: 700; }
html.rg .vr-pagina .card { background: var(--rg-surface); border: 1px solid var(--rg-line); box-shadow: var(--rg-shadow); color: #fff; }
html.rg .vr-pagina .card p[style*="font-weight:700"] { color: #fff; }

/* prêmio em destaque */
html.rg .vr-pagina .vr-sticky-prize { background: transparent; }
html.rg .vr-pagina .prize-banner { position: relative; overflow: hidden; background: linear-gradient(135deg, #7c3aed, #c026d3); box-shadow: 0 14px 34px -12px rgba(192, 38, 211, .6); }
html.rg .vr-pagina .prize-banner::after { content: ""; position: absolute; right: -30px; top: -30px; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle, rgba(245, 197, 66, .35), transparent 70%); pointer-events: none; }
html.rg .vr-pagina .prize-label { opacity: 1; color: rgba(255, 255, 255, .85); }
html.rg .vr-pagina .prize-value { color: #fff; font-family: var(--rg-font-display) !important; text-shadow: 0 2px 12px rgba(0, 0, 0, .25); }
html.rg .vr-pagina p.prize-value { font-size: clamp(1.9rem, 8.5vw, 2.6rem); }
html.rg .vr-pagina .vr-sticky-prize p.prize-value { font-size: clamp(1.5rem, 7vw, 1.9rem); }
html.rg .vr-pagina p.prize-label { font-size: .72rem; }
html.rg .vr-pagina p.prize-note { font-size: .78rem; }
html.rg .vr-pagina .prize-note { color: var(--rg-gold); opacity: 1; font-weight: 600; }
html.rg .vr-pagina .prize-note + .prize-note { color: rgba(255, 255, 255, .8); font-weight: 500; }

/* campos */
html.rg .vr-pagina .input { background: var(--rg-surface-2) !important; border: 2px solid var(--rg-line-2) !important; color: #fff !important; border-radius: 16px; }
html.rg .vr-pagina .input::placeholder { color: var(--rg-ink-3); opacity: .8; }
html.rg .vr-pagina .input:focus { border-color: var(--rg-lima) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 15%, transparent) !important; }
html.rg .vr-pagina .bet-prefix { color: var(--rg-ink-3); }
html.rg .vr-pagina .bet-input { font-family: var(--rg-font-display) !important; font-size: 1.3rem; }
html.rg .vr-pagina .vr-select { background-image: linear-gradient(45deg, transparent 50%, var(--rg-lima) 50%), linear-gradient(135deg, var(--rg-lima) 50%, transparent 50%) !important; }
html.rg .vr-pagina .vr-select option { background: var(--rg-surface-2); color: #fff; }
html.rg .vr-pagina .pw-toggle { color: var(--rg-lima-texto); }
html.rg .vr-pagina .error { color: var(--rg-coral); font-weight: 600; }
html.rg .vr-pagina .cap-note { color: var(--rg-gold); }

/* valores rápidos */
html.rg .vr-pagina .chip { background: var(--rg-surface-2); border: 2px solid var(--rg-line-2); color: #fff; font-family: var(--rg-font-display) !important; font-weight: 800; height: 44px; white-space: nowrap; font-size: clamp(.72rem, 3.3vw, .9rem); padding: 0 4px; }
html.rg .vr-pagina .chips { gap: 6px; }
html.rg .vr-pagina .chip { min-width: 0; }
html.rg .vr-pagina .chip.active { background: var(--rg-gold); border-color: var(--rg-gold); color: var(--rg-tinta); }

/* surpresinha */
html.rg .vr-pagina .vr-surpresinha { background: color-mix(in srgb, var(--rg-rosa) 8%, transparent); border: 1.5px dashed color-mix(in srgb, var(--rg-rosa) 55%, transparent); border-radius: 18px; }
html.rg .vr-pagina .vr-surpresinha-title { color: var(--rg-rosa); }
html.rg .vr-pagina .vr-qty-btn { background: var(--rg-surface-2); border: 2px solid var(--rg-line-2); color: var(--rg-ink-2); font-family: var(--rg-font-display) !important; border-radius: 12px; }
html.rg .vr-pagina .vr-qty-btn:hover { border-color: var(--rg-rosa); color: #fff; background: var(--rg-surface-2); }
html.rg .vr-pagina .vr-qty-btn.active { border-color: var(--rg-gold); color: var(--rg-gold); background: rgba(245, 197, 66, .12); }

/* cartela em bolinhas (mesmo desenho da tela de jogo nova) */
html.rg .vr-pagina .num-grid { gap: 10px; }
html.rg .vr-pagina .number-cell {
    border-radius: 50%; border: 2px solid var(--rg-line-2); background: var(--rg-surface-2); color: #fff;
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: 1.1rem;
    transition: transform .12s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
html.rg .vr-pagina .number-cell::before, html.rg .vr-pagina .number-cell::after { display: none !important; }
html.rg .vr-pagina .number-cell:hover:not(:disabled) { border-color: var(--rg-lima); }
html.rg .vr-pagina .number-cell.active {
    background: radial-gradient(circle at 35% 30%, var(--rg-lima-claro), var(--rg-lima) 55%, var(--rg-lima-escuro)); border-color: transparent; color: var(--rg-on-lima);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--rg-lima) 35%, transparent), inset 0 -3px 0 rgba(0, 0, 0, .15);
    animation: rg-pop .3s cubic-bezier(.2, 1.4, .4, 1) both;
}
html.rg .vr-pagina .number-cell:disabled { opacity: .3; }

/* botões */
html.rg .vr-pagina .btn-cta, html.rg .vr-pagina .btn-cta-blue {
    background: var(--rg-lima) !important; background-image: none !important; color: var(--rg-on-lima) !important;
    font-family: var(--rg-font-display) !important; font-weight: 800; letter-spacing: .02em; border-radius: 16px;
    box-shadow: 0 10px 28px -8px color-mix(in srgb, var(--rg-lima) 55%, transparent);
}
html.rg .vr-pagina .btn-cta .spin, html.rg .vr-pagina .btn-cta-blue .spin { border-color: rgba(20, 16, 46, .3); border-top-color: var(--rg-tinta); }
html.rg .vr-pagina .btn-outline { background: transparent; border: 2px solid var(--rg-line-2); color: #fff; }
html.rg .vr-pagina .btn-outline:hover { border-color: var(--rg-lima); color: var(--rg-lima-texto); }
html.rg .vr-pagina .btn-link { color: var(--rg-lima-texto); }
html.rg .vr-pagina .sticky-footer { background: linear-gradient(to top, var(--rg-bg) 0%, var(--rg-bg) 62%, rgba(15, 8, 40, 0) 100%); }

/* dados: resumo */
html.rg .vr-pagina .summary-tile.pay { background: var(--rg-surface-2); }
html.rg .vr-pagina .summary-tile.pay .label { color: var(--rg-ink-3); }
html.rg .vr-pagina .summary-tile.pay .value { color: #fff; }
html.rg .vr-pagina .summary-tile.prize { background-image: linear-gradient(135deg, #7c3aed, #c026d3); }
html.rg .vr-pagina .summary-tile .value { font-family: var(--rg-font-display) !important; font-size: clamp(1.05rem, 4.6vw, 1.4rem); overflow-wrap: anywhere; }
html.rg .vr-pagina .security { color: var(--rg-ink-3); }
html.rg .vr-pagina .security svg { color: var(--rg-good); }

/* pagamento */
html.rg .vr-pagina .card > p[style*="font-size:36px"] { color: var(--rg-lima-texto) !important; font-family: var(--rg-font-display) !important; }
html.rg .vr-pagina .card .between > span:first-child { color: var(--rg-ink-3) !important; }
html.rg .vr-pagina .tag { background: color-mix(in srgb, var(--rg-violeta) 22%, transparent); color: #d9ccff; }
html.rg .vr-pagina .qr-box { border: 0; box-shadow: 0 0 0 6px color-mix(in srgb, var(--rg-lima) 18%, transparent); }
html.rg .vr-pagina .pix-copy { background: var(--rg-surface-2); border: 1.5px dashed color-mix(in srgb, var(--rg-lima) 50%, transparent); }
html.rg .vr-pagina .pix-copy .title { color: var(--rg-ink-3); }
html.rg .vr-pagina .pix-copy .code { color: #fff; }
html.rg .vr-pagina .pix-copy .action { color: var(--rg-lima-texto); }
html.rg .vr-pagina .list-steps { color: var(--rg-ink-2); }
html.rg .vr-pagina .list-steps li { padding: 10px 14px; border-radius: 12px; background: var(--rg-surface); border: 1px solid var(--rg-line); }

/* confirmação e meus jogos */
html.rg .vr-pagina .check-circle { background: var(--rg-lima); color: var(--rg-on-lima); box-shadow: 0 0 0 10px color-mix(in srgb, var(--rg-lima) 14%, transparent), 0 12px 30px -8px color-mix(in srgb, var(--rg-lima) 60%, transparent); animation: rg-pop .5s cubic-bezier(.2, 1.4, .4, 1) both; }
html.rg .vr-pagina .dezena-chip { border-radius: 50%; background: radial-gradient(circle at 35% 30%, var(--rg-lima-claro), var(--rg-lima) 55%, var(--rg-lima-escuro)); color: var(--rg-on-lima); font-family: var(--rg-font-display) !important; font-weight: 800; }
html.rg .vr-pagina .row .l { color: var(--rg-ink-3); }
html.rg .vr-pagina .row .v { color: #fff; }
html.rg .vr-pagina .card .v[style*="brand-magenta"], html.rg .vr-pagina .row .v[style*="brand-magenta"] { color: var(--rg-good) !important; }
html.rg .vr-pagina hr, html.rg .vr-pagina .dashed { border-color: var(--rg-line-2); }
html.rg .vr-pagina .vr-collapse-head span[style*="brand-purple"], html.rg .vr-pagina .vr-collapse-chevron { color: var(--rg-lima-texto) !important; }
html.rg .vr-pagina .card > p[style*="text-transform:uppercase"], html.rg .vr-pagina .main > p[style*="text-transform:uppercase"] { color: var(--rg-ink-3) !important; }

/* aviso flutuante */
html.rg .vr-pagina .notice span { background: var(--rg-lima); color: var(--rg-on-lima); font-weight: 800; }
html.rg .vr-pagina :focus-visible { outline-color: var(--rg-lima); }

/* boas-vindas do link mágico (site/avulso-magic-welcome) */
html.rg .vr-boas-vindas { background: radial-gradient(ellipse 80% 50% at 50% -20%, rgba(139, 92, 246, .3), transparent), var(--rg-bg) !important; font-family: var(--rg-font) !important; }
html.rg .vr-boas-vindas .card { background: var(--rg-surface); border-color: var(--rg-line); box-shadow: var(--rg-shadow-lg); }
html.rg .vr-boas-vindas h1 { color: #fff; font-family: var(--rg-font-display) !important; }
html.rg .vr-boas-vindas .name { color: var(--rg-lima-texto); }
html.rg .vr-boas-vindas .lead, html.rg .vr-boas-vindas .fine { color: var(--rg-ink-3); }
html.rg .vr-boas-vindas .btn-enter { background: var(--rg-lima); color: var(--rg-on-lima); font-family: var(--rg-font-display) !important; font-weight: 800; border-radius: 16px; box-shadow: 0 10px 28px -8px color-mix(in srgb, var(--rg-lima) 55%, transparent); }

/* =====================================================================
   Usuários — lista e edição (layout novo)
   ===================================================================== */
/* cores por função */
html.rg .rg-us-cor-adm { color: var(--rg-rosa); }
html.rg .rg-us-cor-ger { color: var(--rg-gold); }
html.rg .rg-us-cor-con { color: var(--rg-sky); }
html.rg .rg-us-cor-cli { color: var(--rg-lima-texto); }
html.rg .rg-us-cor-out { color: var(--rg-violeta); }
html.rg .rg-us-cor-sem { color: var(--rg-ink-3); }
html.rg .rg-tc-cats a.ativo i { color: inherit; }
html.rg .rg-us { --rg-us-tom: var(--rg-ink-3); }
html.rg .rg-us-tom-adm { --rg-us-tom: var(--rg-rosa); }
html.rg .rg-us-tom-ger { --rg-us-tom: var(--rg-gold); }
html.rg .rg-us-tom-con { --rg-us-tom: var(--rg-sky); }
html.rg .rg-us-tom-cli { --rg-us-tom: var(--rg-lima); }
html.rg .rg-us-tom-out { --rg-us-tom: var(--rg-violeta); }
html.rg .rg-us-tom-sem { --rg-us-tom: var(--rg-ink-3); }

html.rg .rg-us-filtros { grid-template-columns: minmax(0, 1fr) minmax(150px, 220px); }
html.rg .rg-us-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
html.rg .rg-us-lista li { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 16px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-left: 4px solid var(--rg-us-tom); min-width: 0; }
html.rg .rg-us-lista li.bloqueado { background: color-mix(in srgb, var(--rg-coral) 7%, var(--rg-surface)); }
html.rg .rg-us-avatar { position: relative; flex: none; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: color-mix(in srgb, var(--rg-us-tom) 18%, transparent); border: 2px solid var(--rg-us-tom); color: #fff; font-weight: 900; font-size: .95rem; letter-spacing: .02em; }
html.rg .rg-us-avatar i { position: absolute; right: -4px; bottom: -4px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: var(--rg-coral); color: #fff; font-size: .6rem; }
html.rg .rg-us-avatar.grande { width: 68px; height: 68px; font-size: 1.4rem; }
html.rg .rg-us-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
html.rg .rg-us-nome { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
html.rg .rg-us-nome b { color: #fff; font-size: 1rem; overflow-wrap: anywhere; margin-right: 2px; }
html.rg .rg-us-funcao { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 999px; font-size: .72rem; font-weight: 800; white-space: nowrap; background: color-mix(in srgb, var(--rg-ink-3) 16%, transparent); color: var(--rg-ink-2); border: 1px solid color-mix(in srgb, var(--rg-ink-3) 30%, transparent); }
html.rg .rg-us-funcao i { font-size: .66rem; }
html.rg .rg-us-funcao-adm { background: color-mix(in srgb, var(--rg-rosa) 16%, transparent); color: #ffb3d3; border-color: color-mix(in srgb, var(--rg-rosa) 45%, transparent); }
html.rg .rg-us-funcao-ger { background: color-mix(in srgb, var(--rg-gold) 15%, transparent); color: var(--rg-gold); border-color: color-mix(in srgb, var(--rg-gold) 45%, transparent); }
html.rg .rg-us-funcao-con { background: color-mix(in srgb, var(--rg-sky) 15%, transparent); color: var(--rg-sky); border-color: color-mix(in srgb, var(--rg-sky) 45%, transparent); }
html.rg .rg-us-funcao-cli { background: color-mix(in srgb, var(--rg-lima) 13%, transparent); color: var(--rg-lima-texto); border-color: color-mix(in srgb, var(--rg-lima) 40%, transparent); }
html.rg .rg-us-funcao-out { background: color-mix(in srgb, var(--rg-violeta) 18%, transparent); color: #c9b5ff; border-color: color-mix(in srgb, var(--rg-violeta) 45%, transparent); }
html.rg .rg-us-bloq { background: color-mix(in srgb, var(--rg-coral) 18%, transparent); color: #ffb4a6; border-color: color-mix(in srgb, var(--rg-coral) 50%, transparent); }
html.rg .rg-us-ativo { background: color-mix(in srgb, var(--rg-good) 14%, transparent); color: var(--rg-good); border-color: color-mix(in srgb, var(--rg-good) 40%, transparent); }
html.rg .rg-us-contato, html.rg .rg-us-meta { display: flex; flex-wrap: wrap; gap: 2px 14px; color: var(--rg-ink-2); font-size: .82rem; min-width: 0; }
html.rg .rg-us-contato span, html.rg .rg-us-meta span { overflow-wrap: anywhere; min-width: 0; }
html.rg .rg-us-contato i, html.rg .rg-us-meta i { color: var(--rg-ink-3); margin-right: 3px; }
html.rg .rg-us-meta { color: var(--rg-ink-3); font-size: .76rem; }
html.rg .rg-us-saldo { flex: none; text-align: right; min-width: 96px; }
html.rg .rg-us-saldo small { display: block; color: var(--rg-ink-3); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }
html.rg .rg-us-saldo b { color: var(--rg-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
html.rg .rg-us-saldo b.tem { color: var(--rg-lima-texto); }
html.rg .rg-us-acoes { flex: none; display: flex; gap: 6px; }
html.rg .rg-us-acoes form { margin: 0; }
html.rg .rg-us-acoes .rg-tb-editar { padding: 9px 16px; }
@media (max-width: 767px) {
    html.rg .rg-us-filtros { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-us-lista li { flex-wrap: wrap; gap: 10px 12px; }
    html.rg .rg-us-info { flex-basis: calc(100% - 60px); }
    html.rg .rg-us-saldo { order: 3; flex: 1; text-align: left; display: flex; align-items: baseline; gap: 6px; min-width: 0; }
    html.rg .rg-us-saldo small { display: inline; }
    html.rg .rg-us-acoes { order: 4; }
}
@media (max-width: 379px) {
    html.rg .rg-us-acoes { flex-basis: 100%; }
    html.rg .rg-us-acoes .rg-tb-editar { flex: 1; }
    html.rg .rg-us-avatar { width: 40px; height: 40px; font-size: .85rem; }
    html.rg .rg-us-info { flex-basis: calc(100% - 54px); }
}

/* edição: ficha do usuário */
html.rg .rg-ue { padding-top: 12px; }
html.rg .rg-ue-ficha { position: relative; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 16px 22px; align-items: center; margin-bottom: 16px; padding: 18px 20px; border-radius: 22px; border: 1px solid var(--rg-line); border-top: 4px solid var(--rg-us-tom); background: radial-gradient(520px 220px at 0% 0%, color-mix(in srgb, var(--rg-us-tom) 16%, transparent), transparent 70%), var(--rg-surface); }
html.rg .rg-ue-voltar { grid-column: 1 / -1; justify-self: start; color: var(--rg-ink-3) !important; font-weight: 700; font-size: .85rem; text-decoration: none !important; }
html.rg .rg-ue-voltar:hover { color: #fff !important; }
html.rg .rg-ue-quem { display: flex; align-items: center; gap: 16px; min-width: 0; }
html.rg .rg-ue-nome { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
html.rg .rg-ue-nome h1 { margin: 0; color: #fff; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.35rem, 1.05rem + 1.2vw, 1.9rem); line-height: 1.1; overflow-wrap: anywhere; }
html.rg .rg-ue-nums { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
html.rg .rg-ue-nums > div { padding: 10px 12px; border-radius: 14px; background: var(--rg-surface-2); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-ue-nums small { display: block; color: var(--rg-ink-3); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }
html.rg .rg-ue-nums b, html.rg .rg-ue-nums a { display: block; color: #fff; font-weight: 800; overflow-wrap: anywhere; }
html.rg .rg-ue-nums b.lima { color: var(--rg-lima-texto); font-size: 1.15rem; }
html.rg .rg-ue-nums b.apagado { color: var(--rg-ink-3); }
html.rg .rg-ue-nums a { color: var(--rg-sky) !important; }
html.rg .rg-ue-acoes { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; }
html.rg .rg-ue-acoes:empty { display: none; }
@media (max-width: 991px) { html.rg .rg-ue-ficha { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575px) {
    html.rg .rg-ue-ficha { padding: 14px; }
    html.rg .rg-ue-quem { align-items: flex-start; gap: 12px; }
    html.rg .rg-us-avatar.grande { width: 52px; height: 52px; font-size: 1.1rem; }
    html.rg .rg-ue-acoes .rg-ex-btn { flex: 1 1 100%; justify-content: center; }
}

/* edição: avisos e grupo de consultor */
html.rg .rg-ue .alert-warning { border-radius: 16px; background: color-mix(in srgb, var(--rg-coral) 12%, var(--rg-surface)); border: 1px solid color-mix(in srgb, var(--rg-coral) 45%, transparent); color: #fff; }
html.rg .rg-ue .alert-info { border-radius: 16px; background: color-mix(in srgb, var(--rg-sky) 10%, var(--rg-surface)); border: 1px solid color-mix(in srgb, var(--rg-sky) 40%, transparent); color: #fff; }
html.rg .rg-ue-grupo { padding: 14px 18px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-ue-grupo > div > .d-flex.justify-content-between h6 { color: #fff !important; }
html.rg .rg-ue-grupo > div > .d-flex.justify-content-between h6 i { color: var(--rg-violeta) !important; }
html.rg .rg-ue-grupo > div > .d-flex.justify-content-between > div:first-child > div { color: var(--rg-ink-2) !important; }
html.rg .rg-ue-grupo > div > .d-flex.justify-content-between .btn[style] { background: transparent !important; color: var(--rg-ink-2) !important; border-color: var(--rg-line-2) !important; }

/* edição: abas e formulário */
html.rg .rg-ue #nav-tab { display: flex; flex-wrap: nowrap !important; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 5px; border: 1px solid var(--rg-line) !important; border-radius: 14px; background: var(--rg-surface); }
html.rg .rg-ue #nav-tab::-webkit-scrollbar { display: none; }
html.rg .rg-ue #nav-tab .nav-link { flex: none; margin: 0 !important; padding: 8px 14px; border: 0 !important; border-radius: 10px; background: transparent; color: var(--rg-ink-2) !important; font-weight: 700; white-space: nowrap; }
html.rg .rg-ue #nav-tab .nav-link.active { background: var(--rg-lima) !important; color: var(--rg-on-lima) !important; }
html.rg .rg-ue .card { border-radius: 18px; }
html.rg .rg-ue .card.pb-5 { padding-bottom: 8px !important; }
html.rg .rg-ue .card-header .card-title { font-family: var(--rg-font-display) !important; font-weight: 800; }
html.rg .rg-ue label { color: var(--rg-ink-2); font-weight: 700; font-size: .85rem; }
html.rg .rg-ue .form-text.text-muted { color: var(--rg-ink-3) !important; font-size: .78rem; }
html.rg .rg-ue .form-text code { color: var(--rg-lima-texto); }
html.rg .rg-ue .text-warning.small { color: var(--rg-gold) !important; }
html.rg .rg-ue h5.text-info { color: var(--rg-sky) !important; font-size: 1rem; }

/* funções viram cartões de escolha */
html.rg .rg-ue .card-secondary .form-group { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; margin: 0; }
html.rg .rg-ue .card-secondary .custom-control { padding: 0; margin: 0; min-height: 0; }
html.rg .rg-ue .card-secondary .custom-control-label { display: flex; align-items: center; gap: 10px; width: 100%; padding: 11px 14px; border-radius: 12px; background: var(--rg-surface-2); border: 1px solid var(--rg-line); color: #fff; font-weight: 700; cursor: pointer; transition: border-color .15s, background .15s; }
html.rg .rg-ue .card-secondary .custom-control-label::before { position: static; flex: none; width: 18px; height: 18px; border-radius: 50%; background: transparent; border: 2px solid var(--rg-ink-3); box-shadow: none !important; }
html.rg .rg-ue .card-secondary .custom-control-label::after { display: none; }
html.rg .rg-ue .card-secondary .custom-control-label:hover { border-color: var(--rg-ink-3); }
html.rg .rg-ue .card-secondary .custom-control-input:checked ~ .custom-control-label { background: color-mix(in srgb, var(--rg-lima) 14%, var(--rg-surface-2)); border-color: var(--rg-lima); }
html.rg .rg-ue .card-secondary .custom-control-input:checked ~ .custom-control-label::before { background: var(--rg-lima); border-color: var(--rg-lima); box-shadow: inset 0 0 0 3px var(--rg-surface-2) !important; }
html.rg .rg-ue .card-secondary .custom-control-input:focus-visible ~ .custom-control-label { outline: 2px solid var(--rg-lima); outline-offset: 2px; }

/* edição: botões do rodapé ("Entrar como" já fica na ficha do topo) */
html.rg .rg-ue form button[type="submit"].btn-outline-success { background: var(--rg-lima) !important; border-color: var(--rg-lima) !important; color: var(--rg-on-lima) !important; padding: 12px; }
html.rg .rg-ue form a > .btn-outline-secondary { padding: 12px; }
html.rg .rg-ue form a.btn-outline-info[href*="login-as"] { display: none; }
html.rg .rg-ue .card-body .row.no-gutters .btn-block { white-space: normal; line-height: 1.2; padding: 10px 8px; }

/* Volume de recarga (layout novo) */
html.rg .rg-rv-filtros { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
html.rg .rg-rv-filtros .rg-ex-periodos { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
html.rg .rg-rv-filtros .rg-ex-periodos button { white-space: nowrap; }
html.rg .rg-rv-datas { display: flex; align-items: center; gap: 8px; }
html.rg .rg-rv-datas.d-none { display: none !important; }
html.rg .rg-rv-datas .form-control { width: 140px; }
html.rg .rg-rv-datas span { color: var(--rg-ink-3); }
html.rg .rg-rv-nums { display: grid; grid-template-columns: 1.4fr repeat(4, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-rv-nums > div { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-rv-nums small { color: var(--rg-ink-3); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
html.rg .rg-rv-nums small i { color: var(--rg-violeta); margin-right: 3px; }
html.rg .rg-rv-nums b { color: #fff; font-size: 1.4rem; line-height: 1.15; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
html.rg .rg-rv-nums b.apagado { color: var(--rg-ink-3); font-size: 1rem; }
html.rg .rg-rv-nums b.bom { color: var(--rg-good); }
html.rg .rg-rv-nums b.ruim { color: var(--rg-coral); }
html.rg .rg-rv-nums span { color: var(--rg-ink-3); font-size: .78rem; }
html.rg .rg-rv-nums .destaque { background: radial-gradient(400px 180px at 0% 0%, color-mix(in srgb, var(--rg-lima) 16%, transparent), transparent 70%), var(--rg-surface); }
html.rg .rg-rv-nums .destaque b { color: var(--rg-lima-texto); font-family: var(--rg-font-display) !important; font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2rem); }
html.rg .rg-rv-barra { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
html.rg .rg-rv-barra .rg-tc-cats { min-width: 0; }
html.rg .rg-rv-por { flex: none; display: flex; align-items: center; gap: 8px; margin: 0; color: var(--rg-ink-3); font-size: .85rem; }
html.rg .rg-rv-por select { width: 80px; }
html.rg .rg-rv-lista .rg-us-saldo small { white-space: nowrap; }
@media (max-width: 1199px) { html.rg .rg-rv-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); } html.rg .rg-rv-nums .destaque { grid-column: 1 / -1; } }
@media (max-width: 767px) {
    html.rg .rg-rv-barra { flex-wrap: wrap; }
    html.rg .rg-rv-barra .rg-tc-cats { flex-basis: 100%; }
    html.rg .rg-rv-datas { width: 100%; }
    html.rg .rg-rv-datas .form-control { flex: 1; width: auto; min-width: 0; }
    html.rg .rg-rv-nums b { font-size: 1.15rem; }
}

/* Minha conta do cliente (layout novo) */
html.rg .rg-ca-topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
html.rg .rg-ca-topo h1 { margin: 2px 0 0; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.1rem); color: #fff; overflow-wrap: anywhere; }
html.rg .rg-ca-consultor { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 14px; background: color-mix(in srgb, #25d366 12%, var(--rg-surface)); border: 1px solid color-mix(in srgb, #25d366 45%, transparent); color: #fff !important; text-decoration: none !important; font-weight: 800; min-width: 0; }
html.rg .rg-ca-consultor > i { font-size: 1.6rem; color: #25d366; }
html.rg .rg-ca-consultor small { display: block; color: var(--rg-ink-3); font-size: .72rem; font-weight: 700; }
html.rg .rg-ca-consultor:hover { border-color: #25d366; }
html.rg .rg-ca-saldo { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 20px 22px; border-radius: 22px; background: radial-gradient(420px 200px at 100% 0%, rgba(255,255,255,.35), transparent 70%), linear-gradient(135deg, #d8ff5c, var(--rg-lima) 55%, var(--rg-lima-escuro)); color: var(--rg-on-lima); box-shadow: 0 14px 34px -14px color-mix(in srgb, var(--rg-lima) 60%, transparent); }
html.rg .rg-ca-saldo small { display: block; font-weight: 900; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; opacity: .75; }
html.rg .rg-ca-saldo b { display: block; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(2rem, 1.5rem + 2vw, 2.8rem); line-height: 1.05; }
html.rg .rg-ca-saldo-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
html.rg .rg-ca-saldo-acoes a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 18px; border-radius: 14px; font-weight: 800; text-decoration: none !important; white-space: nowrap; }
html.rg .rg-ca-jogar { background: var(--rg-tinta); color: #fff !important; }
html.rg .rg-ca-recarregar { background: rgba(255, 255, 255, .45); color: var(--rg-tinta) !important; border: 1px solid rgba(20, 16, 46, .2); }
html.rg .rg-ca-saldo-acoes a:hover { filter: brightness(1.1); }
html.rg .rg-ca-resumo { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-ca-resumo > a { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 12px 14px; border-radius: 16px; background: var(--rg-surface); border: 1px solid var(--rg-line); min-width: 0; }
html.rg .rg-ca-resumo i { grid-row: 1 / 3; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 12px; background: color-mix(in srgb, var(--rg-violeta) 22%, transparent); color: #c9b5ff; }
html.rg .rg-ca-resumo b { color: #fff; font-size: 1.2rem; line-height: 1.1; overflow-wrap: anywhere; }
html.rg .rg-ca-resumo small { color: var(--rg-ink-3); font-size: .76rem; }
html.rg .rg-ca-resumo .espera i { background: color-mix(in srgb, var(--rg-warn) 20%, transparent); color: var(--rg-warn); }
html.rg .rg-ca-resumo .ganhou i { background: color-mix(in srgb, var(--rg-gold) 20%, transparent); color: var(--rg-gold); }
html.rg .rg-ca-listatopo { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
html.rg .rg-ca-listatopo h2 { margin: 0; color: #fff; font-size: 1.1rem; font-weight: 800; }
html.rg .rg-ca-listatopo h2 i { color: var(--rg-lima-texto); margin-right: 4px; }
html.rg .rg-ca-filtros { display: flex; gap: 4px; padding: 4px; border-radius: 14px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-ca-filtros a { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 10px; color: var(--rg-ink-2) !important; font-weight: 700; font-size: .88rem; text-decoration: none !important; white-space: nowrap; }
html.rg .rg-ca-filtros a.ativo { background: var(--rg-lima); color: var(--rg-on-lima) !important; }
html.rg .rg-ca-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
html.rg .rg-ca-lista li { --rg-ca-tom: var(--rg-ink-3); display: flex; align-items: center; gap: 14px; padding: 12px 16px; border-radius: 16px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-left: 4px solid var(--rg-ca-tom); min-width: 0; }
html.rg .rg-ca-lista li.rg-ca-win { --rg-ca-tom: var(--rg-lima); background: radial-gradient(300px 120px at 100% 50%, color-mix(in srgb, var(--rg-lima) 12%, transparent), transparent 70%), var(--rg-surface); }
html.rg .rg-ca-lista li.rg-ca-wait { --rg-ca-tom: var(--rg-warn); }
html.rg .rg-ca-lista li.rg-ca-draw { --rg-ca-tom: var(--rg-gold); }
html.rg .rg-ca-ico { flex: none; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: color-mix(in srgb, var(--rg-ca-tom) 16%, transparent); color: var(--rg-ca-tom); }
html.rg .rg-ca-info { flex: 1; min-width: 0; }
html.rg .rg-ca-info b { display: block; color: #fff; overflow-wrap: anywhere; }
html.rg .rg-ca-info small { color: var(--rg-ink-3); font-size: .8rem; }
html.rg .rg-ca-valor { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
html.rg .rg-ca-valor b { color: #fff; font-variant-numeric: tabular-nums; white-space: nowrap; }
html.rg .rg-ca-status { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px; font-size: .74rem; font-weight: 800; white-space: nowrap; background: color-mix(in srgb, var(--rg-ca-tom) 15%, transparent); color: var(--rg-ca-tom); border: 1px solid color-mix(in srgb, var(--rg-ca-tom) 40%, transparent); }
html.rg .rg-ca-done .rg-ca-status { color: var(--rg-ink-2); }
html.rg .rg-ca-paginas { display: flex; align-items: center; justify-content: center; gap: 12px; }
html.rg .rg-ca-paginas a { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 12px; border: 1px solid var(--rg-line-2); background: var(--rg-surface); color: var(--rg-lima-texto) !important; font-weight: 800; text-decoration: none !important; }
html.rg .rg-ca-paginas a.off { opacity: .4; pointer-events: none; color: var(--rg-ink-3) !important; }
html.rg .rg-ca-paginas span { color: var(--rg-ink-3); font-size: .85rem; font-weight: 700; }
@media (max-width: 991px) { html.rg .rg-ca-resumo { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) {
    html.rg .rg-ca-consultor { width: 100%; }
    html.rg .rg-ca-saldo { padding: 16px; }
    html.rg .rg-ca-saldo-acoes { width: 100%; }
    html.rg .rg-ca-saldo-acoes a { flex: 1; padding: 12px 10px; }
    html.rg .rg-ca-filtros { width: 100%; }
    html.rg .rg-ca-filtros a { flex: 1; justify-content: center; padding: 8px 6px; font-size: .8rem; }
    html.rg .rg-ca-filtros a i { display: none; }
    html.rg .rg-ca-lista li { flex-wrap: wrap; gap: 10px 12px; padding: 12px; }
    html.rg .rg-ca-info { flex-basis: calc(100% - 56px); }
    html.rg .rg-ca-valor { flex-basis: 100%; flex-direction: row; justify-content: space-between; align-items: center; padding-top: 8px; border-top: 1px solid var(--rg-line); }
    html.rg .rg-ca-resumo > a { padding: 10px; column-gap: 8px; }
    html.rg .rg-ca-resumo i { width: 30px; height: 30px; border-radius: 10px; font-size: .8rem; }
    html.rg .rg-ca-resumo b { font-size: 1rem; }
    html.rg .rg-ca-paginas a { padding: 9px 12px; }
}
html.rg .rg-ca-resumo > a { color: inherit; text-decoration: none !important; cursor: pointer; transition: border-color .15s, transform .15s; }
html.rg .rg-ca-resumo > a:hover { border-color: var(--rg-ink-3); transform: translateY(-1px); }
html.rg .rg-ca-resumo > a.ativo { border-color: var(--rg-lima); box-shadow: 0 0 0 1px var(--rg-lima) inset; }
html.rg .rg-ca-listatopo { scroll-margin-top: 90px; }

/* =====================================================================
   Meus indicados — lista + árvore (layout novo)
   ===================================================================== */
html.rg .rg-ind-abas { display: flex; gap: 4px; padding: 4px; border-radius: 14px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-ind-abas button { display: inline-flex; align-items: center; gap: 7px; padding: 9px 16px; border: 0; border-radius: 10px; background: transparent; color: var(--rg-ink-2); font-weight: 800; cursor: pointer; white-space: nowrap; }
html.rg .rg-ind-abas button.ativo { background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-ind [data-rg-ind-painel][hidden] { display: none !important; }
html.rg .rg-ind .indicated-filters { width: 100% !important; max-width: none !important; gap: 14px; }

/* barra com o Baixar contatos */
html.rg .rg-ind-barra .card-header { padding: 0 !important; border: 0 !important; background: transparent !important; min-height: 0; }
html.rg .rg-ind-barra .card-header:not(:has(button)) { display: none !important; }
html.rg .rg-ind-barra .btn-primary { border-radius: 12px; }

/* quadro de filtros */
html.rg .rg-ind-filtros { display: flex; flex-direction: column; gap: 12px; padding: 14px; border-radius: 18px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-ind-linha { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
html.rg .rg-ind-busca { flex: 1 1 260px; margin: 0; min-width: 0; }
html.rg .rg-ind-tipo { display: flex; gap: 3px; padding: 3px; border-radius: 12px; background: var(--rg-surface-2); border: 1px solid var(--rg-line); }
html.rg .rg-ind-tipo button { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border: 0; border-radius: 9px; background: transparent; color: var(--rg-ink-2); font-weight: 700; font-size: .86rem; cursor: pointer; white-space: nowrap; }
html.rg .rg-ind-tipo button.ativo { background: var(--rg-lima); color: var(--rg-on-lima); }
html.rg .rg-ind-ordem { position: relative; display: flex; align-items: center; margin: 0; flex: 0 1 250px; min-width: 0; }
html.rg .rg-ind-ordem > i { position: absolute; left: 12px; color: var(--rg-ink-3); font-size: .85rem; pointer-events: none; z-index: 1; }
html.rg .rg-ind-ordem select { padding-left: 34px; }
html.rg .rg-ind-etiquetas { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
html.rg .rg-ind-rotulo { display: inline-flex; align-items: center; gap: 4px; color: var(--rg-ink-3); font-size: .74rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
html.rg .rg-ind-ajuda { border: 0; background: transparent; color: var(--rg-ink-3); padding: 0 2px; cursor: help; }
html.rg .rg-ind-etiquetas .filter-chips { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-start !important; margin: 0 !important; }
html.rg .rg-ind-etiquetas .filter-chip { margin: 0 !important; padding: 6px 11px !important; border-radius: 999px !important; font-size: .8rem !important; font-weight: 700; line-height: 1.2; }
html.rg .rg-ind-etiquetas .filter-chip.is-off { background: var(--rg-surface-2) !important; color: var(--rg-ink-2) !important; border-width: 1px !important; }
html.rg .rg-ind-etiquetas .filter-chip-state { display: none; }
html.rg .rg-ind-desmarcar, html.rg .rg-ind-limpar { border: 0; background: transparent; color: var(--rg-lima-texto); font-weight: 800; font-size: .84rem; cursor: pointer; padding: 4px 6px; }
html.rg .rg-ind-mais { border-top: 1px solid var(--rg-line); padding-top: 10px; }
html.rg .rg-ind-mais summary, html.rg .rg-ind-legenda summary { display: inline-flex; align-items: center; gap: 7px; list-style: none; cursor: pointer; color: var(--rg-ink-2); font-weight: 800; font-size: .88rem; }
html.rg .rg-ind-mais summary::-webkit-details-marker, html.rg .rg-ind-legenda summary::-webkit-details-marker { display: none; }
html.rg .rg-ind-mais summary em { font-style: normal; padding: 1px 8px; border-radius: 999px; background: var(--rg-lima); color: var(--rg-on-lima); font-size: .7rem; }
html.rg .rg-ind-seta { font-size: .7rem; transition: transform .2s; }
html.rg .rg-ind-mais[open] .rg-ind-seta { transform: rotate(180deg); }
html.rg .rg-ind-mais-grade { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 12px; margin-top: 10px; }
html.rg .rg-ind-campo { display: flex; flex-direction: column; gap: 5px; margin: 0; min-width: 0; }
html.rg .rg-ind-campo > span { color: var(--rg-ink-3); font-size: .74rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
html.rg .rg-ind-valor { display: flex; gap: 8px; flex-wrap: wrap; }
html.rg .rg-ind-valor > * { flex: 1 1 140px; min-width: 0; }
html.rg .rg-ind-num { position: relative; display: block; }
html.rg .rg-ind-num em { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); font-style: normal; color: var(--rg-ink-3); font-weight: 800; font-size: .85rem; }
html.rg .rg-ind-num input { padding-left: 38px; }
html.rg .rg-ind-rodape { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; flex-wrap: wrap; border-top: 1px solid var(--rg-line); padding-top: 10px; }
html.rg .rg-ind-legenda { flex: 1; min-width: 0; }
html.rg .rg-ind-legenda summary { color: var(--rg-ink-3); font-weight: 700; }
html.rg .rg-ind-legenda ul { list-style: none; margin: 10px 0 6px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px 16px; }
html.rg .rg-ind-legenda li { display: flex; align-items: flex-start; gap: 8px; min-width: 0; }
html.rg .rg-ind-legenda li .status-badge { flex: none; display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 999px; font-size: .72rem; font-weight: 800; white-space: nowrap; }
html.rg .rg-ind-legenda li small { color: var(--rg-ink-2); font-size: .78rem; }
html.rg .rg-ind-legenda p { color: var(--rg-ink-3); font-size: .78rem; margin: 0; }

/* cards da lista */
html.rg .rg-ind .indicated-grid { gap: 12px !important; }
html.rg .rg-ind .indicated-card { border-radius: 18px !important; background-color: var(--rg-surface) !important; min-height: 0 !important; }
html.rg .rg-ind .indicated-card:hover { transform: translateY(-2px); box-shadow: var(--rg-shadow); }
html.rg .rg-ind .indicated-card .ic-info { font-size: .84rem; }
html.rg .rg-ind .indicated-card .ic-row-label { color: var(--rg-ink-3); }
html.rg .rg-ind .ic-actions { display: grid !important; grid-template-columns: 1fr 1fr; gap: 6px; }
html.rg .rg-ind .ic-actions > *:first-child:not(.ic-btn), html.rg .rg-ind .ic-actions .ic-btn-whatsapp, html.rg .rg-ind .ic-actions > .ic-btn:first-child { grid-column: 1 / -1; }
html.rg .rg-ind .ic-actions .ic-btn { margin: 0 !important; border-radius: 12px !important; font-weight: 800; }
html.rg .rg-ind .ic-actions .ic-btn + .ic-btn { margin: 0 !important; }
html.rg .rg-ind .ic-btn-enter { background: color-mix(in srgb, var(--rg-sky) 18%, var(--rg-surface-2)) !important; color: var(--rg-sky) !important; border: 1px solid color-mix(in srgb, var(--rg-sky) 45%, transparent) !important; }
html.rg .rg-ind .ic-actions .ic-btn:not(.ic-btn-whatsapp):not(.ic-btn-enter) { background: var(--rg-surface-2) !important; color: var(--rg-ink-2) !important; border: 1px solid var(--rg-line-2) !important; }

@media (max-width: 767px) {
    html.rg .rg-ind .rg-ex-topo > nav { width: 100%; }
    html.rg .rg-ind-abas button { flex: 1; justify-content: center; }
    html.rg .rg-ind-tipo { width: 100%; }
    html.rg .rg-ind-tipo button { flex: 1; justify-content: center; padding: 7px 4px; }
    html.rg .rg-ind-ordem { flex: 1 1 100%; }
    html.rg .rg-ind-mais-grade { grid-template-columns: minmax(0, 1fr); }
    html.rg .rg-ind-etiquetas .filter-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; width: 100%; padding-bottom: 2px; }
    html.rg .rg-ind-etiquetas .filter-chips::-webkit-scrollbar { display: none; }
    html.rg .rg-ind-etiquetas .filter-chip { flex: none; white-space: nowrap; }
}

/* ---------- árvore ---------- */
html.rg .rg-av { display: flex; flex-direction: column; gap: 14px; }
html.rg .rg-av-caminho { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; color: var(--rg-ink-3); font-size: .85rem; }
html.rg .rg-av-caminho:empty { display: none; }
html.rg .rg-av-caminho > i { font-size: .6rem; }
html.rg .rg-av-caminho button { border: 0; background: transparent; padding: 2px 4px; color: var(--rg-sky); font-weight: 700; cursor: pointer; }
html.rg .rg-av-caminho b { color: #fff; }
html.rg .rg-av-raiz { --rg-us-tom: var(--rg-lima); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px 20px; align-items: center; padding: 18px 20px; border-radius: 22px; border: 1px solid var(--rg-line); border-top: 4px solid var(--rg-us-tom); background: radial-gradient(520px 220px at 0% 0%, color-mix(in srgb, var(--rg-us-tom) 16%, transparent), transparent 70%), var(--rg-surface); }
html.rg .rg-av-raiz > .rg-av-carregando { grid-column: 1 / -1; }
html.rg .rg-av-raiz-quem { display: flex; align-items: center; gap: 14px; min-width: 0; }
html.rg .rg-av-raiz-quem small { color: var(--rg-ink-3); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-av-raiz-quem h2 { margin: 0 0 4px; color: #fff; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.25rem, 1rem + 1vw, 1.7rem); overflow-wrap: anywhere; }
html.rg .rg-av-raiz-nums { display: flex; gap: 8px; }
html.rg .rg-av-raiz-nums > div { min-width: 96px; padding: 10px 14px; border-radius: 14px; background: var(--rg-surface-2); border: 1px solid var(--rg-line); text-align: center; }
html.rg .rg-av-raiz-nums b { display: block; color: var(--rg-lima-texto); font-size: 1.35rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
html.rg .rg-av-raiz-nums small { color: var(--rg-ink-3); font-size: .72rem; }
html.rg .rg-av-niveis { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px 18px; }
html.rg .rg-av-niveis > div { display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: .8rem; }
html.rg .rg-av-niveis span { color: var(--rg-ink-3); font-weight: 700; }
html.rg .rg-av-niveis i { display: block; height: 8px; border-radius: 99px; background: var(--rg-surface-2); overflow: hidden; }
html.rg .rg-av-niveis em { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--rg-violeta), var(--rg-lima)); }
html.rg .rg-av-niveis b { color: #fff; font-variant-numeric: tabular-nums; }
html.rg .rg-av-raiz-acoes { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; }
html.rg .rg-av-busca { max-width: 560px; width: 100%; margin: 0 auto; }

html.rg .rg-av-arvore { padding: 4px 0 20px; }
html.rg .rg-av-galho { list-style: none; margin: 0; padding: 0 0 0 26px; position: relative; }
html.rg .rg-av-galho.raiz { padding-left: 14px; }
html.rg .rg-av-galho[hidden] { display: none; }
html.rg .rg-av-no { position: relative; padding: 5px 0 5px 18px; }
/* linhas da árvore: vertical do galho + "cotovelo" até cada cartão */
html.rg .rg-av-no::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; border-left: 2px solid var(--rg-line-2); }
html.rg .rg-av-no:last-of-type::before { bottom: auto; height: 30px; }
html.rg .rg-av-no::after { content: ''; position: absolute; left: 0; top: 30px; width: 18px; border-top: 2px solid var(--rg-line-2); }
html.rg .rg-av-galho.resultados .rg-av-no::before, html.rg .rg-av-galho.resultados .rg-av-no::after { display: none; }
html.rg .rg-av-galho.resultados { padding-left: 0; }
html.rg .rg-av-galho.resultados .rg-av-no { padding-left: 0; }
html.rg .rg-av-cartao { display: flex; align-items: center; gap: 10px; padding: 8px 12px 8px 8px; border-radius: 16px; background: var(--rg-surface); border: 1px solid var(--rg-line); border-left: 3px solid var(--rg-us-tom); min-width: 0; max-width: 720px; transition: border-color .15s, background .15s; }
html.rg .rg-av-no.aberto > .rg-av-cartao { background: color-mix(in srgb, var(--rg-us-tom) 7%, var(--rg-surface)); }
html.rg .rg-av-no.bloqueado > .rg-av-cartao { opacity: .7; }
html.rg .rg-av-cartao .rg-us-avatar { width: 40px; height: 40px; font-size: .85rem; }
html.rg .rg-av-abrir, html.rg .rg-av-folha { flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; }
html.rg .rg-av-abrir { border: 1px solid var(--rg-line-2); background: var(--rg-surface-2); color: var(--rg-lima-texto); cursor: pointer; font-size: .75rem; }
html.rg .rg-av-abrir:hover, html.rg .rg-av-abrir[aria-expanded="true"] { background: var(--rg-lima); color: var(--rg-on-lima); border-color: var(--rg-lima); }
html.rg .rg-av-folha::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--rg-line-2); }
html.rg .rg-av-info { flex: 1; min-width: 0; }
html.rg .rg-av-info b { display: block; color: #fff; font-size: .95rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-av-info small { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; color: var(--rg-ink-3); font-size: .76rem; margin-top: 2px; }
html.rg .rg-av-info .rg-us-funcao { font-size: .66rem; padding: 1px 7px; }
html.rg .rg-av-qtd { flex: none; display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; background: color-mix(in srgb, var(--rg-lima) 12%, transparent); color: var(--rg-lima-texto); font-weight: 800; font-size: .8rem; white-space: nowrap; }
html.rg .rg-av-foco { flex: none; display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 10px; border: 1px solid var(--rg-line-2); background: transparent; color: var(--rg-ink-2); font-weight: 700; font-size: .8rem; cursor: pointer; white-space: nowrap; }
html.rg .rg-av-foco:hover { border-color: var(--rg-sky); color: var(--rg-sky); }
html.rg .rg-av-mais, html.rg .rg-av-espera, html.rg .rg-av-nada { position: relative; padding: 6px 0 6px 18px; }
html.rg .rg-av-mais button { padding: 8px 16px; border-radius: 12px; border: 1px dashed var(--rg-line-2); background: transparent; color: var(--rg-lima-texto); font-weight: 800; cursor: pointer; }
html.rg .rg-av-mais small { color: var(--rg-ink-3); font-weight: 600; }
html.rg .rg-av-nada { color: var(--rg-ink-3); font-size: .85rem; padding-left: 0; }
html.rg .rg-av-erro { color: var(--rg-coral); font-size: .85rem; cursor: pointer; }
html.rg .rg-av-carregando { display: flex; gap: 6px; padding: 8px 4px; }
html.rg .rg-av-carregando span { width: 8px; height: 8px; border-radius: 50%; background: var(--rg-lima); animation: rg-av-pula 1s infinite ease-in-out; }
html.rg .rg-av-carregando span:nth-child(2) { animation-delay: .15s; }
html.rg .rg-av-carregando span:nth-child(3) { animation-delay: .3s; }
@keyframes rg-av-pula { 0%, 80%, 100% { opacity: .25; transform: scale(.8); } 40% { opacity: 1; transform: scale(1); } }
@media (max-width: 767px) {
    html.rg .rg-av-raiz { grid-template-columns: minmax(0, 1fr); padding: 14px; }
    html.rg .rg-av-raiz-nums > div { flex: 1; min-width: 0; padding: 8px 6px; }
    html.rg .rg-av-raiz-acoes .rg-ex-btn { flex: 1; justify-content: center; }
    html.rg .rg-av-galho { padding-left: 12px; }
    html.rg .rg-av-galho.raiz { padding-left: 4px; }
    html.rg .rg-av-no { padding-left: 12px; }
    html.rg .rg-av-no::after { width: 12px; }
    html.rg .rg-av-cartao { gap: 8px; padding: 7px 8px 7px 6px; flex-wrap: wrap; }
    html.rg .rg-av-cartao .rg-us-avatar { width: 34px; height: 34px; font-size: .75rem; }
    html.rg .rg-av-info { flex-basis: calc(100% - 90px); }
    html.rg .rg-av-qtd { margin-left: 36px; }
    html.rg .rg-av-foco span { display: none; }
    html.rg .rg-av-foco { margin-left: auto; }
}

/* ---------- Meus indicados: árvore em organograma (de cima para baixo, estilo rede multinível) ---------- */
html.rg .rg-av-arvore { min-width: 0; }
html.rg .rg-mn-barra { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
html.rg .rg-mn-legenda { display: flex; gap: 6px 14px; flex-wrap: wrap; color: var(--rg-ink-3); font-size: .76rem; font-weight: 700; }
html.rg .rg-mn-legenda span { display: inline-flex; align-items: center; gap: 6px; }
html.rg .rg-mn-legenda span::before { content: ''; width: 10px; height: 10px; border-radius: 50%; background: var(--rg-us-tom); box-shadow: 0 0 8px var(--rg-us-tom); }
html.rg .rg-mn-zoom { display: inline-flex; border: 1px solid var(--rg-line-2); border-radius: 12px; overflow: hidden; }
html.rg .rg-mn-zoom button { width: 38px; height: 34px; border: 0; background: var(--rg-surface-2); color: var(--rg-ink-2); cursor: pointer; }
html.rg .rg-mn-zoom button + button { border-left: 1px solid var(--rg-line-2); }
html.rg .rg-mn-zoom button:hover { background: var(--rg-surface-3); color: var(--rg-lima-texto); }

html.rg .rg-mn-palco {
    --rg-mn-linha: color-mix(in srgb, var(--rg-violeta) 75%, transparent);
    --rg-mn-gap: 30px;
    position: relative; overflow: auto; max-height: calc(100vh - 140px); min-height: 340px;
    border-radius: 22px; border: 1px solid var(--rg-line);
    background:
        radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .07) 1px, transparent 0) 0 0 / 22px 22px,
        radial-gradient(700px 360px at 50% 0%, color-mix(in srgb, var(--rg-violeta) 22%, transparent), transparent 70%),
        var(--rg-bg-2);
    cursor: grab; overscroll-behavior: contain;
}
html.rg .rg-mn-palco.arrastando { cursor: grabbing; user-select: none; }
html.rg .rg-mn-tela { width: max-content; min-width: 100%; padding: 26px 24px 48px; }

/* linhas: barra horizontal entre irmãos + descida até cada cartão */
html.rg .rg-mn, html.rg .rg-mn ul { list-style: none; margin: 0; padding: 0; display: flex; justify-content: center; }
html.rg .rg-mn ul { position: relative; padding-top: var(--rg-mn-gap); }
html.rg .rg-mn ul[hidden] { display: none; }
html.rg .rg-mn ul::before { content: ''; position: absolute; top: 0; left: 50%; height: var(--rg-mn-gap); border-left: 2px solid var(--rg-mn-linha); }
html.rg .rg-mn li { position: relative; display: flex; flex-direction: column; align-items: center; padding: var(--rg-mn-gap) 7px 0; }
html.rg .rg-mn li::before, html.rg .rg-mn li::after { content: ''; position: absolute; top: 0; width: 50%; height: var(--rg-mn-gap); border-top: 2px solid var(--rg-mn-linha); }
html.rg .rg-mn li::before { right: 50%; }
html.rg .rg-mn li::after { left: 50%; border-left: 2px solid var(--rg-mn-linha); }
html.rg .rg-mn li:first-child::before, html.rg .rg-mn li:last-child::after { border-top: 0; }
html.rg .rg-mn li:last-child::before { border-right: 2px solid var(--rg-mn-linha); border-top-right-radius: 12px; }
html.rg .rg-mn li:first-child::after { border-top-left-radius: 12px; }
html.rg .rg-mn li:only-child::before { display: none; }
html.rg .rg-mn li:only-child::after { border-top: 0; border-radius: 0; }
html.rg .rg-mn > li { padding-top: 0; }
html.rg .rg-mn > li::before, html.rg .rg-mn > li::after { display: none; }

/* cartão de cada pessoa */
html.rg .rg-mn-cartao { position: relative; width: 148px; min-height: 176px; justify-content: flex-start; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 16px 10px 14px; border-radius: 20px; text-align: center;
    background: linear-gradient(180deg, color-mix(in srgb, var(--rg-us-tom) 14%, var(--rg-surface)), var(--rg-surface) 60%);
    border: 1px solid color-mix(in srgb, var(--rg-us-tom) 35%, var(--rg-line)); box-shadow: 0 10px 26px rgba(4, 2, 16, .45); transition: transform .15s, box-shadow .15s; }
html.rg .rg-mn-no:not(.rg-mn-espera):not(.rg-mn-mais) > .rg-mn-cartao:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(4, 2, 16, .55), 0 0 0 1px var(--rg-us-tom); }
html.rg .rg-mn-cartao .rg-us-avatar { width: 56px; height: 56px; font-size: 1rem; box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-us-tom) 18%, transparent), 0 0 18px color-mix(in srgb, var(--rg-us-tom) 45%, transparent); }
html.rg .rg-mn-cartao > b { width: 100%; color: #fff; font-size: .86rem; line-height: 1.2; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
html.rg .rg-mn-cartao .rg-us-funcao { font-size: .64rem; padding: 1px 8px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-mn-desde { color: var(--rg-ink-3); font-size: 12px; line-height: 1.2; }
html.rg .rg-mn-no.bloqueado > .rg-mn-cartao { opacity: .6; filter: grayscale(.4); }
html.rg .rg-mn-no.raiz > .rg-mn-cartao { width: 190px; min-height: 0; padding: 20px 12px 18px; border-width: 2px; }
html.rg .rg-mn-no.raiz > .rg-mn-cartao .rg-us-avatar { width: 78px; height: 78px; font-size: 1.5rem; }
html.rg .rg-mn-no.raiz > .rg-mn-cartao > b { font-family: var(--rg-font-display) !important; font-size: 1.1rem; }
html.rg .rg-mn-foco { position: absolute; top: 7px; right: 7px; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--rg-line-2); background: var(--rg-surface-2); color: var(--rg-ink-2); cursor: pointer; font-size: .75rem; }
html.rg .rg-mn-foco:hover { border-color: var(--rg-sky); color: var(--rg-sky); }

/* botão de abrir os indicados, pendurado embaixo do cartão */
html.rg .rg-mn-abrir { position: relative; z-index: 1; margin-top: -13px; display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px; border: 2px solid var(--rg-us-tom);
    background: var(--rg-bg-2); color: #fff; font-weight: 800; font-size: .76rem; cursor: pointer; white-space: nowrap; font-variant-numeric: tabular-nums; }
html.rg .rg-mn-abrir i { font-size: .62rem; color: var(--rg-us-tom); }
html.rg .rg-mn-abrir:hover, html.rg .rg-mn-abrir[aria-expanded="true"] { background: var(--rg-us-tom); color: var(--rg-tinta); }
html.rg .rg-mn-abrir:hover i, html.rg .rg-mn-abrir[aria-expanded="true"] i { color: var(--rg-tinta); }
html.rg .rg-mn-abrir.fixo { cursor: default; background: var(--rg-us-tom); color: var(--rg-tinta); }
html.rg .rg-mn-abrir.fixo i { color: var(--rg-tinta); }
html.rg .rg-mn-no.aberto > .rg-mn-cartao, html.rg .rg-mn-no.raiz > .rg-mn-cartao { box-shadow: 0 10px 26px rgba(4, 2, 16, .45), 0 0 0 2px var(--rg-us-tom), 0 0 26px color-mix(in srgb, var(--rg-us-tom) 35%, transparent); }

/* carregando / mostrar mais */
html.rg .rg-mn-espera > .rg-mn-cartao { min-height: 120px; justify-content: center; background: var(--rg-surface); border-style: dashed; box-shadow: none; }
html.rg .rg-mn-mais > .rg-mn-cartao { min-height: 120px; justify-content: center; cursor: pointer; background: transparent; border: 2px dashed var(--rg-line-2); box-shadow: none; color: var(--rg-lima-texto); font: inherit; }
html.rg .rg-mn-mais > .rg-mn-cartao b { font-family: var(--rg-font-display) !important; font-size: 1.3rem; color: var(--rg-lima-texto); }
html.rg .rg-mn-mais > .rg-mn-cartao:hover { border-color: var(--rg-lima); }

@media (max-width: 767px) {
    html.rg .rg-mn-palco { --rg-mn-gap: 24px; max-height: calc(100vh - 120px); border-radius: 18px; }
    html.rg .rg-mn-tela { padding: 18px 14px 36px; }
    html.rg .rg-mn li { padding-left: 5px; padding-right: 5px; }
    html.rg .rg-mn-cartao { width: 128px; min-height: 164px; padding: 14px 8px 12px; }
    html.rg .rg-mn-cartao .rg-us-avatar { width: 48px; height: 48px; font-size: .9rem; }
    html.rg .rg-mn-no.raiz > .rg-mn-cartao { width: 160px; }
    html.rg .rg-mn-no.raiz > .rg-mn-cartao .rg-us-avatar { width: 64px; height: 64px; font-size: 1.2rem; }
    html.rg .rg-mn-legenda { font-size: .7rem; }
}

/* ---------- Meus indicados (lista): cartão clicável + ficha ---------- */
html.rg [x-cloak] { display: none !important; }
html.rg body.rg-ic-travado { overflow: hidden; }
html.rg .rg-ind .indicated-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)) !important; gap: 14px !important; align-items: stretch; }
html.rg .rg-ic { --rg-ic-tom: var(--rg-violeta); position: relative; display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 16px; border-radius: 20px;
    background: linear-gradient(160deg, color-mix(in srgb, var(--rg-ic-tom) 13%, var(--rg-surface)) 0%, var(--rg-surface) 55%);
    border: 1px solid color-mix(in srgb, var(--rg-ic-tom) 30%, var(--rg-line)); border-top: 3px solid var(--rg-ic-tom);
    transition: transform .15s, box-shadow .15s, border-color .15s; }
html.rg .rg-ic:not(.aberta):hover { transform: translateY(-3px); box-shadow: var(--rg-shadow), 0 0 0 1px var(--rg-ic-tom); }
html.rg .rg-ic-alvo { position: absolute; inset: 0; z-index: 0; border: 0; padding: 0; background: transparent; border-radius: inherit; cursor: pointer; }
html.rg .rg-ic-alvo:focus-visible { outline: 2px solid var(--rg-lima); outline-offset: 2px; }
html.rg .rg-ic-topo, html.rg .rg-ic-selos, html.rg .rg-ic-kpis { position: relative; z-index: 0; pointer-events: none; }
html.rg .rg-ic-acoes { position: relative; z-index: 1; }

html.rg .rg-ic-topo { display: flex; align-items: center; gap: 12px; min-width: 0; }
html.rg .rg-ic-avatar { flex: none; width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; font-weight: 900; color: #fff; letter-spacing: .02em;
    background: color-mix(in srgb, var(--rg-ic-tom) 22%, var(--rg-surface-2)); border: 2px solid var(--rg-ic-tom); box-shadow: 0 0 16px color-mix(in srgb, var(--rg-ic-tom) 40%, transparent); }
html.rg .rg-ic-avatar.grande { width: 68px; height: 68px; font-size: 1.35rem; }
html.rg .rg-ic-quem { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
html.rg .rg-ic-quem > b { color: #fff; font-size: 1.02rem; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg .rg-ic-sub { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
html.rg .rg-ic-fraco { color: var(--rg-ink-3); font-size: 13px; }
html.rg .rg-ic-estrelas { color: var(--rg-gold); font-size: 12px; letter-spacing: 1px; }
html.rg .rg-ic-faixa { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 800; }
html.rg .rg-ic-seta { flex: none; color: var(--rg-ink-3); transition: transform .15s, color .15s; }
html.rg .rg-ic:hover .rg-ic-seta { color: var(--rg-lima-texto); transform: translateX(3px); }

html.rg .rg-ic-selos { display: flex; flex-wrap: wrap; gap: 6px; }
html.rg .rg-ic-selo { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 800; line-height: 1.3; white-space: nowrap; }
html.rg .rg-ic-selo-mais { background: var(--rg-surface-2); color: var(--rg-ink-2); }

html.rg .rg-ic-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 0; margin-top: auto; }
html.rg .rg-ic-kpis > div { min-width: 0; padding: 8px 6px; border-radius: 12px; background: color-mix(in srgb, var(--rg-bg) 45%, transparent); border: 1px solid var(--rg-line); text-align: center; }
html.rg .rg-ic-kpis dt { color: var(--rg-ink-3); font-size: 12px; font-weight: 700; margin: 0 0 2px; }
html.rg .rg-ic-kpis dd { margin: 0; color: #fff; font-weight: 800; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
html.rg .rg-ic .ok { color: var(--rg-good); }
html.rg .rg-ic .nao { color: var(--rg-bad); }
html.rg .rg-ic .ouro { color: var(--rg-gold); }
html.rg .rg-ic .laranja { color: var(--rg-warn); }
html.rg .rg-ic .roxo { color: #c9b5ff; }

html.rg .rg-ic-acoes { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 6px; }
html.rg .rg-ic-acoes > * { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 6px 8px; margin: 0; border-radius: 12px; font-weight: 800; font-size: 13px; white-space: nowrap; cursor: pointer; text-decoration: none !important; }
html.rg .rg-ic-zap { background: #25d366; color: #06301a !important; border: 0; }
html.rg .rg-ic-zap:hover { filter: brightness(1.08); }
html.rg .rg-ic-zap.desligado { background: var(--rg-surface-2); color: var(--rg-ink-3) !important; cursor: default; font-size: 12px; }
html.rg .rg-ic-contato, html.rg .rg-ic-ver { background: var(--rg-surface-2); color: var(--rg-ink-2); border: 1px solid var(--rg-line-2); }
html.rg .rg-ic-contato input, html.rg .rg-ic-btn input { position: absolute; opacity: 0; pointer-events: none; }
html.rg .rg-ic-contato.feito { background: color-mix(in srgb, var(--rg-warn) 18%, var(--rg-surface-2)); color: var(--rg-warn); border-color: color-mix(in srgb, var(--rg-warn) 50%, transparent); }
html.rg .rg-ic-ver:hover, html.rg .rg-ic-contato:hover { border-color: var(--rg-lima); color: var(--rg-lima-texto); }

/* ficha: painel à direita (computador) / tela cheia (celular) */
html.rg .rg-ic-ficha { position: fixed; inset: 0; z-index: 1060; display: flex; justify-content: flex-end; }
html.rg .rg-ic-fundo { position: absolute; inset: 0; background: rgba(6, 3, 20, .72); backdrop-filter: blur(3px); animation: rg-ic-surge .2s ease; }
html.rg .rg-ic-painel { position: relative; width: min(480px, 100%); height: 100%; display: flex; flex-direction: column; background: var(--rg-bg-2); border-left: 1px solid var(--rg-line-2); box-shadow: var(--rg-shadow-lg); animation: rg-ic-entra .22s ease; }
@keyframes rg-ic-entra { from { transform: translateX(40px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes rg-ic-surge { from { opacity: 0; } to { opacity: 1; } }
html.rg .rg-ic-painel-topo { display: flex; align-items: center; gap: 14px; padding: 20px; border-bottom: 1px solid var(--rg-line); border-top: 4px solid var(--rg-ic-tom);
    background: radial-gradient(420px 180px at 0 0, color-mix(in srgb, var(--rg-ic-tom) 22%, transparent), transparent 70%); }
html.rg .rg-ic-painel-topo h3 { margin: 0; color: #fff; font-family: var(--rg-font-display) !important; font-size: 1.25rem; font-weight: 800; overflow-wrap: anywhere; }
html.rg .rg-ic-fechar { flex: none; align-self: flex-start; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--rg-line-2); background: var(--rg-surface-2); color: var(--rg-ink-2); cursor: pointer; }
html.rg .rg-ic-fechar:hover { color: #fff; border-color: var(--rg-coral); }
html.rg .rg-ic-painel-corpo { flex: 1; overflow-y: auto; padding: 16px 20px 20px; display: flex; flex-direction: column; gap: 12px; }
html.rg .rg-ic-painel-corpo h4 { margin: 8px 0 0; color: var(--rg-ink-3); font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-ic-contatos { display: flex; flex-direction: column; gap: 6px; color: var(--rg-ink-2); font-size: 14px; overflow-wrap: anywhere; }
html.rg .rg-ic-contatos i { width: 18px; color: var(--rg-ink-3); }
html.rg .rg-ic-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
html.rg .rg-ic-grade > div { min-width: 0; padding: 10px 12px; border-radius: 14px; background: var(--rg-surface); border: 1px solid var(--rg-line); }
html.rg .rg-ic-grade dt { color: var(--rg-ink-3); font-size: 12px; font-weight: 700; margin-bottom: 3px; }
html.rg .rg-ic-grade dd { margin: 0; color: #fff; font-weight: 800; font-size: 14px; overflow-wrap: anywhere; }
html.rg .rg-ic-grade dd small { display: block; margin-top: 3px; color: var(--rg-ink-3); font-weight: 600; font-size: 12px !important; }
html.rg .rg-ic-feedback { margin: 0; padding: 12px 14px; border-radius: 14px; border-left: 3px solid var(--rg-sky); background: var(--rg-surface); color: var(--rg-ink-2); font-size: 14px; white-space: pre-line; }
html.rg .rg-ic-feedback small { display: block; margin-top: 6px; color: var(--rg-ink-3); font-size: 12px !important; }
html.rg .rg-ic-painel-acoes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 14px 20px 20px; border-top: 1px solid var(--rg-line); background: var(--rg-bg); }
html.rg .rg-ic-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; margin: 0; padding: 8px 10px; border-radius: 14px; border: 1px solid var(--rg-line-2);
    background: var(--rg-surface-2); color: var(--rg-ink); font-weight: 800; font-size: 14px; cursor: pointer; text-align: center; text-decoration: none !important; }
html.rg .rg-ic-btn:hover { border-color: var(--rg-lima); color: var(--rg-lima-texto); }
html.rg .rg-ic-btn.zap { grid-column: 1 / -1; background: #25d366; color: #06301a; border: 0; }
html.rg .rg-ic-btn.zap:hover { filter: brightness(1.08); color: #06301a; }
html.rg .rg-ic-btn.feito { background: color-mix(in srgb, var(--rg-warn) 18%, var(--rg-surface-2)); color: var(--rg-warn); border-color: color-mix(in srgb, var(--rg-warn) 50%, transparent); }
html.rg .rg-ic-btn.entrar { background: color-mix(in srgb, var(--rg-sky) 18%, var(--rg-surface-2)); color: var(--rg-sky); border-color: color-mix(in srgb, var(--rg-sky) 45%, transparent); }

@media (max-width: 575px) {
    html.rg .rg-ic { padding: 14px; }
    html.rg .rg-ic-avatar { width: 44px; height: 44px; }
    html.rg .rg-ic-painel { width: 100%; border-left: 0; }
    html.rg .rg-ic-painel-topo { padding: 16px; }
    html.rg .rg-ic-painel-corpo { padding: 14px 16px 16px; }
    html.rg .rg-ic-painel-acoes { padding: 12px 16px 16px; }
}
@media (max-width: 359px) {
    html.rg .rg-ic-acoes { grid-template-columns: 1fr 1fr; }
    html.rg .rg-ic-acoes .rg-ic-zap { grid-column: 1 / -1; }
    html.rg .rg-ic-grade, html.rg .rg-ic-painel-acoes { grid-template-columns: minmax(0, 1fr); }
}
html.rg .rg-ic-acoes > label.rg-ic-contato { font-size: 13px !important; }
html.rg .rg-ic-painel-acoes > label.rg-ic-btn { font-size: 14px !important; }
html.rg .rg-ic-acoes a.rg-ic-zap, html.rg .rg-ic-painel-acoes a.rg-ic-btn.zap { color: #06301a !important; }
/* botões do cartão nunca saem dele: encolhem, cortam o texto e, em cartão estreito, o WhatsApp vai para uma linha só */
html.rg .rg-ind .indicated-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)) !important; }
html.rg .rg-ic { container-type: inline-size; }
html.rg .rg-ic-acoes { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); }
html.rg .rg-ic-acoes > *, html.rg .rg-ic-acoes > label.rg-ic-contato { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 13px !important; }
@container (max-width: 330px) {
    html.rg .rg-ic-acoes { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    html.rg .rg-ic-acoes .rg-ic-zap { grid-column: 1 / -1; }
}

/* =====================================================================
   Popups promocionais e de aviso (layout novo)
   geral, bônus, bônus de consultor, cadastro, botão do consultor, prêmio da loteria e as
   três de transferência (chave, giro, rifa). Só o visual: quem abre/fecha continua sendo o JS
   de cada popup, por isso aqui NUNCA se mexe no display do fundo.
   ===================================================================== */
html.rg :is(.x-popups-geral, .x-popups-bonus, .x-popups-consultores, .x-popups-cadastro, .x-botao-consultores, .x-popups-premio-loteria, .x-popups-transfer-info-chave, .x-popups-transfer-info-giro, .x-popups-transfer-info-rifa) {
    background: radial-gradient(ellipse 70% 60% at 50% 40%, rgba(139, 92, 246, .22), transparent 70%), rgba(8, 4, 24, .78) !important;
    backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(8px) !important;
    padding: 16px; box-sizing: border-box; align-items: center; justify-content: center;
}

/* o cartão */
html.rg :is(.x-popups-geral-modal, .x-popups-bonus-modal, .x-popups-consultores-modal, .x-popups-cadastro-modal, .x-botao-consultores-modal, .x-popups-premio-loteria-mod, .x-popups-transfer-info-mod-chave, .x-popups-transfer-info-mod-giro, .x-popups-transfer-info-mod-rifa) {
    position: relative; width: min(100%, 440px) !important; max-width: 440px !important; max-height: calc(100vh - 32px); overflow-x: hidden; overflow-y: auto; scrollbar-width: none;
    margin: 0 auto; padding: 0 !important; border-radius: 28px !important;
    background: radial-gradient(420px 220px at 50% 0%, color-mix(in srgb, var(--rg-lima) 10%, transparent), transparent 70%), linear-gradient(180deg, #241a5c, #170f3d) !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .8), 0 0 0 1px color-mix(in srgb, var(--rg-lima) 6%, transparent), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
    color: #fff; font-family: var(--rg-font) !important;
    animation: rg-pop-entra .45s cubic-bezier(.2, 1.3, .4, 1) both;
}
html.rg :is(.x-popups-geral-modal, .x-popups-bonus-modal, .x-popups-consultores-modal, .x-popups-cadastro-modal, .x-botao-consultores-modal, .x-popups-premio-loteria-mod, .x-popups-transfer-info-mod-chave, .x-popups-transfer-info-mod-giro, .x-popups-transfer-info-mod-rifa)::-webkit-scrollbar { display: none; }
@keyframes rg-pop-entra { from { opacity: 0; transform: translateY(18px) scale(.94); } to { opacity: 1; transform: none; } }

/* imagem do topo: ocupa a largura toda e se funde no cartão */
html.rg :is(.x-popups-geral-banner, .x-popups-bonus-banner, .x-popups-consultores-banner, .x-popups-cadastro-banner, .x-botao-consultores-banner) {
    display: block; width: 100% !important; height: auto; border-radius: 0 !important; margin: 0 !important;
    -webkit-mask-image: linear-gradient(#000 78%, transparent); mask-image: linear-gradient(#000 78%, transparent);
}

/* botão de fechar: círculo de vidro no canto */
html.rg :is(.x-popups-geral-modal-exit, .x-popups-bonus-modal-exit, .x-popups-consultores-modal-exit, .x-popups-cadastro-modal-exit, .x-botao-consultores-modal-exit, .x-popups-premio-loteria-mod-exit, .x-popups-transfer-info-mod-exit-chave, .x-popups-transfer-info-mod-exit-giro, .x-popups-transfer-info-mod-exit-rifa) {
    position: absolute !important; top: 12px !important; right: 12px !important; left: auto !important; z-index: 5;
    width: 38px !important; height: 38px !important; padding: 0 !important; display: grid !important; place-items: center;
    border-radius: 50% !important; border: 1px solid rgba(255, 255, 255, .25) !important;
    background: rgba(15, 8, 40, .55) !important; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    color: #fff !important; font-size: 18px !important; font-weight: 700; line-height: 1 !important; text-transform: lowercase; cursor: pointer;
    transition: background .15s, transform .15s;
}
html.rg :is(.x-popups-geral-modal-exit, .x-popups-bonus-modal-exit, .x-popups-consultores-modal-exit, .x-popups-cadastro-modal-exit, .x-botao-consultores-modal-exit, .x-popups-premio-loteria-mod-exit, .x-popups-transfer-info-mod-exit-chave, .x-popups-transfer-info-mod-exit-giro, .x-popups-transfer-info-mod-exit-rifa):hover { background: rgba(255, 255, 255, .18) !important; transform: rotate(90deg); }
html.rg :is(.x-popups-premio-loteria-mod-exit, .x-popups-transfer-info-mod-exit-chave, .x-popups-transfer-info-mod-exit-giro, .x-popups-transfer-info-mod-exit-rifa) button {
    width: 100%; height: 100%; padding: 0; border: 0 !important; background: transparent !important; color: #fff !important; font-size: 15px !important; font-weight: 800; box-shadow: none !important;
}

/* faixa de título (bônus e cadastro) */
html.rg :is(.x-popups-bonus-modal-title, .x-popups-cadastro-modal-title) { display: flex; align-items: center; gap: 12px; padding: 18px 22px 0 !important; }
html.rg :is(.x-popups-bonus-modal-title-arrow, .x-popups-cadastro-modal-title-arrow) { flex: none; width: 46px; height: 46px; padding: 0 !important; display: grid !important; place-items: center; border-radius: 14px; background: color-mix(in srgb, var(--rg-lima) 14%, transparent); color: var(--rg-lima-texto); font-size: 22px !important; }
html.rg :is(.x-popups-bonus-modal-title-body, .x-popups-cadastro-modal-title-body) p:first-child { font-family: var(--rg-font-display) !important; font-size: 1.1rem; color: #fff !important; }
html.rg :is(.x-popups-bonus-modal-title-body, .x-popups-cadastro-modal-title-body) p:last-child { height: auto !important; color: var(--rg-ink-3) !important; font-size: .82rem !important; }

/* conteúdo */
html.rg :is(.x-popups-geral-modal-content, .x-popups-bonus-modal-content, .x-popups-consultores-modal-content, .x-popups-cadastro-modal-content, .x-botao-consultores-modal-content) {
    padding: 14px 24px 4px !important; text-align: center; color: var(--rg-ink-2) !important;
}
html.rg :is(.x-popups-geral-modal-content, .x-popups-bonus-modal-content, .x-popups-consultores-modal-content, .x-popups-cadastro-modal-content, .x-botao-consultores-modal-content) p {
    margin: 6px 0 0 !important; color: var(--rg-ink-2) !important; font-size: .98rem !important; line-height: 1.45; text-transform: none;
}
html.rg :is(.x-popups-geral-modal-value, .x-popups-bonus-modal-value, .x-popups-consultores-modal-value, .x-popups-cadastro-modal-value, .x-botao-consultores-modal-value) {
    margin: 4px 0 0 !important; font-family: var(--rg-font-display) !important; font-weight: 800 !important; line-height: 1.12;
    font-size: clamp(1.35rem, 1.05rem + 1.6vw, 1.75rem) !important; letter-spacing: -.01em;
    background: linear-gradient(90deg, #f1ffb8, var(--rg-lima) 45%, #7ee0a8); -webkit-background-clip: text; background-clip: text; color: transparent !important;
}
html.rg :is(.x-popups-geral-modal-value, .x-popups-bonus-modal-value, .x-popups-consultores-modal-value, .x-popups-cadastro-modal-value, .x-botao-consultores-modal-value):empty { display: none; }

/* botão principal: lima, com brilho passando (no lugar do vermelho piscando) */
html.rg :is(.x-popups-geral-modal-button, .x-popups-bonus-modal-button, .x-popups-consultores-modal-button, .x-popups-cadastro-modal-button, .x-botao-consultores-modal-button) { padding: 16px 22px 22px !important; display: block !important; width: 100%; }
html.rg :is(.x-popups-geral-modal-button, .x-popups-bonus-modal-button, .x-popups-consultores-modal-button, .x-popups-cadastro-modal-button, .x-botao-consultores-modal-button) a { display: block; padding: 0 !important; text-decoration: none !important; }
html.rg :is(.x-popups-geral-modal-button, .x-popups-bonus-modal-button, .x-popups-consultores-modal-button, .x-popups-cadastro-modal-button, .x-botao-consultores-modal-button) button,
html.rg :is(.x-popups-premio-loteria-mod-content-button, .x-popups-transfer-info-mod-content-button-chave, .x-popups-transfer-info-mod-content-button-giro, .x-popups-transfer-info-mod-content-button-rifa) {
    position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    width: 100% !important; height: auto !important; min-height: 54px; padding: 14px 20px !important; border: 0 !important; border-radius: 18px !important;
    background: linear-gradient(180deg, #dbff6a, var(--rg-lima) 60%, #a8d81c) !important; color: var(--rg-on-lima) !important;
    font-family: var(--rg-font-display) !important; font-weight: 800 !important; font-size: 1.02rem !important; letter-spacing: .02em !important; text-transform: uppercase;
    box-shadow: 0 14px 30px -10px color-mix(in srgb, var(--rg-lima) 65%, transparent), inset 0 -3px 0 rgba(0, 0, 0, .14) !important;
    animation: none !important; transform: none; cursor: pointer; transition: transform .12s, filter .15s;
}
html.rg :is(.x-popups-geral-modal-button, .x-popups-bonus-modal-button, .x-popups-consultores-modal-button, .x-popups-cadastro-modal-button, .x-botao-consultores-modal-button) button::after,
html.rg :is(.x-popups-premio-loteria-mod-content-button, .x-popups-transfer-info-mod-content-button-chave, .x-popups-transfer-info-mod-content-button-giro, .x-popups-transfer-info-mod-content-button-rifa)::after {
    content: ''; position: absolute; top: 0; bottom: 0; left: -60%; width: 45%; transform: skewX(-20deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent); animation: rg-pop-brilho 2.6s ease-in-out infinite;
}
@keyframes rg-pop-brilho { 0%, 55% { left: -60%; } 100% { left: 130%; } }
html.rg :is(.x-popups-geral-modal-button, .x-popups-bonus-modal-button, .x-popups-consultores-modal-button, .x-popups-cadastro-modal-button, .x-botao-consultores-modal-button) button:hover,
html.rg :is(.x-popups-premio-loteria-mod-content-button, .x-popups-transfer-info-mod-content-button-chave, .x-popups-transfer-info-mod-content-button-giro, .x-popups-transfer-info-mod-content-button-rifa):hover { filter: brightness(1.06); transform: translateY(-1px); }
html.rg :is(.x-popups-transfer-info-mod-content-button-chave, .x-popups-transfer-info-mod-content-button-giro, .x-popups-transfer-info-mod-content-button-rifa)[style*="6c757d"] {
    background: rgba(255, 255, 255, .08) !important; color: #fff !important; box-shadow: none !important; border: 1px solid rgba(255, 255, 255, .18) !important;
}
html.rg :is(.x-popups-transfer-info-mod-content-button-chave, .x-popups-transfer-info-mod-content-button-giro, .x-popups-transfer-info-mod-content-button-rifa)[style*="6c757d"]::after { display: none; }

/* prêmio da loteria e transferências: comemoração centralizada */
html.rg :is(.x-popups-premio-loteria-mod-content, .x-popups-transfer-info-mod-content-chave, .x-popups-transfer-info-mod-content-giro, .x-popups-transfer-info-mod-content-rifa) {
    display: flex !important; flex-direction: column; align-items: center; gap: 6px; width: 100% !important; padding: 34px 24px 24px !important; text-align: center;
    background: radial-gradient(260px 200px at 50% 38%, rgba(245, 197, 66, .22), transparent 70%) !important; color: var(--rg-ink-2) !important;
}
html.rg :is(.x-popups-premio-loteria-mod-content, .x-popups-transfer-info-mod-content-chave, .x-popups-transfer-info-mod-content-giro, .x-popups-transfer-info-mod-content-rifa) h2 {
    margin: 0 0 4px !important; padding: 0 !important; font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.35rem, 1.1rem + 1.4vw, 1.75rem) !important; line-height: 1.15; color: #fff !important;
}
html.rg :is(.x-popups-premio-loteria-mod-content, .x-popups-transfer-info-mod-content-chave, .x-popups-transfer-info-mod-content-giro, .x-popups-transfer-info-mod-content-rifa) h2 span { color: var(--rg-lima-texto) !important; }
html.rg .x-popups-premio-loteria-mod-content > p:first-child { margin: 0 !important; padding: 4px 12px; border-radius: 999px; background: rgba(245, 197, 66, .16); color: var(--rg-gold) !important; font-weight: 800; font-size: .78rem !important; letter-spacing: .08em; text-transform: uppercase; }
html.rg :is(.x-popups-premio-loteria-mod-content, .x-popups-transfer-info-mod-content-chave, .x-popups-transfer-info-mod-content-giro, .x-popups-transfer-info-mod-content-rifa) img {
    width: min(190px, 55%) !important; height: auto; margin: 6px 0 10px !important; filter: drop-shadow(0 14px 26px rgba(245, 197, 66, .35)); animation: rg-pop-flutua 3s ease-in-out infinite;
}
@keyframes rg-pop-flutua { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
html.rg :is(.x-popups-transfer-info-mod-content-chave, .x-popups-transfer-info-mod-content-giro, .x-popups-transfer-info-mod-content-rifa) p { padding: 0 !important; font-size: 1rem !important; color: var(--rg-ink-2) !important; }
html.rg :is(.x-popups-transfer-info-mod-content-chave, .x-popups-transfer-info-mod-content-giro, .x-popups-transfer-info-mod-content-rifa) p span { color: var(--rg-lima-texto) !important; }
html.rg :is(.x-popups-transfer-info-mod-content-chave, .x-popups-transfer-info-mod-content-giro, .x-popups-transfer-info-mod-content-rifa) > div[style*="display: flex"] { width: 100%; gap: 10px !important; margin-top: 14px !important; }
html.rg .x-popups-premio-loteria-mod-content-button { margin-top: 10px; }

@media (max-width: 420px) {
    html.rg :is(.x-popups-geral, .x-popups-bonus, .x-popups-consultores, .x-popups-cadastro, .x-botao-consultores, .x-popups-premio-loteria, .x-popups-transfer-info-chave, .x-popups-transfer-info-giro, .x-popups-transfer-info-rifa) { padding: 12px; }
    html.rg :is(.x-popups-geral-modal, .x-popups-bonus-modal, .x-popups-consultores-modal, .x-popups-cadastro-modal, .x-botao-consultores-modal, .x-popups-premio-loteria-mod, .x-popups-transfer-info-mod-chave, .x-popups-transfer-info-mod-giro, .x-popups-transfer-info-mod-rifa) { border-radius: 24px !important; max-height: calc(100vh - 24px); }
    html.rg :is(.x-popups-geral-modal-button, .x-popups-bonus-modal-button, .x-popups-consultores-modal-button, .x-popups-cadastro-modal-button, .x-botao-consultores-modal-button) { padding: 14px 16px 18px !important; }
    html.rg :is(.x-popups-geral-modal-button, .x-popups-bonus-modal-button, .x-popups-consultores-modal-button, .x-popups-cadastro-modal-button, .x-botao-consultores-modal-button) button { font-size: .92rem !important; }
}
@media (prefers-reduced-motion: reduce) {
    html.rg [class*="x-popups-"], html.rg [class*="x-popups-"] *, html.rg .x-botao-consultores-modal { animation: none !important; }
}
/* prêmio e transferências tinham altura fixa e "x" em linha própria */
html.rg :is(.x-popups-premio-loteria-mod, .x-popups-transfer-info-mod-chave, .x-popups-transfer-info-mod-giro, .x-popups-transfer-info-mod-rifa) { height: auto !important; min-height: 0 !important; }
html.rg :is(.x-popups-premio-loteria-mod-content, .x-popups-transfer-info-mod-content-chave, .x-popups-transfer-info-mod-content-giro, .x-popups-transfer-info-mod-content-rifa) { height: auto !important; }
html.rg :is(.x-popups-premio-loteria-mod-exit, .x-popups-transfer-info-mod-exit-chave, .x-popups-transfer-info-mod-exit-giro, .x-popups-transfer-info-mod-exit-rifa) button { position: static !important; display: grid; place-items: center; outline: none; }
html.rg :is(.x-popups-premio-loteria-mod-content, .x-popups-transfer-info-mod-content-chave, .x-popups-transfer-info-mod-content-giro, .x-popups-transfer-info-mod-content-rifa) { padding-top: 58px !important; }

/* ==========================================================================
   Relatório de ganhos (recargas e bônus, ManualRecharge) — layout novo (reaproveita rg-ex-*; cartões filtram a tabela)
   ========================================================================== */
html.rg .rg-ganhos .rg-ex-filtros { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
html.rg .rg-ganhos-cartoes { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 10px; }
html.rg .rg-ganhos-total {
    position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0;
    padding: 18px 20px; border-radius: 18px; border: 1px solid var(--rg-line); color: inherit; text-align: left; cursor: pointer;
    background: radial-gradient(420px 200px at 0% 0%, color-mix(in srgb, var(--rg-lima) 14%, transparent), transparent 70%), var(--rg-surface);
    transition: transform .12s, border-color .12s;
}
html.rg .rg-ganhos-total:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--rg-lima) 60%, transparent); }
html.rg .rg-ganhos-total.ativo { border-color: var(--rg-lima); box-shadow: 0 0 0 1px var(--rg-lima); }
html.rg .rg-ganhos-total > span { color: var(--rg-ink-3); font-weight: 800; font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; }
html.rg .rg-ganhos-total > b { font-family: var(--rg-font-display) !important; font-weight: 800; font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.2rem); color: var(--rg-lima-texto); line-height: 1.05; font-variant-numeric: tabular-nums; }
html.rg .rg-ganhos-total > b.neg { color: var(--rg-bad); }
html.rg .rg-ganhos-total > small { color: var(--rg-ink-3); font-size: .78rem !important; }
html.rg .rg-ganhos-total .rg-ex-barra { width: 100%; height: 8px; margin-top: 6px; }
html.rg .rg-ganhos-total > em { margin-top: 4px; font-style: normal; color: var(--rg-lima-texto); font-size: .74rem; font-weight: 700; }
html.rg .rg-ganhos .rg-ex-kpi { min-width: 0; padding: 16px; }
html.rg .rg-ganhos .rg-ex-kpi b { font-size: 1.3rem; }
html.rg .rg-ganhos .rg-ex-kpi small.rg-ganhos-explica { margin-top: 0; color: var(--rg-ink-3); font-weight: 600; }
html.rg .rg-ganhos .rg-ex-kpi small:last-child { margin-top: auto; padding-top: 6px; }
@media (max-width: 1199px) { html.rg .rg-ganhos-cartoes { grid-template-columns: repeat(3, minmax(0, 1fr)); } html.rg .rg-ganhos-total { grid-column: 1 / -1; } }
@media (max-width: 767px) { html.rg .rg-ganhos .rg-ex-filtros { grid-template-columns: 1fr; } }
@media (max-width: 575px) {
    html.rg .rg-ganhos-cartoes { grid-template-columns: 1fr 1fr; }
    html.rg .rg-ganhos .rg-ex-kpi:last-child { grid-column: 1 / -1; }
    html.rg .rg-ganhos .rg-ex-kpi b { font-size: 1.1rem; }
}

/* Extratos (Extract\Table) — layout novo; reaproveita rg-ex-* e os cartões do relatório de ganhos */
html.rg .rg-extr .rg-extr-violeta { background: var(--rg-violeta); }
html.rg .rg-extr .rg-extr-coral { background: var(--rg-coral); }
html.rg .rg-extr-filtros { grid-template-columns: minmax(0, 1fr) auto !important; align-items: center; }
html.rg .rg-extr-periodo { color: var(--rg-ink-3); font-weight: 700; font-size: .88rem; white-space: nowrap; }
html.rg .rg-extr-periodo i { color: var(--rg-lima-texto); margin-right: 4px; }
html.rg .rg-extr-desc { display: block; margin-top: 3px; color: var(--rg-ink-3); font-size: .76rem !important; }
html.rg .rg-extr-tag-bichao { background: rgba(245, 197, 66, .18); color: #fde68a; }
html.rg .rg-ex-valor.rg-extr-credito { color: #a7f3d0 !important; }
html.rg .rg-ex-valor.rg-extr-debito { color: #fca5a5 !important; }
@media (max-width: 767px) {
    html.rg .rg-extr-filtros { grid-template-columns: 1fr !important; }
    html.rg .rg-extr .rg-ex-tabela .table td[data-rotulo="Jogo"] { grid-column: 1 / -1; }
}


/* Configurações › Sistema (lista): valores longos (tokens, URLs) empurravam a coluna de editar para fora da tela */
html.rg #system_table { table-layout: fixed; width: 100% !important; }
html.rg #system_table th:first-child, html.rg #system_table td:first-child { width: 34%; overflow-wrap: anywhere; }
html.rg #system_table th.acoes, html.rg #system_table td:last-child { width: 72px; text-align: center; }
html.rg #system_table td:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.rg #system_table tr[data-editar] { cursor: pointer; }
html.rg #system_table tr[data-editar]:hover td { background: color-mix(in srgb, var(--rg-lima) 6%, transparent); }
@media (max-width: 575px) { html.rg #system_table th:first-child, html.rg #system_table td:first-child { width: 42%; } html.rg #system_table th.acoes, html.rg #system_table td:last-child { width: 56px; } }

/* =====================================================================
   CARTEIRA (rg-ct): saldo total em destaque com Depositar/Sacar/Converter,
   saldos separados por uso, chamada para jogar e atalhos de extrato/saques/recargas.
   ===================================================================== */
html.rg .rg-ct { max-width: 880px; margin: 8px auto 40px; display: flex; flex-direction: column; gap: 14px; }
html.rg .rg-ct-hero {
    position: relative; overflow: hidden; border-radius: 26px; padding: 26px 26px 22px; color: #fff; text-align: center;
    background: radial-gradient(120% 140% at 100% 0%, rgba(255, 255, 255, .2), transparent 55%), linear-gradient(135deg, var(--rg-violeta), var(--rg-rosa));
    box-shadow: 0 18px 50px rgba(139, 92, 246, .35);
}
html.rg .rg-ct-hero-brilho {
    position: absolute; inset: -40% auto auto -30%; width: 60%; height: 180%; pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .22), transparent); transform: rotate(18deg);
    animation: rg-ct-brilho 4.5s ease-in-out infinite;
}
@keyframes rg-ct-brilho { 0%, 55% { left: -60%; } 100% { left: 130%; } }
html.rg .rg-ct-sobre {
    display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; background: rgba(14, 7, 38, .3);
    font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
html.rg .rg-ct-rot { margin: 14px 0 2px; font-size: .9rem; font-weight: 700; opacity: .85; }
html.rg .rg-ct-total {
    display: block; font-family: var(--rg-font-display); font-size: clamp(2.2rem, 7vw, 3.4rem); line-height: 1.05;
    text-shadow: 0 4px 18px rgba(14, 7, 38, .35); font-variant-numeric: tabular-nums;
}
html.rg .rg-ct-total.chegou { animation: rg-ct-pulo .45s cubic-bezier(.2, 1.4, .4, 1); }
@keyframes rg-ct-pulo { 50% { transform: scale(1.06); } }
html.rg .rg-ct-acoes { display: flex; justify-content: center; gap: 10px; margin-top: 20px; flex-wrap: wrap; }
html.rg .rg-ct-btn {
    position: relative; height: 48px; padding: 0 20px; border-radius: 999px; display: inline-flex; align-items: center; gap: 8px;
    font-weight: 800; font-size: .98rem; text-decoration: none !important; transition: transform .12s ease, filter .12s ease;
}
html.rg .rg-ct-btn:active { transform: scale(.96); }
html.rg .rg-ct-btn:hover { filter: brightness(1.08); }
html.rg .rg-ct-depositar { background: var(--rg-lima); color: var(--rg-on-lima) !important; animation: rg-deposito-pulso 1.8s ease-out infinite; }
html.rg .rg-ct-depositar em {
    position: absolute; top: -9px; right: -6px; padding: 2px 7px; border-radius: 999px; font-style: normal; font-size: .6rem; font-weight: 900;
    background: var(--rg-gold); color: var(--rg-tinta); box-shadow: 0 2px 6px rgba(0, 0, 0, .25); white-space: nowrap;
}
html.rg .rg-ct-sacar, html.rg .rg-ct-converter { background: rgba(14, 7, 38, .32); color: #fff !important; border: 1.5px solid rgba(255, 255, 255, .35); }
html.rg .rg-ct-sacar i { color: var(--rg-gold); }

html.rg .rg-ct-saldos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
html.rg .rg-ct-saldos.tres { grid-template-columns: repeat(3, 1fr); }
html.rg .rg-ct-saldo {
    display: flex; gap: 12px; align-items: flex-start; padding: 16px; border-radius: 20px;
    background: var(--rg-surface); border: 1px solid var(--rg-line-2);
}
html.rg .rg-ct-saldo small { display: block; font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--rg-ink-3); }
html.rg .rg-ct-saldo strong { display: block; font-family: var(--rg-font-display); font-size: 1.45rem; color: #fff; line-height: 1.15; margin-top: 2px; }
html.rg .rg-ct-saldo p { margin: 4px 0 0; font-size: .78rem; color: var(--rg-ink-3); line-height: 1.3; }
html.rg .rg-ct-ico {
    flex: none; width: 42px; height: 42px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; font-size: 1rem;
    background: rgba(255, 255, 255, .07); color: var(--rg-lima-texto);
}
html.rg .rg-ct-saldo-jogar .rg-ct-ico { background: color-mix(in srgb, var(--rg-lima) 14%, transparent); color: var(--rg-lima-texto); }
html.rg .rg-ct-saldo-sacar .rg-ct-ico { background: rgba(250, 204, 21, .16); color: var(--rg-gold); }
html.rg .rg-ct-saldo-comissao .rg-ct-ico { background: rgba(236, 72, 153, .16); color: var(--rg-rosa); }

html.rg .rg-ct-jogar {
    display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 20px; text-decoration: none !important; color: var(--rg-on-lima) !important;
    background: linear-gradient(135deg, var(--rg-lima), #a3e635); box-shadow: 0 10px 26px color-mix(in srgb, var(--rg-lima) 25%, transparent);
    transition: transform .12s ease;
}
html.rg .rg-ct-jogar:hover { transform: translateY(-2px); }
html.rg .rg-ct-jogar-ico {
    flex: none; width: 44px; height: 44px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center;
    background: var(--rg-tinta); color: var(--rg-lima-texto); font-size: 1.15rem; animation: rg-ct-dado 2.6s ease-in-out infinite;
}
@keyframes rg-ct-dado { 0%, 70%, 100% { transform: rotate(0); } 78% { transform: rotate(-14deg); } 86% { transform: rotate(12deg); } 94% { transform: rotate(-6deg); } }
html.rg .rg-ct-jogar-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
html.rg .rg-ct-jogar-txt b { font-size: 1rem; font-weight: 900; }
html.rg .rg-ct-jogar-txt small { font-size: .8rem; font-weight: 600; opacity: .8; }

html.rg .rg-ct-links { display: flex; flex-direction: column; padding: 6px; border-radius: 20px; background: var(--rg-surface); border: 1px solid var(--rg-line-2); }
html.rg .rg-ct-links a {
    display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; column-gap: 12px; align-items: center;
    padding: 10px; border-radius: 14px; color: #fff !important; text-decoration: none !important;
}
html.rg .rg-ct-links a + a { border-top: 1px solid rgba(255, 255, 255, .06); border-radius: 0 0 14px 14px; }
html.rg .rg-ct-links a:hover { background: rgba(255, 255, 255, .05); }
html.rg .rg-ct-links .rg-ct-ico { grid-row: 1 / 3; width: 38px; height: 38px; font-size: .9rem; }
html.rg .rg-ct-links b { font-size: .95rem; font-weight: 800; }
html.rg .rg-ct-links small { grid-column: 2; font-size: .76rem; color: var(--rg-ink-3); }
html.rg .rg-ct-links a::after { content: "\f054"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: .72rem; opacity: .35; grid-column: 3; grid-row: 1 / 3; }

@media (max-width: 767px) {
    html.rg .rg-ct { margin-top: 0; gap: 12px; }
    html.rg .rg-ct-hero { padding: 20px 16px 18px; border-radius: 22px; }
    html.rg .rg-ct-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    html.rg .rg-ct-depositar { grid-column: 1 / -1; justify-content: center; }
    html.rg .rg-ct-sacar, html.rg .rg-ct-converter { justify-content: center; padding: 0 10px; }
    html.rg .rg-ct-saldos, html.rg .rg-ct-saldos.tres { grid-template-columns: 1fr; gap: 10px; }
    html.rg .rg-ct-saldo { padding: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    html.rg .rg-ct-hero-brilho, html.rg .rg-ct-jogar-ico, html.rg .rg-ct-depositar { animation: none; }
}

/* carrinho da barra do topo: mesmo desenho do ícone de perfil, em dourado, com o contador em selo */
html.rg .rg-avatar.rg-carrinho {
    position: relative; color: var(--rg-tinta);
    background: linear-gradient(135deg, var(--rg-gold), #f97316);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, .9), 0 6px 16px rgba(249, 115, 22, .45);
}
html.rg .main-header .btn-config:hover .rg-carrinho { box-shadow: 0 0 0 2px var(--rg-lima), 0 6px 18px color-mix(in srgb, var(--rg-lima) 35%, transparent); }
html.rg .rg-carrinho .nav-cart-badge {
    position: absolute; top: -6px !important; right: -7px !important; left: auto !important; margin: 0 !important;
    min-width: 18px; height: 18px; padding: 0 5px !important; border-radius: 99px !important;
    display: grid; place-items: center; font-size: 10px !important; font-weight: 900; line-height: 1;
    background: #ef4444 !important; color: #fff !important; border: 2px solid #120a2e !important;
    animation: rg-dp-pop .5s cubic-bezier(.2, 1.6, .4, 1);
}
html.rg .rg-carrinho .nav-cart-badge[style*="display:none"], html.rg .rg-carrinho .nav-cart-badge[style*="display: none"] { display: none !important; }
html.rg .main-header .navbar-nav.ml-auto > #navCartItem { margin-left: 8px !important; }
@media (max-width: 767px) {
    html.rg .main-header .navbar-nav.ml-auto > #navCartItem { margin-left: 4px !important; }
}
@media (max-width: 767px) {
    /* com o carrinho na barra, o saldo perde o ícone de moeda para tudo caber sem cortar */
    html.rg .main-header:has(#navCartItem:not([style*="display:none"]):not([style*="display: none"])) .btn-money { padding-left: 0 !important; }
    html.rg .main-header:has(#navCartItem:not([style*="display:none"]):not([style*="display: none"])) .btn-money::before { display: none !important; }
    html.rg .main-header:has(#navCartItem:not([style*="display:none"]):not([style*="display: none"])) .nav-item:has(.btn-money) { padding-left: 10px; }
}
@media (max-width: 365px) {
    html.rg .main-header:has(#navCartItem:not([style*="display:none"]):not([style*="display: none"])) .rg-avatar { width: 28px; height: 28px; min-width: 28px; max-height: 28px; }
    html.rg .main-header:has(#navCartItem:not([style*="display:none"]):not([style*="display: none"])) .rg-avatar svg { width: 14px; height: 14px; }
    html.rg .main-header:has(#navCartItem:not([style*="display:none"]):not([style*="display: none"])) .navbar-nav.ml-auto > .nav-item:has(.btn-config),
    html.rg .main-header .navbar-nav.ml-auto > #navCartItem { margin-left: 2px !important; }
    html.rg .main-header:has(#navCartItem:not([style*="display:none"]):not([style*="display: none"])) .nav-item:has(.btn-money) { padding-left: 8px; }
    html.rg .main-header:has(#navCartItem:not([style*="display:none"]):not([style*="display: none"])) .btn-despositar[href*="deposito"] { padding: 0 7px 0 3px !important; margin-left: 4px; }
}

/* =====================================================================
   CONVERTER (rg-cv): Pode sacar → Para jogar com prévia ao vivo dos dois saldos,
   atalhos 25%/50%/Tudo e botão grande. Campo e ação são os da tela antiga.
   ===================================================================== */
html.rg .rg-cv { max-width: 560px; margin: 8px auto 40px; display: flex; flex-direction: column; gap: 14px; color: #fff; }
html.rg .rg-cv-voltar { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: .88rem; color: var(--rg-ink-3) !important; text-decoration: none !important; }
html.rg .rg-cv-voltar:hover { color: #fff !important; }
html.rg .rg-cv-topo { text-align: center; }
html.rg .rg-cv-ico-topo {
    width: 58px; height: 58px; border-radius: 18px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.4rem;
    background: linear-gradient(135deg, var(--rg-violeta), var(--rg-rosa)); box-shadow: 0 10px 26px rgba(139, 92, 246, .4);
}
html.rg .rg-cv-topo h1 { margin: 12px 0 4px; font-family: var(--rg-font-display); font-size: 1.7rem; color: #fff; }
html.rg .rg-cv-topo p { margin: 0; color: var(--rg-ink-3); font-size: .92rem; }

html.rg .rg-cv-fluxo { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; }
html.rg .rg-cv-lado { padding: 16px 14px; border-radius: 20px; background: var(--rg-surface); border: 1px solid var(--rg-line-2); text-align: center; min-width: 0; transition: border-color .2s ease, transform .2s ease; }
html.rg .rg-cv-lado small { display: block; font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--rg-ink-3); }
html.rg .rg-cv-lado strong { display: block; margin-top: 4px; font-family: var(--rg-font-display); font-size: 1.35rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
html.rg .rg-cv-lado em { display: block; margin-top: 2px; font-style: normal; font-size: .76rem; font-weight: 800; }
html.rg .rg-cv-de strong { color: var(--rg-gold); }
html.rg .rg-cv-de em { color: var(--rg-ink-3); text-decoration: line-through; }
html.rg .rg-cv-para strong { color: var(--rg-lima-texto); }
html.rg .rg-cv-para em { color: var(--rg-lima-texto); }
html.rg .rg-cv-ativo .rg-cv-para { border-color: var(--rg-lima); transform: scale(1.03); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 12%, transparent); }
html.rg .rg-cv-seta {
    width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    background: var(--rg-surface-2); color: var(--rg-lima-texto); border: 1px solid var(--rg-line-2);
}
html.rg .rg-cv-ativo .rg-cv-seta { background: var(--rg-lima); color: var(--rg-on-lima); animation: rg-cv-seta 1s ease-in-out infinite; }
@keyframes rg-cv-seta { 50% { transform: translateX(4px); } }

html.rg .rg-cv-form, html.rg .rg-cv-vazio { padding: 20px; border-radius: 22px; background: var(--rg-surface); border: 1px solid var(--rg-line-2); display: flex; flex-direction: column; gap: 12px; }
html.rg .rg-cv-form label { margin: 0; font-weight: 800; font-size: .95rem; color: #fff; }
html.rg .rg-cv-campo {
    display: flex; align-items: center; gap: 8px; padding: 0 16px; height: 62px; border-radius: 16px;
    background: #0e0726; border: 2px solid var(--rg-line-2); transition: border-color .15s ease, box-shadow .15s ease;
}
html.rg .rg-cv-campo:focus-within { border-color: var(--rg-lima); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rg-lima) 15%, transparent); }
html.rg .rg-cv-campo span { font-family: var(--rg-font-display); font-size: 1.3rem; color: var(--rg-ink-3); }
html.rg .rg-cv-campo input {
    flex: 1; min-width: 0; height: 100%; border: 0 !important; outline: 0; background: transparent !important; box-shadow: none !important;
    color: #fff !important; font-family: var(--rg-font-display); font-size: 1.6rem; padding: 0 !important;
}
html.rg .rg-cv-campo input::placeholder { color: rgba(255, 255, 255, .25); }
html.rg .rg-cv-atalhos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
html.rg .rg-cv-atalhos button {
    height: 40px; border-radius: 999px; border: 1.5px solid var(--rg-line-2); background: var(--rg-surface-2); color: #fff;
    font-weight: 800; font-size: .9rem; cursor: pointer; transition: transform .1s ease, background .15s ease;
}
html.rg .rg-cv-atalhos button:active { transform: scale(.95); }
html.rg .rg-cv-atalhos button.ativo { background: color-mix(in srgb, var(--rg-lima) 15%, transparent); border-color: var(--rg-lima); color: var(--rg-lima-texto); }
html.rg .rg-cv-aviso { margin: 0; font-size: .82rem; font-weight: 700; color: #fca5a5; }
html.rg .rg-cv-btn {
    height: 54px; border-radius: 999px; border: 0; display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
    background: var(--rg-lima); color: var(--rg-on-lima) !important; font-weight: 900; font-size: 1.05rem; text-decoration: none !important;
    box-shadow: 0 10px 26px color-mix(in srgb, var(--rg-lima) 30%, transparent); cursor: pointer; transition: transform .12s ease, filter .12s ease;
}
html.rg .rg-cv-btn:hover { filter: brightness(1.06); }
html.rg .rg-cv-btn:active { transform: scale(.97); }
html.rg .rg-cv-btn[disabled] { opacity: .7; }
html.rg .rg-cv-nota { margin: 0; text-align: center; font-size: .78rem; color: var(--rg-ink-3); }
html.rg .rg-cv-vazio { align-items: center; text-align: center; }
html.rg .rg-cv-vazio > span { width: 56px; height: 56px; border-radius: 18px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.4rem; background: rgba(250, 204, 21, .14); color: var(--rg-gold); }
html.rg .rg-cv-vazio b { font-size: 1.05rem; }
html.rg .rg-cv-vazio p { margin: 0; color: var(--rg-ink-3); font-size: .88rem; }

@media (max-width: 767px) {
    html.rg .rg-cv { margin-top: 0; gap: 12px; }
    html.rg .rg-cv-fluxo { gap: 6px; }
    html.rg .rg-cv-lado { padding: 12px 8px; border-radius: 16px; }
    html.rg .rg-cv-lado strong { font-size: 1.05rem; }
    html.rg .rg-cv-seta { width: 32px; height: 32px; font-size: .8rem; }
    html.rg .rg-cv-form, html.rg .rg-cv-vazio { padding: 16px; }
}
@media (max-width: 360px) {
    html.rg .rg-cv-lado strong { font-size: .92rem; }
    html.rg .rg-cv-lado small { font-size: .6rem; }
}
@media (max-width: 767px) {
    html.rg .rg-cv-lado small { font-size: .62rem; letter-spacing: .03em; white-space: nowrap; }
    html.rg .rg-cv-ativo .rg-cv-para { transform: none; }
    html.rg .rg-cv-lado em { font-size: .7rem; }
}
@media (max-width: 360px) {
    html.rg .rg-cv-lado { padding: 12px 6px; }
    html.rg .rg-cv-lado small { font-size: .56rem; letter-spacing: .02em; }
    html.rg .rg-cv-seta { width: 28px; height: 28px; }
}

/* =====================================================================
   HOME COMPACTA - Sua jornada, Sequência, Roleta e "Indique e Ganhe" mais baixos,
   para a fileira "Jogos de Hoje" aparecer logo ao entrar
   ===================================================================== */
html.rg .rg-jornada { padding: 14px 18px; margin-bottom: 12px; }
html.rg .rg-jornada h3 { font-size: clamp(1.15rem, 1rem + .6vw, 1.45rem) !important; margin: 0; }
html.rg .rg-jornada-destaque b { font-size: clamp(1.05rem, .95rem + .5vw, 1.3rem); }
html.rg .rg-jornada-destaque span { font-size: .8rem; }
html.rg .rg-jornada-trilha { margin: 12px 0 10px; }
html.rg .rg-jornada-trilha::before, html.rg .rg-jornada-trilha::after { top: 18px; height: 6px; }
html.rg .rg-jornada-trilha::after { --rg-no-meio: 21px; }
html.rg .rg-jornada-no { width: 42px; height: 42px; border-radius: 12px; font-size: .85rem; }
html.rg .rg-jornada-no i { font-size: 1.05rem; }
html.rg .rg-jornada-etapa { gap: 5px; }
html.rg .rg-jornada-etapa.atual .rg-jornada-no { border-width: 3px; box-shadow: 0 0 0 3px rgba(255, 255, 255, .9), 0 6px 16px color-mix(in srgb, var(--rg-lima) 30%, transparent); }
html.rg .rg-jornada-rotulo { font-size: .74rem; }
html.rg .rg-jornada-atual { padding: 8px 12px; gap: 10px; border-radius: 14px; }
html.rg .rg-jornada-atual-marca { width: 38px; height: 38px; border-radius: 10px; font-size: .85rem; }
html.rg .rg-jornada-atual-texto b { font-size: .92rem; }
html.rg .rg-jornada-atual-texto span { font-size: .8rem; }
html.rg .rg-jornada-status { padding: 5px 12px; font-size: .78rem; }

html.rg .rg-painel-grade { gap: 12px; }
html.rg .rg-painel-lado { gap: 12px; }
html.rg .rg-painel .rg-bloco { padding: 12px 16px; }
html.rg .rg-bloco-topo { margin-bottom: 6px; }
html.rg .rg-sequencia-dias { margin: 0 0 6px; }
html.rg .rg-sequencia-dia { gap: 3px; }
html.rg .rg-sequencia-caixa { width: 28px; height: 28px; border-radius: 8px; }
html.rg .rg-sequencia p { font-size: .85rem; }
html.rg .rg-roleta { grid-template-columns: 84px minmax(0, 1fr); gap: 12px; padding: 12px 16px; }
html.rg .rg-roleta-texto { gap: 3px; }
html.rg .rg-roleta-texto h3 { font-size: 1rem !important; }
html.rg .rg-roleta-texto p { font-size: .8rem; }
html.rg .rg-roleta-btn { padding: 7px 10px; font-size: .88rem; }
html.rg .rg-roleta-link { font-size: .8rem; }

/* Indique e ganhe: título, link e botões numa faixa só */
html.rg .card-afiliado { margin-bottom: 12px; }
html.rg .card-afiliado .indica-card { margin: 0 !important; padding: 10px 16px 0 !important; }
html.rg .card-afiliado .card-title { font-size: .98rem !important; }
html.rg .card-afiliado .card-body { display: flex; align-items: center; gap: 8px; padding: 8px 16px 12px !important; }
html.rg .card-afiliado .card-body > .row { margin: 0 !important; }
html.rg .card-afiliado .card-body > .row:first-child { flex: 1 1 auto; min-width: 0; }
html.rg .card-afiliado .card-body > .row > [class*="col-"] { padding: 0 !important; }
html.rg .card-afiliado .card-body > .row:last-child { flex: none; }
html.rg .card-afiliado .card-body > .row:last-child > div { display: flex; gap: 6px; }
html.rg .card-afiliado .input-group { margin: 0 !important; }
html.rg .card-afiliado .card-body .btn { margin: 0 !important; padding: 6px 12px; font-size: .85rem; }

@media (max-width: 767px) {
    html.rg .rg-jornada { padding: 12px 14px; }
    html.rg .rg-jornada-sobre { display: none; }
    html.rg .rg-jornada-topo { flex-wrap: nowrap; align-items: center; gap: 10px; }
    html.rg .rg-jornada-destaque { text-align: right; }
    html.rg .rg-jornada-destaque span { display: none; }
    html.rg .rg-jornada-trilha { margin: 10px 0 8px; }
    html.rg .rg-jornada-trilha::before, html.rg .rg-jornada-trilha::after { top: 14px; height: 5px; }
    html.rg .rg-jornada-trilha::after { --rg-no-meio: 16px; }
    html.rg .rg-jornada-no { width: 32px; height: 32px; border-radius: 9px; font-size: .72rem; }
    html.rg .rg-jornada-no i { font-size: .85rem; }
    html.rg .rg-jornada-etapa.atual .rg-jornada-no { border-width: 2px; box-shadow: 0 0 0 2px rgba(255, 255, 255, .9); }
    html.rg .rg-jornada-etapa.feito .rg-jornada-no::after { width: 15px; height: 15px; right: -5px; bottom: -5px; font-size: .5rem; }
    html.rg .rg-jornada-rotulo { font-size: .58rem; }
    /* faixa de baixo: selo + nome + barra; o texto longo e o "Em andamento" saem (a barra já mostra quanto falta) */
    html.rg .rg-jornada-atual { flex-wrap: wrap; padding: 8px 10px; gap: 6px 10px; }
    html.rg .rg-jornada-atual-marca { width: 30px; height: 30px; border-radius: 8px; font-size: .72rem; }
    html.rg .rg-jornada-atual-texto { flex: 1 1 0; }
    html.rg .rg-jornada-atual-texto span, html.rg .rg-jornada-status { display: none; }
    html.rg .rg-jornada-barra { flex: 1 1 100%; }

    html.rg .rg-painel-grade, html.rg .rg-painel-lado { gap: 10px; }
    html.rg .rg-painel .rg-bloco { padding: 10px 14px; }
    html.rg .rg-sequencia-caixa { width: 24px; height: 24px; border-radius: 7px; font-size: .7rem; }
    html.rg .rg-sequencia-letra { font-size: .62rem; }
    html.rg .rg-sequencia p { display: none; }
    html.rg .rg-roleta { grid-template-columns: 64px minmax(0, 1fr); gap: 10px; padding: 10px 14px; }
    html.rg .rg-roleta-texto p { display: none; }
    html.rg .rg-roleta-texto { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 8px; }
    html.rg .rg-roleta-sobre, html.rg .rg-roleta-texto h3 { grid-column: 1 / -1; }
    html.rg .rg-roleta-btn { margin: 0; padding: 6px 10px; font-size: .82rem; }
    html.rg .rg-roleta-link { white-space: nowrap; }

    html.rg .card-afiliado .card-body { padding: 6px 12px 10px !important; gap: 6px; }
    /* no celular os botões de compartilhar ficam só com o ícone, na mesma linha do link */
    html.rg .card-afiliado .card-body > .row:last-child .btn { font-size: 0 !important; padding: 6px 9px; }
    html.rg .card-afiliado .card-body > .row:last-child .btn i { font-size: 1rem; }
    html.rg .card-afiliado .input-group .form-control { font-size: .78rem; padding: 4px 8px; height: 34px; }
    html.rg .card-afiliado .input-group .btn { font-size: .8rem; padding: 4px 9px; }
}
@media (max-width: 767px) { html.rg .rg-roleta-btn { white-space: nowrap; } }
@media (max-width: 360px) {
    html.rg .rg-roleta-link { font-size: .74rem; }
    html.rg .rg-roleta-btn { padding: 6px 8px; font-size: .78rem; }
    html.rg .card-afiliado .card-title { font-size: .88rem !important; }
}
/* 320px: o botão não cabe ao lado de "Meus prêmios" escrito; fica só o troféu */
@media (max-width: 360px) {
    html.rg .rg-roleta-texto { grid-template-columns: minmax(0, 1fr) auto; }
    html.rg .rg-roleta-link { font-size: 0 !important; padding: 4px; }
    html.rg .rg-roleta-link i { font-size: 1.15rem; }
}

/* =====================================================================
   CARDS DE JOGO (partials/roupagem/card-jogo) em fileiras que deslizam (partials/roupagem/jogos-fileiras):
   "Jogos de Hoje" e "Jogos de Amanhã" logo abaixo dos atalhos
   ===================================================================== */
html.rg .rg-fileira { margin: 4px 0 14px; }
html.rg .rg-fileira-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
html.rg .rg-fileira-topo h2 {
    display: flex; align-items: center; gap: 8px; margin: 0;
    font-family: var(--rg-font-display) !important; font-size: clamp(1.1rem, 1rem + .5vw, 1.4rem) !important; color: #fff;
}
html.rg .rg-fileira-qtd {
    padding: 2px 9px; border-radius: 999px; background: var(--rg-surface-2); color: var(--rg-lima-texto);
    font-family: var(--rg-font) !important; font-size: .74rem; font-weight: 800;
}
html.rg .rg-fileira-trilho {
    /* todos os jogos à vista: grade que quebra linha, sem rolagem lateral */
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 12px;
    padding: 6px 0 10px;
}
html.rg .rg-jogo {
    --rg-cor-jogo: var(--rg-violeta);
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 8px;
    border-radius: 20px;
    background: linear-gradient(165deg, color-mix(in srgb, var(--rg-cor-jogo) 24%, var(--rg-surface)) 0%, var(--rg-surface) 55%);
    border: 1.5px solid color-mix(in srgb, var(--rg-cor-jogo) 45%, transparent);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .32);
    color: #fff !important;
    text-decoration: none !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
html.rg .rg-jogo:nth-child(6n+1) { --rg-cor-jogo: var(--rg-lima); }
html.rg .rg-jogo:nth-child(6n+2) { --rg-cor-jogo: var(--rg-gold); }
html.rg .rg-jogo:nth-child(6n+3) { --rg-cor-jogo: var(--rg-violeta); }
html.rg .rg-jogo:nth-child(6n+4) { --rg-cor-jogo: var(--rg-sky); }
html.rg .rg-jogo:nth-child(6n+5) { --rg-cor-jogo: var(--rg-coral); }
html.rg .rg-jogo:nth-child(6n+6) { --rg-cor-jogo: var(--rg-rosa); }
html.rg .rg-jogo:hover {
    transform: translateY(-4px);
    border-color: var(--rg-cor-jogo);
    box-shadow: 0 16px 32px color-mix(in srgb, var(--rg-cor-jogo) 30%, rgba(0, 0, 0, .4));
}
html.rg .rg-jogo:active { transform: scale(.97); }

html.rg .rg-jogo-midia {
    position: relative;
    display: block;
    aspect-ratio: 165 / 192;
    border-radius: 14px;
    overflow: hidden;
    background: var(--rg-surface-2);
}
html.rg .rg-jogo-midia img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
html.rg .rg-jogo:hover .rg-jogo-midia img { transform: scale(1.06); }
/* sombra no pé do banner + reflexo que passa pelo card */
html.rg .rg-jogo-midia::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .25) 0%, transparent 28%, transparent 70%, rgba(0, 0, 0, .35) 100%);
    pointer-events: none;
}
html.rg .rg-jogo-brilho {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 255, .38) 50%, transparent 62%);
    transform: translateX(-130%);
    pointer-events: none;
    animation: rg-jogo-brilho 6s ease-in-out infinite;
}
html.rg .rg-jogo:nth-child(3n+2) .rg-jogo-brilho { animation-delay: 2s; }
html.rg .rg-jogo:nth-child(3n+3) .rg-jogo-brilho { animation-delay: 4s; }
@keyframes rg-jogo-brilho { 0%, 70% { transform: translateX(-130%); } 85%, 100% { transform: translateX(130%); } }

html.rg .rg-jogo-selo {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(12, 9, 34, .78);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, .18);
    color: #fff;
    font-size: .74rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}
html.rg .rg-jogo-selo i { color: var(--rg-cor-jogo); }
html.rg .rg-jogo-selo-vivo { left: 8px; right: auto; background: var(--rg-coral); border-color: transparent; color: var(--rg-tinta); text-transform: uppercase; letter-spacing: .04em; }
html.rg .rg-jogo-selo-vivo::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: rg-vivo 1.2s ease-in-out infinite; }
html.rg .rg-jogo.ao-vivo { border-color: var(--rg-coral); box-shadow: 0 0 0 3px color-mix(in srgb, var(--rg-coral) 30%, transparent), 0 10px 24px rgba(0, 0, 0, .32); }

html.rg .rg-jogo-info { display: flex; flex-direction: column; gap: 2px; padding: 9px 4px 8px; min-width: 0; }
html.rg .rg-jogo-nome {
    font-family: var(--rg-font-display) !important;
    font-size: .98rem;
    line-height: 1.2;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
html.rg .rg-jogo-tempo { color: var(--rg-ink-2); font-size: .76rem; font-weight: 600; }
html.rg .rg-jogo-tempo > i { display: none; color: var(--rg-cor-jogo); font-size: .9em; }
@media (max-width: 360px) { html.rg .rg-jogo-tempo > i { display: inline; } }
html.rg .rg-jogo-tempo [data-rg-contagem] { color: #fff; font-weight: 800; font-variant-numeric: tabular-nums; }
html.rg .rg-jogo-tempo [data-rg-contagem].urgente { color: var(--rg-coral); }
/* falta menos de 1 hora: o card acende em coral */
html.rg .rg-jogo:has([data-rg-contagem].urgente) { border-color: var(--rg-coral); }
html.rg .rg-jogo:has([data-rg-contagem].urgente) .rg-jogo-selo { background: var(--rg-coral); color: var(--rg-tinta); animation: rg-pulse 1.6s ease-in-out infinite; }
html.rg .rg-jogo:has([data-rg-contagem].urgente) .rg-jogo-selo i { color: var(--rg-tinta); }

html.rg .rg-jogo-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: auto;
    padding: 9px 10px;
    border-radius: 12px;
    background: var(--rg-cor-jogo);
    color: var(--rg-tinta);
    font-weight: 800;
    font-size: .86rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    box-shadow: 0 6px 14px color-mix(in srgb, var(--rg-cor-jogo) 35%, transparent);
}
html.rg .rg-jogo-cta i { transition: transform .2s ease; }
html.rg .rg-jogo:hover .rg-jogo-cta i { transform: translateX(4px); }

@media (max-width: 767px) {
    /* celular: três cards por linha */
    html.rg .rg-fileira { margin: 0 0 10px; }
    html.rg .rg-fileira-topo { margin-bottom: 4px; }
    html.rg .rg-fileira-trilho { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 6px 0 8px; }
    html.rg .rg-jogo { padding: 6px; border-radius: 16px; }
    html.rg .rg-jogo-midia { border-radius: 11px; }
    html.rg .rg-jogo-selo { top: 5px; right: 5px; padding: 2px 7px; font-size: .66rem; gap: 4px; }
    html.rg .rg-jogo-selo-vivo { left: 5px; }
    html.rg .rg-jogo-info { padding: 6px 2px 6px; }
    html.rg .rg-jogo-nome { font-size: .82rem; }
    html.rg .rg-jogo-tempo { font-size: .74rem; white-space: nowrap; }
    /* três por linha: "Sorteio em" não cabe; fica a ampulheta + a contagem */
    html.rg .rg-jogo-tempo-rot { display: none; }
    html.rg .rg-jogo-cta { padding: 6px; border-radius: 10px; font-size: .72rem; gap: 5px; }
}
@media (max-width: 360px) {
    html.rg .rg-fileira-trilho { gap: 6px; }
    html.rg .rg-jogo { padding: 5px; }
}
@media (prefers-reduced-motion: reduce) {
    html.rg .rg-jogo-brilho { animation: none; display: none; }
    html.rg .rg-jogo:has([data-rg-contagem].urgente) .rg-jogo-selo { animation: none; }
}

/* =====================================================================
   BOTÃO "SUA JORNADA" (partials/roupagem/painel): recolhe Jornada, Sequência, Roleta e Indique e ganhe.
   Começa fechado; abre e fecha deslizando.
   ===================================================================== */
html.rg .rg-recolhe-btn {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    margin: 4px 0 12px;
    padding: 12px 14px 16px;
    border: 0;
    border-radius: 20px;
    overflow: hidden;
    color: #fff;
    text-align: left;
    cursor: pointer;
    background: linear-gradient(110deg, #6d3df5 0%, #b43be0 40%, #ff5fa2 70%, #f5c542 100%);
    background-size: 220% 100%;
    box-shadow: 0 10px 26px rgba(180, 59, 224, .45), inset 0 0 0 1.5px rgba(255, 255, 255, .25);
    animation: rg-recolhe-fundo 6s ease-in-out infinite;
    transition: transform .15s ease;
}
html.rg .rg-recolhe-btn:active { transform: scale(.98); }
/* reflexo passando de tempos em tempos */
html.rg .rg-recolhe-btn::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .45) 50%, transparent 65%);
    transform: translateX(-120%);
    animation: rg-jogo-brilho 4s ease-in-out infinite;
    pointer-events: none;
}
@keyframes rg-recolhe-fundo { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
html.rg .rg-recolhe-btn-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
html.rg .rg-recolhe-btn-topo > b { flex: 1; min-width: 0; font-family: var(--rg-font-display) !important; font-size: 1.1rem; text-shadow: 0 2px 6px rgba(0, 0, 0, .25); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.rg .rg-recolhe-btn-acao { flex: none; }
html.rg .rg-recolhe-btn-topo > b i { color: #fff3b0; margin-right: 4px; }
html.rg .rg-recolhe-btn-acao { display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; font-weight: 800; white-space: nowrap; }
html.rg .rg-recolhe-btn-seta {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #fff;
    color: #6d3df5;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .2);
    transition: transform .35s ease;
    animation: rg-recolhe-quica 1.8s ease-in-out infinite;
}
@keyframes rg-recolhe-quica { 0%, 100% { translate: 0 0; } 50% { translate: 0 3px; } }
html.rg .rg-recolhe-btn[aria-expanded="true"] .rg-recolhe-btn-seta { transform: rotate(180deg); animation: none; }

/* um mini-cartão para cada coisa que está dentro: Jornada, Sequência, Roleta, Indique */
html.rg .rg-recolhe-btn-itens { display: grid; grid-template-columns: repeat(var(--rg-itens), minmax(0, 1fr)); gap: 8px; }
html.rg .rg-recolhe-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 8px 4px 7px;
    border-radius: 14px;
    background: rgba(20, 16, 46, .55);
    border: 1px solid rgba(255, 255, 255, .18);
    text-align: center;
    min-width: 0;
}
html.rg .rg-recolhe-item i {
    display: grid; place-items: center; width: 30px; height: 30px; margin-bottom: 2px; border-radius: 10px;
    font-size: .95rem; color: var(--rg-tinta);
    animation: rg-recolhe-icone 2.4s ease-in-out infinite;
}
html.rg .rg-recolhe-item:nth-child(2) i { animation-delay: .3s; }
html.rg .rg-recolhe-item:nth-child(3) i { animation-delay: .6s; }
html.rg .rg-recolhe-item:nth-child(4) i { animation-delay: .9s; }
@keyframes rg-recolhe-icone { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12) rotate(-6deg); } }
html.rg .rg-recolhe-item-jornada i { background: var(--rg-gold); }
html.rg .rg-recolhe-item-sequencia i { background: var(--rg-coral); }
html.rg .rg-recolhe-item-roleta i { background: var(--rg-sky); }
html.rg .rg-recolhe-item-indique i { background: var(--rg-lima); }
html.rg .rg-recolhe-item b { font-size: .8rem; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
html.rg .rg-recolhe-item small { font-size: .7rem; font-weight: 700; opacity: .85; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
/* tem giro para usar: o cartão da roleta acende */
html.rg .rg-recolhe-item.tem { background: var(--rg-lima); color: var(--rg-on-lima); border-color: transparent; animation: rg-pulse 1.6s ease-in-out infinite; }
html.rg .rg-recolhe-item.tem i { background: var(--rg-tinta); color: var(--rg-lima-texto); }
/* quanto já andou na jornada, numa linha fina no pé do botão */
html.rg .rg-recolhe-btn-barra { position: absolute; left: 0; right: 0; bottom: 0; height: 5px; background: rgba(20, 16, 46, .35); }
html.rg .rg-recolhe-btn-barra span { display: block; height: 100%; background: var(--rg-lima); box-shadow: 0 0 10px color-mix(in srgb, var(--rg-lima) 80%, transparent); }

/* o bloco desliza: 0fr fechado, 1fr aberto */
html.rg .rg-recolhe { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .45s ease; }
html.rg .rg-recolhe.aberto { grid-template-rows: 1fr; }
html.rg .rg-recolhe-miolo { min-height: 0; overflow: hidden; opacity: 0; transform: translateY(-10px); transition: opacity .3s ease, transform .4s ease; }
html.rg .rg-recolhe.aberto .rg-recolhe-miolo { opacity: 1; transform: none; padding-bottom: 4px; }
html.rg .rg-recolhe:not(.aberto) .rg-recolhe-miolo { visibility: hidden; transition: opacity .3s ease, transform .4s ease, visibility 0s .45s; }

@media (max-width: 767px) {
    html.rg .rg-recolhe-btn { gap: 8px; padding: 10px 10px 14px; border-radius: 18px; margin: 2px 0 10px; }
    html.rg .rg-recolhe-btn-topo > b { font-size: .98rem; }
    html.rg .rg-recolhe-btn-acao { font-size: .7rem; gap: 6px; }
    html.rg .rg-recolhe-btn-seta { width: 26px; height: 26px; }
    html.rg .rg-recolhe-btn-itens { gap: 6px; }
    html.rg .rg-recolhe-item { padding: 6px 2px; border-radius: 12px; }
    html.rg .rg-recolhe-item i { width: 26px; height: 26px; border-radius: 8px; font-size: .82rem; }
    html.rg .rg-recolhe-item b { font-size: .7rem; }
    html.rg .rg-recolhe-item small { font-size: .62rem; }
}
/* celular: o título ocupa a linha; fica só a seta (que quica) como chamada */
@media (max-width: 480px) { html.rg .rg-recolhe-btn-acao-txt { display: none; } }
@media (max-width: 360px) {
    html.rg .rg-recolhe-btn-topo > b { font-size: .9rem; }
    html.rg .rg-recolhe-item b { font-size: .64rem; }
    html.rg .rg-recolhe-item small { font-size: .58rem; }
}
@media (prefers-reduced-motion: reduce) {
    html.rg .rg-recolhe-btn, html.rg .rg-recolhe-btn::before, html.rg .rg-recolhe-btn-seta, html.rg .rg-recolhe-item i, html.rg .rg-recolhe-item.tem { animation: none; }
    html.rg .rg-recolhe, html.rg .rg-recolhe-miolo { transition: none; }
}

/* =====================================================================
   JORNADA E SEQUÊNCIA À VISTA (partials/roupagem/painel): ficam acima do botão "Seus prêmios e bônus",
   compactas; a Sequência mostra quanto falta para o próximo prêmio (Configurações › Prêmios da Sequência)
   ===================================================================== */
html.rg .rg-painel-fixo { margin-bottom: 10px; }
html.rg .rg-painel-fixo .rg-jornada { margin-bottom: 10px; }
html.rg .rg-painel-fixo .rg-sequencia { margin-bottom: 0; }
html.rg .rg-sequencia h3 i { color: var(--rg-coral); margin-right: 2px; }
html.rg .rg-sequencia-premio {
    display: flex; align-items: center; gap: 8px;
    padding: 7px 10px; border-radius: 10px;
    background: rgba(245, 196, 81, .12); border: 1px solid rgba(245, 196, 81, .35);
    color: #fff !important; font-size: .85rem !important; line-height: 1.3;
}
html.rg .rg-sequencia-premio i { color: var(--rg-gold); flex: none; }
html.rg .rg-sequencia-premio b { color: var(--rg-gold); }

@media (min-width: 992px) {
    /* computador: Jornada e Sequência lado a lado, mesma altura */
    html.rg .rg-painel-fixo.com-os-dois { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 12px; align-items: stretch; }
    html.rg .rg-painel-fixo.com-os-dois .rg-jornada { margin-bottom: 0; }
    html.rg .rg-painel-fixo.com-os-dois .rg-sequencia { display: flex; flex-direction: column; justify-content: space-between; }
}
@media (max-width: 767px) {
    /* celular: Jornada só com a trilha (a faixa de baixo sai); Sequência numa caixa baixa */
    html.rg .rg-painel-fixo .rg-jornada { padding: 10px 12px; margin-bottom: 8px; }
    html.rg .rg-painel-fixo .rg-jornada-trilha { margin: 8px 0 0; }
    html.rg .rg-painel-fixo .rg-jornada-atual { display: none; }
    html.rg .rg-painel-fixo .rg-sequencia { padding: 10px 12px; }
    html.rg .rg-painel-fixo .rg-sequencia .rg-bloco-topo { margin-bottom: 4px; }
    html.rg .rg-painel-fixo .rg-sequencia-dias { margin: 0 0 6px; }
    html.rg .rg-painel-fixo .rg-sequencia p { display: none; }
    html.rg .rg-painel-fixo .rg-sequencia p.rg-sequencia-premio { display: flex; padding: 5px 9px; font-size: .78rem !important; }
}
/* botão com só Roleta e Indique: cada cartão em linha (ícone à esquerda, nome e valor à direita), mais baixo */
html.rg .rg-recolhe-btn-itens[style*="--rg-itens: 2"] .rg-recolhe-item,
html.rg .rg-recolhe-btn-itens[style*="--rg-itens: 1"] .rg-recolhe-item {
    display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto;
    column-gap: 10px; row-gap: 0; align-items: center; justify-items: start; text-align: left; padding: 8px 12px;
}
html.rg .rg-recolhe-btn-itens[style*="--rg-itens: 2"] .rg-recolhe-item i,
html.rg .rg-recolhe-btn-itens[style*="--rg-itens: 1"] .rg-recolhe-item i { grid-row: 1 / span 2; }
/* Sequência com prêmio: 7º dia em dourado, botão "Coletar" pulsando e o "coletado" em verde-limão */
html.rg .rg-sequencia-dia.premio .rg-sequencia-caixa { border: 2px solid var(--rg-gold); color: var(--rg-gold); }
html.rg .rg-sequencia-dia.premio .rg-sequencia-caixa.jogou { background: var(--rg-gold); color: var(--rg-tinta); border-color: transparent; box-shadow: 0 4px 14px rgba(245, 196, 81, .45); }
html.rg .rg-sequencia-dia.premio .rg-sequencia-letra { color: var(--rg-gold); }
html.rg .rg-sequencia-coletar {
    display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
    padding: 10px 12px; border: 0; border-radius: 12px; cursor: pointer;
    background: linear-gradient(135deg, var(--rg-gold), var(--rg-coral)); color: var(--rg-tinta);
    font-family: var(--rg-font-display) !important; font-weight: 800; font-size: .95rem; line-height: 1.2;
    box-shadow: 0 6px 18px rgba(245, 196, 81, .4); animation: rg-pulse 1.6s ease-in-out infinite;
}
html.rg .rg-sequencia-coletar:disabled { opacity: .7; animation: none; cursor: wait; }
html.rg .rg-sequencia-aviso { display: block; margin-top: 6px; color: var(--rg-ink-2); text-align: center; line-height: 1.3; }
html.rg .rg-sequencia-premio.coletado { background: color-mix(in srgb, var(--rg-lima) 12%, transparent); border-color: color-mix(in srgb, var(--rg-lima) 40%, transparent); }
html.rg .rg-sequencia-premio.coletado i, html.rg .rg-sequencia-premio.coletado b { color: var(--rg-lima-texto); }
@media (max-width: 767px) {
    html.rg .rg-sequencia-coletar { padding: 9px 10px; font-size: .86rem; }
}
@media (prefers-reduced-motion: reduce) {
    html.rg .rg-sequencia-coletar { animation: none; }
}