/* ═══════════════════════════════════════════════════════════════════════════════════════════
   #370 (owner 2026-10-17): TEMA "PINTEREST" — "más aesthetic y profesional, no tanto color, que no te
   pierdas". Fondo blanco, grises neutros, UN acento rojo (#e60023), tipografía sans limpia, botones
   píldora, tarjetas de bordes redondeados y sin brillos/neón/degradés. Se carga ÚLTIMA y re-pinta
   todo (login, barra, Inicio, Menú fácil, carga automática, Info, Perfil, cambio de clave, modales).
   ⚠️ NO toca la CARGA MANUAL (#supportPanel: .chat-container, .message, .wa-head, .chat-input-container,
   .cbu-*): el owner quiere que siga pareciendo WhatsApp. Los selectores [style*=…] re-mapean los colores
   inline del HTML viejo y EXCLUYEN #supportPanel, #rouletteModal y el visor de historias.
   Para volver al tema anterior alcanza con quitar el <link> de pin.css en index.html.
   ═══════════════════════════════════════════════════════════════════════════════════════════ */

:root {
  --p-bg: #ffffff;
  --p-surface: #f1f1f1;
  --p-surface-2: #e9e9e9;
  --p-text: #111111;
  --p-muted: #767676;
  --p-border: #e2e2e2;
  --p-red: #e60023;
  --p-red-dark: #ad081b;
  --p-red-soft: #ffe9ec;
  --p-green: #0a7a3e;
  --p-green-soft: #e8f5ee;
  --p-shadow: 0 2px 18px rgba(0, 0, 0, .08);
  --p-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  /* #392: tokens que antes eran colores fijos (hacen posible el modo nocturno) */
  --p-card: #fff; --p-hover: #fafafa; --p-nav: #5f5f5f; --p-border-hi: #cfcfcf; --p-placeholder: #9a9a9a; --p-text-2: #333;
  --p-inv: #fff; --p-green-line: #bfe3cf;
  /* re-mapeo de las variables del tema anterior: todo lo que las lee queda neutro */
  --dx-font: var(--p-font);
  --dx-bg: var(--p-bg);
  --dx-glass: var(--p-surface);
  --dx-border: var(--p-border);
  --dx-border-hi: var(--p-border-hi);
  --dx-cyan: var(--p-text);
  --dx-violet: var(--p-muted);
  --dx-accent: var(--p-red);
  --dx-money: var(--p-green);
  --dx-text: var(--p-text);
  --dx-muted: var(--p-muted);
  --dx-cut: none;
  --dx-cut-sm: none;
  --pr-gold: var(--p-text);
  --pr-gold-soft: var(--p-border);
  --pr-gold-grad: var(--p-red);
  --pr-text: var(--p-text);
  --pr-muted: var(--p-muted);
  --pr-serif: var(--p-font);
  --pr-card: var(--p-surface);
}

/* ── Base ─────────────────────────────────────────────────────────────────────────────────── */
html, body, html.has-session body { background: var(--p-bg) !important; color: var(--p-text); }
body { font-family: var(--p-font); }
::-webkit-scrollbar-track { background: var(--p-surface); }
::-webkit-scrollbar-thumb { background: var(--p-border-hi); }
.chat-screen { background: var(--p-bg) !important; font-family: var(--p-font); }
.chat-screen::before { display: none !important; }
.toast { background: var(--p-text) !important; color: var(--p-inv) !important; border-radius: 16px; box-shadow: 0 6px 24px rgba(0, 0, 0, .18); font-weight: 700; }
.toast.error { background: var(--p-red) !important; color: #fff !important; }
.btn { border-radius: 999px; font-weight: 700; text-transform: none; letter-spacing: 0; }
.btn-primary { background: var(--p-red) !important; color: #fff !important; box-shadow: none !important; }
.btn-primary:hover { background: var(--p-red-dark) !important; transform: none; box-shadow: none !important; }
.btn-secondary { background: var(--p-surface) !important; color: var(--p-text) !important; box-shadow: none !important; }
.btn-secondary:hover { background: var(--p-surface-2) !important; transform: none; box-shadow: none !important; }
.publisher-cta { background: var(--p-red) !important; color: #fff !important; animation: none !important; box-shadow: none !important; }

/* ── Login ────────────────────────────────────────────────────────────────────────────────── */
.login-screen { background: var(--p-bg); }
.login-box { background: var(--p-card); border: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; border-radius: 24px; padding: 18px 16px 14px; max-width: 390px; }
.login-box h1 { color: var(--p-text); }
.login-box p { color: var(--p-muted); font-weight: 600; }
.login-box img { border: 0 !important; border-radius: 16px !important; }
.login-box #helpTelegramBtn, .login-box #loginReviewsBtn, .login-box #loginGiftsBtn { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; border-radius: 16px !important; box-shadow: none !important; }
.login-box #loginClaimsTicker { background: var(--p-surface) !important; border: 0 !important; border-radius: 999px !important; }
.login-box #loginClaimsTicker > span:first-child { color: var(--p-red) !important; }
.login-box #loginClaimsTicker > span:first-child span { background: var(--p-red) !important; box-shadow: none !important; animation: none !important; }
.login-box #loginClaimsText { color: var(--p-text) !important; }
.input-group label { color: var(--p-text); font-weight: 700; font-size: 13px; }
.input-group input, .input-group select, .modal-content input, .modal-content select, .modal-content textarea, #loginPhonePrefix {
  background: var(--p-surface) !important; border: 2px solid transparent !important; color: var(--p-text) !important; border-radius: 16px !important; box-shadow: none !important; font-family: var(--p-font);
}
.input-group input::placeholder, .modal-content input::placeholder, .modal-content textarea::placeholder { color: var(--p-placeholder); }
.input-group input:focus, .modal-content input:focus, .modal-content select:focus, .modal-content textarea:focus { border-color: var(--p-text) !important; background: var(--p-card) !important; box-shadow: none !important; outline: none; }
.error-message { color: #b3261e; background: #fdecea; border-radius: 12px; }

/* ── Barra de arriba ──────────────────────────────────────────────────────────────────────── */
.header.header-toolbar.tb-circles.topnav { background: var(--p-card) !important; border-bottom: 1px solid var(--p-border) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.header .tn-btn, .header .tn-btn:not(.tn-home) { background: transparent !important; border: 1px solid transparent !important; color: var(--p-nav) !important; box-shadow: none !important; clip-path: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border-radius: 14px !important; text-shadow: none !important; }
.header .tn-btn:not(.tn-home) .tn-ico, .header .tn-btn:not(.tn-home) .tn-lbl { color: var(--p-nav) !important; filter: none !important; }
.header .tn-btn:not(.tn-home).active { background: var(--p-surface) !important; border-color: transparent !important; }
.header .tn-btn:not(.tn-home).active .tn-ico, .header .tn-btn:not(.tn-home).active .tn-lbl { color: var(--p-text) !important; }
.header .tn-sep { background: var(--p-border) !important; }
.header .tn-home.tn-retro { background: var(--p-red) !important; border: 0 !important; box-shadow: none !important; text-shadow: none !important; border-radius: 999px !important; color: #fff !important; animation: none !important; min-width: 88px; padding: 7px 14px 8px; }
.header .tn-home.tn-retro::before { display: none !important; }
.header .tn-home.tn-retro .tn-ico, .header .tn-home.tn-retro.active .tn-ico { color: #fff !important; filter: none !important; }
.header .tn-home.tn-retro .tn-ico svg, .header .tn-home.tn-retro.active .tn-ico svg { filter: none !important; }
.header .tn-home.tn-retro .tn-lbl { background: none !important; -webkit-background-clip: initial !important; background-clip: initial !important; color: #fff !important; letter-spacing: 1px !important; font-family: var(--p-font) !important; }
.header .tn-home.tn-retro.active { box-shadow: 0 0 0 3px var(--p-red-soft) !important; animation: none !important; border: 0 !important; }
.header .tn-telegram, .header .tn-stories { background: transparent !important; color: var(--p-nav) !important; box-shadow: none !important; border-color: transparent !important; }
.header .tn-telegram .tn-lbl, .header .tn-stories .tn-lbl, .header .tn-btn:not(.tn-home).tn-stories .tn-lbl, .header .tn-btn:not(.tn-home).tn-telegram .tn-lbl { color: var(--p-nav) !important; }
.header .tn-telegram .tn-ico svg circle { fill: #229ed9; } /* #371: logo real de Telegram (círculo azul, avión blanco) */
.header .tn-telegram .tn-ico svg path { fill: #fff; }
.header .tn-stories .st-ring { background: var(--p-card) !important; border: 2px solid var(--p-border-hi) !important; }
.header .tn-stories.has-active .st-ring { border-color: var(--p-red) !important; background: var(--p-card) !important; }
.header .tn-stories .st-core { color: var(--p-text) !important; }
.header .tn-stories .st-badge { background: var(--p-red) !important; color: #fff !important; box-shadow: none !important; border-color: var(--p-card) !important; }
.header .support-unread { background: var(--p-red) !important; color: #fff !important; box-shadow: none !important; }

/* ── Inicio (menú completo) ───────────────────────────────────────────────────────────────── */
.entry-view { gap: 8px; margin: 6px 10px 0; }
.ev-hero { background: var(--p-surface) !important; border: 0 !important; box-shadow: none !important; border-radius: 18px !important; color: var(--p-text); }
.ev-hero::after { display: none !important; }
.ev-hero-k { color: var(--p-muted) !important; letter-spacing: 1.4px; }
.ev-hero-k .hc-ico { color: var(--p-red) !important; }
.ev-hero-t, .ev-hero-t b { color: var(--p-text) !important; }
.ev-hero-new { background: var(--p-red) !important; color: #fff !important; box-shadow: none !important; }
.ev-hero-new b { color: #fff !important; }
.ev-services { gap: 8px; }
.ev-svc { background: var(--p-card) !important; border: 1px solid var(--p-border) !important; box-shadow: none !important; color: var(--p-text) !important; border-radius: 16px !important; }
.ev-svc b, .ev-svc.svc-refund b, .ev-svc.svc-roulette b, .ev-svc.svc-ref b { color: var(--p-text) !important; }
.ev-svc small { color: var(--p-muted) !important; }
.ev-tab { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; border-radius: 999px !important; box-shadow: none !important; text-transform: none !important; letter-spacing: 0 !important; }
.ev-tab img { background: var(--p-card) !important; }
.ev-tab.active, .ev-tab.plat-ganamos.active { background: var(--p-text) !important; color: var(--p-inv) !important; box-shadow: none !important; }
.ev-reco { background: var(--p-red) !important; color: #fff !important; }
.ev-tab.active .ev-reco { background: var(--p-card) !important; color: var(--p-red) !important; }
.ev-tab.soon .ev-soon, .plat-soon-badge { background: var(--p-surface-2) !important; color: var(--p-muted) !important; border: 0 !important; box-shadow: none !important; }
.ev-frame-wrap { border: 0 !important; background: var(--p-surface) !important; border-radius: 20px !important; box-shadow: none !important; }
.ev-slides { background: var(--p-surface) !important; }
.ev-slide::before { display: none !important; }
.ev-slide img { border: 0 !important; box-shadow: none !important; }
.ev-cta { background: var(--p-red) !important; color: #fff !important; border: 0 !important; box-shadow: 0 6px 18px rgba(230, 0, 35, .28) !important; animation: none !important; border-radius: 999px !important; }
.ev-cta-b, .ev-cta-t { text-shadow: none !important; color: #fff !important; text-transform: none !important; letter-spacing: 0 !important; font-family: var(--p-font) !important; }
.ev-status { background: var(--p-surface) !important; color: var(--p-text) !important; }
.ev-st-open { background: var(--p-red) !important; color: #fff !important; text-transform: none !important; letter-spacing: 0 !important; }
.ev-note, .ev-note-big, .ev-note-line { color: var(--p-muted) !important; }
.ev-note b, .ev-note-big a, .ev-note-line a { color: var(--p-red) !important; border-bottom-color: transparent !important; }
.ev-expand, .ev-view-site, .ev-link-btn, .plat-link-btn { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; box-shadow: none !important; }
.ev-link-btn b, .ev-link-btn span, .plat-link-btn .plb-k, .plat-link-btn .plb-t { color: var(--p-text) !important; }
.ev-easy-link { color: var(--p-muted) !important; }
.ev-easy-link b { color: var(--p-text) !important; }
/* reseñas (Inicio) */
#entryReviews.ev-reviews { background: var(--p-card) !important; border: 1px solid var(--p-border) !important; box-shadow: none !important; border-radius: 18px !important; }
#entryReviews.ev-reviews::before { display: none !important; }
#entryReviews .rv-g, #entryReviews .rv-g::before, .rv-g { color: var(--p-muted) !important; }
#entryReviews .rv-avg, .rv-avg { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; box-shadow: none !important; }
#entryReviews .rv-avg small, .rv-avg small { color: var(--p-muted) !important; }
#entryReviews .rv-card, .rv-card { background: var(--p-surface) !important; border: 0 !important; box-shadow: none !important; color: var(--p-text) !important; font-family: var(--p-font) !important; }
#entryReviews .rv-card:not(.rv-add)::after { color: #d0d0d0 !important; }
#entryReviews .rv-who b, .rv-who b { color: var(--p-text) !important; }
#entryReviews .rv-text, .rv-text { color: var(--p-text-2) !important; }
#entryReviews .rv-stars, .rv-stars, #entryReviews .rv-avg .rv-stars { color: #d9d9d9 !important; }
#entryReviews .rv-stars .on, .rv-stars .on, #entryReviews .rv-avg .rv-stars .on { color: var(--p-red) !important; }
#entryReviews .rv-avatar, .rv-avatar { background: var(--p-text) !important; color: var(--p-inv) !important; border: 0 !important; }
#entryReviews .rv-add, .rv-add { background: var(--p-card) !important; border: 1px dashed var(--p-border-hi) !important; }
#entryReviews .rv-add b, .rv-add b { color: var(--p-text) !important; }
#entryReviews .rv-add small, .rv-add small { color: var(--p-muted) !important; }
#entryReviews .rv-add-star, .rv-add-star { color: var(--p-red) !important; }

/* ── Menú fácil + selector ────────────────────────────────────────────────────────────────── */
.easy-view { margin: 8px 12px 0; gap: 10px; }
.ez-top { background: var(--p-surface) !important; border: 0 !important; border-radius: 18px !important; }
.ez-hello span { color: var(--p-text) !important; }
.ez-hello small, .ez-bal small { color: var(--p-muted) !important; }
.ez-bal b { color: var(--p-green) !important; }
.ez-main { background: var(--p-red) !important; color: #fff !important; border: 0 !important; box-shadow: 0 6px 18px rgba(230, 0, 35, .25) !important; animation: none !important; border-radius: 22px !important; }
.ez-main-txt b { color: #fff !important; text-shadow: none !important; letter-spacing: .4px !important; }
.ez-main-txt small, .ez-main-arrow { color: #fff !important; opacity: .9 !important; }
.ez-btn { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; box-shadow: none !important; border-radius: 20px !important; }
.ez-btn b, .ez-btn.ez-refund b, .ez-btn.ez-roulette b, .ez-btn.ez-ref b, .ez-btn.ez-play b { color: var(--p-text) !important; }
.ez-btn small { color: var(--p-muted) !important; }
.ez-btn.ez-play { background: var(--p-surface) !important; }
.ez-badge { background: var(--p-red) !important; color: #fff !important; box-shadow: none !important; animation: none !important; }
.ez-chat { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; border-radius: 18px !important; }
.ez-chat-txt b { color: var(--p-text) !important; }
.ez-chat-txt small { color: var(--p-muted) !important; }
.ez-switch { background: var(--p-card) !important; border: 1px solid var(--p-border) !important; color: var(--p-text) !important; border-radius: 999px !important; }
.ez-switch b { color: var(--p-text) !important; }
.ez-switch small { color: var(--p-muted) !important; }
.menu-chooser { background: rgba(0, 0, 0, .5) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.mc-card { background: var(--p-card) !important; border: 0 !important; box-shadow: 0 16px 48px rgba(0, 0, 0, .2) !important; border-radius: 28px !important; }
.mc-kicker { color: var(--p-red) !important; }
.mc-card h2 { color: var(--p-text) !important; font-family: var(--p-font) !important; }
.mc-sub { color: var(--p-muted) !important; }
.mc-sub b { color: var(--p-text) !important; }
.mc-opt, .mc-opt.mc-easy, .mc-opt.mc-full { background: var(--p-surface) !important; border: 2px solid transparent !important; box-shadow: none !important; color: var(--p-text) !important; border-radius: 20px !important; }
.mc-opt.mc-easy { border-color: var(--p-text) !important; }
.mc-opt.mc-easy b, .mc-opt.mc-full b { color: var(--p-text) !important; }
.mc-txt small { color: var(--p-muted) !important; }
.mc-tag { background: var(--p-red) !important; color: #fff !important; }
.mc-tag.mc-tag-dim { background: var(--p-surface-2) !important; color: var(--p-text) !important; }

/* ── Carga automática / home completo ────────────────────────────────────────────────────── */
#homeFull, #homePanel { background: transparent; }
.home-card { background: var(--p-card) !important; border: 1px solid var(--p-border) !important; box-shadow: none !important; border-radius: 18px !important; color: var(--p-text) !important; }
.home-card::before { display: none !important; }
.home-card-title { color: var(--p-text) !important; font-family: var(--p-font) !important; text-transform: none !important; letter-spacing: 0 !important; font-weight: 800 !important; font-size: 14px !important; }
.home-card-sub { color: var(--p-muted) !important; }
.hc-ico, #autoLoadCard .hc-ico { color: var(--p-muted) !important; }
.hc-tag { background: var(--p-red) !important; color: #fff !important; clip-path: none !important; border-radius: 999px !important; }
.balance-strip { background: var(--p-surface) !important; border: 0 !important; border-radius: 14px !important; }
.balance-strip .dash-balance-label { color: var(--p-muted) !important; }
.balance-strip .dash-balance-amount { color: var(--p-green) !important; }
.bs-install { background: var(--p-surface) !important; border: 0 !important; box-shadow: none !important; color: var(--p-text) !important; }
.bs-install-t small { color: var(--p-muted) !important; }
.bs-imp { background: var(--p-red) !important; color: #fff !important; box-shadow: none !important; }
.bs-vip { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; }
.bs-vip-t small, .bs-vip-pct { color: var(--p-muted) !important; }
.bs-vip-bar { background: var(--p-border) !important; }
.bs-vip-bar i { background: var(--p-text) !important; }
.al-line, .al-step, .al-access-head { border-color: var(--p-border) !important; }
.al-k, .al-label, .al-meta, .al-meta-2, .al-hint, .al-minline, .al-min, .al-alias-k, .al-access-head span, .al-step-sub, #autoLoadCard .al-step-sub { color: var(--p-muted) !important; }
.al-v, .al-value, .al-cbu .mono, .al-step-t, .al-chip .mono, .al-v.gold, .al-value .gold, .al-value .green, .al-value .blue, .mono.gold, .al-minline b, .al-meta-2 b, #autoLoadCard .al-step-sub b, #autoLoadCard .al-step-2 .al-step-t { color: var(--p-text) !important; }
.al-copy, .al-eye { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; border-radius: 999px !important; }
.al-copy:active, .al-eye:active { background: var(--p-surface-2) !important; }
.al-chip, .al-field { background: var(--p-surface) !important; border: 0 !important; }
.al-n, #autoLoadCard .al-step-2 .al-n { background: var(--p-text) !important; color: var(--p-inv) !important; box-shadow: none !important; }
#autoLoadCard .al-step-c, #autoLoadCard .al-step-2 { background: var(--p-surface) !important; border: 0 !important; border-radius: 16px !important; }
.al-btn { clip-path: none !important; border-radius: 999px !important; box-shadow: none !important; text-transform: none !important; letter-spacing: 0 !important; }
.al-btn.receipt { background: var(--p-red) !important; color: #fff !important; border: 0 !important; }
.al-btn.capture, .al-link-btn { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; }
.al-manual input { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; }
.al-manual button { background: var(--p-text) !important; color: var(--p-inv) !important; }
.al-pw-hint { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; }
.al-pw-hint b { color: var(--p-text) !important; }
.access-head, .access-title { color: var(--p-text) !important; background: transparent !important; }
.access-title small, .access-chevron { color: var(--p-muted) !important; }
.load-row-btn { background: var(--p-red) !important; color: #fff !important; clip-path: none !important; border-radius: 999px !important; box-shadow: none !important; animation: none !important; }
.load-row-btn .lr-text small, .load-row-btn .lr-auto, .withdraw-row-btn .lr-auto { color: inherit !important; opacity: .85; }
.withdraw-row-btn { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; box-shadow: none !important; border-radius: 999px !important; clip-path: none !important; }
.withdraw-row-btn .lr-text small { color: var(--p-muted) !important; }
.hb-btn, .hb-ref, .hb-install, .hb-how { background: var(--p-surface) !important; border: 0 !important; clip-path: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border-radius: 16px !important; box-shadow: none !important; color: var(--p-text) !important; }
.hb-text b { color: var(--p-text) !important; }
.hb-text small { color: var(--p-muted) !important; }
.home-how-btn, .hiw-toggle { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; border-radius: 999px !important; }
.home-how-btn span { color: var(--p-text) !important; }
.hiw-body, .hiw-ladder, .hiw-sub { color: var(--p-text-2) !important; }
.hiw-step b.n { background: var(--p-text) !important; color: var(--p-inv) !important; }
.dash-top { background: transparent !important; }
.dash-top .dash-refunds-title { color: var(--p-muted) !important; }
.dash-top .refund-btn, .dash-top .dash-refunds-row .refund-btn { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; box-shadow: none !important; border-radius: 12px !important; }
.dash-top .dash-refunds-row .refund-label-full { color: var(--p-muted) !important; }
.dash-top .refund-btn .refund-amount, .dash-top .dash-refunds-row .refund-amount { color: var(--p-text) !important; }
.dash-top .dash-refunds-row .refund-btn:disabled { filter: none !important; opacity: .55; }
.dash-top .refund-tier { background: var(--p-text) !important; color: var(--p-inv) !important; border-color: var(--p-text) !important; }
.dash-top .dash-user, .dash-top .dash-roulette { background: var(--p-surface) !important; border: 0 !important; box-shadow: none !important; }
.dash-top .dash-user-avatar, .dash-top .dash-roulette-avatar { background: var(--p-text) !important; color: var(--p-inv) !important; }
.dash-top .dash-user-label, .dash-top .dash-roulette-label, .dash-top .dash-user-name, .dash-top .dash-roulette-sub { color: var(--p-text) !important; }
.refund-btn.daily, .refund-btn.weekly, .refund-btn.monthly, .unified-refund-btn { background: var(--p-surface) !important; color: var(--p-text) !important; }
.fire-home-card { background: var(--p-surface) !important; border: 0 !important; box-shadow: none !important; color: var(--p-text) !important; border-radius: 18px !important; }
.fire-home-card .fh-flame { filter: none !important; }
.fire-home-card .fh-text b { color: var(--p-text) !important; }
.fire-home-card .fh-text small, .fire-home-card .fh-rule, #fireHomeCard .fh-rule { color: var(--p-muted) !important; }
#fireHomeCard .fh-rule b { color: var(--p-text) !important; }
.fire-home-card .fh-streak { background: var(--p-card) !important; border: 0 !important; }
.fire-home-card .fh-streak b { color: var(--p-text) !important; }
.fire-home-card .fh-streak small { color: var(--p-muted) !important; }
.fire-home-card .fh-track { background: var(--p-border) !important; }
.fire-home-card .fh-fill { background: var(--p-red) !important; box-shadow: none !important; }
.fire-home-card .fh-dot i { background: var(--p-card) !important; border-color: var(--p-border-hi) !important; }
.fire-home-card .fh-dot.on i { background: var(--p-red) !important; border-color: var(--p-red) !important; box-shadow: none !important; }
.fire-home-card .fh-dot.next i { background: var(--p-card) !important; border-color: var(--p-text) !important; }
.fire-home-card .fh-dot b, .fire-home-card .fh-dot small { color: var(--p-muted) !important; }
.fire-home-card.can-claim { background: var(--p-red-soft) !important; }
.plat-play-btn, .plat-play-btn.is-default, .plat-play-btn.plat-ganamos { background: var(--p-surface) !important; border: 2px solid transparent !important; box-shadow: none !important; color: var(--p-text) !important; border-radius: 18px !important; }
.plat-play-btn::after { display: none !important; }
.plat-play-btn.is-pref, .plat-play-wrap.is-pref .plat-play-btn, .plat-play-btn.plat-ganamos.is-pref { background: var(--p-card) !important; border-color: var(--p-text) !important; box-shadow: none !important; }
.plat-logo, .plat-play-btn.plat-girox .plat-logo { background: var(--p-card) !important; border: 0 !important; box-shadow: none !important; }
.plat-play-name, .plat-play-btn.plat-ganamos .plat-play-name { color: var(--p-text) !important; }
.plat-play-sub, .plat-play-btn.plat-ganamos .plat-play-sub { color: var(--p-muted) !important; }
.plat-reco { background: var(--p-red) !important; color: #fff !important; }
.plat-check { background: var(--p-card) !important; border-color: var(--p-border-hi) !important; color: var(--p-text) !important; }
.plat-play-btn.is-pref .plat-check { background: var(--p-text) !important; border-color: var(--p-text) !important; color: var(--p-inv) !important; box-shadow: none !important; }
.plat-enter { background: var(--p-text) !important; color: var(--p-inv) !important; border: 0 !important; }
.plat-fix { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; }
.plat-fix.on { background: var(--p-text) !important; color: var(--p-inv) !important; }
.plat-balance { background: var(--p-surface) !important; border: 0 !important; }
.plat-balance .dash-balance-label { color: var(--p-muted) !important; }
.plat-balance .dash-balance-amount { color: var(--p-green) !important; }
.service-banner { background: var(--p-surface) !important; border: 0 !important; box-shadow: none !important; color: var(--p-text) !important; }
.svb-text b, .svb-msg, .svb-min, .svb-min b { color: var(--p-text) !important; }
.svb-msg em { color: var(--p-red) !important; }
.svb-cta, .svb-plat { background: var(--p-red) !important; color: #fff !important; border: 0 !important; box-shadow: none !important; }
.vip-card, #vipCard { background: var(--p-card) !important; }
.vip-head { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; }
.vip-head-next, .vip-pct, .vip-chevron { color: var(--p-muted) !important; }
.vip-bar { background: var(--p-border) !important; }
.vip-bar-fill { background: var(--p-red) !important; box-shadow: none !important; }
.vip-body-p { color: var(--p-text-2) !important; }
.vip-body-p b { color: var(--p-text) !important; }
.vip-lvl { background: var(--p-card) !important; }
.vip-lvl.on { background: var(--p-red-soft) !important; }
.vip-lvl.next { background: var(--p-surface) !important; }
.vip-lvl.on .vip-lvl-st, .vip-lvl-th, .vip-lvl-win, .vip-lvl-name small { color: var(--p-muted) !important; }
.vip-claim { background: var(--p-surface) !important; border: 0 !important; }
.vip-claim::before { display: none !important; }
.vc-title { color: var(--p-text) !important; }
.vc-amt { color: var(--p-muted) !important; }
.vc-amt b { color: var(--p-green) !important; }
.vc-plat { background: var(--p-card) !important; border: 1px solid var(--p-border) !important; color: var(--p-text) !important; }
.vc-plat.on { background: var(--p-text) !important; color: var(--p-inv) !important; border-color: var(--p-text) !important; }
.vc-btn { background: var(--p-red) !important; color: #fff !important; clip-path: none !important; border-radius: 999px !important; box-shadow: none !important; }
.ig-bar { background: var(--p-text) !important; color: var(--p-inv) !important; border: 0 !important; box-shadow: 0 -4px 20px rgba(0, 0, 0, .12) !important; }
.ig-bar-k { background: var(--p-red) !important; color: #fff !important; }
.ig-sheet { background: var(--p-card) !important; border: 0 !important; box-shadow: 0 -12px 40px rgba(0, 0, 0, .18) !important; color: var(--p-text) !important; }
.ig-title { color: var(--p-text) !important; }
.ig-amount { color: var(--p-red) !important; }
.ig-btn-main { background: var(--p-red) !important; color: #fff !important; box-shadow: none !important; }
.ig-btn-later { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; }
.ig-note { color: var(--p-muted) !important; }
.play-now-card, .pn-sheet { background: var(--p-card) !important; border: 0 !important; box-shadow: 0 -12px 40px rgba(0, 0, 0, .18) !important; color: var(--p-text) !important; }
.pn-title { color: var(--p-text) !important; }
.pn-sub { color: var(--p-muted) !important; }
.pn-btn, .pn-gift-btn, .plat-play-now { background: var(--p-red) !important; color: #fff !important; box-shadow: none !important; border: 0 !important; }
.pn-later, .pn-test { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; }
.pn-gift { background: var(--p-surface) !important; border: 0 !important; }
.pn-gift-t, .pn-gift-sub { color: var(--p-muted) !important; }
.pn-gift-amt { color: var(--p-text) !important; }
.casino-topbar { background: var(--p-card) !important; border-bottom: 1px solid var(--p-border) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.casino-topbar-title { color: var(--p-text) !important; }
.casino-back { background: var(--p-surface) !important; color: var(--p-text) !important; text-transform: none !important; letter-spacing: 0 !important; }
.casino-plat-tab { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; text-transform: none !important; letter-spacing: 0 !important; }
.casino-plat-tab.active { background: var(--p-text) !important; color: var(--p-inv) !important; box-shadow: none !important; }
.casino-quick-btn { background: var(--p-red) !important; color: #fff !important; text-transform: none !important; letter-spacing: 0 !important; }
.casino-load { background: var(--p-card) !important; border: 1px solid var(--p-border) !important; color: var(--p-text) !important; box-shadow: 0 14px 44px rgba(0, 0, 0, .18) !important; }
.cl-step { background: var(--p-surface) !important; }
.cl-step > b { background: var(--p-text) !important; color: var(--p-inv) !important; }
.cl-cbu .mono { color: var(--p-text) !important; }
.cl-copy, .cl-plat { background: var(--p-card) !important; color: var(--p-text) !important; border: 1px solid var(--p-border) !important; }
.cl-plat.on { background: var(--p-text) !important; color: var(--p-inv) !important; }
.cl-btn { background: var(--p-red) !important; color: #fff !important; border: 0 !important; }
.cl-meta, .cl-meta a { color: var(--p-muted) !important; }
.cl-close, .cq-x { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; }
.at-row { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; }
.at-row.at-ok { background: var(--p-green-soft) !important; }
.at-row.at-bad { background: var(--p-red-soft) !important; }
.at-lbl, .at-st { color: var(--p-text) !important; }
.at-st.at-x { color: var(--p-red) !important; }
.at-help { background: var(--p-text) !important; color: var(--p-inv) !important; border: 0 !important; box-shadow: none !important; }

/* ── Modales (genérico) ───────────────────────────────────────────────────────────────────── */
.modal { background: rgba(0, 0, 0, .55) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.modal-content { background: var(--p-card) !important; border: 0 !important; border-radius: 24px !important; box-shadow: 0 16px 48px rgba(0, 0, 0, .18) !important; color: var(--p-text) !important; font-family: var(--p-font) !important; }
.modal-header h2, .modal-content h2, .modal-content h3 { color: var(--p-text) !important; text-transform: none !important; letter-spacing: -.2px !important; font-weight: 800 !important; font-family: var(--p-font) !important; }
.modal-header p { color: var(--p-muted) !important; }
.modal-content .btn, .modal-content .btn-primary, .modal-content button.btn-primary { background: var(--p-red) !important; color: #fff !important; border: 0 !important; border-radius: 999px !important; text-transform: none !important; letter-spacing: 0 !important; box-shadow: none !important; font-weight: 700 !important; }
.modal-content .btn-secondary, .modal-content button.btn-secondary { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; border-radius: 999px !important; box-shadow: none !important; }
.modal-content > button[onclick][style*="position: absolute"], .rs-close, .refund-simple .rs-close, .modal.profile-modal .rs-close { color: var(--p-muted) !important; }
.refund-details, .fire-details, .info-card { background: var(--p-surface) !important; border: 0 !important; border-radius: 16px !important; }
.refund-info-row, .fire-info-row { border-color: var(--p-border) !important; color: var(--p-text); }
.refund-info-row.highlight { background: var(--p-green-soft) !important; }
.refund-info-row.highlight span:last-child { color: var(--p-green) !important; }
.fire-info-row.highlight span:last-child { color: var(--p-red) !important; }
.notif-plan-card, .notif-plan-card.plan-suave, .notif-plan-card.plan-normal, .notif-plan-card.plan-activo, .notif-plan-card.plan-reembolsos { background: var(--p-surface) !important; border: 2px solid transparent !important; color: var(--p-text) !important; border-radius: 18px !important; }
.notif-plan-card.plan-normal { border-color: var(--p-text) !important; }
.notif-plan-card .plan-detail { color: var(--p-text-2) !important; }
.notif-plan-card .plan-desc { color: var(--p-muted) !important; }
.notif-plan-badge { background: var(--p-red) !important; color: #fff !important; }
.wa-switch-track { background: var(--p-border-hi) !important; border: 0 !important; }
.wa-switch input:checked + .wa-switch-track { background: var(--p-red) !important; }
.wa-switch-thumb { background: var(--p-card) !important; box-shadow: 0 1px 3px rgba(0, 0, 0, .25) !important; }
/* Perfil */
.modal.profile-modal .modal-content { background: var(--p-card) !important; border: 0 !important; box-shadow: 0 16px 48px rgba(0, 0, 0, .18) !important; color: var(--p-text) !important; font-family: var(--p-font) !important; }
.modal.profile-modal .modal-header h2 { color: var(--p-text) !important; font: 800 18px var(--p-font) !important; text-transform: none !important; letter-spacing: -.2px !important; }
.modal.profile-modal .modal-header p { color: var(--p-muted) !important; }
.profile-modal .pf-userbox { background: var(--p-surface) !important; border: 0 !important; box-shadow: none !important; border-radius: 18px !important; }
.profile-modal .pf-avatar { background: var(--p-card) !important; border: 0 !important; box-shadow: none !important; }
.profile-modal .pf-avatar-edit { background: var(--p-red) !important; color: #fff !important; border: 2px solid var(--p-card) !important; }
.profile-modal .pf-username { color: var(--p-text) !important; }
.profile-modal .pf-userlvl, .profile-modal .pf-userhint { color: var(--p-muted) !important; }
.profile-modal .pf-build { color: var(--p-placeholder) !important; }
.profile-modal .pf-main, .profile-modal .pf-main-big { background: var(--p-surface) !important; border: 0 !important; border-radius: 18px !important; }
.profile-modal .pf-row { border-bottom-color: var(--p-border) !important; }
.profile-modal .pf-k { color: var(--p-muted) !important; }
.profile-modal .pf-v, .profile-modal .pf-main-big .pf-v, .profile-modal .pf-main-big .pf-link { color: var(--p-text) !important; }
.profile-modal .pf-copy { background: var(--p-card) !important; border: 1px solid var(--p-border-hi) !important; color: var(--p-text) !important; }
.profile-modal .pf-hint { color: var(--p-muted) !important; }
.profile-modal .pf-capture { background: var(--p-text) !important; color: var(--p-inv) !important; border: 0 !important; border-radius: 999px !important; box-shadow: none !important; }
.profile-modal .pf-act { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; border-radius: 16px !important; }
.profile-modal .pf-act small { color: var(--p-muted) !important; }
.profile-modal .pf-act .pf-ico-btn { background: var(--p-card) !important; color: var(--p-text) !important; }
.profile-modal .pf-act .pf-ico-btn.active { background: var(--p-green-soft) !important; }
/* Reembolso simple (ya era blanco): botón rojo */
.refund-simple .modal-content { font-family: var(--p-font) !important; border-radius: 24px !important; }
.refund-simple .btn-primary { background: var(--p-red) !important; color: #fff !important; border-radius: 999px !important; box-shadow: none !important; }
.refund-simple .btn-primary:disabled { background: var(--p-border-hi) !important; color: #fff !important; }
.refund-simple .btn-secondary { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; border-radius: 999px !important; }
.refund-simple .rs-line { background: var(--p-surface) !important; }
.refund-simple #refundAvailabilityInfo { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; }
/* Info del servicio */
#infoModal .info-head-sm h2::after { background: var(--p-red) !important; }
#infoModal .modal-content > button[onclick] { background: var(--p-surface) !important; color: var(--p-text) !important; }
.info-reviews-wrap, #infoModal .info-reviews-wrap { background: var(--p-surface) !important; border: 0 !important; border-radius: 16px !important; }
.info-reviews-head, #infoModal .info-reviews-head { background: transparent !important; color: var(--p-text) !important; }
.info-reviews-chevron, #infoModal .info-reviews-chevron { color: var(--p-muted) !important; }
.info-msg { background: var(--p-surface) !important; border: 0 !important; box-shadow: none !important; color: var(--p-text-2) !important; border-radius: 20px 20px 20px 6px !important; }
.info-msg .im-sec { border-bottom-color: var(--p-border) !important; }
.info-msg b, .info-msg .im-sec > b:first-child { color: var(--p-text) !important; }
.info-msg .im-link { color: var(--p-red) !important; }
.info-badge, #infoModal .info-badge { background: var(--p-red) !important; color: #fff !important; }
#infoModal #closeInfoModal { background: var(--p-red) !important; color: #fff !important; border: 0 !important; box-shadow: none !important; border-radius: 999px !important; }
.info-vip, .info-vip-inner, .info-vip-mine { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; }
.info-vip-head, .info-vip-p, .info-vip-p b, .info-vip-mine b { color: var(--p-text) !important; }
.vip-row, .vip-row:nth-child(even) { background: var(--p-card) !important; }
.vip-row.is-cur { background: var(--p-red-soft) !important; }
.vip-row-h { background: var(--p-surface) !important; color: var(--p-muted) !important; }
.vip-th { color: var(--p-muted) !important; }
.vip-bonus, .vip-rake { color: var(--p-text) !important; }
/* Niveles VIP / avatar */
#vipLevelsModal .vl-intro, #avatarModal .vl-intro { color: var(--p-text-2) !important; }
#vipLevelsModal .vl-intro b, #avatarModal .vl-intro b { color: var(--p-text) !important; }
#vipLevelsModal .vl-mine { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; }
#vipLevelsModal .vl-mine small, #vipLevelsModal .vl-name small, #vipLevelsModal .vl-rake, #vipLevelsModal .vl-empty { color: var(--p-muted) !important; }
#vipLevelsModal .vl-row { background: var(--p-card) !important; border-bottom: 1px solid var(--p-border) !important; }
#vipLevelsModal .vl-row.on { background: var(--p-red-soft) !important; }
#vipLevelsModal .vl-row.next { background: var(--p-surface) !important; }
#vipLevelsModal .vl-gift { color: var(--p-green) !important; }
#avatarModal .av-opt { background: var(--p-surface) !important; border: 2px solid transparent !important; color: var(--p-text) !important; }
#avatarModal .av-opt.sel { background: var(--p-card) !important; border-color: var(--p-text) !important; box-shadow: none !important; }
/* Fueguito */
.fire-rule-top { background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; }
.fire-rule-top b { color: var(--p-red) !important; }
.fire-streak-row { background: var(--p-surface) !important; border: 0 !important; }
.fire-streak-row span:first-child, .fire-prizes-title { color: var(--p-text) !important; }
.fire-streak-row #fireStreakModal { color: var(--p-red) !important; }
#fireMilestonesMenu > div { background: var(--p-surface) !important; border: 0 !important; }
.fire-ms-toggle { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; }
.fire-ms-sum, .fire-ms-chev { color: var(--p-muted) !important; }
#fireModal #claimFireBtn { background: var(--p-red) !important; color: #fff !important; }
/* Referidos */
.ref-how-wrap { background: var(--p-surface) !important; border: 0 !important; }
.ref-how-head { background: transparent !important; color: var(--p-text) !important; }
.ref-how-chevron { color: var(--p-muted) !important; }
.ref-claim { background: var(--p-surface) !important; border: 0 !important; }
.ref-claim-k, .ref-claim-note { color: var(--p-muted) !important; }
.ref-claim-v { color: var(--p-text) !important; }
.ref-claim-btn { background: var(--p-red) !important; color: #fff !important; clip-path: none !important; border-radius: 999px !important; box-shadow: none !important; text-transform: none !important; letter-spacing: 0 !important; }
/* Historias: la etiqueta "Historias" del visor sigue oscura (pantalla completa, a propósito). */

/* ── Colores INLINE del HTML viejo (dorados, grises, verdes) → neutros ────────────────────── */
/* Alcance POSITIVO (login, Inicio, Menú fácil, home completo, barra, modales): así no toca el chat de Carga manual
   (#supportPanel), la ruleta (#rouletteModal, HTML armado por JS) ni el visor de historias. */
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#d4af37"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #d4af37"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#ffd700"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #ffd700"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#ffcc66"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #e6c9a8"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#d9b8ff"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#53bdeb"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#3aa0e0"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #6a0dad"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#fff"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #fff"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#eee"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#ddd"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#d8d8d8"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#1a0033"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #1a0033"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#000"] { color: var(--p-text) !important; }
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#888"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #888"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#aaa"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#999"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#b0b0b0"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #b0b0b0"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#a0a0a0"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #667781"] { color: var(--p-muted) !important; }
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#00ff88"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #00ff88"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#25d366"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#052e16"] { color: var(--p-green) !important; }
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #ff6b6b"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color: #ff4500"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#ff6666"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="color:#f7931e"] { color: var(--p-red) !important; }
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background: rgba(0,0,0,0.4)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:rgba(0,0,0,0.4)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:rgba(0,0,0,0.3)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:rgba(255,255,255,0.05)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:rgba(255,255,255,0.04)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:rgba(212,175,55,0.2)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:rgba(212,175,55,0.1"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:rgba(106,13,173,0.18)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:rgba(0,136,204,0.12)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:linear-gradient(135deg,rgba(0,255,136,0.10)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:linear-gradient(135deg,rgba(157,78,221,0.16)"] { background: var(--p-surface) !important; }
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="background:linear-gradient(135deg,#d4af37,#ffd700)"] { background: var(--p-red) !important; color: #fff !important; }
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border:1px solid rgba(212,175,55"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border: 1px solid rgba(212,175,55"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border:1px solid rgba(255,255,255,0.1"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border:1px solid rgba(0,255,136,0.55)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border:1px solid #d4af37"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border:2px solid #d4af37"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border:1px solid rgba(157,78,221"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border:1px solid rgba(255,204,0,0.25)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border:1px solid rgba(247,147,30,0.2)"],
:is(#loginScreen, #entryView, #easyView, #menuChooser, #homeFull, #playNowCard, .header.topnav, .modal:not(#rouletteModal)) [style*="border-color:rgba(0,136,204,0.5)"] { border-color: var(--p-border) !important; }
/* los botones rojos/negros de este tema mantienen el texto blanco aunque tengan color inline */
.btn-primary, .modal-content .btn-primary, .ez-main, .ev-cta, .load-row-btn, .al-btn.receipt, .ref-claim-btn, .vc-btn, .pn-btn, .ig-btn-main, #infoModal #closeInfoModal, .mc-tag, .ez-badge, .ev-hero-new, .hc-tag, .plat-reco, .bs-imp, .ig-bar, .at-help, .profile-modal .pf-capture, .header .tn-home.tn-retro { color: #fff !important; }

/* ── #372: RULETA DIARIA con el estilo nuevo (HTML en js/roulette.js, clases rl-*) ─────────── */
#rouletteModal, .rl-overlay { background: rgba(0, 0, 0, .55) !important; }
.rl-overlay { position: fixed; inset: 0; z-index: 99998; display: flex; align-items: flex-start; justify-content: center; padding: 14px; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.rl-card { position: relative; width: 100%; max-width: 480px; margin: 14px auto; background: var(--p-card); border-radius: 28px; padding: 22px 18px 18px; color: var(--p-text); font-family: var(--p-font); box-shadow: 0 16px 48px rgba(0, 0, 0, .18); display: flex; flex-direction: column; gap: 12px; }
.rl-card.rl-loading { text-align: center; color: var(--p-muted); font-weight: 700; padding: 34px; }
.rl-x { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--p-surface); color: var(--p-text); font-size: 16px; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.rl-head { text-align: center; padding-right: 36px; padding-left: 36px; }
.rl-kicker { font: 800 10.5px var(--p-font); letter-spacing: 1.6px; text-transform: uppercase; color: var(--p-red); }
.rl-title { margin: 2px 0 2px; font: 800 24px/1.15 var(--p-font); letter-spacing: -.3px; color: var(--p-text); text-align: center; }
.rl-sub { margin: 0; font: 500 13px/1.4 var(--p-font); color: var(--p-muted); text-align: center; }
.rl-sub b { color: var(--p-text); }
.rl-pending { background: var(--p-surface); border-radius: 16px; padding: 10px 14px; font: 600 12.5px/1.4 var(--p-font); color: var(--p-text); text-align: center; }
.rl-pending b { color: var(--p-red); }
.rl-hero, .rl-result { background: var(--p-surface); border-radius: 22px; padding: 24px 16px 20px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.rl-result.win { background: var(--p-green-soft); }
.rl-result.warn { background: var(--p-red-soft); }
.rl-emoji { font-size: 64px; line-height: 1; }
.rl-emoji-swing { animation: rlSwing 2s ease-in-out infinite; }
.rl-emoji-spin { animation: rlSpin .5s linear infinite; }
@keyframes rlSwing { 0%, 100% { transform: rotate(-8deg); } 50% { transform: rotate(8deg); } }
@keyframes rlSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .rl-emoji-swing, .rl-emoji-spin { animation: none; } }
.rl-hero-t, .rl-res-k { font: 800 17px var(--p-font); color: var(--p-text); }
.rl-result.win .rl-res-k { color: var(--p-green); text-transform: uppercase; letter-spacing: 1.2px; font-size: 13px; }
.rl-result.warn .rl-res-k { color: var(--p-red); text-transform: uppercase; letter-spacing: 1.2px; font-size: 13px; }
.rl-result.lose .rl-res-k { color: var(--p-muted); }
.rl-hero-s { font: 500 13px/1.45 var(--p-font); color: var(--p-muted); max-width: 300px; }
.rl-hero-s b { color: var(--p-text); }
.rl-res-big { font: 900 36px/1.1 var(--p-font); color: var(--p-text); letter-spacing: -.5px; font-variant-numeric: tabular-nums; }
.rl-res-note { margin-top: 6px; background: var(--p-card); border-radius: 14px; padding: 9px 12px; font: 600 12.5px/1.4 var(--p-font); color: var(--p-text); }
.rl-tx { font: 500 10px ui-monospace, Menlo, monospace; color: var(--p-placeholder); margin-top: 4px; }
.rl-err { color: var(--p-red); font-weight: 700; padding: 16px; }
.rl-spin { margin-top: 10px; min-width: 200px; background: var(--p-red); color: #fff; border: 0; border-radius: 999px; padding: 15px 36px; font: 800 17px var(--p-font); letter-spacing: .3px; cursor: pointer; box-shadow: 0 6px 18px rgba(230, 0, 35, .28); -webkit-tap-highlight-color: transparent; }
.rl-spin:active { transform: scale(.98); }
.rl-spin.rl-cta { width: 100%; min-width: 0; font-size: 15px; }
.rl-close { width: 100%; background: var(--p-surface); color: var(--p-text); border: 0; border-radius: 999px; padding: 13px; font: 700 14px var(--p-font); cursor: pointer; }
.rl-sec-t { font: 800 10.5px var(--p-font); letter-spacing: 1.4px; text-transform: uppercase; color: var(--p-muted); }
.rl-prizes { display: flex; flex-direction: column; gap: 6px; }
.rl-prize-list { display: flex; flex-direction: column; gap: 5px; }
.rl-prize { display: flex; align-items: center; gap: 8px; padding: 9px 12px; background: var(--p-card); border: 1px solid var(--p-border); border-radius: 14px; }
.rl-prize-n { font: 700 12.5px var(--p-font); color: var(--p-text); white-space: nowrap; }
.rl-prize-v { flex: 1; font: 500 11px var(--p-font); color: var(--p-muted); text-align: center; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rl-prize-p { font: 800 11.5px var(--p-font); color: var(--p-text); background: var(--p-surface); border-radius: 999px; padding: 3px 9px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rl-winners { background: var(--p-surface); border-radius: 18px; padding: 12px 12px 10px; display: flex; flex-direction: column; gap: 6px; }
.rl-win-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rl-live { display: inline-flex; align-items: center; gap: 5px; font: 800 9.5px var(--p-font); letter-spacing: 1px; color: var(--p-red); }
.rl-live i { width: 7px; height: 7px; border-radius: 50%; background: var(--p-red); animation: rlPulse 1.4s ease-in-out infinite; }
@keyframes rlPulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.rl-win-list { max-height: 240px; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.rl-win-empty { text-align: center; color: var(--p-muted); font: 500 11.5px var(--p-font); padding: 10px 6px; }
.rl-win-foot { text-align: center; font: 500 10px/1.35 var(--p-font); color: var(--p-placeholder); padding-top: 6px; border-top: 1px dashed #d6d6d6; }
#rouletteModalWinnersList .winner-row { display: flex !important; align-items: center !important; gap: 8px !important; padding: 7px 4px !important; border-bottom: 1px solid #e4e4e4 !important; background: transparent !important; border-radius: 0 !important; margin: 0 !important; }
#rouletteModalWinnersList .winner-row.is-me { background: var(--p-card) !important; border-radius: 10px !important; padding: 7px 8px !important; }
#rouletteModalWinnersList .winner-user { color: var(--p-text) !important; font: 600 12px var(--p-font) !important; flex: 1 !important; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#rouletteModalWinnersList .winner-row.is-me .winner-user { color: var(--p-red) !important; font-weight: 800 !important; }
#rouletteModalWinnersList .winner-prize { color: var(--p-green) !important; font: 800 12.5px var(--p-font) !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
#rouletteModalWinnersList .winner-time { color: var(--p-muted) !important; font: 500 10.5px var(--p-font) !important; white-space: nowrap; }
.rl-community { background: var(--p-surface); border-radius: 18px; padding: 12px 12px 10px; display: flex; flex-direction: column; gap: 8px; }
.rl-community p { margin: 0; font: 500 12.5px/1.45 var(--p-font); color: var(--p-text); }
.rl-link { display: flex; align-items: center; gap: 9px; background: var(--p-text); color: var(--p-inv); text-decoration: none; padding: 11px 14px; border-radius: 999px; font: 700 13px var(--p-font); }
.rl-link span { flex: 1; } .rl-link i { font-style: normal; opacity: .7; }
.rl-link.rl-link-2 { background: var(--p-card); color: var(--p-text); border: 1px solid var(--p-border); }
.rl-needs { text-align: center; align-items: center; }
.rl-needs .rl-sub { max-width: 340px; }
.rl-steps { width: 100%; display: flex; flex-direction: column; gap: 6px; text-align: left; }
.rl-step { display: flex; align-items: center; gap: 12px; background: var(--p-surface); border-radius: 16px; padding: 10px 12px; }
.rl-step-n { flex: 0 0 32px; height: 32px; border-radius: 50%; background: var(--p-red); color: #fff; font: 800 14px var(--p-font); display: inline-flex; align-items: center; justify-content: center; }
.rl-step.done .rl-step-n { background: var(--p-green); }
.rl-step-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.rl-step-t b { font: 700 13.5px var(--p-font); color: var(--p-text); }
.rl-step-t small { font: 500 11px var(--p-font); color: var(--p-muted); }

/* ── #372: aviso "promoción hasta diciembre" de los reembolsos (texto /sys_refund_promo, lo pinta home.js) ── */
.refund-promo { display: block; font: 600 10.5px/1.35 var(--p-font); color: var(--p-muted); }
.refund-promo::before { content: "●"; color: var(--p-red); font-size: 7px; vertical-align: 2px; margin-right: 5px; }
.refund-promo[hidden] { display: none !important; }
.ez-btn .refund-promo { font-size: 9px; margin-top: 2px; }
.info-msg .refund-promo { margin-top: 6px; font-size: 11.5px; color: var(--p-text) !important; }
.rs-promo { text-align: center; margin-top: 8px; }
.dash-promo { margin: 2px 2px 0; }

/* ── #373: SOPORTE (ex Carga manual) — el chat con el estilo de la página + presentación de Martín ──────── */
body.home-mini .support-panel, body.wa-dark.home-mini .support-panel { background: var(--p-card) !important; border: 1px solid var(--p-border) !important; border-bottom: 0 !important; border-radius: 22px 22px 0 0 !important; margin: 0 8px !important; }
.support-panel, body.wa-dark .support-panel { background: var(--p-card) !important; }
.chat-topbar, .wa-head, body.wa-dark .chat-topbar, .support-head, body.wa-dark .support-head { background: var(--p-card) !important; color: var(--p-text) !important; border-bottom: 1px solid var(--p-border) !important; box-shadow: none !important; }
.wa-head .chat-topbar-name, .chat-topbar-name, .support-head-title { color: var(--p-text) !important; }
.wa-head .chat-topbar-status, .chat-topbar-status, .support-head-sub { color: var(--p-muted) !important; }
.chat-topbar-dot { background: var(--p-green) !important; box-shadow: none !important; }
.chat-topbar-avatar, .wa-head .wa-assist { background: var(--p-card) !important; border: 0 !important; box-shadow: none !important; overflow: hidden; border-radius: 50% !important; }
.wa-head .wa-assist svg { width: 100% !important; height: 100% !important; }
.wa-head-btn, .support-back, .support-load-btn, .theme-topbar-btn { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; box-shadow: none !important; }
.chat-container, body.wa-dark .chat-container { background: var(--p-card) !important; background-image: none !important; }
.message, body.wa-dark .message { box-shadow: none !important; font-family: var(--p-font); }
.message.usuario, body.wa-dark .message.usuario, .message.admin, .message.system { background: var(--p-surface) !important; color: var(--p-text) !important; border-radius: 18px 18px 18px 6px !important; }
.message.agente, body.wa-dark .message.agente { background: var(--p-red) !important; color: #fff !important; border-radius: 18px 18px 6px 18px !important; }
.message-time, body.wa-dark .message-time, .msg-ticks { color: var(--p-placeholder) !important; }
.message.agente .message-time, .message.agente .msg-ticks, .message.agente .msg-ticks.msg-read { color: rgba(255, 255, 255, .85) !important; }
.message.agente .chat-link, .message.agente a { color: #fff !important; text-decoration: underline; }
.chat-link, body.wa-dark .chat-link { color: var(--p-red) !important; }
.message img { border-radius: 14px !important; }
.chat-date-separator span, body.wa-dark .chat-date-separator span { background: var(--p-surface) !important; color: var(--p-muted) !important; box-shadow: none !important; border: 0 !important; }
.chat-input-container, body.wa-dark .chat-input-container, body.home-mini .chat-input-container { background: var(--p-card) !important; border-top: 1px solid var(--p-border) !important; box-shadow: none !important; }
#messageInput, body.wa-dark #messageInput { background: var(--p-surface) !important; color: var(--p-text) !important; border: 0 !important; border-radius: 22px !important; box-shadow: none !important; font-family: var(--p-font); }
#messageInput::placeholder, body.wa-dark #messageInput::placeholder { color: var(--p-placeholder) !important; }
.wa-icon-btn, body.wa-dark .wa-icon-btn, .action-btn { color: var(--p-nav) !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
.send-btn, body.wa-dark .send-btn { background: var(--p-red) !important; color: #fff !important; border: 0 !important; border-radius: 50% !important; box-shadow: none !important; }
.copy-btn, body.wa-dark .copy-btn { background: var(--p-card) !important; color: var(--p-text) !important; border: 1px solid var(--p-border) !important; border-radius: 999px !important; }
#typingIndicator, body.wa-dark #typingIndicator { color: var(--p-muted) !important; }
.plat-btn, .deposit-btn, .withdraw-btn { background: var(--p-text) !important; color: var(--p-inv) !important; border: 0 !important; border-radius: 999px !important; box-shadow: none !important; }
.plat-btn.plat-link { background: var(--p-surface) !important; color: var(--p-text) !important; }
.cbu-box { background: var(--p-card) !important; border: 1px solid var(--p-border) !important; }
.cbu-row span { color: var(--p-muted) !important; }
.cbu-row b { color: var(--p-text) !important; }
.cbu-copy, .message.admin .cbu-copy, .message.system .cbu-copy { color: var(--p-text) !important; border-color: var(--p-border-hi) !important; background: var(--p-card) !important; }
.cbu-send { background: var(--p-red) !important; color: #fff !important; box-shadow: none !important; }
body.home-mini .support-panel .cbu-chat-btn { display: none !important; } /* #373: ya no hay "carga manual" por chat */
.support-unread { background: var(--p-red) !important; color: #fff !important; }
/* Presentación de Martín (estilo Stake) */
.sp-intro { display: none; gap: 12px; align-items: flex-start; margin: 10px 10px 0; padding: 14px 14px 12px; background: var(--p-surface); border-radius: 22px; cursor: default; flex: 0 0 auto; }
body.home-mini .sp-intro { display: flex; }
.sp-avatar { position: relative; flex: 0 0 52px; width: 52px; height: 52px; border-radius: 50%; overflow: visible; }
.sp-avatar svg { width: 52px; height: 52px; border-radius: 50%; display: block; }
.sp-dot { position: absolute; right: 1px; bottom: 1px; width: 13px; height: 13px; border-radius: 50%; background: var(--p-green); border: 2px solid var(--p-card); }
.sp-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.sp-name { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font: 800 14.5px var(--p-font); color: var(--p-text); }
.sp-name span { color: var(--p-muted); font-weight: 600; }
.sp-name .sp-online { font: 700 10px var(--p-font); color: var(--p-green); background: var(--p-card); border-radius: 999px; padding: 2px 8px; font-style: normal; }
.sp-msg { font: 500 13.5px/1.45 var(--p-font); color: var(--p-text); }
.sp-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sp-chips button { border: 1px solid var(--p-border); background: var(--p-card); color: var(--p-text); border-radius: 999px; padding: 7px 12px; font: 700 12px var(--p-font); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.sp-chips button:active { background: var(--p-surface-2); }
.sp-sla { align-self: flex-start; font: 800 11px var(--p-font); color: var(--p-red); background: var(--p-card); border-radius: 999px; padding: 5px 10px; }
/* después del primer mensaje queda compacta (tocar el nombre la vuelve a abrir) */
body.sp-sent .sp-intro:not(.sp-open) { padding: 9px 12px; gap: 10px; align-items: center; cursor: pointer; }
body.sp-sent .sp-intro:not(.sp-open) .sp-msg, body.sp-sent .sp-intro:not(.sp-open) .sp-chips { display: none; }
body.sp-sent .sp-intro:not(.sp-open) .sp-avatar, body.sp-sent .sp-intro:not(.sp-open) .sp-avatar svg { flex-basis: 36px; width: 36px; height: 36px; }
body.sp-sent .sp-intro:not(.sp-open) .sp-body { flex-direction: row; align-items: center; justify-content: space-between; gap: 8px; }
body.sp-sent .sp-intro:not(.sp-open) .sp-sla { padding: 3px 8px; font-size: 10px; }
@media (max-height: 640px) { .sp-msg { font-size: 12.5px; } .sp-intro { padding: 11px 12px 10px; } }
/* #374: ruleta — premio mayor destacado y estado bloqueado */
.rl-top { display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; padding: 9px 14px; border-radius: 999px; background: var(--p-red-soft); color: var(--p-text); font: 700 12px var(--p-font); }
.rl-top b { font: 900 16px var(--p-font); color: var(--p-red); letter-spacing: -.2px; }
.rl-top-k { color: var(--p-text); }
.rl-top-odd { color: var(--p-muted); font-weight: 600; }
.rl-hero.rl-locked { background: var(--p-surface); }
.rl-hero.rl-locked .rl-emoji { font-size: 54px; }
.rl-min { color: inherit; font-weight: 800; }
/* #375 (owner): SOPORTE es sólo soporte — sin cartel "Recomendable / Ir a carga automática", sin botones extra */
body.home-mini .service-banner, body.home-mini .test-mini-manual, body.home-mini #supportTests, body.home-mini .plat-link-manual, body.home-mini .ig-bar { display: none !important; }
body.home-mini #waThemeBtn, body.home-mini .wa-head-fire { display: none !important; }
body.home-mini .wa-head .chat-topbar-info { cursor: default; }
/* #376: estado de la carga automática (chat + franja) */
.dep-pill { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; padding: 5px 11px; border-radius: 999px; font: 800 11.5px var(--p-font); background: var(--p-card); color: var(--p-text); border: 1px solid var(--p-border); }
.dep-pill.dep-wait { color: #8a5a00; background: #fff6e0; border-color: #ffe0a3; }
.dep-pill.dep-dup, .dep-pill.dep-rej { color: var(--p-red); background: var(--p-red-soft); border-color: #ffc2cb; }
.message.agente .dep-pill { background: var(--p-card); }
.dep-pending-strip { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; padding: 9px 12px; border-radius: 14px; background: #fff6e0; border: 1px solid #ffe0a3; color: #5a3d00; }
.dep-pending-strip[hidden] { display: none !important; }
.dep-pending-strip .dps-ico { font-size: 20px; line-height: 1; }
.dep-pending-strip .dps-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.dep-pending-strip b { font: 800 13px var(--p-font); color: #5a3d00; }
.dep-pending-strip small { font: 600 11px var(--p-font); color: #8a5a00; }
.easy-view .dep-pending-strip { flex: 0 0 auto; margin: 0; }
/* #377: firma de la persona de Soporte en las respuestas */
.msg-who { font: 800 10.5px var(--p-font); color: var(--p-red); margin-bottom: 2px; letter-spacing: .2px; }
/* #379: retiro: pago automático + mínimo */
.wd-auto { margin: 4px 0 0 !important; font: 600 12px var(--p-font) !important; color: var(--p-muted) !important; }
.wd-auto b { color: var(--p-text); }

/* #380 (owner): las plataformas del Inicio como cuadrados iguales (grilla de N columnas, misma altura) */
.ev-tabs { display: grid !important; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 8px !important; padding-top: 0 !important; }
.ev-tab, .ev-tab.soon { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 4px !important; height: 86px; padding: 8px 6px !important; border-radius: 18px !important; font: 800 11.5px var(--p-font) !important; text-transform: none !important; letter-spacing: 0 !important; position: relative; opacity: 1 !important; min-width: 0; }
.ev-tab img { width: 30px !important; height: 30px !important; border-radius: 9px !important; flex: 0 0 auto; }
.ev-tab .ev-reco { position: absolute !important; top: 6px !important; right: 6px !important; font-size: 7.5px !important; padding: 2px 6px !important; }
.ev-tab.soon .ev-soon, .ev-tab .ev-soon { position: static !important; display: inline-block !important; flex: 0 0 auto !important; margin: 0 !important; width: auto !important; font: 800 8px var(--p-font) !important; letter-spacing: .4px !important; text-transform: uppercase; padding: 2px 7px !important; border-radius: 999px !important; }

/* ── #381: PANTALLA DE INGRESO ─────────────────────────────────────────────────────────────── */
.login-screen { align-items: flex-start; padding: 0; }
.login-box.lg { max-width: 440px; padding: 14px 16px 22px; display: flex; flex-direction: column; gap: 10px; text-align: left; }
.lg-head { display: flex; align-items: center; gap: 10px; }
.lg-logo { width: 46px; height: 46px; border-radius: 13px; flex: 0 0 auto; }
.lg-brand { display: flex; flex-direction: column; line-height: 1.1; flex: 1 1 auto; min-width: 0; }
.lg-brand b { font: 900 17px var(--p-font); letter-spacing: 1.2px; color: var(--p-text); }
.lg-brand small { font: 600 10.5px var(--p-font); color: var(--p-muted); letter-spacing: .3px; }
.lg-tg { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; background: var(--p-surface) !important; border: 0 !important; color: var(--p-text) !important; border-radius: 999px !important; padding: 8px 12px !important; font: 700 12px var(--p-font) !important; cursor: pointer; box-shadow: none !important; }
.lg-chip-red { background: var(--p-red); color: #fff; }
.lg-ticker-t { flex: 1; min-width: 0; font: 600 11.5px var(--p-font); color: var(--p-text) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lg-form { background: var(--p-surface); border-radius: 22px; padding: 14px 14px 6px; margin-top: 2px; }
.lg-form .input-group { margin-bottom: 10px; }
.lg-form .input-group input { background: var(--p-card) !important; }
.lg-form .btn-primary { margin-bottom: 6px; padding: 14px; font-size: 15px; }
.lg-alt { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.lg-alt-q { font: 700 13px var(--p-font); color: var(--p-text); flex: 1 0 100%; }
.lg-register { flex: 1 1 auto; margin: 0 !important; padding: 13px !important; font-size: 14px !important; }
.lg-link { border: 0; background: transparent; color: var(--p-muted); font: 700 12px var(--p-font); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; padding: 6px 4px; }
.lg-alt-note { flex: 1 0 100%; font: 500 10.5px var(--p-font); color: var(--p-placeholder); }
.lg-sec { margin-top: 6px; }
.lg-reviews { margin: 0 !important; }
.lg-foot { margin: 4px 0 0; text-align: center; font: 600 10px var(--p-font); color: var(--p-placeholder); }

/* #383 (owner): las plataformas de la carga automática en una sola fila de cuadrados iguales (como el Inicio) */
.plat-play-row { display: grid !important; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 8px !important; }
.plat-play-wrap { min-width: 0 !important; flex: none !important; }
.plat-play-btn { height: 96px; padding: 8px 6px 24px !important; min-width: 0; }
.plat-play-btn .plat-logo { width: 28px !important; height: 28px !important; }
.plat-play-name { font-size: 11.5px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
/* #385: "Retirar premio" con título + bajada (mínimo y pago automático) */
.withdraw-row-btn { display: flex !important; align-items: center; justify-content: center; text-align: left; }
.withdraw-row-btn .lr-text b { font: 800 13px var(--p-font) !important; color: var(--p-text) !important; }
.withdraw-row-btn .lr-text small { font: 600 10px var(--p-font) !important; color: var(--p-muted) !important; }

/* ── #392 (owner 2026-10-18): MODO NOCTURNO de la app. html[data-theme="dark"] (localStorage 'vip_theme'; se alterna
   desde Perfil y desde el botón 🌙/☀️ de la barra de arriba). Sólo cambian los tokens; la Carga manual (#supportPanel),
   la ruleta y las historias no dependen de pin.css y siguen igual. ── */
html[data-theme="dark"] {
  --p-bg: #121212; --p-surface: #1e1e1e; --p-surface-2: #2a2a2a; --p-text: #f2f2f2; --p-muted: #a3a3a3; --p-border: #2e2e2e;
  --p-red: #ff3b4e; --p-red-dark: #d1192d; --p-red-soft: #3a1218; --p-green: #5fd38d; --p-green-soft: #10291a; --p-green-line: #1e4a30;
  --p-shadow: 0 2px 18px rgba(0, 0, 0, .5);
  --p-card: #181818; --p-hover: #232323; --p-nav: #bdbdbd; --p-border-hi: #3a3a3a; --p-placeholder: #7a7a7a; --p-text-2: #d6d6d6; --p-inv: #111;
  color-scheme: dark;
}
html[data-theme="dark"] .error-message { color: #ff8a9a; background: #3a1218; }
html[data-theme="dark"] .toast { box-shadow: 0 6px 24px rgba(0, 0, 0, .6); }
.header .tn-theme .tn-ico { font-size: 17px; line-height: 1; }
/* ── #391: "Retirar premio" en VERDE sobrio (misma familia que el resto), bajada corta y legible ── */
.withdraw-row-btn { background: var(--p-green-soft) !important; color: var(--p-green) !important; border: 1px solid var(--p-green-line) !important; }
.withdraw-row-btn .lr-text b { color: var(--p-green) !important; font: 800 13px var(--p-font) !important; letter-spacing: .2px !important; text-transform: none !important; }
.withdraw-row-btn .lr-text small { color: var(--p-green) !important; opacity: .85; font: 600 10.5px var(--p-font) !important; letter-spacing: 0 !important; text-transform: none !important; }
/* ── #393: Perfil — código de referido debajo del nombre ── */
.profile-modal .pf-usercode { display: flex; align-items: center; gap: 6px; margin: 2px 0 4px; font: 600 11.5px var(--p-font); color: var(--p-muted); }
.profile-modal .pf-usercode b { font: 800 12.5px var(--p-font); letter-spacing: 1.5px; color: var(--p-text); background: var(--p-surface); padding: 2px 8px; border-radius: 8px; }
.profile-modal .pf-usercode .pf-copy { padding: 2px 8px; font-size: 10.5px; }
/* ── #394: Info — cada sección es una TARJETA propia (franja de color distinta) y el título va RECUADRADO ── */
.info-msg { background: transparent !important; padding: 0 !important; border-radius: 0 !important; margin: 8px 0 0 !important; }
.info-msg .im-sec { display: block; background: var(--p-card) !important; border: 1px solid var(--p-border) !important; border-left: 5px solid var(--im-acc, var(--p-red)) !important; border-radius: 14px !important; padding: 12px 14px !important; margin: 0 0 10px !important; color: var(--p-text-2) !important; font-size: 12.5px; line-height: 1.5; }
.info-msg .im-sec:last-child { margin-bottom: 0 !important; }
.info-msg .im-sec > b:first-child { display: inline-flex !important; align-items: center; gap: 6px; background: var(--p-surface) !important; border: 1px solid var(--p-border) !important; border-radius: 10px; padding: 5px 10px; margin: 0 0 8px !important; font: 800 13px var(--p-font) !important; color: var(--p-text) !important; letter-spacing: 0 !important; }
.info-msg .im-sec:nth-of-type(1) { --im-acc: #e60023; } .info-msg .im-sec:nth-of-type(2) { --im-acc: #16a34a; } .info-msg .im-sec:nth-of-type(3) { --im-acc: #0ea5e9; }
.info-msg .im-sec:nth-of-type(4) { --im-acc: #9333ea; } .info-msg .im-sec:nth-of-type(5) { --im-acc: #f97316; } .info-msg .im-sec:nth-of-type(6) { --im-acc: #d4af37; }

/* ── #399: en NOCTURNO, todo lo que tiene fondo --p-text (blanco ahí) lleva texto --p-inv (y sus hijos) ── */
html[data-theme="dark"] #autoLoadCard .al-step-2 .al-n, html[data-theme="dark"] #entryReviews .rv-avatar, html[data-theme="dark"] .al-manual button, html[data-theme="dark"] .al-n, html[data-theme="dark"] .at-help, html[data-theme="dark"] .bs-vip-bar i, html[data-theme="dark"] .casino-plat-tab.active, html[data-theme="dark"] .cl-plat.on, html[data-theme="dark"] .cl-step > b, html[data-theme="dark"] .dash-top .dash-roulette-avatar, html[data-theme="dark"] .dash-top .dash-user-avatar, html[data-theme="dark"] .dash-top .refund-tier, html[data-theme="dark"] .deposit-btn, html[data-theme="dark"] .ev-tab.active, html[data-theme="dark"] .ev-tab.plat-ganamos.active, html[data-theme="dark"] .hiw-step b.n, html[data-theme="dark"] .ig-bar, html[data-theme="dark"] .plat-btn, html[data-theme="dark"] .plat-enter, html[data-theme="dark"] .plat-fix.on, html[data-theme="dark"] .plat-play-btn.is-pref .plat-check, html[data-theme="dark"] .profile-modal .pf-capture, html[data-theme="dark"] .rl-link, html[data-theme="dark"] .rv-avatar, html[data-theme="dark"] .toast, html[data-theme="dark"] .vc-plat.on, html[data-theme="dark"] .withdraw-btn { color: var(--p-inv) !important; }
html[data-theme="dark"] #autoLoadCard .al-step-2 .al-n *, html[data-theme="dark"] #entryReviews .rv-avatar *, html[data-theme="dark"] .al-manual button *, html[data-theme="dark"] .al-n *, html[data-theme="dark"] .at-help *, html[data-theme="dark"] .bs-vip-bar i *, html[data-theme="dark"] .casino-plat-tab.active *, html[data-theme="dark"] .cl-plat.on *, html[data-theme="dark"] .cl-step > b *, html[data-theme="dark"] .dash-top .dash-roulette-avatar *, html[data-theme="dark"] .dash-top .dash-user-avatar *, html[data-theme="dark"] .dash-top .refund-tier *, html[data-theme="dark"] .deposit-btn *, html[data-theme="dark"] .ev-tab.active *, html[data-theme="dark"] .ev-tab.plat-ganamos.active *, html[data-theme="dark"] .hiw-step b.n *, html[data-theme="dark"] .ig-bar *, html[data-theme="dark"] .plat-btn *, html[data-theme="dark"] .plat-enter *, html[data-theme="dark"] .plat-fix.on *, html[data-theme="dark"] .plat-play-btn.is-pref .plat-check *, html[data-theme="dark"] .profile-modal .pf-capture *, html[data-theme="dark"] .rl-link *, html[data-theme="dark"] .rv-avatar *, html[data-theme="dark"] .toast *, html[data-theme="dark"] .vc-plat.on *, html[data-theme="dark"] .withdraw-btn * { color: var(--p-inv) !important; }
html[data-theme="dark"] .ev-tab.active .ev-reco, html[data-theme="dark"] .ev-tab.active .ev-reco * { color: var(--p-red) !important; }
/* estilos inline blancos del HTML viejo → tarjeta en nocturno */
html[data-theme="dark"] [style*="background:#fff"], html[data-theme="dark"] [style*="background: #fff"], html[data-theme="dark"] [style*="background:#ffffff"], html[data-theme="dark"] [style*="background:white"], html[data-theme="dark"] [style*="background:#f0f2f5"], html[data-theme="dark"] [style*="background:#f1f1f1"], html[data-theme="dark"] [style*="background:#f8f9fa"] { background: var(--p-card) !important; }
html[data-theme="dark"] [style*="color:#111"], html[data-theme="dark"] [style*="color: #111"], html[data-theme="dark"] [style*="color:#000"], html[data-theme="dark"] [style*="color:#222"], html[data-theme="dark"] [style*="color:#333"], html[data-theme="dark"] [style*="color:#444"] { color: var(--p-text) !important; }
html[data-theme="dark"] .modal-content, html[data-theme="dark"] .refund-simple .modal-content { background: var(--p-card) !important; color: var(--p-text) !important; }
/* ── #399: Perfil — interruptor de modo nocturno ARRIBA de todo ── */
.profile-modal .pf-theme-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--p-surface); border-radius: 14px; padding: 9px 12px; margin: 0 0 10px; }
.profile-modal .pf-theme-k { display: flex; flex-direction: column; font: 600 11px var(--p-font); color: var(--p-muted); }
.profile-modal .pf-theme-k b { font: 800 13px var(--p-font); color: var(--p-text); }
.profile-modal .pf-theme-btn { flex: 0 0 auto; border: 0; border-radius: 999px; padding: 7px 14px; background: var(--p-text); color: var(--p-inv); font: 800 12px var(--p-font); cursor: pointer; }
html[data-theme="dark"] .profile-modal .pf-theme-btn { background: var(--p-red); color: #fff; }
/* ── #399: Perfil — usuario / contraseña / página en UNA fila cada uno, letra más chica; botones apilados (Copiar arriba, Ocultar abajo) ── */
.profile-modal .pf-main-big .pf-row { gap: 6px !important; padding: 6px 0 !important; }
.profile-modal .pf-main-big .pf-k { min-width: 74px !important; font-size: 9.5px !important; letter-spacing: .3px !important; }
.profile-modal .pf-main-big .pf-v { font-size: 14px !important; font-weight: 700 !important; letter-spacing: .2px; }
.profile-modal .pf-main-big .pf-link { font-size: 11px !important; font-weight: 700 !important; }
.profile-modal .pf-btns { display: flex; flex-direction: column; gap: 4px; flex: 0 0 auto; align-items: stretch; }
.profile-modal .pf-btns .pf-copy, .profile-modal .pf-main-big .pf-copy { font-size: 10.5px !important; padding: 3px 9px !important; text-align: center; }
/* ── #400: títulos de "Comprobante aquí" / "Retirar premio" en minúscula (sin mayúsculas forzadas) y en UNA fila ── */
.home-actions-row .lr-text { min-width: 0; }
.home-actions-row .lr-text b, .load-row-btn .lr-text b, .withdraw-row-btn .lr-text b { text-transform: none !important; letter-spacing: 0 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12.5px !important; }
.home-actions-row .lr-text small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#autoLoadCard .al-step-3 .al-step-t { color: var(--p-text) !important; }
/* ── #401 (owner): una vez que el cliente habló con Soporte, la burbuja de presentación se va del todo ── */
body.sp-sent .sp-intro, body.sp-sent #supportIntro { display: none !important; } /* #612: en home-mini se vuelve a mostrar arriba (ver abajo) */
/* ── #402 (owner): con la barra fija "PENDIENTE · Instalá la app" (body.ig-pending) el contenido deja lugar abajo para que no
   tape "Comprobante aquí" / "Retirar premio" ── */
body.ig-pending #homeFull, body.ig-pending #easyView, body.ig-pending #entryView, body.ig-pending .chat-screen > .home-actions-row:last-child { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
body.ig-pending .home-actions-row { scroll-margin-bottom: 90px; }
/* ── #403 (owner): "Telegram" e "Historias" se cortaban en la barra → etiquetas un poco más chicas y sin recorte ── */
.header .tn-btn:not(.tn-home) { overflow: visible !important; min-width: 0; }
.header .tn-btn:not(.tn-home) .tn-lbl { font-size: 7.5px !important; letter-spacing: .2px !important; white-space: nowrap; overflow: visible; }
.header .tn-telegram .tn-lbl, .header .tn-stories .tn-lbl, .header .tn-btn:not(.tn-home).tn-telegram .tn-lbl, .header .tn-btn:not(.tn-home).tn-stories .tn-lbl { font-size: 6.8px !important; letter-spacing: 0 !important; }
/* ── #404 (owner): Perfil más COMPACTO ("achicá un poco todo así queda más centralizado") ── */
.pf-compact .modal-content { padding: 14px 14px 12px !important; }
.pf-compact .modal-header { margin-bottom: 8px !important; }
.pf-compact .modal-header h2 { font-size: 18px !important; }
.pf-compact .modal-header p { font-size: 11.5px !important; margin: 2px 0 0 !important; }
.pf-compact .pf-actions { gap: 5px !important; margin: 0 0 8px !important; }
.pf-compact .pf-actions-top { margin: 0 0 8px !important; }
.pf-compact .pf-act { padding: 8px 11px !important; min-height: 0 !important; font-size: 12.5px !important; border-radius: 12px !important; gap: 8px !important; }
.pf-compact .pf-act small { font-size: 10.5px !important; }
.pf-compact .pf-act .pf-ico-btn { width: 30px !important; height: 30px !important; font-size: 15px !important; }
.pf-compact .pf-theme-row { padding: 7px 11px; margin: 0 0 6px; border-radius: 12px; }
.pf-compact .pf-theme-k b { font-size: 12.5px; }
.pf-compact .pf-theme-btn { padding: 6px 12px; font-size: 11.5px; }
.pf-compact .pf-userbox { padding: 9px 11px !important; margin: 0 0 8px !important; gap: 10px !important; border-radius: 14px !important; }
.pf-compact .pf-avatar { width: 54px !important; height: 54px !important; }
.pf-compact .pf-username { font-size: 16px !important; }
.pf-compact .pf-userlvl { font-size: 11px !important; }
.pf-compact .pf-userhint { font-size: 9.5px !important; }
.pf-compact .pf-main-big { padding: 6px 11px 10px !important; margin: 0 0 8px !important; border-radius: 14px !important; }
.pf-compact .pf-main-big .pf-row { padding: 5px 0 !important; }
.pf-compact .pf-main-big .pf-v { font-size: 13px !important; }
.pf-compact .pf-hint { font-size: 10.5px !important; }
.pf-compact .pf-capture { padding: 9px 12px !important; font-size: 12px !important; margin-top: 6px !important; }
/* ── #406 (owner): "Página de la app" — el link va RECTO debajo del título, en una sola línea (no se parte) ── */
.profile-modal .pf-row.pf-row-link { flex-wrap: wrap !important; row-gap: 3px !important; }
.profile-modal .pf-row.pf-row-link .pf-k { order: 1; min-width: 0 !important; flex: 1 1 auto; }
.profile-modal .pf-row.pf-row-link .pf-copy { order: 2; margin-left: auto; }
.profile-modal .pf-row.pf-row-link .pf-link { order: 3; flex: 1 1 100% !important; width: 100%; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; word-break: normal !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 0 !important; }
/* ── #409 (owner): los dos botones a MITAD y MITAD, dentro del ancho de las tarjetas de pasos, sin desbordar ── */
.home-actions-row, body.home-full .home-actions-row { display: flex !important; gap: 8px !important; margin: 6px 12px !important; width: auto !important; max-width: 100%; box-sizing: border-box; }
.home-actions-row > .load-row-btn, .home-actions-row > .withdraw-row-btn, body.home-full .home-actions-row .withdraw-row-btn, body.home-full .load-row-btn { flex: 1 1 0 !important; width: 50% !important; max-width: 50% !important; min-width: 0 !important; margin: 0 !important; overflow: hidden !important; box-sizing: border-box; padding: 9px 12px !important; }
.home-actions-row .lr-text { min-width: 0 !important; overflow: hidden; flex: 1 1 auto; }
.home-actions-row .lr-text b { font-size: 12px !important; }
.home-actions-row .lr-text small { font-size: 9.5px !important; }
.home-actions-row .load-row-btn svg { flex: 0 0 auto; width: 16px; height: 16px; }
/* ── #412: "Cerrar sesión" en Perfil sólo para el usuario de prueba ── */
.profile-modal .pf-logout { display: none !important; }
body.is-tester .profile-modal .pf-logout, body.can-logout .profile-modal .pf-logout { display: flex !important; color: var(--p-red) !important; } /* #437 */
body.is-tester .profile-modal .pf-logout small, body.can-logout .profile-modal .pf-logout small { color: var(--p-muted) !important; }
/* ── #414: pantalla de ingreso = REGISTRO primero; "Ya tengo cuenta" despliega el login ── */
.lg-reg-main { display: flex !important; flex-direction: column; align-items: center; gap: 2px; padding: 13px 14px !important; font-size: 16px !important; margin: 0 !important; }
.lg-reg-main small { font: 600 11px var(--p-font); opacity: .92; text-transform: none; letter-spacing: 0; }
.lg-alt .lg-link { font: 700 12px var(--p-font); color: var(--p-text); background: var(--p-surface); border: 0; border-radius: 999px; padding: 8px 12px; cursor: pointer; }
/* ── #414: ticker sobrio ── */
.lg-ticker-t { display: flex !important; align-items: baseline; gap: 6px; transition: opacity .25s; }
.lg-tk-n { font: 800 12px var(--p-font); color: var(--p-text); letter-spacing: .3px; }
.lg-tk-v { font: 500 11px var(--p-font); color: var(--p-muted); }
.lg-tk-a { font: 800 12.5px var(--p-font); color: var(--p-green); }
.lg-tk-k { font: 600 10.5px var(--p-font); color: var(--p-muted); background: var(--p-card); border-radius: 999px; padding: 1px 7px; white-space: nowrap; }
/* ── #414: SOPORTE PARA VISITANTES (burbuja + panel) ── */
.gs-av { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%; overflow: hidden; display: block; background: var(--p-red-soft); }
.gs-av svg { width: 100%; height: 100%; display: block; }
.gs-bubble { position: fixed; right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); z-index: 9500; display: flex; align-items: center; gap: 10px; padding: 8px 14px 8px 8px; border: 1px solid var(--p-border); background: var(--p-card); color: var(--p-text); border-radius: 999px; box-shadow: 0 8px 28px rgba(0, 0, 0, .18); cursor: pointer; font-family: var(--p-font); }
.gs-bubble.hide, html.has-session .gs-bubble { display: none !important; }
.gs-bubble-t { display: flex; flex-direction: column; text-align: left; line-height: 1.15; }
.gs-bubble-t b { font: 800 13.5px var(--p-font); } .gs-bubble-t small { font: 600 10.5px var(--p-font); color: var(--p-muted); }
.gs-panel { position: fixed; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); left: 12px; margin-left: auto; width: min(380px, calc(100% - 24px)); max-height: min(78vh, 620px); z-index: 9600; display: none; flex-direction: column; background: var(--p-card); border: 1px solid var(--p-border); border-radius: 22px; box-shadow: 0 14px 44px rgba(0, 0, 0, .24); overflow: hidden; font-family: var(--p-font); }
.gs-panel.open { display: flex; }
.gs-head { display: flex; align-items: center; gap: 10px; padding: 12px 12px 10px; border-bottom: 1px solid var(--p-border); }
.gs-head-t { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.gs-head-t b { font: 800 14.5px var(--p-font); color: var(--p-text); } .gs-head-t small { font: 600 11px var(--p-font); color: var(--p-muted); display: flex; align-items: center; gap: 4px; }
.gs-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--p-green); display: inline-block; }
.gs-x { border: 0; background: var(--p-surface); color: var(--p-text); width: 32px; height: 32px; border-radius: 50%; font-size: 14px; cursor: pointer; }
.gs-form { display: flex; flex-direction: column; gap: 8px; padding: 12px; overflow-y: auto; }
.gs-form label { display: flex; flex-direction: column; gap: 4px; font: 700 11.5px var(--p-font); color: var(--p-muted); }
.gs-form input, .gs-form textarea { background: var(--p-surface) !important; border: 2px solid transparent !important; border-radius: 12px !important; padding: 10px 12px !important; font: 500 14px var(--p-font) !important; color: var(--p-text) !important; }
.gs-form input:focus, .gs-form textarea:focus { border-color: var(--p-text) !important; outline: none; }
.gs-err { color: var(--p-red); font: 600 11.5px var(--p-font); min-height: 14px; }
.gs-send-main { border: 0; background: var(--p-red); color: #fff; border-radius: 999px; padding: 12px; font: 800 14px var(--p-font); cursor: pointer; }
.gs-chat { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.gs-messages { flex: 1; min-height: 180px; max-height: 46vh; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; background: var(--p-bg); }
.gs-intro { margin-bottom: 2px; }
.gs-msg { max-width: 86%; padding: 9px 12px; border-radius: 16px; font: 500 13.5px/1.4 var(--p-font); display: flex; flex-direction: column; gap: 2px; }
.gs-theirs { align-self: flex-start; background: var(--p-surface); color: var(--p-text); border-bottom-left-radius: 6px; }
.gs-mine { align-self: flex-end; background: var(--p-red); color: #fff; border-bottom-right-radius: 6px; }
.gs-who { font: 700 10px var(--p-font); color: var(--p-muted); }
.gs-time { font: 500 9.5px var(--p-font); opacity: .75; align-self: flex-end; }
.gs-closed { align-self: center; font: 600 11px var(--p-font); color: var(--p-muted); background: var(--p-surface); border-radius: 999px; padding: 4px 10px; }
.gs-status { font: 600 10.5px var(--p-font); color: var(--p-muted); padding: 4px 12px 0; }
.gs-input { display: flex; gap: 6px; padding: 8px 10px 6px; }
.gs-input input { flex: 1; min-width: 0; background: var(--p-surface) !important; border: 0 !important; border-radius: 999px !important; padding: 10px 14px !important; font: 500 14px var(--p-font) !important; color: var(--p-text) !important; }
.gs-input button { flex: 0 0 40px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--p-red); color: #fff; font-size: 16px; cursor: pointer; }
.gs-reset { border: 0; background: transparent; color: var(--p-muted); font: 600 11px var(--p-font); padding: 4px 12px 10px; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; align-self: center; }
/* ── #415 (owner): INGRESO EN UNA SOLA PANTALLA, estilo registro de app (Pinterest): sin deslizar, explicación resumida ── */
.login-screen:has(.lg-app) { min-height: 100dvh; display: flex; align-items: center !important; justify-content: center; padding: 10px 0 !important; }
.login-box.lg-app { gap: 8px !important; padding: 12px 16px 12px !important; max-width: 420px; }
.lg-app .lg-logo { width: 42px; height: 42px; border-radius: 12px; }
.lg-app .lg-brand b { font-size: 16px; } .lg-app .lg-brand small { font-size: 10px; }
.lg-app .lg-form { padding: 12px 12px 8px; border-radius: 20px; }
.lg-app .lg-reg-main { padding: 14px !important; font-size: 17px !important; }
.lg-app .lg-sec, .lg-app #loginReviewsBtn { display: none !important; }   /* "Lo que te damos" y el slider: fuera de la pantalla única */
.lg-app .lg-alt { gap: 6px; } .lg-app .lg-alt .lg-link { padding: 7px 11px; font-size: 11.5px; } .lg-app .lg-alt-note { font-size: 10px; }
.lg-trust { display: flex; align-items: center; gap: 6px; font: 600 12px var(--p-font); color: var(--p-muted); padding: 2px 2px 0; }
.lg-trust b { color: var(--p-text); font-weight: 800; }
.lg-stars { color: #f5a623; letter-spacing: 1px; font-size: 13px; } .lg-stars i { color: var(--p-border); font-style: normal; }
.lg-app .lg-foot { margin: 0; }
@media (max-height: 620px) { .lg-app .lg-alt-note { display: none; } }
/* ── #416: ingreso — tira de HISTORIAS y una reseña corta que rota (sin chips ni ticker) ── */
.lg-stories-t { font: 800 10.5px var(--p-font); letter-spacing: 1.2px; text-transform: uppercase; color: var(--p-muted); }
.lg-stories-row { display: flex; gap: 10px; overflow-x: auto; padding: 2px 2px 4px; scrollbar-width: none; }
.lg-stories-row::-webkit-scrollbar { display: none; }
.lg-story-ring { width: 54px; height: 54px; border-radius: 50%; padding: 2px; background: linear-gradient(135deg, var(--p-red), #ff8a9a); display: flex; align-items: center; justify-content: center; }
.lg-story-ring img, .lg-story-ring i { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 2px solid var(--p-card); display: flex; align-items: center; justify-content: center; font: 800 14px var(--p-font); font-style: normal; color: #fff; background: var(--bg, #06070d); }
.lg-quote-t { font: 500 12.5px/1.4 var(--p-font); color: var(--p-text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lg-quote-n { font: 700 10.5px var(--p-font); color: var(--p-muted); }
/* ── #417: ingreso — anillo de HISTORIAS arriba a la derecha (Instagram), reseñas deslizándose, registro como estaba ── */
.lg-ring { position: relative; flex: 0 0 auto; width: 44px; height: 44px; border: 0; background: transparent; padding: 0; cursor: pointer; }
.lg-ring-av { display: flex; width: 44px; height: 44px; border-radius: 50%; padding: 2.5px; background: linear-gradient(135deg, #f9ce34, #ee2a7b, #6228d7); }
.lg-ring.has-new .lg-ring-av { animation: lgRingPulse 2.2s ease-in-out infinite; }
.lg-ring-av img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 2px solid var(--p-card); background: var(--p-card); }
.lg-ring-n { position: absolute; right: -3px; bottom: -3px; min-width: 17px; height: 17px; border-radius: 999px; background: var(--p-red); color: #fff; font: 800 10px/17px var(--p-font); text-align: center; padding: 0 4px; border: 2px solid var(--p-card); }
@keyframes lgRingPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(238, 42, 123, .35); } 50% { box-shadow: 0 0 0 6px rgba(238, 42, 123, 0); } }
.lg-app .lg-sec-reviews { display: block !important; margin-top: 2px; }
.lg-app .lg-sec-reviews .ev-reviews { margin: 0 !important; }
.lg-app .lg-alt { margin-top: 2px; }
.lg-app .lg-register { padding: 11px !important; font-size: 13.5px !important; }
.login-screen:has(.lg-app) { align-items: flex-start !important; }          /* centrado por margin:auto de .login-box: no recorta arriba */
.login-box.lg-app { margin: auto !important; }
/* ── #419 (owner): ingreso — todo lo de arriba más chico, reseñas con el comentario visible, Soporte abajo en la punta ── */
.login-box.lg-app { gap: 6px !important; padding: 10px 14px 10px !important; }
.lg-app .lg-head { gap: 8px; }
.lg-app .lg-logo { width: 34px; height: 34px; border-radius: 10px; }
.lg-app .lg-brand b { font-size: 14px; letter-spacing: 1px; } .lg-app .lg-brand small { font-size: 9.5px; }
.lg-app .lg-tg { padding: 6px 10px !important; font-size: 11.5px !important; }
.lg-app .lg-ring, .lg-app .lg-ring-av { width: 36px; height: 36px; } .lg-app .lg-ring-n { min-width: 15px; height: 15px; font-size: 9px; line-height: 15px; }
.lg-app .lg-form { padding: 10px 10px 6px; border-radius: 18px; }
.lg-app .lg-form .input-group { margin-bottom: 7px; }
.lg-app .lg-form .input-group label { font-size: 12px; }
.lg-app .lg-form .input-group input { padding: 10px 12px !important; font-size: 14px !important; }
.lg-app .lg-form .btn-primary { padding: 11px !important; font-size: 14px !important; margin-bottom: 4px !important; }
.lg-app .lg-alt { gap: 5px; } .lg-app .lg-alt-q { font-size: 12px; flex: 1 0 100%; }
.lg-app .lg-register { padding: 9px !important; font-size: 12.5px !important; }
.lg-app .lg-alt .lg-link { padding: 6px 10px; font-size: 11px; }
.lg-app .lg-alt-note { display: none; }
.lg-app .lg-trust { font-size: 11px; padding: 0 2px; }
/* reseñas: tarjeta clara con el COMENTARIO visible (3 líneas) */
.lg-app #loginReviews { background: transparent !important; border: 0 !important; padding: 0 !important; }
.lg-app #loginReviews .rv-head { padding: 0 2px; } .lg-app #loginReviews .rv-g { font: 800 10.5px var(--p-font); letter-spacing: 1px; text-transform: uppercase; color: var(--p-muted); }
.lg-app #loginReviews .rv-card { flex: 0 0 72%; max-width: 260px; background: var(--p-surface) !important; color: var(--p-text) !important; border-radius: 14px !important; padding: 8px 10px !important; display: flex; flex-direction: column; gap: 4px; }
.lg-app #loginReviews .rv-who b { color: var(--p-text) !important; font-size: 12px; }
.lg-app #loginReviews .rv-text { color: var(--p-text) !important; font: 500 12px/1.4 var(--p-font) !important; -webkit-line-clamp: 3; min-height: 2.8em; }
.lg-app .lg-foot { font-size: 9.5px; }
/* Soporte: más abajo, en la punta derecha, compacto (sólo avatar + "Soporte") */
.gs-bubble { right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); padding: 5px 12px 5px 5px; gap: 8px; box-shadow: 0 6px 20px rgba(0, 0, 0, .16); }
.gs-bubble .gs-av { flex-basis: 36px; width: 36px; height: 36px; }
.gs-bubble-t b { font-size: 12px; } .gs-bubble-t small { display: none; }
@media (max-height: 700px) { .lg-app #loginReviews .rv-text { -webkit-line-clamp: 2; min-height: 0; } }
/* ── #420 (owner): botón de ingreso "Iniciar sesión", más chico y sin el estilo llamativo de publicista ── */
.lg-app .lg-form .btn-primary.lg-login-btn, .lg-app .lg-form .btn-primary.publisher-cta { padding: 9px 12px !important; font-size: 13px !important; font-weight: 700 !important; width: auto !important; min-width: 56%; margin: 2px auto 4px !important; display: block; animation: none !important; box-shadow: none !important; }
/* ── #421: ENTRADA RÁPIDA (registro desactivado desde el panel) ── */
.lg-quick { display: none; flex-direction: column; gap: 7px; }
body.reg-quick .lg-quick { display: flex; }
body.reg-quick:not(.reg-quick-login) #loginForm, body.reg-quick:not(.reg-quick-login) .lg-alt .lg-alt-q, body.reg-quick:not(.reg-quick-login) .lg-alt .lg-register { display: none !important; }
body.reg-quick.reg-quick-login .lg-quick { display: none; }
.lg-quick-l { font: 700 12px var(--p-font); color: var(--p-text); }
.lg-quick input { background: var(--p-card) !important; border: 2px solid transparent !important; border-radius: 14px !important; padding: 12px 14px !important; font: 600 16px var(--p-font) !important; color: var(--p-text) !important; }
.lg-quick input:focus { border-color: var(--p-text) !important; outline: none; }
.lg-quick-btn { padding: 13px !important; font-size: 16px !important; margin: 0 !important; }
.lg-quick-n { font: 500 11px var(--p-font); color: var(--p-muted); text-align: center; }
/* ── #423: ingreso — fila de plataformas (logo + nombre; "Próximamente" las que no tienen API) ── */
.lg-plats-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 0; }
.lg-plat-pill { display: inline-flex; align-items: center; gap: 5px; background: var(--p-surface); border-radius: 999px; padding: 4px 9px 4px 5px; font-family: var(--p-font); }
.lg-plat-pill img, .lg-plat-pill i { width: 18px; height: 18px; border-radius: 50%; object-fit: cover; background: var(--p-card); font-style: normal; font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
.lg-plat-pill b { font: 800 11.5px var(--p-font); color: var(--p-text); }
.lg-plat-pill small { font: 700 9px var(--p-font); color: var(--p-muted); background: var(--p-card); border-radius: 999px; padding: 1px 6px; letter-spacing: .2px; }
.lg-plat-pill.soon { opacity: .85; } .lg-plat-pill.soon b { color: var(--p-muted); }
/* ── #424: ingreso — tarjetas de beneficios estilo Pinterest con íconos de línea ── */
/* ── #425 (owner): la ENTRADA CON NOMBRE es la forma de registro → fuera "¿Primera vez acá? / Crear mi cuenta" (registro con SMS) ── */
.lg-app .lg-alt .lg-alt-q, .lg-app .lg-alt .lg-register { display: none !important; }
body.reg-quick .lg-quick-alt { display: inline-block; }
/* ── #426: "¡Te registraste con éxito!" — usuario + clave y Entrar ── */
.lg-quick-done { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; padding: 4px 0 2px; }
.lg-done-ico { width: 44px; height: 44px; border-radius: 50%; background: var(--p-green-soft); color: var(--p-green); display: flex; align-items: center; justify-content: center; }
.lg-done-ico svg { width: 24px; height: 24px; }
.lg-done-t { font: 800 17px var(--p-font); color: var(--p-text); }
.lg-done-s { font: 500 11.5px/1.35 var(--p-font); color: var(--p-muted); }
.lg-cred { width: 100%; display: flex; align-items: center; gap: 8px; background: var(--p-card); border-radius: 12px; padding: 8px 10px; text-align: left; }
.lg-cred span { font: 700 10px var(--p-font); letter-spacing: .8px; text-transform: uppercase; color: var(--p-muted); min-width: 56px; }
.lg-cred b { flex: 1; min-width: 0; font: 800 15px ui-monospace, Menlo, Consolas, monospace; color: var(--p-text); letter-spacing: .3px; overflow: hidden; text-overflow: ellipsis; }
.lg-done-n { font: 500 10.5px var(--p-font); color: var(--p-muted); }
.lg-quick-done .lg-quick-btn { width: 100%; margin-top: 2px !important; }
/* ── #427 (owner): la pantalla inicial es SOLO "Completá tu nombre para registrarte": sin Olvidé mi contraseña, sin link Soporte,
   sin "Ya tengo cuenta" (los clientes con sesión guardada entran directo). ── */
.lg-app .lg-alt { display: none !important; }
body.reg-quick #loginForm { display: none !important; }
/* ── #428: recuadro "Elegí dónde jugar" debajo de Registrarse · sin línea de estrellas · opiniones a la vista ── */
.lg-play-box { background: var(--p-card); border: 1.5px solid var(--p-border); border-radius: 18px; padding: 10px 12px 11px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 1px 0 rgba(0, 0, 0, .02); }
.lg-play-h { display: flex; align-items: center; gap: 9px; }
.lg-play-h b { display: block; font: 800 13.5px var(--p-font); color: var(--p-text); } .lg-play-h small { font: 500 10.5px var(--p-font); color: var(--p-muted); }
.lg-play-box .lg-plats-row { gap: 6px; }
.lg-play-box .lg-plat-pill { background: var(--p-surface); border: 1px solid var(--p-border); padding: 5px 10px 5px 5px; }
.lg-play-box .lg-plat-pill img, .lg-play-box .lg-plat-pill i { width: 22px; height: 22px; }
.lg-play-box .lg-plat-pill b { font-size: 12px; }
.lg-app .lg-trust { display: none !important; }
.lg-app .lg-sec-reviews { margin-top: 2px; }
.lg-app #loginReviews .rv-head .rv-g { font-size: 11px; }
.lg-app #loginReviews .rv-card { flex: 0 0 68%; max-width: 240px; }
/* ── #429 (owner): todo más chico para que las OPINIONES entren en la pantalla principal ── */
.login-box.lg-app { gap: 5px !important; padding: 8px 12px 8px !important; }
.lg-app .lg-logo { width: 30px; height: 30px; } .lg-app .lg-brand b { font-size: 13px; } .lg-app .lg-brand small { font-size: 9px; }
.lg-app .lg-ring, .lg-app .lg-ring-av { width: 32px; height: 32px; } .lg-app .lg-tg { padding: 5px 9px !important; font-size: 11px !important; }
/* beneficios: UNA fila de 3, sin bajadas */
/* registro */
.lg-app .lg-form { padding: 8px 9px 7px; border-radius: 16px; }
.lg-quick { gap: 5px; } .lg-quick-l { font-size: 11.5px; }
.lg-quick input { padding: 9px 12px !important; font-size: 14px !important; border-radius: 12px !important; }
.lg-app .lg-quick-btn { padding: 10px !important; font-size: 14.5px !important; }
.lg-quick-n { display: none; }
/* elegí dónde jugar: una línea */
.lg-play-box { padding: 7px 9px 8px; gap: 5px; border-radius: 14px; }
.lg-play-h { gap: 7px; }
.lg-play-h b { font-size: 12px; } .lg-play-h small { display: none; }
.lg-play-box .lg-plats-row { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 5px; } .lg-play-box .lg-plats-row::-webkit-scrollbar { display: none; }
.lg-play-box .lg-plat-pill { flex: 0 0 auto; padding: 3px 8px 3px 4px; }
.lg-play-box .lg-plat-pill img, .lg-play-box .lg-plat-pill i { width: 18px; height: 18px; } .lg-play-box .lg-plat-pill b { font-size: 11px; } .lg-play-box .lg-plat-pill small { font-size: 8.5px; padding: 1px 5px; }
/* opiniones: compactas */
.lg-app #loginReviews .rv-head { padding: 0 1px; } .lg-app #loginReviews .rv-g { font-size: 10px; }
.lg-app #loginReviews .rv-card { flex: 0 0 62%; max-width: 220px; padding: 6px 9px !important; gap: 3px; }
.lg-app #loginReviews .rv-text { -webkit-line-clamp: 2; min-height: 0; font-size: 11.5px !important; }
.lg-app #loginReviews .rv-who b { font-size: 11px; }
.lg-app .lg-foot { font-size: 9px; }
/* ── #430 (owner): el inicio ocupa EXACTAMENTE una pantalla de teléfono (sin scroll); las opiniones toman el alto que sobra.
   Sin burbuja de Soporte en el inicio. ── */
.login-screen:has(.lg-app) { height: 100dvh; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; align-items: stretch !important; }
.login-box.lg-app { height: 100dvh; max-height: 100dvh; margin: 0 auto !important; display: flex !important; flex-direction: column; gap: 4px !important; overflow: hidden; padding: calc(6px + env(safe-area-inset-top, 0px)) 12px calc(6px + env(safe-area-inset-bottom, 0px)) !important; box-sizing: border-box; border-radius: 0 !important; }
.lg-app > * { flex: 0 0 auto; }
.lg-quick input { padding: 8px 12px !important; font-size: 14px !important; } .lg-app .lg-quick-btn { padding: 9px !important; font-size: 14px !important; }
.lg-play-box { padding: 6px 9px 7px; }
.lg-app .lg-sec-reviews { flex: 1 1 auto !important; min-height: 0; display: flex; flex-direction: column; margin: 0; }
.lg-app #loginReviews { flex: 1 1 auto; min-height: 0; display: flex !important; flex-direction: column; gap: 3px; }
.lg-app #loginReviews .rv-row { flex: 1 1 auto; min-height: 0; display: flex; }
.lg-app #loginReviews .rv-track { flex: 1 1 auto; min-height: 0; align-items: stretch; padding-bottom: 2px; }
.lg-app #loginReviews .rv-card { height: auto; max-height: 100%; overflow: hidden; }
.lg-app #loginReviews .rv-text { -webkit-line-clamp: 3; }
.lg-app .lg-foot { display: none !important; }
.gs-bubble { display: none !important; }   /* #430: sin Soporte en el inicio (la columna Visitantes del panel sigue para los hilos existentes) */
@media (max-height: 560px) { .lg-app .lg-sec-reviews { display: none !important; } }
/* ── #431 (owner): más aire entre bloques (la sección de opiniones absorbe la diferencia; sigue en una pantalla) ── */
.login-box.lg-app { gap: 10px !important; }
.lg-quick { gap: 7px; } .lg-play-box { gap: 7px; }
.lg-app #loginReviews { gap: 5px; }
@media (max-height: 700px) { .login-box.lg-app { gap: 7px !important; } }
/* ── #432 (owner): beneficios con el texto completo, en TRES filas finas (ícono + texto) ── */
/* ── #433: "CARGAS Y PAGOS LAS 24 HS SIN LÍMITES" bajo el título ── */
/* ── #434: fila prioritaria "Carga automática y atención personalizada" ── */
/* ── #436 (owner): la parte superior baja un poco (misma separación arriba que abajo) ── */
.login-box.lg-app { padding-top: calc(16px + env(safe-area-inset-top, 0px)) !important; padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important; }
.lg-app .lg-head { margin-top: 2px; }
/* ── #438/#439 (owner): Info → el título recuadrado en su propia línea (separa "Girox"); sólo las plataformas en negrita ── */
.info-msg #infoCardTwoPlats > b:first-child { display: inline-flex !important; margin-bottom: 8px !important; }
.info-msg #infoCardTwoPlatsDesc { display: block; font-weight: 500 !important; color: var(--p-text-2) !important; }
.info-msg #infoCardTwoPlatsDesc b { font-weight: 800 !important; color: var(--p-text) !important; }
/* ── #440 (owner): íconos de LÍNEA (estilo Pinterest) en Info y en las acciones de Perfil, en vez de emojis ── */
.im-ico { display: inline-flex; width: 18px; height: 18px; color: var(--p-red); margin-right: 6px; flex: 0 0 auto; }
.im-ico svg { width: 18px; height: 18px; }
.pi { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 10px; background: var(--p-card); color: var(--p-red); flex: 0 0 auto; margin-right: 2px; }
.pi svg { width: 17px; height: 17px; }
.pf-compact .pf-act .pi { width: 28px; height: 28px; }
.pf-logout .pi { color: var(--p-red); }
.pf-theme-k b { display: inline-flex; align-items: center; gap: 6px; }
.pi.pi-sm { width: 22px; height: 22px; border-radius: 7px; background: var(--p-card); margin: 0; }
.pi.pi-sm svg { width: 13px; height: 13px; }
html[data-theme="dark"] .pi, html[data-theme="dark"] .pi.pi-sm { background: var(--p-surface-2); }
/* ── #441 (owner): INICIO (post-login) con íconos de línea en vez de emojis: entrada, menú fácil, selector de menú, Instalar app ── */
.li { display: inline-flex; width: 15px; height: 15px; vertical-align: -2px; margin-right: 5px; color: var(--p-red); flex: 0 0 auto; }
.li svg { width: 100%; height: 100%; }
.li-w, .ev-cta .li { color: #fff; }
.ez-ico, .ez-main-ico, .mc-ico { display: inline-flex !important; align-items: center; justify-content: center; }
.ez-btn .ez-ico { width: 40px; height: 40px; border-radius: 12px; background: var(--p-card); color: var(--p-red); }
.ez-btn .ez-ico svg { width: 22px; height: 22px; }
.ez-main .ez-main-ico { width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 255, 255, .18); color: #fff; }
.ez-main .ez-main-ico svg { width: 24px; height: 24px; }
.ez-chat .ez-ico { width: 36px; height: 36px; border-radius: 11px; background: var(--p-card); color: var(--p-red); }
.ez-chat .ez-ico svg { width: 20px; height: 20px; }
.ez-switch .li { color: var(--p-text); }
.mc-ico { width: 40px; height: 40px; border-radius: 12px; background: var(--p-surface); color: var(--p-red); }
.mc-ico svg { width: 22px; height: 22px; }
.bs-install .li { color: var(--p-red); }
html[data-theme="dark"] .ez-btn .ez-ico, html[data-theme="dark"] .ez-chat .ez-ico, html[data-theme="dark"] .mc-ico { background: var(--p-surface-2); }
/* ── #442: alerta "banco con fallas" en el modal de retiro ── */
.wd-bank-alert { background: var(--p-amber-soft); color: var(--p-amber); border: 1px solid var(--p-amber-line); border-radius: 14px; padding: 10px 12px; font: 600 12.5px/1.4 var(--p-font); margin: 0 0 10px; }
/* ── #445 (owner): íconos con más "vivencia": trazo 2.4, relleno suave del mismo color (duotono) y caja rojo claro ── */
.li svg, .im-ico svg, .pi svg, .ez-ico svg, .ez-main-ico svg, .mc-ico svg, .lg-done-ico svg { stroke-width: 2.4; }
.li svg path, .li svg circle, .li svg rect, .im-ico svg path, .im-ico svg circle, .im-ico svg rect, .pi svg path, .pi svg circle, .pi svg rect, .ez-ico svg path, .ez-ico svg circle, .ez-ico svg rect, .mc-ico svg path, .mc-ico svg circle, .mc-ico svg rect { fill: currentColor; fill-opacity: .14; }
.ez-main-ico svg path { fill: #fff; fill-opacity: .22; }
.pi, .ez-btn .ez-ico, .ez-chat .ez-ico, .mc-ico { background: var(--p-red-soft) !important; color: var(--p-red); box-shadow: inset 0 0 0 1px rgba(230, 0, 35, .10); }
.im-ico { width: 20px; height: 20px; } .im-ico svg { width: 20px; height: 20px; }
.li { width: 16px; height: 16px; }
.pi svg { width: 18px; height: 18px; }
.ez-btn .ez-ico svg { width: 24px; height: 24px; } .mc-ico svg { width: 24px; height: 24px; }
.ez-switch .li svg path, .ez-switch .li svg circle { fill-opacity: .1; }
html[data-theme="dark"] .lg-fi, html[data-theme="dark"] .pi, html[data-theme="dark"] .ez-btn .ez-ico, html[data-theme="dark"] .ez-chat .ez-ico, html[data-theme="dark"] .mc-ico { background: #3a1218 !important; box-shadow: none; }
/* ── #446 (owner): selector de reembolsos — los tres botones rojos con letra blanca ── */
#unifiedRefundModal .ur-btn { background: var(--p-red) !important; color: #fff !important; border: 0 !important; border-radius: 999px !important; font-weight: 800 !important; display: flex !important; align-items: center; justify-content: center; gap: 6px; }
#unifiedRefundModal .ur-btn * { color: #fff !important; }
#unifiedRefundModal .ur-btn .li svg path, #unifiedRefundModal .ur-btn .li svg rect { fill: #fff; fill-opacity: .18; }
#unifiedRefundModal .ur-btn:hover { background: var(--p-red-dark) !important; }
/* ── #448: Menú fácil — avatar + nombre desplegable ── */
.ez-hello-btn { border: 0 !important; background: transparent !important; display: flex !important; align-items: center; gap: 9px; text-align: left; padding: 0 !important; cursor: pointer; min-width: 0; flex: 1 1 auto; font-family: var(--p-font); }
.ez-av { width: 38px; height: 38px; border-radius: 50%; background: var(--p-card); display: inline-flex; align-items: center; justify-content: center; font-size: 20px; flex: 0 0 auto; box-shadow: 0 0 0 2px var(--p-red-soft); }
.ez-hello-t { display: flex; flex-direction: column; min-width: 0; }
.ez-hello-t span { font: 900 15px var(--p-font); color: var(--p-text) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ez-hello-t small { font: 600 11px var(--p-font); color: var(--p-muted) !important; }
.ez-chev { color: var(--p-muted); font: 800 9px var(--p-font); letter-spacing: .6px; text-transform: uppercase; border: 1px solid var(--p-border); border-radius: 999px; padding: 2px 7px; margin-left: 2px; } /* #481: "menú" chiquito en vez de la flecha */
.ez-hello-btn[aria-expanded="true"] .ez-chev { background: var(--p-red); color: #fff; border-color: var(--p-red); }
.ez-more { background: var(--p-card); border: 1px solid var(--p-border); border-radius: 14px; padding: 8px 12px; margin: -2px 0 8px; display: flex; flex-direction: column; gap: 6px; }
.ez-more[hidden] { display: none; }
.ez-more-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; font: 600 12px var(--p-font); color: var(--p-muted); }
.ez-more-row b { font: 800 13px var(--p-font); color: var(--p-text); max-width: 60%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ez-more-actions { display: flex; gap: 6px; margin-top: 2px; }
.ez-more-actions button { flex: 1; border: 0; background: var(--p-surface); color: var(--p-text); border-radius: 999px; padding: 8px 10px; font: 800 12px var(--p-font); cursor: pointer; }
/* ── #449 (owner): fuera el "GIROX · LA APP QUE PAGA" de la entrada; recuadro más chico ── */
.ev-hero .ev-hero-k { display: none !important; }
.ev-hero { padding: 7px 12px !important; gap: 0 !important; }
.ev-hero-t { font-size: 12.5px !important; line-height: 1.3 !important; }
/* ── #450 (owner): modal "Tu opinión" con el estilo de la app ── */
.rvm-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, .55); z-index: 26000; display: flex; align-items: center; justify-content: center; padding: 14px; }
.rvm-card { background: var(--p-card); border: 1px solid var(--p-border); border-radius: 22px; padding: 18px 16px 14px; max-width: 400px; width: 100%; color: var(--p-text); box-sizing: border-box; box-shadow: 0 14px 44px rgba(0, 0, 0, .25); font-family: var(--p-font); }
.rvm-t { margin: 0 0 4px; text-align: center; font: 800 18px var(--p-font); color: var(--p-text) !important; }
.rvm-s { margin: 0 0 12px; text-align: center; font: 500 12.5px/1.4 var(--p-font); color: var(--p-muted); }
.rvm-stars { display: flex; justify-content: center; gap: 6px; margin: 0 0 12px; }
.rvm-star { font-size: 36px; line-height: 1; color: var(--p-border); cursor: pointer; transition: transform .12s, color .12s; }
.rvm-star.on { color: var(--p-red); }
.rvm-star:active { transform: scale(1.15); }
.rvm-ta { width: 100%; box-sizing: border-box; min-height: 84px; resize: vertical; background: var(--p-surface) !important; border: 2px solid transparent !important; border-radius: 14px !important; padding: 10px 12px !important; font: 500 14px var(--p-font) !important; color: var(--p-text) !important; }
.rvm-ta:focus { border-color: var(--p-text) !important; outline: none; }
.rvm-msg { font: 600 12px var(--p-font); text-align: center; min-height: 16px; margin: 8px 0; color: var(--p-muted); }
.rvm-send { width: 100%; border: 0; background: var(--p-red); color: #fff; border-radius: 999px; padding: 13px; font: 800 14.5px var(--p-font); cursor: pointer; }
.rvm-send:disabled { opacity: .6; }
.rvm-close { width: 100%; margin-top: 8px; border: 0; background: var(--p-surface); color: var(--p-text); border-radius: 999px; padding: 10px; font: 700 12.5px var(--p-font); cursor: pointer; }
  background:
    repeating-linear-gradient(135deg, rgba(255, 255, 255, .028) 0 1px, transparent 1px 7px),
    repeating-linear-gradient(45deg, rgba(0, 0, 0, .35) 0 2px, transparent 2px 9px),
    radial-gradient(ellipse at 15% 20%, rgba(255, 255, 255, .07), transparent 45%),
    radial-gradient(ellipse at 85% 80%, rgba(255, 255, 255, .05), transparent 40%),
    linear-gradient(180deg, #1c1c1c, #0d0d0d) !important;
  border-top: 1px solid rgba(255, 255, 255, .08); }
/* ── #456 (owner): arriba sólo el nombre (sin logo) ── */
/* ── #458 (owner): "Promoción válida hasta diciembre…" NO en el Inicio (antes de abrir); sólo adentro de los modales ── */
.refund-promo { display: none !important; }
.modal .refund-promo, #unifiedRefundModal .refund-promo, #infoModal .refund-promo { display: block !important; }
.modal .refund-promo[hidden], #unifiedRefundModal .refund-promo[hidden], #infoModal .refund-promo[hidden] { display: none !important; }
/* ── #465: condiciones (Referidos / VIP) estilo 1win + detalle de niveles ── */
.cond-wrap { background: var(--p-surface); border-radius: 16px; margin: 0 0 12px; overflow: hidden; }
.cond-head { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 0; background: transparent; padding: 11px 14px; font: 800 13px var(--p-font); color: var(--p-text); cursor: pointer; text-align: left; }
.cond-chev { color: var(--p-muted); font-size: 11px; }
.cond-body { padding: 0 14px 12px; display: flex; flex-direction: column; gap: 8px; }
.cond-sec { background: var(--p-card); border-radius: 12px; padding: 9px 12px; border-left: 4px solid var(--p-red); }
.cond-sec > b { display: block; font: 800 12.5px var(--p-font); color: var(--p-text); margin-bottom: 3px; }
.cond-sec p { margin: 0; font: 500 12.5px/1.5 var(--p-font); color: var(--p-text-2); } .cond-sec p b { color: var(--p-text); }
.cond-sec.cond-black { border-left-color: #111; background: #1a1a1a; } .cond-sec.cond-black > b, .cond-sec.cond-black p, .cond-sec.cond-black p b { color: #fff; }
.cond-note { font: 600 11px/1.45 var(--p-font); color: var(--p-muted); padding: 2px 2px 0; }
#vipLevelsModal .vl-cols { display: grid; grid-template-columns: 1.3fr 1fr .9fr .9fr; gap: 6px; padding: 4px 10px; font: 800 9.5px var(--p-font); letter-spacing: .6px; text-transform: uppercase; color: var(--p-muted); }
#vipLevelsModal .vl-row { display: grid !important; grid-template-columns: 1.3fr 1fr .9fr .9fr; gap: 6px; align-items: center; padding: 8px 10px !important; }
#vipLevelsModal .vl-row .vl-st { display: none; }
#vipLevelsModal .vl-row .vl-name { font: 800 12.5px var(--p-font); } #vipLevelsModal .vl-row .vl-name small { font-weight: 700; color: var(--p-red); }
#vipLevelsModal .vl-th { font: 700 11px var(--p-font); color: var(--p-text-2); white-space: nowrap; }
#vipLevelsModal .vl-gift { font: 700 11px var(--p-font); color: var(--p-green); white-space: nowrap; }
#vipLevelsModal .vl-rake { font: 700 11px var(--p-font); color: var(--p-text); display: flex; flex-direction: column; }
#vipLevelsModal .vl-black { font: 700 9.5px var(--p-font); color: var(--p-muted); white-space: normal; }
#vipLevelsModal .vl-black-note { margin-top: 10px; background: #1a1a1a; color: #fff; border-radius: 12px; padding: 9px 12px; font: 600 12px/1.45 var(--p-font); } #vipLevelsModal .vl-black-note b { color: #fff; }
html[data-theme="dark"] .cond-sec.cond-black, html[data-theme="dark"] #vipLevelsModal .vl-black-note { background: #2a2a2a; }
/* ── #470: selector "Elegí dónde jugar" del Menú fácil ── */
.ep-list { display: flex; flex-direction: column; gap: 8px; }
.ep-item { display: flex; align-items: center; gap: 12px; width: 100%; border: 1px solid var(--p-border); background: var(--p-card); border-radius: 16px; padding: 10px 12px; cursor: pointer; text-align: left; font-family: var(--p-font); color: var(--p-text); }
.ep-item img, .ep-item i { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; background: var(--p-surface); display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 20px; flex: 0 0 auto; }
.ep-item span { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ep-item b { font: 800 14px var(--p-font); } .ep-item small { font: 600 11px var(--p-font); color: var(--p-muted); }
.ep-item em { font: 800 16px var(--p-font); color: var(--p-red); font-style: normal; }
.ep-item.soon { opacity: .7; } .ep-item.soon em { font-size: 11px; background: var(--p-surface); border-radius: 999px; padding: 3px 9px; color: var(--p-muted); }
/* ── #472: novedad en Referidos ── */
.ref-news { margin: 8px 0 0; background: var(--p-red-soft); color: var(--p-text); border-radius: 12px; padding: 8px 12px; font: 600 12px/1.4 var(--p-font); text-align: left; }
.ref-news > b:first-child { display: inline-block; background: var(--p-red); color: #fff; border-radius: 999px; padding: 1px 8px; font-size: 10px; letter-spacing: .8px; margin-right: 6px; }
/* ── #479 (owner): fondo del saludo con íconos de juego/cargas (dados, fichas, cartas, rayo), sutil y sin tapar el nombre ── */
.ez-top { position: relative; overflow: hidden; }
.ez-top::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .09; background-repeat: no-repeat;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e60023' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='18' height='18' rx='4'/><circle cx='8' cy='8' r='1.2' fill='%23e60023'/><circle cx='16' cy='8' r='1.2' fill='%23e60023'/><circle cx='12' cy='12' r='1.2' fill='%23e60023'/><circle cx='8' cy='16' r='1.2' fill='%23e60023'/><circle cx='16' cy='16' r='1.2' fill='%23e60023'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e60023' stroke-width='1.8'><circle cx='12' cy='12' r='9'/><circle cx='12' cy='12' r='4.5'/><path d='M12 3v4M12 17v4M3 12h4M17 12h4'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e60023' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><rect x='5' y='2.5' width='12' height='17' rx='2'/><path d='M11 6.5c-1.2-1.3-3.4-.4-3 1.4.3 1.4 2.2 2.4 3 3.3.8-.9 2.7-1.9 3-3.3.4-1.8-1.8-2.7-3-1.4z' fill='%23e60023' stroke='none'/><path d='M17 6l2.2 1 .3 12.6-9 2.4'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e60023' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><path d='M13 2L4.5 13.5H11l-1 8.5 8.5-11.5H12z'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e60023' stroke-width='1.8' stroke-linecap='round'><circle cx='12' cy='12' r='8.5'/><path d='M9 8.5h4.5a2 2 0 0 1 0 4H9m0 0h5a2 2 0 0 1 0 4H9M11 6.5v11'/></svg>");
  background-size: 34px 34px, 30px 30px, 30px 30px, 26px 26px, 30px 30px;
  background-position: right 14px top 6px, right 58px bottom 6px, left 14px bottom 4px, right 108px top 10px, left 60px top 6px; }
.ez-top > * { position: relative; z-index: 1; }
html[data-theme="dark"] .ez-top::before { opacity: .14; }
/* ── #480/#481: MENÚ OPCIÓN 2 — #bottomNav = header idéntico al superior, al final de la columna (debajo del chat en Soporte) ── */
#bottomNav.bottom-nav { order: 99; position: sticky; bottom: 0; top: auto; z-index: 60; border-top: 1px solid var(--p-border) !important; border-bottom: 0 !important; padding-top: 4px !important; padding-bottom: max(6px, env(safe-area-inset-bottom, 6px)) !important; justify-content: center; }
#bottomNav .tn-btn { flex: 1 1 0; }
#bottomNav .tn-home.tn-retro { flex: 1.6 1 0; }
/* #482: con la opción 2 NO se oculta nada de lo que hoy se muestra: sólo se mueven los 3 botones de la barra. */
/* ── #485 (owner): el Inicio completo entra entero con la línea "pasar al menú fácil" visible: todo apenas más chico y, si aun así
   no entra, se puede deslizar (antes overflow hidden la escondía). ── */
.entry-view { gap: 5px !important; margin: 4px 10px 0 !important; overflow-y: auto !important; padding-bottom: 6px; }
.ev-hero { padding: 7px 10px !important; }
.ev-hero-t { font-size: 12px !important; line-height: 1.3 !important; }
.ev-hero-new { padding: 5px 10px !important; font-size: 10px !important; }
.ev-svc { padding: 5px 4px !important; }
.ev-svc small { font-size: 9.5px !important; }
.ev-frame-wrap { min-height: 130px !important; }
#entryReviews.ev-reviews { padding: 4px 8px 6px !important; gap: 3px !important; }
.ev-easy-link { padding: 2px 8px !important; }
/* ── #488: cartel BONO DE PRIMERA CARGA ── */
.fd-modal .fd-card { max-width: 360px !important; text-align: center; padding: 22px 20px 16px !important; }
.fd-logo { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; display: block; margin: 0 auto 6px; box-shadow: 0 6px 18px rgba(230,0,35,.18); }
.fd-brand { font: 900 13px var(--p-font); letter-spacing: 2px; color: var(--p-red); }
.fd-kicker { font: 800 11px var(--p-font); letter-spacing: 1.6px; color: var(--p-muted); margin-top: 10px; }
.fd-big { display: flex; flex-direction: column; align-items: center; margin: 4px 0 10px; }
.fd-big b { font: 900 56px/1 var(--p-font); color: var(--p-red); letter-spacing: -1px; }
.fd-big small { font: 700 13px var(--p-font); color: var(--p-text); margin-top: 4px; }
.fd-app { display: flex; align-items: center; gap: 10px; background: var(--p-red-soft); border-radius: 14px; padding: 10px 12px; text-align: left; font: 600 13px/1.35 var(--p-font); color: var(--p-text); }
.fd-app i { font-style: normal; font-size: 22px; } .fd-app b { color: var(--p-red); font-size: 18px; }
.fd-txt { font: 600 12px/1.45 var(--p-font); color: var(--p-muted); margin: 10px 0 12px; }
.fd-btn { width: 100%; }
.fd-later { border: 0; background: transparent; color: var(--p-muted); font: 700 12px var(--p-font); padding: 10px; cursor: pointer; }
/* ── #489 (owner): Top juegos — tarjetas individuales grandes con "N jugando" ── */
.ev-frame-wrap.games { height: auto !important; min-height: 0 !important; flex: 0 0 auto !important; background: #0d0d1a !important; display: flex; flex-direction: column; }
.ev-frame-wrap.games .ev-slides { position: static !important; inset: auto !important; } /* el carril da la altura (antes era absoluto dentro del recuadro) */
.ev-frame-wrap.games .ev-cta { bottom: 12px; }
.ev-games-h { display: flex; align-items: center; justify-content: space-between; color: #fff; font: 900 15px var(--p-font); padding: 10px 12px 2px; }
.ev-games-h small { font: 700 11px var(--p-font); color: #9aa0b2; display: inline-flex; align-items: center; gap: 6px; }
.ev-games-h i, .ev-game .gp i { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,.22); display: inline-block; }
.ev-slides-track.games { position: static; flex: 0 0 auto; flex-direction: row; gap: 10px; padding: 8px 10px 56px; scroll-snap-type: x mandatory; overflow-x: auto; }
.ev-game { flex: 0 0 36%; max-width: 160px; /* #494: un poco más chicas */ scroll-snap-align: start; border-radius: 16px; overflow: hidden; background: #161622; display: flex; flex-direction: column; box-shadow: 0 8px 22px rgba(0,0,0,.45); }
/* #491: la foto COMPLETA (contain) en una caja de proporción fija: ninguna tarjeta se corta aunque las fotos tengan alturas distintas */
.ev-game img { width: 100%; aspect-ratio: 300 / 330; height: auto; object-fit: contain; display: block; background: #161622; }
.ev-frame-wrap.games .ev-slides, .ev-frame-wrap.games .ev-slides-track { overflow-y: visible !important; height: auto !important; min-height: 0 !important; max-height: none !important; }
.ev-game .gp { display: flex; align-items: center; gap: 6px; padding: 6px 8px 7px; color: #fff; font: 700 11px var(--p-font); background: #161622; }
.ev-game .gp b { color: #fff; }
@media (min-width: 480px) { .ev-game { flex-basis: 24%; } }
/* #493 (owner): se revirtieron #490 y #492 (negro por defecto, pastilla +X% y íconos emoji): el menú fácil queda como antes. */
/* ── #495: parpadeo del número de "jugando" cuando cambia ── */
@keyframes gpTick { 0% { color: #22c55e; transform: scale(1.25); } 100% { color: #fff; transform: scale(1); } }
.ev-game .gp b { display: inline-block; } .ev-game .gp b.tick { animation: gpTick .6s ease-out; }
/* ── #496 (owner): GANAMOS con fondo VIOLETA en el Inicio y donde aparezca (pestaña, tarjeta del home completo, selector del menú fácil, botones del chat) ── */
:root { --p-purple: #6d28d9; --p-purple-2: #8b5cf6; }
.ev-tab.plat-ganamos, .ev-tab.plat-ganamos.soon, .ev-tab.plat-ganamos.active { background: linear-gradient(135deg, var(--p-purple), var(--p-purple-2)) !important; color: #fff !important; box-shadow: 0 6px 16px rgba(109,40,217,.28) !important; }
.ev-tab.plat-ganamos *, .ev-tab.plat-ganamos.active * { color: #fff !important; }
.ev-tab.plat-ganamos img { background: #fff !important; }
.ev-tab.plat-ganamos .ev-soon, .ev-tab.plat-ganamos .plat-soon-badge { background: rgba(255,255,255,.22) !important; color: #fff !important; }
.plat-play-btn.plat-ganamos, .plat-play-btn.plat-ganamos.is-pref, .plat-play-btn.plat-ganamos.soon { background: linear-gradient(160deg, var(--p-purple), var(--p-purple-2)) !important; border-color: transparent !important; }
.plat-play-btn.plat-ganamos .plat-play-name, .plat-play-btn.plat-ganamos .plat-play-sub { color: #fff !important; }
.ep-item.ep-ganamos, .ep-item.ep-ganamos.soon { background: linear-gradient(135deg, var(--p-purple), var(--p-purple-2)) !important; border-color: transparent !important; color: #fff !important; opacity: 1 !important; }
.ep-item.ep-ganamos b, .ep-item.ep-ganamos small, .ep-item.ep-ganamos em { color: #fff !important; }
.ep-item.ep-ganamos.soon em { background: rgba(255,255,255,.22) !important; }
.plat-btn[data-plat="ganamos"] { background: linear-gradient(135deg, var(--p-purple), var(--p-purple-2)) !important; color: #fff !important; border-color: transparent !important; }
/* ── #497: selector de reembolsos prolijo (tarjetas con título, % como detalle, estado y RECLAMAR directo) ── */
.ur-list { display: flex; flex-direction: column; gap: 10px; padding: 6px 0 8px; }
.ur-card { background: var(--p-surface); border: 1px solid var(--p-border); border-radius: 18px; padding: 12px 12px 10px; text-align: left; }
.ur-head { display: flex; align-items: center; gap: 10px; }
.ur-head .li { width: 38px; height: 38px; border-radius: 12px; background: var(--p-red); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.ur-head .li svg { width: 20px; height: 20px; }
.ur-head b { display: block; font: 900 15px var(--p-font); color: var(--p-text); }
.ur-head small { display: block; font: 600 12px var(--p-font); color: var(--p-muted); margin-top: 1px; }
.ur-head small em { font-style: normal; font-weight: 900; color: var(--p-red); }
.ur-state { margin: 8px 0 0; font: 600 12.5px var(--p-font); color: var(--p-muted); }
.ur-card.ok .ur-state { color: var(--p-green); } .ur-card.ok .ur-state b { color: var(--p-green); }
.ur-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; }
.ur-claim { flex: 1 1 auto; padding: 10px 12px !important; font-size: 13px !important; }
.ur-detail { margin-left: auto; border: 0; background: transparent; color: var(--p-text); font: 800 12px var(--p-font); padding: 8px 4px; cursor: pointer; }
/* ── #498 (owner): JUGAYGANA con fondo NEGRO donde aparezca (misma lógica que Ganamos violeta) ── */
.ev-tab.plat-jugaygana, .ev-tab.plat-jugaygana.soon, .ev-tab.plat-jugaygana.active { background: linear-gradient(135deg, #000, #262626) !important; color: #fff !important; box-shadow: 0 6px 16px rgba(0,0,0,.3) !important; }
.ev-tab.plat-jugaygana *, .ev-tab.plat-jugaygana.active * { color: #fff !important; }
.ev-tab.plat-jugaygana img { background: #fff !important; }
.ev-tab.plat-jugaygana .ev-soon, .ev-tab.plat-jugaygana .plat-soon-badge { background: rgba(255,255,255,.2) !important; color: #fff !important; }
.plat-play-btn.plat-jugaygana, .plat-play-btn.plat-jugaygana.is-pref, .plat-play-btn.plat-jugaygana.soon { background: linear-gradient(160deg, #000, #262626) !important; border-color: transparent !important; }
.plat-play-btn.plat-jugaygana .plat-play-name, .plat-play-btn.plat-jugaygana .plat-play-sub { color: #fff !important; }
.ep-item.ep-jugaygana, .ep-item.ep-jugaygana.soon { background: linear-gradient(135deg, #000, #262626) !important; border-color: transparent !important; color: #fff !important; opacity: 1 !important; }
.ep-item.ep-jugaygana b, .ep-item.ep-jugaygana small, .ep-item.ep-jugaygana em { color: #fff !important; }
.ep-item.ep-jugaygana.soon em { background: rgba(255,255,255,.2) !important; }
.plat-btn[data-plat="jugaygana"] { background: linear-gradient(135deg, #000, #262626) !important; color: #fff !important; border-color: transparent !important; }
html[data-theme="dark"] .ev-tab.plat-jugaygana, html[data-theme="dark"] .plat-play-btn.plat-jugaygana, html[data-theme="dark"] .ep-item.ep-jugaygana { border: 1px solid rgba(255,255,255,.22) !important; }
/* ── #504: estrategia — banner de segunda carga y misiones ── */
.sd-banner { display: flex; align-items: center; gap: 8px; width: 100%; border: 0; border-radius: 16px; padding: 11px 14px; background: linear-gradient(90deg, #ff7a18, #ffb627); color: #1a1a1a; font: 700 13px var(--p-font); text-align: left; cursor: pointer; box-shadow: 0 6px 16px rgba(255,122,24,.28); }
.sd-banner b { font-size: 15px; font-weight: 900; } .sd-banner small { color: rgba(0,0,0,.65); font-weight: 700; } .sd-banner span { margin-left: auto; font-weight: 900; }
.sd-banner-full { margin: 0 0 10px; }
.ez-btn.ez-missions { grid-column: 1 / -1; align-items: flex-start !important; text-align: left; padding-bottom: 12px !important; }
.ez-btn.ez-missions .ez-ico { color: var(--p-red); }
.ez-mis-bars { display: flex; gap: 6px; width: 100%; margin-top: 8px; }
.ez-mis-bars i { flex: 1; height: 6px; border-radius: 999px; background: var(--p-border); position: relative; overflow: hidden; }
.ez-mis-bars i::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: var(--w, 0%); background: var(--p-red); border-radius: 999px; }
.ez-mis-bars i.ok::after { background: var(--p-green); width: 100%; }
.ms-list { display: flex; flex-direction: column; gap: 10px; }
.ms-item { background: var(--p-surface); border: 1px solid var(--p-border); border-radius: 16px; padding: 12px; text-align: left; }
.ms-item.done { border-color: var(--p-green); }
.ms-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; } .ms-row b { font: 900 14px var(--p-font); color: var(--p-text); }
.ms-prize { font: 900 12px var(--p-font); color: var(--p-red); white-space: nowrap; } .ms-item.done .ms-prize { color: var(--p-green); }
.ms-track { height: 8px; border-radius: 999px; background: var(--p-border); margin: 8px 0 6px; overflow: hidden; } .ms-track i { display: block; height: 100%; background: var(--p-red); border-radius: 999px; transition: width .4s; } .ms-item.done .ms-track i { background: var(--p-green); }
.ms-item small { font: 600 11.5px var(--p-font); color: var(--p-muted); }
.ms-card { cursor: pointer; } .ms-card-h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; } .ms-card-h b { font: 900 15px var(--p-font); color: var(--p-text); } .ms-card-h small { color: var(--p-muted); font-weight: 700; }
#missionsCardList { display: flex; flex-direction: column; gap: 8px; }
/* ── #508: tarjeta de misiones plegable en el home completo (chica, no tapa la carga) ── */
.ms-card { cursor: default; padding: 8px 12px !important; }
.ms-card .ms-card-h { width: 100%; border: 0; background: transparent; display: flex; align-items: center; gap: 8px; padding: 4px 0; margin: 0; cursor: pointer; color: var(--p-text); font-family: var(--p-font); }
.ms-card .ms-card-h b { font: 900 13.5px var(--p-font); } .ms-card .ms-card-h small { margin-left: auto; font: 700 11px var(--p-font); color: var(--p-muted); }
.ms-card .ms-chev { font-style: normal; color: var(--p-muted); transition: transform .2s; } .ms-card .ms-card-h[aria-expanded="true"] .ms-chev { transform: rotate(180deg); }
#missionsCardBody { padding: 6px 0 4px; } #missionsCardList { cursor: pointer; }
.ms-note { display: block; margin-top: 6px; font: 600 11px var(--p-font); color: var(--p-muted); }
/* ── #509 (owner): el menú fácil se encimaba al sumar Misiones (la grilla tenía alto fijo). Ahora cada cosa es un recuadro con su
   alto natural y la pantalla se desliza si hace falta; el saludo es compacto para que entre todo. ── */
.easy-view { overflow-y: auto !important; gap: 8px !important; }
.ez-top { padding: 6px 10px !important; gap: 8px !important; }
.ez-top .ez-av, .ez-top #easyAvatar { width: 30px !important; height: 30px !important; font-size: 15px !important; }
.ez-hello-t span { font-size: 13.5px !important; } .ez-hello-t small { font-size: 10.5px !important; }
.ez-bal small { font-size: 9.5px !important; } .ez-bal b { font-size: 15px !important; }
.ez-main { flex: 0 0 auto !important; min-height: 0 !important; padding: 11px 14px !important; }
.ez-main-txt b { font-size: 16px !important; } .ez-main-txt small { font-size: 11px !important; }
.ez-grid { flex: 0 0 auto !important; grid-auto-rows: auto !important; gap: 8px !important; }
.ez-btn { min-height: 86px !important; padding: 10px 8px !important; }
.ez-btn.ez-missions { min-height: 0 !important; padding: 10px 12px 12px !important; flex-direction: column; align-items: flex-start !important; }
.ez-btn.ez-missions > b { margin-top: 4px; }
.ez-chat, .ez-switch { flex: 0 0 auto !important; }
.sd-banner { flex: 0 0 auto; }
/* ── #510: Misiones como recuadro normal (media columna), al lado de Reembolso ── */
.ez-btn.ez-missions { grid-column: auto !important; align-items: center !important; text-align: center !important; padding: 10px 8px 12px !important; }
.ez-btn.ez-missions > b { margin-top: 0; }
.ez-mis-bars { margin-top: 6px; }
/* ── #511 (owner): "Pronto" sutil en todos lados (pestañas del Inicio, tarjetas de plataformas, ingreso, selector del menú fácil) ── */
.ev-tab.soon .ev-soon, .ev-tab .ev-soon, .plat-soon-badge, .ep-item.soon em { background: transparent !important; color: var(--p-muted) !important; border: 1px solid var(--p-border) !important; font: 700 8px/1.2 var(--p-font) !important; letter-spacing: .4px !important; text-transform: uppercase !important; padding: 2px 7px !important; border-radius: 999px !important; box-shadow: none !important; opacity: .85; }
.ev-tab.plat-ganamos .ev-soon, .ev-tab.plat-jugaygana .ev-soon, .plat-play-btn.plat-ganamos .plat-soon-badge, .plat-play-btn.plat-jugaygana .plat-soon-badge, .ep-item.ep-ganamos.soon em, .ep-item.ep-jugaygana.soon em { color: rgba(255,255,255,.85) !important; border-color: rgba(255,255,255,.35) !important; }
/* ── #512: MENÚ BÁSICO ── */
.basic-view { display: none; flex-direction: column; gap: 10px; margin: 8px 12px 0; padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); overflow-y: auto; }
body.home-basic .basic-view { display: flex; }
body.home-basic #easyView { display: none !important; }
.bv-top { display: flex; align-items: center; justify-content: space-between; background: var(--p-surface); border-radius: 16px; padding: 10px 14px; font: 800 14px var(--p-font); color: var(--p-text); }
.bv-top b { font-size: 18px; color: var(--p-green); }
.bv-btn { display: flex; align-items: center; gap: 14px; width: 100%; border: 0; border-radius: 22px; padding: 22px 18px; text-align: left; cursor: pointer; font-family: var(--p-font); min-height: 96px; }
.bv-btn .li { width: 48px; height: 48px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.18); flex: 0 0 auto; } .bv-btn .li svg { width: 26px; height: 26px; }
.bv-btn span { flex: 1; display: flex; flex-direction: column; } .bv-btn b { font: 900 22px/1.1 var(--p-font); letter-spacing: .5px; } .bv-btn small { font: 600 12px var(--p-font); opacity: .85; margin-top: 3px; }
.bv-btn em { font-style: normal; font: 900 24px var(--p-font); opacity: .8; }
.bv-load { background: var(--p-red); color: #fff; box-shadow: 0 8px 22px rgba(230,0,35,.28); }
.bv-wd { background: var(--p-green); color: #fff; box-shadow: 0 8px 22px rgba(10,122,62,.25); }
.bv-plats-h { display: flex; align-items: baseline; gap: 8px; margin-top: 4px; } .bv-plats-h b { font: 900 14px var(--p-font); color: var(--p-text); } .bv-plats-h small { color: var(--p-muted); font-weight: 600; }
.bv-plats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.bv-chip { border: 2px solid var(--p-border); background: var(--p-card); color: var(--p-text); border-radius: 16px; padding: 10px 6px; display: flex; flex-direction: column; align-items: center; gap: 5px; cursor: pointer; font-family: var(--p-font); }
.bv-chip img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; background: #fff; }
.bv-chip b { font: 800 12.5px var(--p-font); } .bv-chip small { font: 700 9.5px var(--p-font); color: var(--p-muted); text-transform: uppercase; letter-spacing: .4px; }
.bv-chip.on { border-color: var(--p-red); box-shadow: 0 0 0 3px rgba(230,0,35,.12); } .bv-chip.on small { color: var(--p-red); }
.bv-chip.soon { opacity: .75; }
.bv-chip.plat-ganamos { background: linear-gradient(135deg, var(--p-purple), var(--p-purple-2)); color: #fff; border-color: transparent; } .bv-chip.plat-ganamos small { color: rgba(255,255,255,.85); }
.bv-chip.plat-jugaygana { background: linear-gradient(135deg, #000, #262626); color: #fff; border-color: transparent; } .bv-chip.plat-jugaygana small { color: rgba(255,255,255,.85); }
.bv-play { border: 1px solid var(--p-border); background: var(--p-card); color: var(--p-text); border-radius: 999px; padding: 12px; font: 800 13px var(--p-font); cursor: pointer; }
.bv-switch { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 6px; flex-wrap: wrap; } .bv-switch small { color: var(--p-muted); font-weight: 700; width: 100%; text-align: center; }
.bv-switch button { border: 1px solid var(--p-border); background: transparent; color: var(--p-text); border-radius: 999px; padding: 8px 14px; font: 800 12px var(--p-font); cursor: pointer; }
.mc-opt.mc-basic { border-color: var(--p-red) !important; } .mc-opt.mc-basic b { color: var(--p-red) !important; }
/* ── #514: nivel de misiones ── */
.ms-level { display: flex; flex-direction: column; gap: 3px; background: var(--p-red-soft); border-radius: 14px; padding: 10px 12px; margin-bottom: 4px; text-align: left; }
.ms-level b { font: 900 14px var(--p-font); color: var(--p-red); } .ms-level small { font: 600 11.5px/1.35 var(--p-font); color: var(--p-text); }
/* ── #516: básico — paneles de Cargar / Retirar y selector de otro menú con más lugar ── */
.bv-btn .bv-chev { transition: transform .2s; } .bv-btn[aria-expanded="true"] .bv-chev { transform: rotate(180deg); }
.bv-btn[aria-expanded="true"] { border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; }
.bv-panel { background: var(--p-surface); border: 1px solid var(--p-border); border-radius: 0 0 20px 20px; margin-top: -8px; padding: 14px 12px 12px; }
.bv-steps { margin: 0 0 10px; padding-left: 20px; display: grid; gap: 8px; } .bv-steps li { font: 600 12.5px/1.45 var(--p-font); color: var(--p-text); }
.bv-cbu { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: var(--p-card); border: 1px solid var(--p-border); border-radius: 12px; padding: 8px 10px; margin-top: 6px; }
.bv-cbu small { display: block; font: 700 9.5px var(--p-font); color: var(--p-muted); text-transform: uppercase; letter-spacing: .4px; } .bv-cbu b { font: 800 13px var(--p-font); color: var(--p-text); word-break: break-all; }
.bv-copy { border: 0; background: var(--p-red); color: #fff; border-radius: 999px; padding: 7px 12px; font: 800 11px var(--p-font); cursor: pointer; flex: 0 0 auto; }
.bv-tit { display: block; margin-top: 5px; color: var(--p-muted); font-weight: 600; }
.bv-action { width: 100%; border: 0; border-radius: 999px; padding: 14px; background: var(--p-red); color: #fff; font: 900 14px var(--p-font); cursor: pointer; box-shadow: 0 6px 16px rgba(230,0,35,.25); }
.bv-action-wd { background: var(--p-green); box-shadow: 0 6px 16px rgba(10,122,62,.22); }
.bv-switch2 { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--p-border); display: flex; flex-direction: column; gap: 8px; }
.bv-switch2-h { font: 800 12px var(--p-font); color: var(--p-muted); text-transform: uppercase; letter-spacing: 1px; text-align: center; }
.bv-sw { width: 100%; text-align: left; border: 1px solid var(--p-border); background: var(--p-card); color: var(--p-text); border-radius: 16px; padding: 12px 14px; cursor: pointer; display: flex; flex-direction: column; gap: 3px; font-family: var(--p-font); }
.bv-sw b { font: 900 14px var(--p-font); } .bv-sw small { font: 600 11.5px/1.35 var(--p-font); color: var(--p-muted); }
/* ── #517 (owner): básico más compacto — Cargar/Retirar más chicos y "¿Querés ver más?" más junto, para que entre todo en una pantalla ── */
.basic-view { gap: 8px !important; margin: 6px 12px 0 !important; }
.bv-top { padding: 7px 12px; font-size: 13px; } .bv-top b { font-size: 16px; }
.bv-btn { padding: 13px 14px !important; min-height: 64px !important; border-radius: 18px !important; gap: 12px !important; }
.bv-btn .li { width: 38px !important; height: 38px !important; border-radius: 12px !important; } .bv-btn .li svg { width: 20px !important; height: 20px !important; }
.bv-btn b { font-size: 17px !important; } .bv-btn small { font-size: 11px !important; margin-top: 1px !important; } .bv-btn em { font-size: 18px !important; }
.bv-plats-h { margin-top: 2px; } .bv-plats-h b { font-size: 13px; }
.bv-chip { padding: 8px 6px; gap: 4px; } .bv-chip img { width: 28px; height: 28px; } .bv-chip b { font-size: 12px; }
.bv-play { padding: 10px; font-size: 12.5px; }
.bv-switch2 { margin-top: 8px; padding-top: 8px; gap: 6px; flex-direction: row; flex-wrap: wrap; }
.bv-switch2-h { width: 100%; font-size: 10.5px; }
.bv-sw { flex: 1 1 0; min-width: 0; padding: 9px 10px; border-radius: 14px; gap: 2px; }
.bv-sw b { font-size: 12.5px; } .bv-sw small { font-size: 10.5px; line-height: 1.3; }
/* ── #518: misiones en Info ── */
.im-sec.im-missions { border: 1px solid var(--p-red) !important; }
.im-sec.im-missions > b { color: var(--p-red) !important; }
/* ── #519: el tipo de menú se elige desde INICIO (arriba); los pases de abajo se van ── */
.ez-switch, .ev-easy-link, .bv-switch2 { display: none !important; }
.menu-chooser .mc-sub { font-weight: 600; }
/* ── #520: "Cambiar menú" arriba del Inicio ── */
.change-menu { display: none; align-items: center; gap: 6px; margin: 6px 12px 0; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--p-border); background: var(--p-card); color: var(--p-text); font: 800 12px var(--p-font); cursor: pointer; align-self: flex-start; }
.change-menu .li { width: 16px; height: 16px; display: inline-flex; color: var(--p-red); } .change-menu .li svg { width: 16px; height: 16px; }
.change-menu span { color: var(--p-muted); font-weight: 700; } .change-menu em { font-style: normal; color: var(--p-muted); }
body.home-easy .change-menu, body.home-basic .change-menu, body.home-play .change-menu, body.home-full .change-menu { display: inline-flex; }
body.home-mini .change-menu, body.mc-open .change-menu { display: none !important; }
/* ── #522 (owner): modo nocturno más "Pinterest": menos color, más aire y separación clara entre recuadros ── */
html[data-theme="dark"] { --p-bg: #0e0e0e; --p-card: #1a1a1a; --p-surface: #161616; --p-surface-2: #242424; --p-border: #2a2a2a; --p-red: #f0344a; --p-red-soft: #2a1418; }
html[data-theme="dark"] .easy-view, html[data-theme="dark"] .basic-view { gap: 12px !important; }
html[data-theme="dark"] .ez-top, html[data-theme="dark"] .ez-btn, html[data-theme="dark"] .ez-more, html[data-theme="dark"] .bv-top, html[data-theme="dark"] .bv-panel, html[data-theme="dark"] .home-card, html[data-theme="dark"] .change-menu { border: 1px solid var(--p-border) !important; background: var(--p-card) !important; }
html[data-theme="dark"] .ez-top::before { opacity: .05; }                       /* íconos de fondo casi imperceptibles */
html[data-theme="dark"] .ez-chev { background: transparent; color: var(--p-muted); border-color: var(--p-border); }
html[data-theme="dark"] .ez-hello-btn[aria-expanded="true"] .ez-chev { background: transparent; color: var(--p-text); border-color: var(--p-text); }
html[data-theme="dark"] .ez-main { background: var(--p-red) !important; box-shadow: none !important; }
html[data-theme="dark"] .sd-banner { background: #2b1d0a; color: #ffd48a; border: 1px solid #4a3312; box-shadow: none; }
html[data-theme="dark"] .sd-banner b, html[data-theme="dark"] .sd-banner span { color: #ffc966; } html[data-theme="dark"] .sd-banner small { color: #c9a35a; }
html[data-theme="dark"] .ez-btn .ez-ico { background: var(--p-surface-2) !important; }
html[data-theme="dark"] .ez-badge { background: var(--p-red) !important; }
html[data-theme="dark"] .ez-more-actions button { background: var(--p-surface-2) !important; border: 1px solid var(--p-border) !important; }
html[data-theme="dark"] .ev-tab, html[data-theme="dark"] .ev-svc, html[data-theme="dark"] .ev-hero, html[data-theme="dark"] #entryReviews.ev-reviews { border: 1px solid var(--p-border) !important; background: var(--p-card) !important; }
html[data-theme="dark"] .bv-load { background: var(--p-red) !important; box-shadow: none !important; } html[data-theme="dark"] .bv-wd { background: #1f7a4a !important; box-shadow: none !important; }
html[data-theme="dark"] .bv-chip, html[data-theme="dark"] .bv-play, html[data-theme="dark"] .bv-sw { background: var(--p-card) !important; border-color: var(--p-border) !important; }
html[data-theme="dark"] .ms-item, html[data-theme="dark"] .ur-card, html[data-theme="dark"] .ep-item { background: var(--p-card) !important; border-color: var(--p-border) !important; }
html[data-theme="dark"] .chat-screen { background: var(--p-bg) !important; }
/* ── #523 (owner): Inicio completo — NOVEDAD en una sola fila sin el titular; las 3 plataformas con logo y nombre en línea;
   "Recomendado" y "Pronto" como recuadros chicos del estilo de la página; Girox legible en nocturno ── */
.ev-hero { padding: 6px 8px !important; }
.ev-hero-k { display: none !important; }
.ev-hero-new { display: block !important; width: 100%; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; font: 800 clamp(9px, 2.8vw, 11px) var(--p-font) !important; letter-spacing: .3px; padding: 7px 10px !important; }
.ev-tab, .ev-tab.soon { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: center !important; gap: 8px !important; min-height: 60px !important; padding: 12px 10px 10px !important; border-radius: 18px !important; border: 1px solid var(--p-border) !important; position: relative; }
.ev-tab img { width: 32px !important; height: 32px !important; border-radius: 50% !important; object-fit: cover !important; }
.ev-tab .ev-name { font: 900 14px var(--p-font); white-space: nowrap; }
.ev-tab .ev-reco, .ev-tab .ev-soon { position: absolute !important; top: -8px !important; right: 10px !important; margin: 0 !important; font: 800 8px/1.2 var(--p-font) !important; letter-spacing: .5px !important; text-transform: uppercase !important; padding: 3px 8px !important; border-radius: 8px !important; box-shadow: none !important; }
.ev-tab .ev-reco { background: var(--p-card) !important; color: var(--p-red) !important; border: 1px solid var(--p-red) !important; opacity: 1 !important; }
.ev-tab .ev-soon { background: var(--p-card) !important; color: var(--p-muted) !important; border: 1px solid var(--p-border) !important; }
.ev-tab.plat-ganamos .ev-soon, .ev-tab.plat-jugaygana .ev-soon { background: rgba(0,0,0,.35) !important; color: #fff !important; border-color: rgba(255,255,255,.35) !important; }
.ev-tab.active { border-color: var(--p-text) !important; }
html[data-theme="dark"] .ev-tab.active, html[data-theme="dark"] .ev-tab.active .ev-name { color: var(--p-text) !important; }
html[data-theme="dark"] .ev-tab.active { background: var(--p-card) !important; border-color: #f2f2f2 !important; }
html[data-theme="dark"] .ev-tab .ev-reco { background: var(--p-card) !important; }
.ev-tab.plat-ganamos .ev-name, .ev-tab.plat-jugaygana .ev-name { color: #fff !important; }
/* ── #524: accesos rápidos del básico + 4 servicios en la fila del Inicio completo ── */
.bv-quick { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-top: 2px; }
.bv-quick button { border: 1px solid var(--p-border); background: var(--p-card); color: var(--p-text); border-radius: 14px; padding: 8px 2px; display: flex; flex-direction: column; align-items: center; gap: 3px; font: 800 9.5px var(--p-font); cursor: pointer; min-width: 0; }
.bv-quick button i { font-style: normal; font-size: 18px; line-height: 1; }
.ev-services { display: flex; gap: 6px; }
.ev-svc { flex: 1 1 0; min-width: 0; padding: 8px 4px !important; }
.ev-svc b { font-size: 11.5px !important; } .ev-svc small { font-size: 9.5px !important; line-height: 1.25 !important; }
.ev-svc.svc-missions b { color: var(--p-text) !important; } .ev-svc.svc-missions small { color: var(--p-muted) !important; }
/* ── #525 (owner): novedad en una sola línea recta, letra un poco más chica ── */
.ev-hero-new { font: 800 clamp(8.5px, 2.5vw, 10px) var(--p-font) !important; letter-spacing: .2px !important; padding: 6px 10px !important; white-space: nowrap !important; text-overflow: clip !important; }
.ev-hero-new b { font-weight: 900; }
/* ── #526 (owner): la fila de servicios del Inicio completo entra bien: tarjetas un poco más altas, ícono dentro del círculo,
   título y detalle legibles, y una flechita que indica que se puede abrir ── */
.ev-services { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.ev-svc, .ev-svc.svc-refund, .ev-svc.svc-roulette, .ev-svc.svc-ref, .ev-svc.svc-missions { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; gap: 3px !important; padding: 9px 4px 6px !important; min-height: 96px !important; border-radius: 16px !important; min-width: 0; position: relative; }
.ev-svc b { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 5px !important; font: 900 10.5px/1.1 var(--p-font) !important; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.ev-svc b .li { width: 32px !important; height: 32px !important; border-radius: 50% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; background: var(--p-red-soft) !important; color: var(--p-red) !important; flex: 0 0 auto; margin: 0 !important; }
.ev-svc b .li svg { width: 17px !important; height: 17px !important; display: block; }
.ev-svc small { display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font: 600 9px/1.2 var(--p-font) !important; text-align: center; max-width: 100%; margin: 0 !important; }
.ev-svc small b, .ev-svc small .rl-min { display: inline !important; font-size: 9px !important; }
.ev-svc::after { content: "▾"; position: absolute; right: 6px; bottom: 3px; font: 800 10px var(--p-font); color: var(--p-muted); }
/* ── #527 (owner): fotos de Top juegos más chicas · fila de servicios un poco más arriba · las 3 plataformas con logo arriba y texto abajo · botón de cargar más arriba ── */
.ev-game { flex: 0 0 30% !important; max-width: 132px !important; }
.ev-game .gp { padding: 5px 7px 6px !important; font-size: 10.5px !important; }
.ev-games-h { padding: 8px 12px 0 !important; font-size: 14px !important; }
.entry-view { gap: 4px !important; }
.ev-hero { margin-bottom: 0 !important; padding: 4px 8px !important; }
.ev-services { margin-top: 0 !important; }
.ev-tab, .ev-tab.soon, .ev-tab.active, .ev-tab.plat-ganamos, .ev-tab.plat-jugaygana { flex-direction: column !important; gap: 5px !important; padding: 12px 8px 10px !important; min-height: 84px !important; }
.ev-tab img { width: 34px !important; height: 34px !important; }
.ev-tab .ev-name { font-size: 13.5px !important; }
.ev-tab .ev-reco { top: -8px !important; right: auto !important; left: 50% !important; transform: translateX(-50%); }
.ev-tab .ev-soon { top: auto !important; bottom: -8px !important; right: auto !important; left: 50% !important; transform: translateX(-50%); }
.ev-frame-wrap.games .ev-cta { bottom: 26px !important; }
.ev-slides-track.games { padding-bottom: 70px !important; }
/* ── #528 (owner): "Ver más" en los accesos del básico · opiniones pegadas al botón de cargar · fueguito resumido junto a "Cambiar menú" ·
   misiones del home completo en una línea · plataformas más chicas y juntas ── */
.bv-quick button small { font: 700 8.5px var(--p-font); color: var(--p-red); margin-top: 1px; }
.ev-frame-wrap.games { margin-bottom: 0 !important; }
.ev-slides-track.games { padding-bottom: 54px !important; }
.ev-frame-wrap.games .ev-cta { bottom: 10px !important; }
#entryReviews.ev-reviews { margin-top: 2px !important; }
.top-row { display: flex; align-items: center; gap: 8px; margin: 6px 12px 0; }
.top-row .change-menu { margin: 0 !important; flex: 0 0 auto; }
.fire-mini { display: none; flex: 1 1 auto; min-width: 0; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 999px; border: 1px solid #f59e0b; background: linear-gradient(90deg, rgba(245,158,11,.14), rgba(245,158,11,.04)); color: var(--p-text); font-family: var(--p-font); cursor: pointer; }
body.home-full .fire-mini:not([hidden]) { display: inline-flex; }
.fire-mini .fm-flame { font-size: 18px; line-height: 1; } .fire-mini .fm-txt { display: flex; flex-direction: column; min-width: 0; text-align: left; }
.fire-mini .fm-txt b { font: 900 12px var(--p-font); color: #d97706; } .fire-mini .fm-txt small { font: 600 10px var(--p-font); color: var(--p-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fire-mini .fm-streak { margin-left: auto; font: 900 12px var(--p-font); color: #d97706; background: rgba(245,158,11,.15); border-radius: 999px; padding: 3px 8px; white-space: nowrap; }
body.home-full #fireHomeCard { display: none !important; }
.ms-card .ms-card-h.ms-oneline { white-space: nowrap; overflow: hidden; }
.ms-card .ms-card-h.ms-oneline b { flex: 0 0 auto; } .ms-card .ms-card-h.ms-oneline small { margin-left: 6px !important; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; text-align: left; }
.ms-card .ms-chev { font: 700 10px var(--p-font) !important; color: var(--p-red) !important; flex: 0 0 auto; transform: none !important; }
.ev-tabs { gap: 6px !important; }
.ev-tab, .ev-tab.soon, .ev-tab.active, .ev-tab.plat-ganamos, .ev-tab.plat-jugaygana { min-height: 70px !important; padding: 10px 6px 8px !important; gap: 4px !important; }
.ev-tab img { width: 28px !important; height: 28px !important; }
.ev-tab .ev-name { font-size: 12.5px !important; }
.plat-play-btn { height: 82px !important; padding: 6px 6px 20px !important; }
/* ── #529 REFERIDOS 2.0 (réplica): card del home, popup y modal. Mantienen su estética violeta/dorada en los dos temas (el modal y el popup se fuerzan a tarjeta oscura: sus textos son claros). ── */
                .dash-ref { background:linear-gradient(135deg,#1a0033,#2d0052); border:1.5px solid #d4af37; border-radius:13px; padding:9px 11px; color:#fff; box-shadow:0 3px 12px rgba(212,175,55,.35); }
                .dash-ref-head { display:flex; align-items:center; gap:8px; }
                .dash-ref-title { font-size:12.5px; font-weight:900; color:#ffd700; letter-spacing:.5px; flex:1; }
                .dash-ref-cta { font-size:9px; font-weight:900; color:#1a0033; background:linear-gradient(135deg,#d4af37,#ffd700); border-radius:999px; padding:4px 8px; border:none; cursor:pointer; white-space:nowrap; }
                .dash-ref-bar { position:relative; height:9px; background:rgba(255,255,255,.12); border-radius:999px; margin:9px 0 6px; overflow:hidden; }
                .dash-ref-fill { height:100%; background:linear-gradient(90deg,#d4af37,#ffd700); border-radius:999px; transition:width .5s ease; }
                .dash-ref-steps { display:flex; justify-content:space-between; gap:4px; }
                .dash-ref-step { flex:1; text-align:center; font-size:9px; color:#bbb; line-height:1.25; }
                .dash-ref-step b { display:block; font-size:16px; line-height:1; }
                .dash-ref-step.on { color:#00ff88; }
                .dash-ref-invite { width:100%; margin-top:8px; background:linear-gradient(135deg,#ffd700,#f7931e); color:#000; border:none; border-radius:10px; padding:9px; font-weight:900; font-size:12px; cursor:pointer; letter-spacing:.4px; }
                /* Popup promocional */
                .ref-promo { background:linear-gradient(180deg,#2d0052 0%,#1a0033 70%,#0a001a 100%); border:2.5px solid #ffd700; border-radius:18px; padding:20px 16px 16px; color:#fff; max-width:420px; width:100%; margin:18px auto; position:relative; text-align:center; box-shadow:0 0 40px rgba(255,215,0,.35); overflow:hidden; }
                .ref-promo-btn { width:100%; background:linear-gradient(135deg,#ffd700,#f7931e); color:#000; border:none; border-radius:12px; padding:14px; font-weight:900; font-size:15px; cursor:pointer; letter-spacing:.6px; box-shadow:0 4px 16px rgba(255,215,0,.45); }
                .ref-promo-link { width:100%; margin-top:8px; background:rgba(255,255,255,.06); color:#fff; border:1px solid rgba(255,255,255,.25); border-radius:12px; padding:11px; font-weight:800; font-size:12.5px; cursor:pointer; }
                .ref-promo-x { position:absolute; top:10px; right:10px; width:34px; height:34px; border-radius:50%; background:rgba(0,0,0,.55); border:1px solid #ffd700; color:#ffd700; font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; line-height:1; }

#referralModal .modal-content, #referralPromoModal .ref-promo { background: #14062b !important; color: #fff !important; border: 1px solid rgba(255,215,0,.35) !important; }
#referralModal .modal-header h2, #referralModal .modal-header p { color: #fff !important; }
#referralModal .ref-news { background: rgba(230,0,35,.18); color: #fff; }
#referralModal .ref-table { width: 100%; border-collapse: collapse; font-size: 11.5px; } #referralModal .ref-table th { color: #aaa; font-weight: 700; text-align: left; padding: 4px 6px; border-bottom: 1px solid rgba(255,255,255,.12); } #referralModal .ref-table td { padding: 5px 6px; border-bottom: 1px solid rgba(255,255,255,.06); color: #ddd; }
.ref-pill { display: inline-block; border-radius: 999px; padding: 2px 7px; font-size: 10px; font-weight: 800; }
.ref-modal-tile { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.14); border-radius: 12px; padding: 10px; display: flex; flex-direction: column; gap: 3px; } .ref-modal-tile .v { font-size: 18px; font-weight: 900; } .ref-modal-tile .l { font-size: 10.5px; color: #bbb; line-height: 1.3; }
body.home-easy #referralHomeCard, body.home-basic #referralHomeCard { display: none !important; }
/* ── #530 PANTALLA DE REGISTRO (idea de la landing del owner): fondo BLANCO siempre (tokens claros forzados aunque el tema sea nocturno). ── */
#loginScreen { --p-bg: #ffffff; --p-surface: #f3f3f3; --p-surface-2: #e9e9e9; --p-text: #111111; --p-muted: #6f6f6f; --p-border: #e2e2e2; --p-card: #fff; --p-placeholder: #9a9a9a; --p-text-2: #333; --p-red: #e60023; --p-red-soft: #ffe9ec; background: #fff !important; color: #111; }
#loginScreen .login-box.lg { background: #fff; }
.lg-quick-l { text-align: center; font-size: 14px !important; }
.lg-quick input { text-align: center; font-size: 17px !important; }
.lg-quick-btn { background: linear-gradient(135deg, #2ce06e, #0f9a4b) !important; color: #05230f !important; font-weight: 900 !important; letter-spacing: .4px; border: 0 !important; }
.lg-trustrow { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; font: 600 12px var(--p-font); color: var(--p-muted); }
.lg-trustrow span { display: inline-flex; align-items: center; gap: 5px; } .lg-trustrow i { width: 5px; height: 5px; border-radius: 50%; background: #25d366; }
.lg-play-box { background: var(--p-surface); border-radius: 18px; padding: 10px 12px 12px; }
.lg-play-h { display: flex; flex-direction: column; align-items: center; gap: 1px; margin-bottom: 8px; text-align: center; }
.lg-play-h b { font: 800 13px var(--p-font); color: var(--p-text); } .lg-play-h small { font: 500 10.5px var(--p-font); color: var(--p-muted); }
.lg-plats-tiles { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.lg-plats-tiles .lg-plat-pill { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; background: var(--p-card); border: 1px solid var(--p-border); border-radius: 14px; padding: 10px 6px 8px; position: relative; }
.lg-plats-tiles .lg-plat-pill img, .lg-plats-tiles .lg-plat-pill i { width: 40px; height: 40px; border-radius: 12px; font-size: 22px; }
.lg-plats-tiles .lg-plat-pill b { font: 800 11.5px var(--p-font); text-align: center; }
.lg-plats-tiles .lg-plat-pill small { position: absolute; top: 6px; right: 6px; padding: 1px 5px; font-size: 8px; }
.lg-plats-tiles .lg-plat-pill.soon img { filter: grayscale(.4); opacity: .8; }
.lg-sys { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
.lg-sy { display: inline-flex; align-items: center; gap: 5px; background: var(--p-surface); border-radius: 999px; padding: 5px 10px 5px 6px; font: 700 11px var(--p-font); color: var(--p-text); }
.lg-sy i { width: 20px; height: 20px; border-radius: 50%; background: var(--p-red-soft); color: var(--p-red); display: inline-flex; align-items: center; justify-content: center; } .lg-sy i svg { width: 12px; height: 12px; }
.lg-sy b { color: var(--p-green); font-weight: 900; }
.lg-pop { position: fixed; inset: 0; background: rgba(0,0,0,.55); display: none; align-items: center; justify-content: center; padding: 24px; z-index: 3000; }
.lg-pop.on { display: flex; }
.lg-pop-box { width: 100%; max-width: 340px; background: #fff; border: 1px solid #f3d6a4; border-radius: 20px; padding: 22px 18px; text-align: center; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 24px 70px rgba(0,0,0,.35); }
.lg-pop-box b { font: 900 19px var(--p-font); color: #111; } .lg-pop-box p { margin: 0 0 6px; font: 500 13.5px/1.45 var(--p-font); color: #6f6f6f; }
.lg-pop-later { border: 0; background: none; font: 700 12.5px var(--p-font); color: #6f6f6f; text-decoration: underline; cursor: pointer; padding: 6px; }
.lg-quick-ref { text-align: center; font: 700 11.5px var(--p-font); color: #8a6100; background: #fff7e6; border: 1px solid #f3d6a4; border-radius: 999px; padding: 6px 10px; } .lg-quick-ref b { color: #111; letter-spacing: 1px; }
/* #534: barra de progreso del registro automático */
.lg-quick-loading { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 14px 10px; background: var(--p-surface); border-radius: 22px; }
.lg-quick-loading b { font: 800 15px var(--p-font); color: var(--p-text); } .lg-quick-loading small { font: 500 11px/1.35 var(--p-font); color: var(--p-muted); }
.lg-bar { width: 100%; max-width: 280px; height: 10px; border-radius: 999px; background: var(--p-card); overflow: hidden; }
.lg-bar i { display: block; height: 100%; width: 35%; border-radius: 999px; background: linear-gradient(135deg, #2ce06e, #0f9a4b); animation: lgBar 1.6s ease-in-out infinite; }
.lg-quick-loading.is-in .lg-bar i { width: 92%; animation: none; transition: width .8s ease; }
@keyframes lgBar { 0% { margin-left: -35%; } 100% { margin-left: 100%; } }
/* ── #536 fueguito minimizado, banner recordatorio y REFERIDOS en estilo Pinterest ── */
.fire-mini .fm-txt small { display: none !important; } .fire-mini .fm-txt b { white-space: nowrap; }
.fire-mini .fm-more { font: 700 10.5px var(--p-font); color: var(--p-muted); font-style: normal; white-space: nowrap; }
.sd-banner { flex-wrap: nowrap; } .sd-banner .sd-txt { flex: 1 1 auto; min-width: 0; font: 600 11.5px/1.3 var(--p-font); color: #1a1a1a; white-space: normal; }
.sd-banner .sd-txt b { font-size: 13px; } .sd-banner .sd-txt small { display: block; margin-top: 2px; font-size: 10px; }
.dash-ref { background: var(--p-card) !important; border: 1px solid var(--p-border) !important; color: var(--p-text) !important; box-shadow: var(--p-shadow) !important; border-radius: 16px !important; }
.dash-ref-title { color: var(--p-text) !important; } .dash-ref-cta { background: var(--p-red) !important; color: #fff !important; }
.dash-ref-bar { background: var(--p-surface-2) !important; } .dash-ref-fill { background: var(--p-red) !important; }
.dash-ref-step { color: var(--p-muted) !important; } .dash-ref-step.on { color: var(--p-green) !important; }
.dash-ref-invite { background: var(--p-red) !important; color: #fff !important; border-radius: 999px !important; }
#referralModal .modal-content, #referralPromoModal .ref-promo { background: var(--p-card) !important; color: var(--p-text) !important; border: 1px solid var(--p-border) !important; box-shadow: var(--p-shadow) !important; }
#referralModal .modal-header h2, #referralModal .modal-header p { color: var(--p-text) !important; }
#referralModal .ref-hi { color: var(--p-red); } #referralModal .ref-ok { color: var(--p-green); }
#referralModal .ref-news { background: var(--p-red-soft); color: var(--p-text); }
#referralModal .ref-table th { color: var(--p-muted); border-bottom: 1px solid var(--p-border); } #referralModal .ref-table td { color: var(--p-text); border-bottom: 1px solid var(--p-border); }
.ref-modal-tile { background: var(--p-surface) !important; border: 1px solid var(--p-border) !important; } .ref-modal-tile .l { color: var(--p-muted) !important; }
.ref-promo { max-width: 400px !important; width: calc(100% - 24px); margin: 18px auto !important; padding: 26px 18px 18px !important; border-radius: 22px !important; text-align: center; position: relative; }
.ref-promo-x { position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border-radius: 50%; border: 0; background: var(--p-surface); color: var(--p-text); font-size: 16px; cursor: pointer; }
.ref-promo-ico { font-size: 56px; line-height: 1; }
.ref-promo-h { margin: 8px 0 4px; font: 900 22px var(--p-font); color: var(--p-text); }
.ref-promo-p { margin: 0 0 10px; font: 500 13.5px/1.45 var(--p-font); color: var(--p-muted); } .ref-promo-p b { color: var(--p-red); font-size: 18px; }
.ref-promo-extra { font: 700 11.5px/1.4 var(--p-font); color: var(--p-green); margin: 0 0 10px; }
.ref-promo-btn { width: 100%; border: 0; border-radius: 999px; padding: 14px; font: 900 15px var(--p-font); background: var(--p-red); color: #fff; cursor: pointer; box-shadow: none; }
.ref-promo-link { width: 100%; margin-top: 8px; border: 0; border-radius: 999px; padding: 11px; font: 800 12.5px var(--p-font); background: var(--p-surface); color: var(--p-text); cursor: pointer; }
/* ── #538 modo "Iniciar sesión" (Config entryLogin) + acomodo del bloque de confianza/plataformas/servicios fuera del formulario ── */
.lg-trustrow { margin-top: 2px; } .lg-sys { padding: 0 2px; }
.lg-login-h { display: none; margin: 2px 0 8px; text-align: center; font: 900 20px var(--p-font); color: var(--p-text); }
.lg-login-links { display: none; justify-content: center; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.lg-login-links .lg-link { font: 700 12px var(--p-font); color: var(--p-text); background: var(--p-card); border: 0; border-radius: 999px; padding: 8px 12px; cursor: pointer; }
body.entry-login .lg-quick, body.entry-login #quickLoading, body.entry-login #quickDone { display: none !important; }
body.entry-login #loginForm { display: block !important; }
body.entry-login .lg-login-h, body.entry-login .lg-login-links { display: flex; }
body.entry-login .lg-login-h { display: block; }
body.entry-login .lg-form { padding-top: 16px; }
/* #540 (owner): en el registro de la app NO va el bono de bienvenida (la gente ya se registra ahí); queda sólo en la landing. */
/* #541 registro desde el inicio: celular + SMS, botón Registrarse */
.lg-phone { display: flex; align-items: center; gap: 6px; background: var(--p-card); border-radius: 14px; padding: 0 0 0 12px; border: 2px solid transparent; }
.lg-phone:focus-within { border-color: var(--p-text); } .lg-phone span { font: 800 15px var(--p-font); color: var(--p-muted); }
.lg-phone input { flex: 1; min-width: 0; background: transparent !important; border: 0 !important; padding: 12px 10px !important; font: 700 16px var(--p-font) !important; color: var(--p-text); text-align: left; outline: none; }
.lg-quick-otp { border: 0; border-radius: 999px; padding: 10px 14px; font: 800 13px var(--p-font); background: var(--p-text); color: var(--p-inv); cursor: pointer; }
.lg-quick-otp:disabled { opacity: .55; cursor: default; }
#quickOtpStep { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; } #quickOtpStep input { text-align: center; letter-spacing: 6px; font-size: 20px !important; }
#quickSmsBox { display: flex; flex-direction: column; gap: 7px; margin: 2px 0; }
.lg-login-links .lg-register-btn { flex: 1 0 100%; padding: 13px !important; font-size: 15px !important; }
/* ── #542 pantalla de ingreso COMPACTA (entra en una pantalla) + registro en pantalla interna ── */
.login-box.lg-app { gap: 7px !important; padding: 8px 14px 10px !important; }
.lg-head { gap: 8px; } .lg-logo { width: 38px; height: 38px; border-radius: 11px; } .lg-brand b { font-size: 15px; } .lg-brand small { font-size: 9.5px; }
.lg-ring, .lg-ring-av { width: 38px; height: 38px; }
.lg-form { padding: 10px 12px 8px; border-radius: 18px; }
.lg-form .input-group { margin-bottom: 7px; } .lg-form .input-group label { font-size: 11.5px; margin-bottom: 3px; }
.lg-form .input-group input { padding: 10px 12px !important; font-size: 14px !important; }
.lg-form .btn-primary { padding: 11px !important; font-size: 14px !important; margin-bottom: 4px; }
.lg-login-h { display: block; margin: 0 0 6px; font-size: 16px; text-align: center; }
.lg-login-links { display: flex; margin-top: 2px; gap: 6px; }
.lg-login-links .lg-register-btn { padding: 11px !important; font-size: 14px !important; }
.lg-login-links .lg-link { padding: 7px 10px; font-size: 11.5px; }
body.reg-quick .lg-form:not(.lg-form-reg), body.reg-quick .lg-login-h, body.reg-quick .lg-login-links { display: none !important; } /* #543: el form de la pantalla de registro NO se esconde */
.lg-trustrow { gap: 8px; font-size: 10.5px; flex-wrap: nowrap; white-space: nowrap; overflow: hidden; margin-top: 0; }
.lg-play-box { padding: 7px 10px 9px; border-radius: 16px; } .lg-play-h { margin-bottom: 6px; } .lg-play-h b { font-size: 12px; } .lg-play-h small { font-size: 9.5px; }
.lg-plats-tiles { gap: 6px; } .lg-plats-tiles .lg-plat-pill { padding: 7px 4px 6px; border-radius: 12px; gap: 4px; }
.lg-plats-tiles .lg-plat-pill img, .lg-plats-tiles .lg-plat-pill i { width: 32px; height: 32px; border-radius: 10px; } .lg-plats-tiles .lg-plat-pill b { font-size: 10.5px; }
.lg-sys { gap: 4px; } .lg-sy { padding: 4px 8px 4px 5px; font-size: 10px; gap: 4px; } .lg-sy i { width: 17px; height: 17px; } .lg-sy i svg { width: 10px; height: 10px; }
.lg-foot { font-size: 9px; margin: 0; }
@media (max-height: 760px) { .lg-app .lg-sec-reviews { display: none !important; } }
@media (max-height: 640px) { .lg-sys .lg-sy:nth-child(n+7) { display: none; } }
.lg-regscreen { position: fixed; inset: 0; z-index: 2600; background: #fff; overflow-y: auto; padding: calc(10px + env(safe-area-inset-top, 0px)) 14px calc(16px + env(safe-area-inset-bottom, 0px)); display: flex; flex-direction: column; gap: 10px; --p-bg: #fff; --p-surface: #f3f3f3; --p-card: #fff; --p-text: #111; --p-muted: #6f6f6f; --p-border: #e2e2e2; }
.lg-regscreen[hidden] { display: none !important; }
.lg-reg-head { display: flex; align-items: center; gap: 10px; max-width: 420px; width: 100%; margin: 0 auto; }
.lg-reg-back { width: 38px; height: 38px; border-radius: 50%; border: 0; background: var(--p-surface); color: var(--p-text); font: 900 24px/1 var(--p-font); cursor: pointer; flex: 0 0 auto; }
.lg-logo-sm { width: 36px; height: 36px; border-radius: 10px; }
.lg-form-reg { max-width: 420px; width: 100%; margin: 0 auto; }
.lg-form-reg .lg-quick-l { font-size: 15px !important; }
.lg-reg-login { align-self: center; background: transparent !important; text-decoration: underline; }
/* #543 limpieza del ingreso */
.lg-regscreen .lg-form-reg { display: block !important; }
/* ── #548 pantalla de registro "premium" estilo Pinterest (blanca, tarjeta con sombra, píldoras rojas, pasos) ── */
#quickSmsBox[hidden], #quickOtpStep[hidden], #quickNextBtn[hidden], #quickEntryBtn[hidden], #regSteps[hidden] { display: none !important; }
.lg-regscreen { gap: 12px; padding-top: calc(14px + env(safe-area-inset-top, 0px)); }
.lg-reg-head .lg-brand b { font-size: 19px; letter-spacing: .3px; } .lg-reg-head .lg-brand small { font-size: 10.5px; }
.lg-reg-back { box-shadow: var(--p-shadow); background: #fff; }
.lg-steps { display: flex; gap: 6px; max-width: 420px; width: 100%; margin: 0 auto; }
.lg-steps span { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; font: 800 11px var(--p-font); color: var(--p-placeholder); background: var(--p-surface); border-radius: 999px; padding: 7px 6px; }
.lg-steps span i { width: 18px; height: 18px; border-radius: 50%; background: var(--p-surface-2); color: var(--p-muted); font: 900 10px/18px var(--p-font); text-align: center; font-style: normal; }
.lg-regscreen[data-step="1"] .lg-steps span[data-s="1"], .lg-regscreen[data-step="2"] .lg-steps span[data-s="2"], .lg-regscreen[data-step="3"] .lg-steps span[data-s="3"] { background: var(--p-red); color: #fff; }
.lg-regscreen[data-step="1"] .lg-steps span[data-s="1"] i, .lg-regscreen[data-step="2"] .lg-steps span[data-s="2"] i, .lg-regscreen[data-step="3"] .lg-steps span[data-s="3"] i { background: #fff; color: var(--p-red); }
.lg-regscreen[data-step="2"] .lg-steps span[data-s="1"], .lg-regscreen[data-step="3"] .lg-steps span[data-s="1"], .lg-regscreen[data-step="3"] .lg-steps span[data-s="2"] { color: var(--p-text); }
.lg-regscreen[data-step="2"] .lg-steps span[data-s="1"] i, .lg-regscreen[data-step="3"] .lg-steps span[data-s="1"] i, .lg-regscreen[data-step="3"] .lg-steps span[data-s="2"] i { background: var(--p-green); color: #fff; }
.lg-form-reg { background: #fff !important; border-radius: 24px !important; padding: 18px 16px 16px !important; box-shadow: var(--p-shadow); border: 1px solid var(--p-border); }
.lg-form-reg .lg-quick { gap: 9px; }
.lg-form-reg .lg-quick-l { font-size: 15px !important; font-weight: 900 !important; text-align: center; }
.lg-form-reg .lg-quick input, .lg-form-reg .lg-phone { background: var(--p-surface) !important; border-radius: 16px !important; }
.lg-form-reg .lg-quick input { padding: 14px 14px !important; font-size: 17px !important; font-weight: 700; }
.lg-form-reg .lg-quick input:focus, .lg-form-reg .lg-phone:focus-within { border-color: var(--p-red) !important; box-shadow: 0 0 0 3px rgba(230,0,35,.12); }
.lg-form-reg .lg-phone { padding-left: 14px; } .lg-form-reg .lg-phone span { color: var(--p-text); }
.lg-form-reg .lg-phone input { padding: 13px 12px !important; font-size: 17px !important; }
.lg-form-reg .lg-quick-btn { background: var(--p-red) !important; color: #fff !important; border-radius: 999px !important; padding: 14px !important; font: 900 15px var(--p-font) !important; letter-spacing: .4px; box-shadow: 0 6px 18px rgba(230,0,35,.25); }
.lg-form-reg .lg-quick-btn:disabled { opacity: .7; box-shadow: none; }
.lg-form-reg .lg-quick-otp { border-radius: 999px; padding: 12px 14px; font-size: 13.5px; background: var(--p-text); color: #fff; }
.lg-form-reg #quickSmsBox { gap: 8px; margin: 4px 0 2px; padding-top: 10px; border-top: 1px dashed var(--p-border); }
.lg-form-reg #quickSmsBox .lg-quick-l { font-size: 14px !important; }
.lg-form-reg #quickOtpStep input { letter-spacing: 8px; font-size: 24px !important; font-weight: 900; }
.lg-form-reg #quickOtpStep input::placeholder { letter-spacing: 0; font-size: 14px; font-weight: 600; color: var(--p-placeholder); }
.lg-form-reg .lg-quick-n { font-size: 11.5px; }
.lg-form-reg .lg-quick-loading { background: #fff; }
.lg-reg-trust { margin: 0; text-align: center; font: 700 11px var(--p-font); color: var(--p-muted); }
.lg-reg-login { font-size: 12.5px; color: var(--p-text); }
   difuminado; el pie (marca + botón) va DEBAJO de la foto, no encima; cierre más claro. ── */
/* #559 botón "Dejar preseleccionado para el ingreso" (al lado de Cambiar menú) · #560 fueguito mini sólo "Racha" */
.top-row { flex-wrap: wrap; }
.menu-pin { display: inline-flex; align-items: center; gap: 5px; flex: 0 1 auto; min-width: 0; padding: 7px 10px; border-radius: 999px; border: 1px solid var(--p-border); background: var(--p-card); color: var(--p-muted); font: 700 11px var(--p-font); cursor: pointer; }
.menu-pin .li { width: 14px; height: 14px; display: inline-flex; color: var(--p-muted); } .menu-pin .li svg { width: 14px; height: 14px; }
.menu-pin span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.menu-pin.on { background: var(--p-green-soft); border-color: var(--p-green-line); color: var(--p-green); } .menu-pin.on .li { color: var(--p-green); }
.fire-mini { flex: 0 0 auto; gap: 6px; padding: 6px 9px; } .fire-mini .fm-txt b { font-size: 11.5px; } .fire-mini .fm-more { display: none; }
/* #561 (owner): con el MENÚ 2 (barra abajo) la hoja "Jugar ahora" y demás hojas inferiores suben por encima de la barra: no se tapa el texto */
body.menu2 .play-now-card { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); z-index: 9700; }
body.menu2 .play-now-card .pn-sheet { border-radius: 22px 22px 18px 18px; }
body.menu2 #homeFull, body.menu2 #easyView, body.menu2 #basicView, body.menu2 #entryView { padding-bottom: 12px; }
/* ── #563 (owner): fila Cambiar menú · Fijar · Racha en UNA línea; "Elegí dónde jugar" primero; carga acreditada como burbuja
   temporal (no tapa nada); botón negro "lo instalo después" arriba de Cambiar menú ── */
.top-row { flex-wrap: nowrap !important; gap: 6px; }
.menu-pin { flex: 0 0 auto; padding: 7px 9px; } .menu-pin span { overflow: visible; }
.ev-play-first { margin: 6px 12px 0; padding: 8px 10px 9px; border-radius: 16px; background: var(--p-surface); border: 1px solid var(--p-border); }
.ev-play-k { display: block; font: 900 13px var(--p-font); color: var(--p-text); margin-bottom: 6px; }
.ev-play-first .ev-tabs { margin: 0 !important; }
#installGiftBar.ig-bar { position: static !important; left: auto !important; right: auto !important; bottom: auto !important; margin: 8px 12px 0; width: auto; z-index: auto; background: #111 !important; color: #fff !important; border-radius: 14px; box-shadow: var(--p-shadow); }
#installGiftBar .ig-bar-k { background: var(--p-red); color: #fff; } #installGiftBar .ig-bar-t { color: #fff; } #installGiftBar .ig-bar-amt { color: #ffd166; }
.play-now-card { inset: auto 10px auto 10px !important; top: calc(62px + env(safe-area-inset-top, 0px)) !important; bottom: auto !important; background: transparent !important; backdrop-filter: none !important; align-items: flex-start !important; padding: 0 !important; pointer-events: none !important; }
.play-now-card.show .pn-sheet { pointer-events: auto; }
.play-now-card .pn-sheet { border-radius: 18px !important; box-shadow: 0 14px 40px rgba(0,0,0,.28) !important; padding: 12px 14px !important; border: 1px solid var(--p-border) !important; }
body.menu2 .play-now-card { padding-bottom: 0 !important; }
/* #564: cartel de primera carga más chico */
.sd-banner-full { padding: 8px 12px; } .sd-banner .sd-txt { font-size: 11px; } .sd-banner .sd-txt b { font-size: 12px; } .sd-banner .sd-txt small { display: inline; margin: 0 0 0 4px; font-size: 10px; }
/* #565 (owner): MENÚ 2 — la barra inferior va FIJA y el contenido deja lugar: no tapa nada */
body.menu2 #bottomNav.bottom-nav { position: fixed !important; left: 0; right: 0; bottom: 0; top: auto; order: 99; }
/* (#575: los rellenos por contenedor se reemplazaron por acortar la pantalla entera; ver abajo) */
/* #567 (owner): MENÚ 2 — el relleno va en los contenedores que SCROLLEAN (no en #chatScreen): nada queda debajo de la barra fija */
/* (#575: ídem) */
body.menu2 #bottomNav.bottom-nav { box-shadow: 0 -6px 20px rgba(0,0,0,.08); }
#sdBannerFull { display: none !important; }
/* #568 (owner): en Carga auto la fila "Comprobante aquí · Retirar premio" va FIJA al tope de abajo, pegada arriba del menú (Inicio) */
/* #571 (owner): la fila sólo tapa SU línea (sin fondo ni sombra), va pegada al menú, y el relleno va en #homePanel (el que scrollea
   en Carga auto): así los 3 pasos de "Cargá acá" se ven completos deslizando, nada queda tapado ni hay huecos blancos. */
body.home-full .home-actions-row { position: fixed; left: 8px; right: 8px; bottom: calc(6px + env(safe-area-inset-bottom, 0px)); z-index: 58; margin: 0 !important; background: var(--p-card); padding: 5px; border-radius: 18px; box-shadow: 0 4px 18px rgba(0,0,0,.12); border: 1px solid var(--p-border); } /* #572: fondo SOLO en ese recuadro */
body.home-full.menu2 .home-actions-row { bottom: calc(82px + env(safe-area-inset-bottom, 0px)); }
body.home-full .entry-view, body.home-full #homeFull { padding-bottom: 0 !important; }
body.home-full #homePanel { padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important; }
body.home-full.menu2 #homePanel { padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important; }
body.home-full .test-mini-row { margin-bottom: 2px; }
/* #569: "Fijar" adentro del selector de menú; la fila de arriba queda Cambiar menú · Racha */
.mc-pin { width: 100%; margin-top: 8px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 12px; border-radius: 999px; border: 1px solid var(--p-border); background: var(--p-surface); color: var(--p-text); font: 800 12px var(--p-font); cursor: pointer; }
.mc-pin .li { width: 15px; height: 15px; display: inline-flex; color: var(--p-red); } .mc-pin .li svg { width: 15px; height: 15px; }
.mc-pin.on { background: var(--p-green-soft); border-color: var(--p-green-line); color: var(--p-green); } .mc-pin.on .li { color: var(--p-green); }
.change-menu span { display: none; }
/* #574 (owner): sin barra de desplazamiento visible en los menús (el contenido se desliza igual) */
.basic-view, .easy-view, .entry-view, #homePanel, #homeFull { scrollbar-width: none !important; -ms-overflow-style: none; }
.basic-view::-webkit-scrollbar, .easy-view::-webkit-scrollbar, .entry-view::-webkit-scrollbar, #homePanel::-webkit-scrollbar, #homeFull::-webkit-scrollbar { display: none; width: 0; height: 0; }
/* ── #575 (owner): MENÚ 2 — la barra inferior es fija y la PANTALLA ENTERA termina arriba de ella (altura 100dvh − 76 px). Sin rellenos
   por contenedor: ningún bloque blanco tapa el contenido, en ningún menú. ── */
body.menu2 .chat-screen, body.menu2 #chatScreen { height: calc(100dvh - 76px - env(safe-area-inset-bottom, 0px)) !important; max-height: calc(100dvh - 76px - env(safe-area-inset-bottom, 0px)) !important; min-height: 0 !important; overflow: hidden; }
body.menu2 #bottomNav.bottom-nav { height: calc(76px + env(safe-area-inset-bottom, 0px)); padding-bottom: env(safe-area-inset-bottom, 0px); box-sizing: border-box; background: var(--p-card); }
/* #576 (owner): en el recuadro "Elegí dónde jugar" las etiquetas RECOMENDADO / PRONTO van ADENTRO de cada tile, centradas (se habían corrido) */
.ev-play-first, .ev-play-first .ev-tabs { overflow: visible; }
.ev-play-first .ev-tab, .ev-play-first .ev-tab.soon, .ev-play-first .ev-tab.active { position: relative !important; padding: 18px 6px 20px !important; min-height: 96px !important; }
.ev-play-first .ev-tab .ev-reco { position: absolute !important; top: 5px !important; left: 50% !important; right: auto !important; bottom: auto !important; transform: translateX(-50%); white-space: nowrap; }
.ev-play-first .ev-tab .ev-soon { position: absolute !important; bottom: 5px !important; top: auto !important; left: 50% !important; right: auto !important; transform: translateX(-50%); white-space: nowrap; }
/* #578 menú básico: nivel VIP (con progreso) y fueguito, cada uno en una línea debajo del usuario */
.bv-line { display: flex; align-items: center; gap: 8px; width: 100%; background: var(--p-surface); border: 0; border-radius: 14px; padding: 8px 12px; color: var(--p-text); font-family: var(--p-font); cursor: pointer; text-align: left; }
.bv-line > i { font-size: 16px; font-style: normal; flex: 0 0 auto; }
.bv-line-t { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; line-height: 1.15; }
.bv-line-t b { font: 800 12.5px var(--p-font); color: var(--p-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bv-line-t small { font: 600 10px var(--p-font); color: var(--p-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bv-bar { flex: 0 0 72px; height: 8px; border-radius: 999px; background: var(--p-surface-2); overflow: hidden; } .bv-bar i { display: block; height: 100%; background: var(--p-red); border-radius: 999px; transition: width .4s; }
.bv-line > em { font: 800 10.5px var(--p-font); color: var(--p-muted); font-style: normal; flex: 0 0 auto; white-space: nowrap; }
/* #579 (owner): en modo nocturno el botón "Pendiente · Instalá la app y cargá tu extra" va en un color llamativo (en negro se perdía) */
html[data-theme="dark"] #installGiftBar.ig-bar { background: linear-gradient(135deg, #ffb300, #ff6f00) !important; color: #111 !important; box-shadow: 0 8px 24px rgba(255,140,0,.35); }
html[data-theme="dark"] #installGiftBar .ig-bar-k { background: #111; color: #ffd166; } html[data-theme="dark"] #installGiftBar .ig-bar-t { color: #111; } html[data-theme="dark"] #installGiftBar .ig-bar-amt { color: #111; }
/* #580: el recomendado del selector es el BÁSICO */
.mc-opt.mc-easy { border-color: transparent !important; } .mc-opt.mc-basic { border-color: var(--p-text) !important; }
/* #581: canje del link de acceso: la pantalla de registro NO se ve; cartel "Entrando a tu cuenta…" */
.access-splash { display: none; }
html.access-pending #loginScreen { display: none !important; }
html.access-pending .access-splash { display: flex; position: fixed; inset: 0; z-index: 4000; background: #fff; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.access-splash img { width: 72px; height: 72px; border-radius: 20px; } .access-splash b { font: 900 16px var(--p-font); color: #111; } .access-splash .lg-bar { max-width: 220px; }
   visible debajo en una tarjeta, sello de marca y botón en píldora; la de texto solo (Telegram) centrada y grande ── */
/* #584: la fila de accesos del básico queda con 4 (sin Niveles VIP) */
.bv-quick { grid-template-columns: repeat(4, 1fr) !important; }
   PICA ROJA va ADENTRO de la foto (parte de la marca); debajo sólo el texto y el botón, sobre el mismo fondo. ── */
/* #587 (owner): la foto abarca TODA la pantalla (sin marco) y el texto va abajo de todo */
   el logo de la marca, el texto y el botón, todo centrado ── */
/* #595 (owner): pantalla limpia al entrar: sin la card "Invitá a tus amigos" en el inicio (Referidos sigue en su botón) */
#referralHomeCard { display: none !important; }
/* #598: panel "Carga rápida" del casino, chico y simple */
.casino-load { padding: 10px 12px 12px !important; width: min(320px, calc(100vw - 24px)) !important; }
.cl-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--p-border); }
.cl-row small { flex: 0 0 48px; font: 800 9.5px var(--p-font); letter-spacing: .8px; text-transform: uppercase; color: var(--p-muted); }
.cl-row b { flex: 1; min-width: 0; font: 700 12px var(--p-font); color: var(--p-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cl-row .cl-copy { flex: 0 0 auto; border-radius: 999px; padding: 4px 9px; font: 800 10.5px var(--p-font); }
.casino-load .cl-btn { width: 100%; margin-top: 10px; border-radius: 999px !important; padding: 12px !important; font: 900 13px var(--p-font) !important; }
/* #599 (owner): botones prediseñados del soporte, siempre a la vista arriba de la caja de escribir (estilo Stake) */
.sp-quickbar { display: none; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 6px 10px; background: var(--p-card); border-top: 1px solid var(--p-border); }
.sp-quickbar::-webkit-scrollbar { display: none; }
body.home-mini .sp-quickbar { display: flex; }
.sp-quickbar button { flex: 0 0 auto; border: 1px solid var(--p-border); background: var(--p-surface); color: var(--p-text); border-radius: 999px; padding: 7px 12px; font: 800 12px var(--p-font); cursor: pointer; white-space: nowrap; }
.sp-quickbar button:active { background: var(--p-surface-2); }
body.home-mini .sp-intro .sp-chips { display: none; } /* los botones viven en la barra de abajo */
/* #600 (owner): menú intermedio sin hueco abajo: la grilla de servicios crece y llena la pantalla hasta la barra */
.easy-view { flex: 1 1 auto !important; min-height: 0; }
.easy-view .ez-grid { flex: 1 1 auto; min-height: 0; grid-auto-rows: minmax(104px, 1fr); align-content: stretch; }
.easy-view .ez-btn { height: 100%; min-height: 104px; }
/* ── #602 (owner): SOPORTE DE PROBLEMAS — sin charla abierta se ve SOLO el selector (nombre, "¿Con qué tenés problema?" y 4 botones);
   al elegir, aparece la charla (mensajes + caja + barra de temas). Cerrada desde el panel ⇒ vuelve el selector. ── */
body.home-mini:not(.sp-sent) #chatMessages, body.home-mini:not(.sp-sent) .chat-input-container, body.home-mini:not(.sp-sent) .sp-quickbar { display: none !important; }
body.home-mini:not(.sp-sent) .sp-intro { margin: 12px; padding: 18px 16px !important; }
.sp-ask { font: 900 15px var(--p-font); color: var(--p-text); margin: 10px 0 8px; }
.sp-topics { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; }
.sp-topics button { padding: 12px 10px !important; font: 800 13px var(--p-font) !important; border-radius: 14px !important; background: var(--p-surface) !important; border: 1px solid var(--p-border) !important; text-align: center; }
body.sp-sent .sp-ask { display: none; }
/* #603 (owner): con la charla abierta es SOLO chat a pantalla completa (sin la barra de temas); "Chat cerrado" en el selector */
body.home-mini.sp-sent .sp-quickbar { display: none !important; }
body.home-mini.sp-sent #chatMessages { flex: 1 1 auto; }
.sp-closed { display: inline-block; font: 800 11.5px var(--p-font); color: var(--p-muted); background: var(--p-surface); border-radius: 999px; padding: 5px 10px; margin: 6px 0 2px; }
/* #605 (owner): menú básico cortado abajo: la vista es la que scrollea (ocupa el alto libre) y nada queda recortado */
.basic-view { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; padding-bottom: 14px; }
/* #604: con el chat cerrado se ve el aviso del agente arriba del selector */
body.home-mini:not(.sp-sent) #chatMessages { display: flex !important; flex: 0 0 auto; max-height: 40vh; }
body.home-mini:not(.sp-sent) #chatMessages:empty { display: none !important; }
/* #608 (owner): el aviso de primera carga va debajo de la barra, en los 3 menús (no en Soporte) */
#sdBanner { margin: 8px 12px 0 !important; }
body.home-mini #sdBanner { display: none !important; }
/* #610 (owner): la FRANJA BLANCA que tapaba el final del básico/intermedio: con el regalo de instalar pendiente (`body.ig-pending`)
   el home completo plegado (#homeFull, alto 0) seguía reservando 84 px de padding para una barra que ya no va abajo (desde #563 está
   arriba). Nada plegado reserva lugar. */
body.ig-pending #homeFull, body.ig-pending #easyView, body.ig-pending #entryView, body.ig-pending .chat-screen > .home-actions-row:last-child { padding-bottom: 12px !important; }
body.home-easy #homeFull, body.home-basic #homeFull, body.home-play #homeFull, body.home-mini #homeFull { padding: 0 !important; margin: 0 !important; border: 0 !important; }
/* #612 (owner): con la charla abierta, la PRESENTACIÓN queda ARRIBA del chat, prolija y compacta ("Bienvenido al soporte, mi nombre es
   {nombre}…"); abajo sólo los mensajes y la caja. Sin la pregunta ni los botones de tema. */
body.home-mini.sp-sent #supportIntro { display: flex !important; margin: 8px 10px 0 !important; padding: 11px 12px 10px !important; border: 1px solid var(--p-border); }
body.home-mini.sp-sent #supportIntro .sp-ask, body.home-mini.sp-sent #supportIntro .sp-topics, body.home-mini.sp-sent #supportIntro #spClosed, body.home-mini.sp-sent #supportIntro .sp-sla { display: none !important; }
body.home-mini.sp-sent #supportIntro .sp-msg { font-size: 13px; line-height: 1.4; }
body.home-mini.sp-sent #chatMessages { flex: 1 1 auto !important; min-height: 0; }
/* #613 (owner): chat cerrado = selector + aviso FIJADO "Chat cerrado · fecha" debajo de las opciones (el historial no se ve hasta
   abrir de nuevo; al abrir, vuelve completo con sus separadores de fecha). */
body.home-mini:not(.sp-sent) #chatMessages { display: none !important; }
.sp-closed { display: block; width: 100%; text-align: center; margin: 10px 0 0 !important; padding: 9px 12px !important; border-radius: 12px !important; font: 800 12.5px var(--p-font) !important; color: var(--p-muted); background: var(--p-card); border: 1px dashed var(--p-border); }
.sp-closed[hidden] { display: none !important; }
/* ── #615 (owner): HISTORIAS tipo INSTAGRAM — un solo bloque (las capas #452…#607 se eliminaron). Marco 9:16 centrado (en el
   celular ocupa toda la pantalla; en pantallas anchas queda centrado con fondo negro), la FOTO COMPLETA sin recortes (contain) sobre
   el color de la historia (blanco = se ve de borde a borde), barras de progreso y marca arriba sobre un degradé, y abajo SÓLO el
   botón si la historia tiene link. Sin pie ni sello: el texto va dentro de la imagen y nada lo tapa. ── */
.story-viewer { background: #000 !important; --st-l: max(0px, calc(50% - 100dvh * 9 / 32)); }
.story-viewer .st-media { position: absolute !important; top: 0 !important; bottom: 0 !important; left: var(--st-l) !important; right: var(--st-l) !important; padding: 0 !important; margin: 0 !important; flex: none; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.story-viewer .st-media img, .story-viewer .st-media video { width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; object-fit: contain !important; object-position: center !important; border-radius: 0 !important; box-shadow: none !important; }
.story-viewer .st-media .st-blur { display: none !important; }
.story-viewer .st-media .st-textonly { height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; text-align: center; padding: 60px 26px; font: 900 26px/1.3 var(--p-font); color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,.45); }
.story-viewer::before { content: ""; position: absolute; top: 0; left: var(--st-l); right: var(--st-l); height: 120px; background: linear-gradient(180deg, rgba(0,0,0,.62), transparent); z-index: 3; pointer-events: none; }
.story-viewer .st-bars { position: absolute; top: calc(10px + env(safe-area-inset-top, 0px)) !important; left: calc(var(--st-l) + 10px) !important; right: calc(var(--st-l) + 10px) !important; display: flex; gap: 4px !important; z-index: 6; }
.story-viewer .st-bars i { flex: 1 1 0; height: 3px !important; border-radius: 999px !important; background: rgba(255,255,255,.35) !important; overflow: hidden; display: block; }
.story-viewer .st-bars i b { display: block; height: 100%; width: 0; background: #fff !important; border-radius: 999px; }
.story-viewer .st-bars i.done b { width: 100%; }
.story-viewer .st-head { position: absolute !important; top: calc(22px + env(safe-area-inset-top, 0px)) !important; left: calc(var(--st-l) + 12px) !important; right: calc(var(--st-l) + 12px) !important; bottom: auto !important; padding: 0 !important; margin: 0; background: transparent !important; display: flex !important; align-items: center; justify-content: space-between !important; gap: 10px; z-index: 6; }
.story-viewer .st-head .st-logo { display: flex !important; flex: 0 0 auto; }
.story-viewer .st-head .st-logo img { width: 32px !important; height: 32px !important; border-radius: 50% !important; border: 2px solid #fff !important; background: #000; display: block; }
.story-viewer .st-head .st-who { display: flex !important; flex-direction: row; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; }
.story-viewer .st-head .st-brand { font: 900 13.5px var(--p-font); letter-spacing: 1.2px; color: #fff; text-shadow: 0 1px 6px rgba(0,0,0,.7); }
.story-viewer .st-head .st-brand-sub, .story-viewer .st-head .st-title-hidden { display: none !important; }
.story-viewer .st-head #storyWhen { font: 600 11.5px var(--p-font); color: rgba(255,255,255,.8); text-shadow: 0 1px 6px rgba(0,0,0,.7); }
.story-viewer .st-close { width: 34px; height: 34px; border-radius: 50%; background: rgba(0,0,0,.35) !important; color: #fff !important; border: 0 !important; font-size: 18px; line-height: 34px; text-align: center; padding: 0; cursor: pointer; backdrop-filter: blur(4px); flex: 0 0 auto; }
.story-viewer .st-tap { position: absolute; inset: 0 !important; z-index: 4; }
.story-viewer .st-foot { position: absolute !important; left: var(--st-l) !important; right: var(--st-l) !important; bottom: 0 !important; top: auto !important; height: auto !important; min-height: 0 !important; padding: 10px 16px calc(16px + env(safe-area-inset-bottom, 0px)) !important; margin: 0; background: transparent !important; border: 0 !important; display: flex !important; flex-direction: column; align-items: center; gap: 8px; z-index: 5; pointer-events: none; }
.story-viewer .st-foot::before, .story-viewer .st-foot::after { display: none !important; }
.story-viewer .st-foot .st-brand-foot, .story-viewer .st-foot .st-caption { display: none !important; }
.story-viewer .st-link { pointer-events: auto; display: inline-block; width: calc(100% - 24px); max-width: 360px; text-align: center; background: var(--p-red) !important; color: #fff !important; border-radius: 999px !important; padding: 13px 18px !important; font: 900 14px var(--p-font) !important; letter-spacing: .2px; text-decoration: none !important; box-shadow: 0 8px 22px rgba(0,0,0,.35); }