/* ===== Robinhood dark theme — app pages (build / board / how-it-works / history) ===== */
html, body { background:#000 !important; color:#fff !important; }

/* --- white / light-gray surfaces -> black & consistent dark --- */
.bg-base, .bg-white { background-color:#000 !important; }
.bg-base\/85 { background-color:rgba(0,0,0,.82) !important; }
.bg-base\/90 { background-color:rgba(0,0,0,.9) !important; }
.surface, .bg-surface-1 { background-color:#0b0d0b !important; border-color:rgba(255,255,255,.12) !important; }
.bg-surface-2 { background-color:#000 !important; border-color:rgba(255,255,255,.12) !important; }
.bg-surface-3 { background-color:#000 !important; border-color:rgba(255,255,255,.12) !important; }
.field { background-color:#111311 !important; border-color:rgba(255,255,255,.16) !important; color:#fff !important; }
.field::placeholder { color:rgba(255,255,255,.4) !important; }
.btn-primary { background-color:#15180f !important; color:#fff !important; border-color:rgba(255,255,255,.16) !important; }

/* footer / ground surface -> solid lime panel (like the board panel) */
.bg-ground { background-color:#ccff00 !important; }

/* bottom stake-summary card (rounded-panel.bg-ground) -> solid lime CTA card,
   dark text, and a dark CONNECT WALLET button so it doesn't blend on lime */
.rounded-panel.bg-ground { background-color:#ccff00 !important; }
.rounded-panel.bg-ground * { color:#0a0d02 !important; }
.rounded-panel.bg-ground .btn-lime, .rounded-panel.bg-ground .btn-primary {
  background-color:#0a0d02 !important; border-color:#0a0d02 !important; color:#ccff00 !important;
}
.rounded-panel.bg-ground .btn-lime *, .rounded-panel.bg-ground .btn-primary * { color:#ccff00 !important; }
.rounded-panel.bg-ground [class*="border"] { border-color:rgba(10,13,2,.3) !important; }

/* --- borders / lines --- */
.bg-line { background-color:rgba(255,255,255,.10) !important; }
.border-line { border-color:rgba(255,255,255,.12) !important; }
.border-ink  { border-color:rgba(255,255,255,.28) !important; }

/* --- text: dark ink -> white; keep white text white --- */
.text-ink, .text-ground { color:#fff !important; }
.text-ground\/70 { color:rgba(255,255,255,.72) !important; }
.text-ground\/80 { color:rgba(255,255,255,.82) !important; }
.text-base, .text-white { color:#fff !important; }
.text-white\/40 { color:rgba(255,255,255,.4) !important; }
.text-white\/50 { color:rgba(255,255,255,.5) !important; }
.text-white\/60 { color:rgba(255,255,255,.6) !important; }
.tab { color:rgba(255,255,255,.55) !important; }

/* --- dark button surface --- */
.bg-ink { background-color:#16150e !important; color:#fff !important; }

/* --- lime accents (text/borders on dark) --- */
.text-lime, .text-moss { color:#ccff00 !important; }
.border-lime, .border-moss { border-color:#ccff00 !important; }

/* --- solid lime panels & buttons: lime bg, ALL descendant text dark --- */
.bg-lime, .bg-moss, .btn-lime { background-color:#ccff00 !important; }
.bg-lime, .bg-lime *, .bg-moss, .bg-moss *, .btn-lime, .btn-lime * { color:#0a0d02 !important; }
.btn-lime:hover { background-color:#c2f000 !important; }

/* the "to win / connect wallet" bar: solid lime, dark text ... */
.bg-lime-wash { background-color:#ccff00 !important; }
.bg-lime-wash * { color:#0a0d02 !important; }
/* ... and its lime button flips to dark so it doesn't blend into the lime bar */
.bg-lime-wash .btn-lime, .bg-lime-wash .btn-primary {
  background-color:#0a0d02 !important; color:#ccff00 !important; border-color:#0a0d02 !important;
}
.bg-lime-wash .btn-lime *, .bg-lime-wash .btn-primary * { color:#ccff00 !important; }

/* buttons & accent dots INSIDE a solid lime panel -> dark so they contrast on lime */
.bg-lime .btn-lime, .bg-lime .btn-ghost, .bg-lime .btn-primary,
.bg-moss .btn-lime, .bg-moss .btn-ghost, .bg-moss .btn-primary {
  background-color:#0a0d02 !important; color:#ccff00 !important; border-color:#0a0d02 !important;
}
.bg-lime .btn-lime *, .bg-lime .btn-ghost *, .bg-lime .btn-primary * { color:#ccff00 !important; }
.bg-lime .bg-moss, .bg-lime .bg-lime { background-color:#0a0d02 !important; }
.bg-lime [class*="border"] { border-color:rgba(10,13,2,.35) !important; }

/* --- muted grays readable on dark --- */
.text-neutral-400, .text-gray-400, .text-zinc-400,
.text-neutral-500, .text-gray-500,
.text-ink-faint { color:rgba(255,255,255,.6) !important; }

/* ===== FINAL: lime containers always get readable dark text =====
   (the earlier ".bg-lime *" rules tie with .text-* utilities on specificity;
   these descendant selectors win by specificity AND source order) */
.bg-lime [class*="text-"], .bg-lime .smallcaps,
.bg-lime-wash [class*="text-"], .bg-lime-wash .smallcaps,
.rounded-panel.bg-ground [class*="text-"], .rounded-panel.bg-ground .smallcaps,
footer.bg-ground, footer.bg-ground [class*="text-"], footer.bg-ground .smallcaps {
  color:#0a0d02 !important;
}
/* buttons inside lime containers: dark bg + lime text (placed last to win) */
.bg-lime .btn-lime, .bg-lime .btn-ghost, .bg-lime .btn-primary,
.bg-lime-wash .btn-lime, .bg-lime-wash .btn-primary,
.rounded-panel.bg-ground .btn-lime, .rounded-panel.bg-ground .btn-primary,
footer.bg-ground .btn-lime, footer.bg-ground .btn-primary {
  background-color:#0a0d02 !important; border-color:#0a0d02 !important; color:#ccff00 !important;
}

/* ===== Mobile: kill the "flying" sticky header (iOS sticky+blur jank) ===== */
@media (max-width: 768px) {
  header.sticky, .bleed.sticky {
    position: static !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

/* header logo mark -> Binkl green mask (safety: if any app header renders the old face SVG) */
.header_logo__LRIT_{
  background:url("/landing/illustrations/logo-mark.png") center/contain no-repeat !important;
}
.header_logo__LRIT_ > *{ visibility:hidden !important; }

