/* MassaCoin — R303: PARTE SUPERIOR da tela principal (referência: cartão de saldo claro com brilho dourado e moedas à direita,
   botões de operação em blocos azul→dourado com ícone dourado grande, painel azul com texto dourado).
   SOMENTE apresentação (CSS): mesmos textos, mesmos links, mesmos botões e funções (saldo, ⓘ, Pagar, Transferir, Receber, Extrato, Cartões, Cadastre-se). */
:root { --vt-text: #11296a; --vt-navy: var(--mc-p-dark, #0A4D8C); --vt-blue: var(--mc-p, #1D70B8); --vt-gold: #e0b44a; --vt-gold-2: #f4d77d; --vt-ink: #0b1b3f; }
:root[data-mc-paleta="padrao"] { --vt-blue: #2A6AC0; --vt-navy: #174C9C; }   /* azul royal da imagem de referência (só no tema padrão; os outros temas seguem a cor escolhida) */

/* ---------- Cabeçalho ---------- */
html body .wrap > header.header.header { background: linear-gradient(180deg, var(--vt-blue) 0%, var(--vt-navy) 100%) !important; background-image: linear-gradient(180deg, var(--vt-blue) 0%, var(--vt-navy) 100%) !important; }
html body .wrap > .header { padding: 14px 16px; margin: 10px 14px 0; border-radius: 26px; box-shadow: 0 10px 24px color-mix(in srgb, var(--vt-navy) 22%, transparent), inset 0 1px 0 rgba(255,255,255,.18); border: 1px solid color-mix(in srgb, var(--vt-gold) 45%, transparent); }
html body .wrap > .header .brand__name { font-weight: 800; letter-spacing: .01em; font-size: clamp(22px, 6.6vw, 30px); }
html body .wrap > .header .lang-select__btn { border: 1px solid color-mix(in srgb, var(--vt-gold-2) 75%, transparent); box-shadow: 0 2px 8px rgba(0,0,0,.18); }

/* ---------- Cartão de saldo: texto à esquerda, moedas à direita, brilho dourado ---------- */
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "label coins" "value value" "note note"; column-gap: 8px; align-items: center; text-align: left;
  margin: 12px 26px 22px; padding: 20px 18px 18px; border-radius: 30px; overflow: hidden;
  background: radial-gradient(120% 140% at 85% 20%, #fff3c9 0%, rgba(255,243,201,0) 55%), linear-gradient(135deg, #ffffff 0%, #f3f7ff 55%, #fbeec3 100%) !important;
  border: 1px solid color-mix(in srgb, var(--vt-gold) 60%, transparent) !important;
  box-shadow: 0 0 0 12px color-mix(in srgb, var(--vt-blue) 45%, var(--vt-navy)), 0 0 0 13px color-mix(in srgb, var(--vt-gold-2) 55%, transparent), 0 20px 40px color-mix(in srgb, var(--vt-navy) 40%, transparent), 0 0 36px rgba(244,215,125,.6) !important;
}
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-balance__label { grid-area: label; align-self: end; margin: 0; text-align: left; font-size: 12.5px; font-weight: 800; letter-spacing: .12em; color: var(--vt-text) !important; -webkit-text-fill-color: var(--vt-text) !important; opacity: 1; }
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-balance__value { grid-area: value; justify-content: flex-start; margin: 8px 0 6px; font-size: 40px; }
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-balance__value, html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-balance__value * { color: var(--vt-text) !important; -webkit-text-fill-color: var(--vt-text) !important; }
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-balance__value small { color: var(--vt-blue) !important; -webkit-text-fill-color: var(--vt-blue) !important; }
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-balance__pop { grid-column: 1 / -1; }
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-balance__note { grid-area: note; margin: 6px 0 0; max-width: none; text-align: left; font-size: 11px; letter-spacing: .05em; font-weight: 700; color: rgba(11,27,63,.72) !important; -webkit-text-fill-color: rgba(11,27,63,.72) !important; }
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-coins { grid-area: coins; --c: clamp(60px, 19vw, 96px); width: calc(var(--c) * 2.15); height: calc(var(--c) * 1.25); margin: 0; filter: drop-shadow(0 8px 12px rgba(150,110,20,.35)) !important; }
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-coins::before { background: radial-gradient(closest-side, rgba(244,215,125,.7) 0%, rgba(244,215,125,0) 100%); }
html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-coins::after { display: none; }
@media (min-width: 700px) { html body .wrap > section.balance.mc-balance:not(.mc-balance--hub) .mc-balance__value { font-size: 46px; } }

/* ---------- Botões de operação: blocos azul→dourado com ícone dourado grande ---------- */
html body .wrap > .quick-actions, html body .wrap > .shortcuts { gap: 12px; }
html body .quick-actions .btn-pill, html body .shortcuts .shortcut {
  flex-direction: column !important; justify-content: space-between; gap: 10px; min-height: 112px; padding: 14px 6px 12px !important; border-radius: 24px !important;
  background: linear-gradient(180deg, var(--vt-blue) 0%, color-mix(in srgb, var(--vt-blue) 55%, #fff) 42%, #f7e6b0 100%) !important; border: 1px solid color-mix(in srgb, var(--vt-gold) 60%, transparent) !important;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--vt-navy) 22%, transparent), inset 0 1px 0 rgba(255,255,255,.35) !important; color: var(--vt-ink) !important;
}
html body .quick-actions .btn-pill__icon, html body .shortcuts .shortcut__icon {
  width: 48px; height: 48px; border-radius: 16px; display: grid !important; place-items: center; background: linear-gradient(145deg, #fff0b8, var(--vt-gold)) !important; color: var(--vt-ink) !important;
  box-shadow: 0 6px 12px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.7); filter: none;
}
html body .quick-actions .btn-pill__icon svg, html body .shortcuts .shortcut__icon svg { width: 26px; height: 26px; stroke: var(--vt-ink) !important; }
html body .quick-actions .btn-pill__label, html body .shortcuts .shortcut span:not(.shortcut__icon) { color: var(--vt-ink) !important; font-weight: 800; font-size: 13px; letter-spacing: .02em; }
html body .quick-actions .btn-pill:hover, html body .shortcuts .shortcut:hover { transform: translateY(-2px); }

/* ---------- Painel azul com texto dourado (Cadastre-se) ---------- */
html body a#homeSignup.cta-participar.home-signup { border-radius: 24px !important; padding: 18px 16px !important; background: linear-gradient(180deg, var(--vt-blue), var(--vt-navy)) !important; color: var(--vt-gold-2) !important; -webkit-text-fill-color: var(--vt-gold-2) !important; font-weight: 800; letter-spacing: .03em; border: 1px solid color-mix(in srgb, var(--vt-gold) 70%, transparent) !important; box-shadow: 0 12px 26px color-mix(in srgb, var(--vt-navy) 30%, transparent), inset 0 1px 0 rgba(255,255,255,.18) !important; text-shadow: 0 1px 6px rgba(0,0,0,.35); }
html body .section-heading--hero .hero-title { color: var(--vt-navy); font-weight: 800; }
@media (prefers-reduced-motion: reduce) { html body .quick-actions .btn-pill, html body .shortcuts .shortcut { transition: none; } }

/* ---------- Banner patrocinado: mesmo azul do tema (mantém texto, link e botão) ---------- */
html body #adBannerTop .ad-banner__go { background: linear-gradient(180deg, var(--vt-blue), var(--vt-navy)) !important; background-image: linear-gradient(180deg, var(--vt-blue), var(--vt-navy)) !important; border: 1px solid color-mix(in srgb, var(--vt-gold) 60%, transparent); }
html body #adBannerTop .ad-banner__tag { background: var(--vt-blue) !important; }
