/* homepage-ivory.css — the whole homepage in Ivory day.
   Martin, 2026-09-14: "like the surface of water, when you walk at the beach… shimmering". Loaded LAST on the homepage
   only. Every rule is scoped to light theme on the landing page, which is the homepage default for visitors who never
   chose a theme; dark mode and every other page are untouched.
   Each block below fixes a pattern the light-mode contrast audit measured (text below 3:1 against its real background). */
:root{--iv-ground:#F1F1EC;--iv-surface:#FBFAF6;--iv-ink:#1B1F24;--iv-ink2:#4A5058;--iv-silver:#5E656D;--iv-gold:#A8832B;--iv-gold-deep:#7C5B0F;--iv-line:#DAD9D1}
/* 2026-09-15 sweep: silver #6B737C read 4.02:1 on the raised ivory and gold-deep #8C6C20 4.10:1; now #5E656D (4.93:1 min) and #7C5B0F (4.68:1 min, incl. the pink hologram cards #EBDAE9/#F8EFF5 where #7E6118 read 4.36:1; the same gold as the burger letters). */

html[data-theme="light"] body[data-page="landing"]{background-color:var(--iv-ground)!important;color:var(--iv-ink)}

/* 1. Headings drawn as gradient text (fill transparent, gradient invisible on a light ground). */
html[data-theme="light"] body[data-page="landing"] :is(.hero-title,.claim-card-title,.p21-title,.apex-well-title,.d26-display,.d26-tile-title,#for-agents h2){
  background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;
  color:var(--iv-ink)!important;-webkit-text-fill-color:var(--iv-ink)!important;text-shadow:none!important}
html[data-theme="light"] body[data-page="landing"] :is(.hero-title,.claim-card-title,.p21-title,.apex-well-title,.d26-display,.d26-tile-title) :is(em,span){
  background:none!important;-webkit-background-clip:border-box!important;color:var(--iv-gold)!important;-webkit-text-fill-color:var(--iv-gold)!important}

/* 2. Pale silver (185,194,212) on light surfaces. */
html[data-theme="light"] body[data-page="landing"] :is(.d26-tile-num,#p21-live-value div,#today-pot div,.hg-name,.hg-sym,#stat-buyback-sub){
  color:var(--iv-silver)!important;-webkit-text-fill-color:var(--iv-silver)!important}

/* 3. Near-white text left from the dark design. */
html[data-theme="light"] body[data-page="landing"] :is(#tp-spots,#tp-total,.claim-rewards-heading,#p21-claim-container b){
  color:var(--iv-ink)!important;-webkit-text-fill-color:var(--iv-ink)!important}

/* 4. Small gold tags: the light gold measured ~2.7:1; the deep gold reads. */
html[data-theme="light"] body[data-page="landing"] :is(.hg-tag,.ho-tag-tl,.ho-tag-tr,.ho-tag-bl,.ho-tag-br,.p21-stat-value,.p21-announce-badge){
  color:var(--iv-gold-deep)!important;-webkit-text-fill-color:var(--iv-gold-deep)!important}

/* 5. Cyan (95,244,255) links and the second hero's "Claim rewards" button. */
html[data-theme="light"] body[data-page="landing"] .hero-primary-action{
  background:#D4AF37!important;background-image:linear-gradient(180deg,#F1DB93 0%,#D4AF37 55%,#B8912F 100%)!important;border-color:#B8912F!important;box-shadow:0 6px 16px -8px rgba(138,106,22,.55)!important;
  color:#2A2008!important;-webkit-text-fill-color:#2A2008!important}
html[data-theme="light"] body[data-page="landing"] :is(.quick-links a,#main-content a:not([class])){
  color:var(--iv-ink)!important;-webkit-text-fill-color:var(--iv-ink)!important;text-shadow:none!important}
html[data-theme="light"] body[data-page="landing"] #stat-capy{color:#15803D!important;-webkit-text-fill-color:#15803D!important}
/* The quick-link pills kept a dark navy background, so ink text disappeared on them. */
html[data-theme="light"] body[data-page="landing"] .quick-links .quick-link{background:var(--iv-surface)!important;background-image:none!important;border:1px solid var(--iv-line)!important;box-shadow:none!important;color:var(--iv-ink)!important;-webkit-text-fill-color:var(--iv-ink)!important;text-shadow:none!important}

/* 6. The navy inline-styled tiles (NFT AMM, Launch token and the eight "new" tiles) become ivory cards. */
html[data-theme="light"] body[data-page="landing"] #main-content section a[style*="border-radius:12px"]{
  background:var(--iv-surface)!important;background-image:none!important;border:1px solid var(--iv-line)!important;box-shadow:none!important;
  color:var(--iv-ink)!important;-webkit-text-fill-color:var(--iv-ink)!important}
html[data-theme="light"] body[data-page="landing"] #main-content section a[style*="border-radius:12px"] *{
  color:inherit!important;-webkit-text-fill-color:currentColor!important;text-shadow:none!important}

/* 6b. Small "NEW" badges: white on lilac measured 2.5:1. Ink on the same lilac reads. */
html[data-theme="light"] body[data-page="landing"] #main-content span[style*="background"]{color:var(--iv-ink)!important;-webkit-text-fill-color:var(--iv-ink)!important;text-shadow:none!important}

/* 7. The water. Soft light drifting over shallow water on the Ivory top band: three blurred highlights moving slowly
   out of phase. No layout, no images; off for anyone who asked for reduced motion. */
html[data-theme] body[data-page="landing"] #apex-launcher#apex-launcher{
  background-color:var(--iv-ground)!important;
  background-image:
    radial-gradient(38% 28% at 22% 18%, rgba(255,255,255,.85), rgba(255,255,255,0) 70%),
    radial-gradient(34% 30% at 78% 34%, rgba(214,234,229,.55), rgba(214,234,229,0) 72%),
    radial-gradient(46% 34% at 50% 92%, rgba(237,228,204,.6), rgba(237,228,204,0) 74%),
    linear-gradient(115deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.32) 46%, rgba(255,255,255,0) 62%)!important;
  background-size:180% 180%,170% 170%,160% 160%,240% 240%!important;
  background-repeat:no-repeat!important;
  animation:apexWater 22s ease-in-out infinite alternate}
@keyframes apexWater{
  0%  {background-position:0% 0%,100% 10%,40% 100%,0% 50%}
  50% {background-position:60% 30%,30% 50%,70% 60%,60% 50%}
  100%{background-position:100% 60%,0% 90%,20% 20%,100% 50%}}
@media (prefers-reduced-motion:reduce){ html[data-theme] body[data-page="landing"] #apex-launcher#apex-launcher{animation:none} }

/* 8. The sponsor banner was position:fixed, so while scrolling it sat over the counters and tiles. It now scrolls
   away with the page (all themes, homepage only); the launcher still reserves its height at load. */
body[data-page="landing"] #sp-banner#sp-banner{position:absolute!important}

/* 9. The faucet status pop-up ("A free claim every 8 hours"). It carries data-keep-color now, so the light-mode engine
   no longer half-repaints it (it had left pale silver text and navy borders on white); every colour is set here.
   The markup is static in index.html, so the inline-style selectors below match it exactly. */
html[data-theme="light"] #faucet-status-modal#faucet-status-modal{background:rgba(27,31,36,.32)!important;-webkit-backdrop-filter:blur(6px)!important;backdrop-filter:blur(6px)!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal *{border-color:#DAD9D1!important;text-shadow:none!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal > div{background:#FBFAF6!important;background-image:none!important;border:1px solid #DAD9D1!important;box-shadow:0 30px 70px -30px rgba(27,31,36,.45)!important;color:#4A5058!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal > div > button[aria-label="Close"]{background:#F1F1EC!important;background-image:none!important;border:1px solid #DAD9D1!important;box-shadow:none!important;color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal h2{background:none!important;color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important;font-family:"Bricolage Grotesque",Inter,system-ui,sans-serif!important;font-weight:800!important;letter-spacing:-.02em}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal :is(p,div,span,code,summary){color:#4A5058!important;-webkit-text-fill-color:#4A5058!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal b{color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal :is(div,summary)[style*="background:#1a1030"]{background:#F1F1EC!important;border:1px solid #DAD9D1!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal div[style*="background:#0d0719"]{background:#FFFFFF!important;border-color:#DAD9D1!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal div[style*="height:7px"]{background:#E4E3DB!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal #hp-pool-bar{background:linear-gradient(90deg,#D9BC6A,#A8832B)!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal div[style*="linear-gradient(90deg,transparent"]{background:#E4E3DB!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal [style*="text-transform:uppercase"]{color:#8C6C20!important;-webkit-text-fill-color:#8C6C20!important;font-family:"JetBrains Mono",ui-monospace,Menlo,monospace!important;font-size:10.5px!important;letter-spacing:.14em!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal #hp-pool-depth{color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal summary{color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal .hp-rung{background:#FFFFFF!important;border:1px solid #DAD9D1!important;box-shadow:none!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal .hp-rung b{color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal .hp-rung span{color:#6B737C!important;-webkit-text-fill-color:#6B737C!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal .hp-rung span:last-child{color:#8C6C20!important;-webkit-text-fill-color:#8C6C20!important;font-weight:700}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal .hp-rung-star{border-color:#A8832B!important;background:#FBF5E4!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal .hp-rung .hp-star{color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal #supporters-list > div{background:#FFFFFF!important;border:1px solid #DAD9D1!important}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal button:not([aria-label="Close"]){background:#D4AF37!important;background-image:linear-gradient(180deg,#F1DB93 0%,#D4AF37 55%,#B8912F 100%)!important;border:1px solid #B8912F!important;box-shadow:none!important;color:#2A2008!important;-webkit-text-fill-color:#2A2008!important;min-height:0}
html[data-theme="light"] #faucet-status-modal#faucet-status-modal a{color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important;border-color:#DAD9D1!important;background:#FFFFFF!important}

/* 10. The ladder's gold price sticker (the real cost of the first rung, e.g. "~$0.03"). black-2026.css hides it with
   the other dark-theme decorations, which left an empty 44px gap on the Ripple row; in Ivory a gold starburst belongs. */
html[data-theme="light"] #faucet-status-modal#faucet-status-modal .hp-rung .hp-star{display:flex!important;visibility:visible!important;opacity:1!important;background:#D9BC6A!important;border:0!important;color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important}

/* 11. Toasts: the live feed ("someone claimed", jackpots) and apexToast messages were dark purple cards. */
html[data-theme="light"] body[data-page="landing"] :is(#apex-live-feed,#apex-toast-host) .apex-toast{background:#FBFAF6!important;background-image:none!important;border:1px solid #DAD9D1!important;border-left:3px solid #A8832B!important;box-shadow:0 18px 40px -24px rgba(27,31,36,.45)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important}
html[data-theme="light"] body[data-page="landing"] :is(#apex-live-feed,#apex-toast-host) .apex-toast::before,
html[data-theme="light"] body[data-page="landing"] :is(#apex-live-feed,#apex-toast-host) .apex-toast::after{background:none!important}
html[data-theme="light"] body[data-page="landing"] #apex-live-feed .apex-toast .apex-toast-icon{background:#F1F1EC!important;box-shadow:none!important}
html[data-theme="light"] body[data-page="landing"] #apex-live-feed .apex-toast .apex-toast-title{background:none!important;color:#8C6C20!important;-webkit-text-fill-color:#8C6C20!important;text-shadow:none!important}
html[data-theme="light"] body[data-page="landing"] #apex-live-feed .apex-toast :is(.apex-toast-msg,.apex-toast-msg *){color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important;text-shadow:none!important}
html[data-theme="light"] body[data-page="landing"] #apex-live-feed .apex-toast .apex-toast-time{color:#6B737C!important;-webkit-text-fill-color:#6B737C!important;opacity:1!important}
html[data-theme="light"] body[data-page="landing"] #apex-live-feed .apex-toast .apex-toast-bar{background:#A8832B!important}
html[data-theme="light"] body[data-page="landing"] #apex-live-feed .apex-toast .apex-toast-shine{display:none!important}
html[data-theme="light"] body[data-page="landing"] #apex-live-feed .apex-toast.toast-jackpot{background:#FBF5E4!important;border-left-color:#8C6C20!important}
html[data-theme="light"] body[data-page="landing"] #apex-toast-host .apex-toast.ok{border-left-color:#15803D!important}
html[data-theme="light"] body[data-page="landing"] #apex-toast-host .apex-toast.err{border-left-color:#B42318!important}
html[data-theme="light"] body[data-page="landing"] #apex-toast-host .apex-toast.info{border-left-color:#1B1F24!important}
html[data-theme="light"] body[data-page="landing"] #apex-toast-host .apex-toast :is(a,.apex-toast-close){color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important;background:#F1F1EC!important;border:1px solid #DAD9D1!important;border-radius:8px!important}

/* 12. black-2026.css paints anything whose class contains "toast" as a bordered card, including the invisible
   full-width host the messages sit in, so every message appeared inside a navy slab. And both toast kinds were
   content-box, 425px and 400px wide on a 412px phone, hanging off the edge (every theme). */
html[data-theme="light"] body[data-page="landing"] #apex-toast-host#apex-toast-host{background:transparent!important;border:0!important;box-shadow:none!important}
body[data-page="landing"] :is(#apex-live-feed,#apex-toast-host) .apex-toast{box-sizing:border-box!important;max-width:100%!important}

/* 13. The last items under 3:1 in the final light audit (2026-09-14).
   - Inner lines of the inline-styled tiles (e.g. Graviton's "Token battle royale") got a navy fill from black-2026's
     [style*="background..."] list; divs inside those tiles are see-through. Badge spans keep their own chip.
   - The "NEW" badges were neon lavender/cyan/green/pink chips; in Ivory they are gold chips (text colour is engine-inked).
   - "AD SLOT" tag light gold on a violet tint; the banner kept a navy hairline.
   - "Your plot from $5" silver on the gold tile. */
html[data-theme="light"] body[data-page="landing"] #main-content section a[style*="border-radius:12px"] div{background-color:transparent!important;background-image:none!important}
html[data-theme="light"] body[data-page="landing"] #main-content section a[style*="border-radius:12px"] :is(span[style*="font-size:8px"],span[style*="font-size: 8px"]){background:#EDE4CC!important;color:#1B1F24!important;-webkit-text-fill-color:#1B1F24!important;border:1px solid #DCCDA2!important}
html[data-theme="light"] body[data-page="landing"] #sp-banner#sp-banner{border-color:#DAD9D1!important}
html[data-theme="light"] body[data-page="landing"] #sp-banner#sp-banner .sp-tag{background:#EDE4CC!important;color:#8C6C20!important;-webkit-text-fill-color:#8C6C20!important}
html[data-theme="light"] body[data-page="landing"] #apex-launcher#apex-launcher .al-gold .al-d{color:#5E6670!important;-webkit-text-fill-color:#5E6670!important}
html[data-theme="light"] body[data-page="landing"] .p21-announce-badge{background:#EDE4CC!important;border-color:#DCCDA2!important}

/* 13. "Your faucet claim" looked like a text field (Martin, 2026-09-14: people might think they can paste their address
   there). theme.css paints every [class*=card]-ish element in light mode white with a shadow, so the kicker, header and
   description each became a white bordered box. There is no field in this section: the form lives at the top. Make it
   read as a heading, and make the way to the real field an obvious button. */
html[data-theme="light"] body[data-page="landing"] #claim-section :is(.claim-card-kicker,.claim-card-header,.claim-card-title,.claim-card-desc){
  background:none!important;background-image:none!important;border:0!important;box-shadow:none!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;padding-left:0!important;padding-right:0!important}
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-card-kicker{
  display:flex!important;align-items:center;gap:12px;justify-content:center;margin:0 0 14px!important;
  font:700 11px/1 ui-sans-serif,system-ui,sans-serif!important;letter-spacing:.22em!important;text-transform:uppercase;
  color:var(--iv-gold-deep)!important;-webkit-text-fill-color:var(--iv-gold-deep)!important}
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-card-kicker::before,
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-card-kicker::after{
  content:"";flex:1;max-width:72px;height:1px;background:linear-gradient(90deg,transparent,var(--iv-gold))}
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-card-kicker::after{background:linear-gradient(90deg,var(--iv-gold),transparent)}
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-card-kicker > span{display:none!important}
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-card-header{text-align:center;margin:22px 0 6px!important}
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-card-title{margin:0!important;line-height:1.1!important}
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-card-desc{
  margin:8px auto 0!important;max-width:30ch;font-size:15px!important;letter-spacing:0!important;
  color:var(--iv-ink2)!important;-webkit-text-fill-color:var(--iv-ink2)!important}
/* The real way in: a gold pill that scrolls to the wallet field. */
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-moved{margin:18px 0 14px!important}
html[data-theme="light"] body[data-page="landing"] #claim-section .claim-moved a{
  display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;text-decoration:none!important;
  white-space:nowrap;max-width:100%;font:700 14px/1 ui-sans-serif,system-ui,sans-serif!important;
  background:#D4AF37!important;background-image:linear-gradient(180deg,#F1DB93 0%,#D4AF37 55%,#B8912F 100%)!important;
  border:1px solid #B8912F!important;box-shadow:0 6px 16px -8px rgba(138,106,22,.55)!important;
  color:#2A2008!important;-webkit-text-fill-color:#2A2008!important}
