/* ═══════════════════════════════════════════════════════════
   TITANPIPS — LIQUID GLASS THEME
   Loaded AFTER style.css / responsive.css / neumorphic.css.
   Everything here overrides the neumorphic layer, so removing
   the <link> to this file restores the old look instantly.
   ═══════════════════════════════════════════════════════════ */

:root {
  --g-bg-1:      #eef0fd;
  --g-bg-2:      #e3e8fb;
  --g-ink:       #2a2470;   /* headings, big numbers */
  --g-ink-2:     #5b49c9;   /* accent / links / active */
  --g-muted:     #6e6aa3;   /* labels, secondary text */
  --g-line:      rgba(255,255,255,.85);
  --g-glass:     rgba(255,255,255,.52);
  --g-glass-2:   rgba(255,255,255,.34);
  --g-shadow:    0 14px 40px rgba(104, 92, 196, .16);
  --g-shadow-sm: 0 6px 18px rgba(104, 92, 196, .13);
  --g-grad:      linear-gradient(135deg, #b39bff 0%, #8fa8ff 55%, #7ed3fb 100%);
  --g-grad-btn:  linear-gradient(135deg, #7a63e8 0%, #5b8bf0 100%);
  --g-blur:      blur(18px) saturate(1.4);

  /* re-point the legacy tokens so every old rule inherits the new palette */
  --neu-bg:       transparent;
  --neu-text:     var(--g-ink);
  --neu-text2:    var(--g-muted);
  --neu-text3:    #9c98c7;
  --neu-blue:     var(--g-ink-2);
  --blue:         #5b49c9;
  --blue-light:   #8fa8ff;
  --blue-pale:    rgba(143,168,255,.18);
  --blue-dark:    #3f31a8;
  --text:         var(--g-ink);
  --muted:        var(--g-muted);
  --border:       rgba(255,255,255,.7);
  --green:        #14a37f;
  --green-pale:   rgba(20,163,127,.12);
  --red:          #e0526b;
  --red-pale:     rgba(224,82,107,.12);
  --gold:         #c98a1a;
  --gold-pale:    rgba(201,138,26,.13);
  --radius:       22px;
  --radius-lg:    30px;
}

/* ── PAGE BACKGROUND ─────────────────────────────────────── */
html { background: var(--g-bg-1); height: auto !important; }
body { height: auto !important; min-height: 100vh; min-height: 100dvh; }
body {
  color: var(--g-ink) !important;
  background:
    radial-gradient(520px 420px at 8% 4%,   rgba(206,184,255,.55), transparent 70%),
    radial-gradient(560px 460px at 96% 18%, rgba(160,214,255,.50), transparent 70%),
    radial-gradient(520px 520px at 20% 96%, rgba(255,200,236,.38), transparent 70%),
    linear-gradient(180deg, var(--g-bg-1), var(--g-bg-2)) !important;
}

/* ── GLASS SURFACES ──────────────────────────────────────── */
.card, .chart-card, .plan-card, .admin-stat-card, .modal-box,
.top-header, .auth-card, .support-option, .profile-card,
.table-wrap, .form-section, .ref-box, .stat-card {
  background: rgba(255,255,255,.66) !important;
  border: 1.5px solid var(--g-line) !important;
  border-radius: 28px !important;
  box-shadow: var(--g-shadow), inset 0 1px 0 rgba(255,255,255,.9) !important;
  color: var(--g-ink);
}
.card:hover, .plan-card:hover, .plan-card.selected {
  transform: translateY(-2px) !important;
  box-shadow: 0 18px 46px rgba(104,92,196,.2), inset 0 1px 0 rgba(255,255,255,.9) !important;
}
.plan-card.featured {
  box-shadow: var(--g-shadow), 0 0 0 2px rgba(122,99,232,.55) !important;
}
.card-title, .tx-date, .form-hint, .card-label { color: var(--g-muted) !important; }
.card-value, .section-title, .chart-title, .tx-name, .page-title,
.plan-name, .modal-title, h1, h2, h3 { color: var(--g-ink) !important; }
.card-icon, .card-icon.blue, .card-icon.green, .card-icon.gold, .card-icon.red {
  background: rgba(255,255,255,.6) !important;
  box-shadow: inset 0 1px 0 #fff, 0 4px 12px rgba(104,92,196,.14) !important;
  color: var(--g-ink-2);
  border-radius: 14px !important;
}
.section-link { color: var(--g-ink-2) !important; font-weight: 600; }

/* ── DESKTOP SIDEBAR ─────────────────────────────────────── */
.sidebar {
  background: rgba(247,246,255,.9) !important;
  border-right: 1.5px solid var(--g-line) !important;
  box-shadow: 8px 0 40px rgba(104,92,196,.1) !important;
}
.brand-logo, .brand-logo-sm {
  background: var(--g-grad) !important;
  color: #fff !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 16px rgba(122,99,232,.35), inset 0 1px 0 rgba(255,255,255,.55) !important;
}
.brand-name {
  background: none !important;
  -webkit-text-fill-color: var(--g-ink-2) !important;
  color: var(--g-ink-2) !important;
}
.brand-tagline, .nav-label { color: var(--g-muted) !important; }
a.nav-item, .nav-item { color: var(--g-muted) !important; border-radius: 16px !important; }
a.nav-item:hover, .nav-item:hover {
  background: rgba(255,255,255,.6) !important;
  color: var(--g-ink) !important;
  box-shadow: var(--g-shadow-sm) !important;
}
a.nav-item.active, .nav-item.active {
  background: rgba(255,255,255,.8) !important;
  color: var(--g-ink-2) !important;
  box-shadow: var(--g-shadow-sm), inset 0 1px 0 #fff !important;
}
.sidebar-user {
  background: rgba(255,255,255,.55) !important;
  box-shadow: inset 0 1px 0 #fff, var(--g-shadow-sm) !important;
  border-radius: 18px !important;
}
.sidebar-user-name { color: var(--g-ink) !important; }
.sidebar-user-email { color: var(--g-muted) !important; }
.sidebar-avatar, .user-chip-avatar { background: var(--g-grad) !important; color: #fff !important; box-shadow: none !important; }

/* ── ICON BUTTONS / HEADER CHIPS ─────────────────────────── */
.icon-btn {
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50% !important;
  background: rgba(255,255,255,.62) !important;
  color: var(--g-ink-2) !important;
  border: 1.5px solid var(--g-line) !important;
  box-shadow: var(--g-shadow-sm), inset 0 1px 0 #fff !important;
  position: relative;
}
.icon-btn.wa { color: #1fa855 !important; }
.icon-btn.wa i { font-size: 1.2em; }
.icon-btn:hover { background: #fff !important; color: var(--g-ink-2) !important; }
.icon-btn .badge { background: #e0526b !important; color: #fff !important; }
.user-chip {
  background: rgba(255,255,255,.62) !important;
  border: 1.5px solid var(--g-line) !important;
  border-radius: 999px !important;
  color: var(--g-ink) !important;
}

/* ── MOBILE HEADER ───────────────────────────────────────── */
.mobile-header {
  box-shadow: none !important;
  border: none !important;
  padding: 14px 18px 10px !important;
  background: rgba(238,240,253,.9) !important;
}
.mh-row { display: flex; justify-content: space-between; align-items: center; }
.mh-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.mh-logo {
  width: 44px; height: 44px; border-radius: 15px;
  background: var(--g-grad);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 800; font-size: 15px; letter-spacing: .3px;
  box-shadow: 0 8px 18px rgba(122,99,232,.35), inset 0 1px 0 rgba(255,255,255,.6);
}
.mh-name { font-size: 20px; font-weight: 700; color: var(--g-ink-2); }
.mh-actions { display: flex; gap: 10px; }
.mh-actions .icon-btn { width: 46px; height: 46px; font-size: 17px; text-decoration: none; }
.mh-actions .icon-btn.mh-avatar { font-size: 14px; font-weight: 600; letter-spacing: .3px; }

/* ── MOBILE BOTTOM TABS (floating glass bar) ─────────────── */
.mobile-tabs {
  background: rgba(255,255,255,.82) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  -webkit-transform: translateZ(0); transform: translateZ(0);
  border: 1.5px solid var(--g-line) !important;
  border-radius: 28px !important;
  box-shadow: var(--g-shadow), inset 0 1px 0 #fff !important;
  left: 12px !important; right: 12px !important;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  width: auto !important;
  padding: 8px 6px !important;
}
a.tab-btn, .tab-btn { color: #7d79b5 !important; }
a.tab-btn.active, .tab-btn.active { color: var(--g-ink-2) !important; font-weight: 600; }
.tab-btn.active .tab-icon { filter: drop-shadow(0 3px 8px rgba(91,73,201,.35)); }
.tab-btn span:last-child { font-size: 11px; font-weight: 500; }

/* ── HERO CARD (iridescent glass) ────────────────────────── */
.hero-card.glass-hero {
  position: relative; overflow: hidden;
  color: var(--g-ink);
  padding: 26px 24px 22px !important;
  border-radius: 34px !important;
  border: 1.5px solid rgba(255,255,255,.95) !important;
  background:
    radial-gradient(260px 200px at 22% 38%, rgba(160,206,255,.75), transparent 70%),
    radial-gradient(240px 220px at 70% 62%, rgba(203,178,255,.70), transparent 70%),
    radial-gradient(200px 160px at 38% 88%, rgba(255,196,232,.60), transparent 70%),
    radial-gradient(220px 160px at 88% 90%, rgba(150,225,250,.55), transparent 70%),
    linear-gradient(145deg, rgba(255,255,255,.78), rgba(236,232,255,.62)) !important;
  box-shadow: 0 18px 48px rgba(104,92,196,.22), inset 0 2px 0 #fff, inset 0 -10px 30px rgba(255,255,255,.35) !important;
}
.hero-card.glass-hero::before, .hero-card.glass-hero::after { display: none !important; }
.gh-bubble { position: absolute; pointer-events: none; border-radius: 50%; }
.gh-bubble-a {
  top: -34px; right: -48px; width: 62%; aspect-ratio: 1.05;
  border-radius: 46% 54% 50% 50% / 52% 46% 54% 48%;
  background: linear-gradient(160deg, rgba(255,255,255,.55), rgba(255,255,255,.08));
  border: 1.5px solid rgba(255,255,255,.9);
  box-shadow: inset 0 0 40px rgba(255,255,255,.55), 0 10px 30px rgba(104,92,196,.1);
}
.gh-bubble-b {
  left: -34px; bottom: 16px; width: 120px; height: 120px;
  background: radial-gradient(circle at 30% 28%, rgba(255,255,255,.7), rgba(255,255,255,.12) 62%);
  border: 1.5px solid rgba(255,255,255,.85);
  box-shadow: inset 0 0 26px rgba(255,255,255,.5);
}
.glass-hero > *:not(.gh-bubble) { position: relative; z-index: 2; }

.gh-top { display: flex; justify-content: space-between; align-items: flex-start; }
.glass-hero .hero-greeting { font-size: 17px; font-weight: 400; color: var(--g-muted); opacity: 1; margin-bottom: 2px; }
.glass-hero .hero-name { font-size: 24px; font-weight: 700; color: var(--g-ink); margin-bottom: 0; }
.gh-status {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 16px; border-radius: 999px;
  font-size: 14px; font-weight: 600; color: var(--g-ink-2);
  background: rgba(255,255,255,.6);
  border: 1.5px solid rgba(255,255,255,.95);
  box-shadow: 0 4px 12px rgba(104,92,196,.12), inset 0 1px 0 #fff;
}
.gh-dot { width: 8px; height: 8px; border-radius: 50%; background: #8b7cf0; }
.gh-status.on .gh-dot { background: #22c58b; animation: ghPulse 2s infinite; }
@keyframes ghPulse { 0%,100% { opacity: 1; } 50% { opacity: .45; } }

.gh-balances { display: flex; justify-content: space-between; align-items: flex-end; margin: 26px 0 10px; }
.gh-label { font-size: 12.5px; font-weight: 600; letter-spacing: .09em; color: var(--g-muted); text-transform: uppercase; margin-bottom: 4px; }
.gh-amount { font-size: 38px; font-weight: 700; line-height: 1.1; color: var(--g-ink-2); letter-spacing: -.5px; }
.gh-balances > div:last-child { text-align: right; }

.gh-chart { position: relative; height: 170px; margin: 6px 0 12px; }
.gh-empty { min-height: 90px; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 15px; color: var(--g-ink); padding: 8px 0 18px; }

.gh-tf { display: flex; gap: 6px; margin-bottom: 14px; overflow-x: auto; padding: 2px 2px 6px; scrollbar-width: none; }
.gh-tf::-webkit-scrollbar { display: none; }
.gh-tf a {
  padding: 8px 12px; border-radius: 999px; font-size: 14px; font-weight: 500; white-space: nowrap;
  color: var(--g-ink); text-decoration: none;
  background: rgba(255,255,255,.55);
  border: 1.5px solid rgba(255,255,255,.95);
  box-shadow: 0 4px 12px rgba(104,92,196,.1), inset 0 1px 0 #fff;
}
.gh-tf a.on {
  color: var(--g-ink-2); font-weight: 600;
  background: linear-gradient(135deg, rgba(200,185,255,.85), rgba(160,214,255,.8));
}
.gh-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.gh-pill {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 9px 16px; border-radius: 999px; font-size: 15px; font-weight: 600; color: var(--g-ink);
  background: rgba(255,255,255,.6); border: 1.5px solid rgba(255,255,255,.95);
  box-shadow: 0 4px 12px rgba(104,92,196,.1), inset 0 1px 0 #fff;
}
.gh-pill.up   { color: #0f8f6c; }
.gh-pill.down { color: #d04560; }
.gh-expiry { text-align: right; }
.gh-expiry small { display: block; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--g-muted); }
.gh-expiry strong { font-size: 15px; font-weight: 700; color: var(--g-ink); }
.gh-expiry strong.warn { color: #d04560; }

/* ── NOTICE CARD ("Not earning yet") ─────────────────────── */
.gh-notice {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 18px 20px; margin-bottom: 16px;
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,255,255,.78), rgba(226,222,255,.6));
  border: 1.5px solid var(--g-line);
  box-shadow: var(--g-shadow), inset 0 1px 0 #fff;
}
.gh-notice-title { display: flex; align-items: center; gap: 8px; font-size: 17px; font-weight: 700; color: var(--g-ink-2); margin-bottom: 4px; }
.gh-notice-text { font-size: 14px; color: var(--g-ink); line-height: 1.45; }
.gh-notice-text + .gh-notice-text { margin-top: 6px; }
.gh-notice-btn {
  flex-shrink: 0; padding: 12px 20px; border-radius: 999px; text-decoration: none; white-space: nowrap;
  font-size: 15px; font-weight: 600; color: var(--g-ink-2);
  background: rgba(255,255,255,.7); border: 1.5px solid rgba(255,255,255,.95);
  box-shadow: 0 6px 16px rgba(104,92,196,.16), inset 0 1px 0 #fff;
}

/* ── QUICK ACTIONS ───────────────────────────────────────── */
.action-grid { gap: 12px !important; }
.action-item {
  background: rgba(255,255,255,.66) !important;
  border: 1.5px solid var(--g-line) !important;
  border-radius: 26px !important;
  box-shadow: var(--g-shadow-sm), inset 0 1px 0 #fff !important;
  padding: 16px 6px 14px !important;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
}
.action-item:hover { transform: translateY(-2px) !important; background: rgba(255,255,255,.7) !important; }
.action-icon {
  width: 56px !important; height: 56px !important;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px !important; color: var(--g-ink-2);
  background: linear-gradient(145deg, rgba(220,210,255,.85), rgba(190,222,255,.75)) !important;
  border: 1.5px solid rgba(255,255,255,.95);
  border-radius: 18px !important;
  box-shadow: 0 6px 14px rgba(104,92,196,.18), inset 0 1px 0 #fff !important;
  margin: 0 !important;
}
.action-item:hover .action-icon { background: linear-gradient(145deg, rgba(200,188,255,.95), rgba(170,208,255,.9)) !important; color: var(--g-ink-2) !important; box-shadow: 0 6px 14px rgba(104,92,196,.22), inset 0 1px 0 #fff !important; }
.action-label { color: var(--g-ink) !important; font-size: 14px !important; font-weight: 500 !important; }

/* ── TRANSACTION / TRADE ROWS ────────────────────────────── */
.tx-item { border-bottom: 1px solid rgba(120,108,210,.12) !important; }
.tx-icon {
  width: 42px; height: 42px; border-radius: 14px !important;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; color: var(--g-ink-2);
  background: rgba(255,255,255,.65) !important;
  box-shadow: inset 0 1px 0 #fff, 0 4px 10px rgba(104,92,196,.12);
}
.tx-icon.win  { color: #0f8f6c; }
.tx-icon.loss { color: #d04560; }
.tx-amount.positive { color: #0f8f6c !important; }
.tx-amount.negative { color: #d04560 !important; }

/* ── STATUS CHIPS ────────────────────────────────────────── */
.status, .card-badge {
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.9);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
.badge-blue  { background: rgba(143,168,255,.22) !important; color: var(--g-ink-2) !important; }
.badge-green { background: rgba(20,163,127,.14) !important; color: #0f8f6c !important; }
.badge-gold  { background: rgba(201,138,26,.15) !important; color: #a8730d !important; }

/* ── BUTTONS ─────────────────────────────────────────────── */
.btn { border-radius: 999px !important; font-weight: 600 !important; }
.btn-primary {
  background: var(--g-grad-btn) !important; color: #fff !important; border: none !important;
  box-shadow: 0 10px 24px rgba(104,92,196,.34), inset 0 1px 0 rgba(255,255,255,.4) !important;
}
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 30px rgba(104,92,196,.4), inset 0 1px 0 rgba(255,255,255,.4) !important; }
.btn-secondary {
  background: rgba(255,255,255,.65) !important; color: var(--g-ink-2) !important;
  border: 1.5px solid rgba(255,255,255,.95) !important;
  box-shadow: var(--g-shadow-sm), inset 0 1px 0 #fff !important;
}
.btn-secondary:hover { color: var(--g-ink) !important; border-color: #fff !important; }
.btn-outline-blue { color: var(--g-ink-2) !important; border-color: rgba(122,99,232,.5) !important; }
.btn-outline-blue:hover { background: var(--g-ink-2) !important; color: #fff !important; }
.btn-success { background: linear-gradient(135deg, #2bc9a0, #14a37f) !important; box-shadow: 0 10px 24px rgba(20,163,127,.3) !important; }
.btn-danger  { background: linear-gradient(135deg, #f0708a, #d04560) !important; box-shadow: 0 10px 24px rgba(208,69,96,.3) !important; }
.period-btn {
  background: rgba(255,255,255,.6) !important; color: var(--g-muted) !important;
  border: 1.5px solid rgba(255,255,255,.95) !important; border-radius: 999px !important;
  box-shadow: 0 4px 12px rgba(104,92,196,.1), inset 0 1px 0 #fff !important;
}
.period-btn.active { color: var(--g-ink-2) !important; background: linear-gradient(135deg, rgba(200,185,255,.85), rgba(160,214,255,.8)) !important; }

/* ── FORMS ───────────────────────────────────────────────── */
.form-label { color: var(--g-ink) !important; font-weight: 600; }
.form-input, input[type=text], input[type=email], input[type=password],
input[type=number], input[type=tel], select, textarea {
  background: rgba(255,255,255,.62) !important;
  border: 1.5px solid rgba(255,255,255,.95) !important;
  border-radius: 18px !important;
  color: var(--g-ink) !important;
  box-shadow: inset 0 2px 6px rgba(104,92,196,.08) !important;
}
.form-input:focus, input:focus, select:focus, textarea:focus {
  outline: none !important;
  border-color: rgba(122,99,232,.65) !important;
  box-shadow: 0 0 0 4px rgba(122,99,232,.15), inset 0 2px 6px rgba(104,92,196,.06) !important;
}
.form-input::placeholder { color: #a5a1cc !important; }
.input-icon { color: var(--g-muted); }

/* ── TABLES ──────────────────────────────────────────────── */
table { color: var(--g-ink); }
th { color: var(--g-muted) !important; background: rgba(255,255,255,.4) !important; }
td { border-color: rgba(120,108,210,.1) !important; }
tr:hover td { background: rgba(255,255,255,.35) !important; }

/* ── GRADIENT BANNERS (referral, profile, about, downloads) ─ */
.ref-card, .profile-header {
  background:
    radial-gradient(260px 200px at 18% 30%, rgba(160,206,255,.7), transparent 70%),
    radial-gradient(240px 220px at 80% 70%, rgba(203,178,255,.65), transparent 70%),
    linear-gradient(145deg, rgba(255,255,255,.75), rgba(236,232,255,.6)) !important;
  color: var(--g-ink) !important;
  border: 1.5px solid rgba(255,255,255,.95) !important;
  border-radius: 32px !important;
  box-shadow: var(--g-shadow), inset 0 2px 0 #fff !important;
}
.ref-card *, .profile-header * { color: inherit; }
.profile-avatar-big { background: var(--g-grad) !important; color: #fff !important; border: 3px solid #fff !important; }

/* ── TOASTS / MODALS ─────────────────────────────────────── */
.toast { border-radius: 18px !important; box-shadow: var(--g-shadow) !important; }
.modal-overlay { background: rgba(60,50,130,.28) !important; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.modal-close { background: rgba(255,255,255,.7) !important; color: var(--g-ink) !important; }

/* ── AUTH PAGES (login / register / forgot / reset) ──────── */
.auth-card { padding: 34px 30px !important; border-radius: 34px !important; }
.auth-card a { color: var(--g-ink-2); }
.auth-logo {
  width: 48px; height: 48px; border-radius: 16px; background: var(--g-grad);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 800; font-size: 16px;
  box-shadow: 0 8px 18px rgba(122,99,232,.35), inset 0 1px 0 rgba(255,255,255,.6);
}

/* ── MOBILE TUNING ───────────────────────────────────────── */
@media (max-width: 768px) {
  .main-content { padding: 84px 16px 118px !important; min-width: 0 !important; }
  .chart-card, .card { padding: 18px !important; }
  .action-icon { width: 54px !important; height: 54px !important; font-size: 21px !important; }
  .action-label { font-size: 13px !important; }
}
@media (max-width: 380px) {
  .gh-amount { font-size: 31px; }
  .gh-tf a { padding: 7px 12px; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .gh-status.on .gh-dot { animation: none; }
}

/* ── LOGIN PAGE polish ───────────────────────────────────── */
.auth-shell { position: relative; }
.auth-back { color: var(--g-muted) !important; }
.auth-card { background: rgba(255,255,255,.72) !important; }
.auth-title { color: var(--g-ink); }
.auth-field > i.lead, .auth-field .eye-btn { color: #7a63e8; }
.auth-field .form-input { padding-left: 46px !important; }
.auth-error { border-radius: 18px; }

/* ── LEFTOVER NEUMORPHIC INLINE STYLES (older pages) ─────── */
[style*="c5cad4"]:not([style*="linear-gradient"]):not([style*="background:#"]) {
  box-shadow: inset 0 2px 6px rgba(104,92,196,.14), 0 0 0 1.5px rgba(255,255,255,.9) !important;
  background: rgba(255,255,255,.55) !important;
}
[style*="linear-gradient(90deg,#1B6FE8,#00C48C)"] { background: linear-gradient(90deg,#8f7cf5,#6fc8f7) !important; }
[style*="linear-gradient(135deg,#1B6FE8,#0057cc)"],
[style*="linear-gradient(135deg,#1B6FE8,#1454B8)"] { background: var(--g-grad-btn) !important; border-radius: 999px !important; box-shadow: 0 10px 24px rgba(104,92,196,.3) !important; }
[style*="color:#1B6FE8"], [style*="color:var(--blue)"] { color: var(--g-ink-2) !important; }
.card-badge.badge-gold { background: rgba(255,214,140,.5) !important; color: #8a5a00 !important; }
.card-badge.badge-blue { background: rgba(143,168,255,.25) !important; color: var(--g-ink-2) !important; }
.card-badge.badge-red  { background: rgba(224,82,107,.14) !important; color: #c23552 !important; }

/* decorative circles on hero cards must never swallow taps meant for the buttons */
.hero-card::before, .hero-card::after { pointer-events: none; }
.hero-card .hero-actions, .hero-card .hero-btn { position: relative; z-index: 2; }

.auth-card a.google-btn{color:#1f2430;}