:root{
  --bg:#12051f;
  --bg2:#261052;
  --panel:#1b0c38;
  --panel2:#2c165e;
  --text:#fffaff;
  --muted:#d6cfe8;
  --green:#55dfff;
  --mint:#8e6cff;
  --cyan:#55dfff;
  --pink:#ff4fc6;
  --gold:#ffc85a;
  --gold2:#c7832d;
  --violet:#8e6cff;
  --border:rgba(255,79,198,.34);
  --shadow:0 24px 80px rgba(0,0,0,.38);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:radial-gradient(circle at 80% 10%,rgba(81,231,255,.2),transparent 28%),radial-gradient(circle at 20% 20%,rgba(255,122,200,.15),transparent 24%),var(--bg);color:var(--text);overflow-x:hidden}
a{color:inherit;text-decoration:none}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");z-index:1}
.stars{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 20% 30%,#fff 0 1px,transparent 2px),radial-gradient(circle at 70% 20%,#fff 0 1px,transparent 2px),radial-gradient(circle at 85% 60%,#fff 0 1px,transparent 2px),radial-gradient(circle at 35% 75%,#fff 0 1px,transparent 2px);opacity:.35;z-index:0}
.site-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:16px clamp(18px,4vw,54px);background:rgba(6,8,20,.72);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.2px}
.brand img{width:42px;height:42px;border-radius:50%;box-shadow:0 0 24px rgba(100,255,154,.28)}
nav{display:flex;gap:18px;color:var(--muted);font-weight:700;font-size:14px}
nav a:hover{color:var(--green)}
main{position:relative;z-index:2}
.hero{min-height:82vh;display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,580px);gap:36px;align-items:center;padding:64px clamp(18px,6vw,82px) 38px}
.eyebrow{margin:0 0 12px;color:var(--green);font-weight:900;text-transform:uppercase;letter-spacing:.16em;font-size:12px}
.hero h1{margin:0;font-size:clamp(46px,7.6vw,98px);line-height:.92;letter-spacing:-.07em}
.hero h1 span{background:linear-gradient(90deg,var(--green),var(--cyan),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead,.section-lead{max-width:670px;color:var(--muted);font-size:clamp(17px,2vw,22px);line-height:1.55}
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.actions.center{justify-content:center}
.btn{border:1px solid var(--border);border-radius:999px;padding:14px 20px;font-weight:900;cursor:pointer;transition:.18s transform,.18s border,.18s filter;background:rgba(255,255,255,.06);color:var(--text);font-size:15px}
.btn:hover{transform:translateY(-2px);border-color:rgba(100,255,154,.6)}
.btn.primary{background:linear-gradient(135deg,var(--green),var(--cyan));color:#061014;border:0;box-shadow:0 12px 36px rgba(100,255,154,.22)}
.btn.ghost{backdrop-filter:blur(10px)}
.btn.disabled{opacity:.7;pointer-events:none}
.mint-box{margin-top:22px;max-width:680px;padding:14px 16px;border:1px solid var(--border);border-radius:18px;background:rgba(255,255,255,.06);display:grid;gap:6px;overflow:hidden}
.mint-box span,.stats span,.supply-card span{display:block;color:var(--muted);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.14em}
.mint-box code{font-size:13px;color:#dbe7ff;overflow-wrap:anywhere}
.hero-notes{display:grid;gap:10px;margin-top:18px;color:var(--muted);font-size:14px}
.hero-notes strong{color:var(--text)}
.hero-art{position:relative;min-height:580px;display:grid;place-items:center}
.coin-stage{position:relative;width:min(86vw,540px);height:min(86vw,540px);display:grid;place-items:center;z-index:3}
#coinCanvas{position:relative;width:100%;height:100%;display:block;border-radius:50%;outline:none;touch-action:none;cursor:grab;z-index:2}


.coin-stage.ready 
#coinCanvas:active{cursor:grabbing}
.coin-stage-glow{position:absolute;inset:12%;border-radius:50%;background:radial-gradient(circle,rgba(255,209,102,.26),rgba(81,231,255,.08) 48%,transparent 70%);filter:blur(24px);z-index:0}
.coin-help{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);padding:9px 14px;border-radius:999px;background:rgba(17,23,43,.74);backdrop-filter:blur(10px);font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border:1px solid rgba(255,255,255,.08);z-index:3}
.cat-planet{position:absolute;right:16px;top:12px;width:118px;height:118px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff0b8,var(--gold) 40%,#be7bff 100%);box-shadow:0 0 36px rgba(255,209,102,.45);display:grid;place-items:center;z-index:4}
.cat-planet .ring{position:absolute;width:168px;height:44px;border:8px solid rgba(81,231,255,.7);border-left-color:transparent;border-right-color:transparent;border-radius:50%;transform:rotate(-18deg)}
.cat-planet .ear{position:absolute;top:-8px;width:34px;height:34px;background:var(--gold);clip-path:polygon(50% 0,0 100%,100% 100%)}
.cat-planet .left{left:20px}.cat-planet .right{right:20px}
.cat-planet .face{font-size:44px;z-index:1}
.chart-card{position:absolute;right:-22px;top:120px;width:190px;padding:14px;border:1px solid rgba(100,255,154,.28);border-radius:22px;background:rgba(17,23,43,.50);backdrop-filter:blur(14px);box-shadow:var(--shadow);z-index:1}
.chart-title{font-size:12px;color:var(--muted);font-weight:900;margin-bottom:12px}
.candles{height:110px;display:flex;align-items:end;gap:12px}
.candles i{width:14px;border-radius:8px;background:linear-gradient(180deg,var(--green),#1bbf67);position:relative;box-shadow:0 0 18px rgba(100,255,154,.25)}
.candles i:before{content:"";position:absolute;left:6px;bottom:-12px;width:2px;height:calc(100% + 25px);background:rgba(100,255,154,.6)}
.stats{padding:0 clamp(18px,6vw,82px) 40px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.stats article,.panel,.roadmap article,.join,.tokenomics article,.supply-card{border:1px solid var(--border);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));border-radius:26px;box-shadow:var(--shadow)}
.stats article{padding:22px}.stats strong,.supply-card strong{display:block;margin-top:8px;font-size:20px}
.panel-grid{padding:30px clamp(18px,6vw,82px);display:grid;grid-template-columns:1.4fr .8fr;gap:18px}
.panel{padding:30px}.panel h2,.roadmap h2,.join h2,.tokenomics h2{margin:0 0 14px;font-size:clamp(32px,5vw,58px);letter-spacing:-.05em}.panel p{color:var(--muted);font-size:18px;line-height:1.6}
.checklist h3{margin:0 0 18px;font-size:26px}.checklist p{margin:14px 0;color:var(--text);font-weight:800}.checklist span{display:inline-grid;place-items:center;margin-right:10px;width:24px;height:24px;border-radius:50%;background:var(--green);color:#061014}
.tokenomics{padding:52px clamp(18px,6vw,82px)}.tokenomics-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px}.tokenomics article{padding:24px;position:relative;overflow:hidden}.tokenomics article:before{content:"";position:absolute;left:0;right:0;bottom:0;height:7px;background:linear-gradient(90deg,var(--green),var(--cyan));width:calc(var(--pct) * 1%)}.tokenomics b{font-size:40px;letter-spacing:-.05em;color:var(--green)}.tokenomics h3{margin:10px 0 8px}.tokenomics p{color:var(--muted);line-height:1.5}.supply-card{margin-top:16px;padding:20px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.supply-card button{border:0;border-radius:999px;background:rgba(100,255,154,.15);color:var(--green);padding:11px 14px;font-weight:900;cursor:pointer}
.roadmap{padding:52px clamp(18px,6vw,82px)}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.roadmap article{padding:24px}.roadmap b{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;background:rgba(100,255,154,.12);color:var(--green);margin-bottom:18px}.roadmap h3{margin:0 0 8px}.roadmap p{color:var(--muted);line-height:1.55}
.join{margin:40px clamp(18px,6vw,82px) 54px;padding:44px;text-align:center;background:radial-gradient(circle at 50% 0,rgba(100,255,154,.16),rgba(255,255,255,.04))}.join p{color:var(--muted);font-size:20px}
footer{position:relative;z-index:2;padding:28px;text-align:center;color:var(--muted);border-top:1px solid var(--border)}
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);opacity:0;background:#fff;color:#07101b;padding:12px 18px;border-radius:999px;font-weight:900;z-index:20;transition:.2s}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media (max-width:980px){nav{display:none}.hero{grid-template-columns:1fr;padding-top:38px}.hero-art{min-height:450px;order:-1}.chart-card{right:-10px;top:112px;width:170px}.cat-planet{right:12px;top:0;width:96px;height:96px}.stats{grid-template-columns:repeat(2,1fr)}.panel-grid,.steps,.tokenomics-grid,.supply-card{grid-template-columns:1fr}.hero h1{font-size:54px}.lead{font-size:17px}.mint-box code{font-size:12px}}
@media (max-width:520px){.stats{grid-template-columns:1fr}.hero-art{min-height:380px}.coin-stage{width:min(92vw,360px);height:min(92vw,360px)}.chart-card{scale:.78;right:-22px}.cat-planet{scale:.8;right:-8px}.btn{width:100%;text-align:center}.hero h1{font-size:48px}.site-header{padding:12px 16px}.brand img{width:36px;height:36px}.join{padding:28px 18px}.coin-help{bottom:0}}

.coin-stage.webgl-ready 


/* v1.3.0: transparent 3D coin embed from checkpoint app */
.coin-stage{
  background:transparent !important;
  isolation:isolate;
}
#coinCanvas{
  background:transparent !important;
}
.coin-stage-glow{
  opacity:.22;
  pointer-events:none;
}

.coin-stage.coin-ready 
.coin-stage.coin-ready #coinCanvas{
  opacity:1;
}
.coin-help{
  z-index:6;
}


/* v1.3.2: clean fit patch — no geometry changes */
.hero-art{
  min-height:500px;
}
.coin-stage{
  width:min(76vw,440px) !important;
  height:min(76vw,440px) !important;
  background:transparent !important;
  overflow:visible !important;
}
#coinCanvas{
  background:transparent !important;
  border-radius:0 !important;
}
.chart-card{
  right:-46px !important;
  top:118px !important;
  z-index:1 !important;
}
.cat-planet{
  transform:scale(.86);
}
.coin-help{
  bottom:2px !important;
}
@media(max-width:900px){
  .coin-stage{
    width:min(86vw,420px) !important;
    height:min(86vw,420px) !important;
  }
  .hero-art{
    min-height:460px;
  }
}


/* v1.3.3: slightly smaller hero coin */
.coin-stage{
  width:min(72vw,400px) !important;
  height:min(72vw,400px) !important;
}
.hero-art{
  min-height:470px !important;
}
.coin-help{
  bottom:-2px !important;
}
@media(max-width:900px){
  .coin-stage{
    width:min(82vw,390px) !important;
    height:min(82vw,390px) !important;
  }
  .hero-art{
    min-height:440px !important;
  }
}


/* v1.3.4: smaller fit + prevent side clipping */
.coin-stage{
  width:min(68vw,370px) !important;
  height:min(68vw,370px) !important;
  overflow:visible !important;
}
.hero-art{
  min-height:430px !important;
}
.coin-help{
  bottom:-6px !important;
}
.chart-card{
  right:-54px !important;
}
@media(max-width:900px){
  .coin-stage{
    width:min(78vw,360px) !important;
    height:min(78vw,360px) !important;
  }
  .hero-art{
    min-height:410px !important;
  }
}


/* v1.3.12: closeable spin hint */
.coin-help{
  display:flex !important;
  align-items:center;
  gap:10px;
  padding:9px 10px 9px 14px !important;
}
.coin-help.is-hidden{
  display:none !important;
}
.coin-help-close{
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  color:#ffffff;
  font-size:16px;
  line-height:18px;
  font-weight:900;
  cursor:pointer;
  display:grid;
  place-items:center;
  padding:0;
}
.coin-help-close:hover{
  background:rgba(255,255,255,.18);
}
.coin-help-close:active{
  transform:scale(.92);
}


/* v1.3.13: official social links */
.official-links{
  max-width:1120px;
  margin:0 auto;
  padding:72px 22px 88px;
  text-align:center;
}
.links-lead{
  max-width:640px;
  margin:0 auto 22px;
  color:var(--muted);
}
.link-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-top:26px;
}
.link-grid a{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:18px;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.09);
  color:var(--text);
  text-decoration:none;
  box-shadow:0 18px 40px rgba(0,0,0,.18);
  transition:transform .18s, border-color .18s, background .18s;
}
.link-grid a:hover{
  transform:translateY(-3px);
  border-color:rgba(255,209,102,.35);
  background:linear-gradient(180deg,rgba(255,209,102,.13),rgba(81,231,255,.045));
}
.link-grid span{
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.link-grid strong{
  font-size:15px;
}
.footer-links{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:12px;
}
.footer-links a{
  color:var(--muted);
  font-weight:800;
  text-decoration:none;
}
.footer-links a:hover{
  color:var(--gold);
}
@media(max-width:900px){
  .link-grid{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:560px){
  .link-grid{
    grid-template-columns:1fr;
  }
}


/* v1.3.14: removed hero notes and visible website-card link */
.link-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
@media(max-width:900px){
  .link-grid{
    grid-template-columns:1fr;
  }
}


/* v1.3.15: live trading space */
.trading-space{
  max-width:1180px;
  margin:0 auto;
  padding:76px 22px 84px;
}
.trade-head{
  max-width:760px;
  margin:0 auto 24px;
  text-align:center;
}
.trade-head p:not(.eyebrow){
  color:var(--muted);
  line-height:1.65;
}
.trade-layout{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);
  gap:18px;
  align-items:stretch;
}
.dex-panel,
.wallet-panel{
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.10);
  border-radius:28px;
  box-shadow:var(--shadow);
}
.dex-panel{
  overflow:hidden;
  min-height:620px;
}
.panel-title{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(6,8,20,.38);
}
.panel-title span{
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--gold);
}
.panel-title a{
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}
.panel-title a:hover{color:var(--cyan)}
.dex-panel iframe{
  width:100%;
  height:562px;
  border:0;
  display:block;
  background:#070a12;
}
.wallet-panel{
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.wallet-status{
  padding:18px;
  border-radius:22px;
  background:rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.08);
}
.wallet-status span{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:8px;
}
.wallet-status strong{
  display:block;
  font-size:20px;
}
.wallet-status small{
  display:block;
  color:var(--muted);
  margin-top:8px;
  line-height:1.4;
  word-break:break-all;
}
.btn.full{
  width:100%;
  justify-content:center;
  text-align:center;
}
.trade-buttons{
  display:grid;
  gap:10px;
}
.btn.buy{
  background:linear-gradient(135deg,#64ff9a,#51e7ff);
  color:#06111b;
  border:0;
}
.btn.sell{
  background:linear-gradient(135deg,#ff7ac8,#ffd166);
  color:#140611;
  border:0;
}
.mini-links{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.mini-links a,
.mini-links button{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.06);
  color:var(--text);
  border-radius:16px;
  padding:12px 10px;
  font-weight:850;
  font-size:13px;
  text-align:center;
  cursor:pointer;
}
.mini-links a:hover,
.mini-links button:hover{
  border-color:rgba(255,209,102,.35);
}
.trade-note{
  margin:auto 0 0;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}
@media(max-width:980px){
  .trade-layout{
    grid-template-columns:1fr;
  }
  .dex-panel{
    min-height:520px;
  }
  .dex-panel iframe{
    height:462px;
  }
}
@media(max-width:560px){
  .trading-space{
    padding-left:14px;
    padding-right:14px;
  }
  .dex-panel iframe{
    height:430px;
  }
  .mini-links{
    grid-template-columns:1fr;
  }
}


/* v1.3.16: replace useless top-right chart with approved Cat Planet art */
.chart-card{
  display:none !important;
}
.cat-planet{
  display:none !important;
}
.cat-planet-art{
  position:absolute;
  right:-10px;
  top:-18px;
  width:min(30vw,210px);
  height:auto;
  z-index:5;
  pointer-events:none;
  user-select:none;
  filter:
    drop-shadow(0 20px 34px rgba(0,0,0,.42))
    drop-shadow(0 0 22px rgba(255,209,102,.18));
  transform:rotate(2deg);
}
@media(max-width:900px){
  .cat-planet-art{
    right:-18px;
    top:-12px;
    width:min(36vw,165px);
  }
}
@media(max-width:560px){
  .cat-planet-art{
    right:-16px;
    top:2px;
    width:128px;
  }
}


/* v1.3.17: transparent Cat Planet art, no fake checkerboard background */
.cat-planet-art{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  right:-8px !important;
  top:-12px !important;
  width:min(31vw,230px) !important;
  transform:rotate(2deg) !important;
  filter:
    drop-shadow(0 22px 34px rgba(0,0,0,.45))
    drop-shadow(0 0 22px rgba(255,209,102,.18)) !important;
}
@media(max-width:900px){
  .cat-planet-art{
    right:-16px !important;
    top:-6px !important;
    width:min(38vw,180px) !important;
  }
}
@media(max-width:560px){
  .cat-planet-art{
    right:-14px !important;
    top:8px !important;
    width:140px !important;
  }
}


/* v1.3.18: move Cat Planet into the corner, away from coin */
.cat-planet-art{
  right:clamp(24px, 3.2vw, 58px) !important;
  top:clamp(22px, 3vw, 46px) !important;
  width:min(17vw, 165px) !important;
  max-width:165px !important;
  z-index:4 !important;
  transform:rotate(1deg) !important;
}
.coin-stage{
  z-index:3 !important;
}
@media(max-width:1100px){
  .cat-planet-art{
    right:18px !important;
    top:18px !important;
    width:138px !important;
  }
}
@media(max-width:700px){
  .cat-planet-art{
    right:8px !important;
    top:12px !important;
    width:104px !important;
  }
}


/* v1.3.19: corrected transparent Cat Planet image */
.cat-planet-art{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  right:clamp(18px, 2.6vw, 48px) !important;
  top:clamp(18px, 2.6vw, 42px) !important;
  width:min(16vw, 155px) !important;
  max-width:155px !important;
  z-index:4 !important;
  object-fit:contain !important;
  transform:rotate(1deg) !important;
  filter:
    drop-shadow(0 20px 30px rgba(0,0,0,.45))
    drop-shadow(0 0 16px rgba(255,209,102,.14)) !important;
}
@media(max-width:1100px){
  .cat-planet-art{
    right:14px !important;
    top:16px !important;
    width:125px !important;
  }
}
@media(max-width:700px){
  .cat-planet-art{
    right:6px !important;
    top:10px !important;
    width:96px !important;
  }
}


/* v1.3.20: Cat Planet bigger + pushed farther into top-right corner */
.cat-planet-art{
  right:-34px !important;
  top:10px !important;
  width:230px !important;
  max-width:230px !important;
  min-width:230px !important;
  z-index:4 !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  object-fit:contain !important;
  transform:rotate(1deg) !important;
  filter:
    drop-shadow(0 22px 34px rgba(0,0,0,.48))
    drop-shadow(0 0 18px rgba(255,209,102,.16)) !important;
}

@media(max-width:1200px){
  .cat-planet-art{
    right:-22px !important;
    top:12px !important;
    width:180px !important;
    min-width:180px !important;
    max-width:180px !important;
  }
}

@media(max-width:700px){
  .cat-planet-art{
    right:-10px !important;
    top:10px !important;
    width:118px !important;
    min-width:118px !important;
    max-width:118px !important;
  }
}


/* v1.3.21: true top-right Cat Planet placement */
.hero{
  position:relative !important;
  overflow:visible !important;
}
.hero .cat-planet-art{
  position:absolute !important;
  top:26px !important;
  right:-8px !important;
  width:220px !important;
  min-width:220px !important;
  max-width:220px !important;
  height:auto !important;
  z-index:6 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  object-fit:contain !important;
  pointer-events:none !important;
  user-select:none !important;
  transform:rotate(1deg) !important;
  filter:
    drop-shadow(0 22px 34px rgba(0,0,0,.48))
    drop-shadow(0 0 18px rgba(255,209,102,.16)) !important;
}
.hero-art .cat-planet-art{
  display:none !important;
}
@media(max-width:1200px){
  .hero .cat-planet-art{
    top:20px !important;
    right:-10px !important;
    width:170px !important;
    min-width:170px !important;
    max-width:170px !important;
  }
}
@media(max-width:700px){
  .hero .cat-planet-art{
    top:8px !important;
    right:-8px !important;
    width:118px !important;
    min-width:118px !important;
    max-width:118px !important;
  }
}


/* v1.3.22: clean token status icons + remove mojibake */
.checklist p{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
}
.checklist p span{
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  border-radius:999px !important;
  display:inline-grid !important;
  place-items:center !important;
  background:linear-gradient(135deg,#64ff9a,#51e7ff) !important;
  box-shadow:0 0 16px rgba(100,255,154,.24) !important;
  color:transparent !important;
  font-size:0 !important;
  line-height:0 !important;
  overflow:hidden !important;
}
.checklist p span::before{
  content:"" !important;
  width:9px !important;
  height:5px !important;
  border-left:3px solid #06111b !important;
  border-bottom:3px solid #06111b !important;
  transform:rotate(-45deg) translateY(-1px) !important;
}
.tokenomics > .section-lead{
  display:none !important;
}

/* Animated cosmic backdrop - no extra image file needed */
body{
  background:
    radial-gradient(circle at 78% 12%, rgba(81,231,255,.22), transparent 28%),
    radial-gradient(circle at 18% 22%, rgba(255,122,200,.12), transparent 26%),
    linear-gradient(135deg, #050813 0%, #071427 42%, #092d35 100%) !important;
  background-attachment: fixed !important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.8) 0 1px, transparent 2px),
    radial-gradient(circle at 65% 18%, rgba(255,255,255,.65) 0 1px, transparent 2px),
    radial-gradient(circle at 84% 62%, rgba(255,255,255,.65) 0 1px, transparent 2px),
    radial-gradient(circle at 40% 78%, rgba(255,255,255,.55) 0 1px, transparent 2px);
  opacity:.32;
  animation:hamaStars 18s ease-in-out infinite alternate;
}

body::after{
  content:"";
  position:fixed;
  inset:-20%;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(ellipse at 82% 18%, rgba(81,231,255,.16), transparent 32%),
    radial-gradient(ellipse at 72% 35%, rgba(177,122,255,.13), transparent 30%),
    radial-gradient(ellipse at 32% 85%, rgba(100,255,154,.08), transparent 28%);
  filter:blur(18px);
  animation:hamaNebula 26s ease-in-out infinite alternate;
}

.site-header,
main,
footer,
.toast{
  position:relative;
  z-index:2;
}

@keyframes hamaStars{
  from{transform:translateY(0);opacity:.25}
  to{transform:translateY(-12px);opacity:.45}
}

@keyframes hamaNebula{
  from{transform:scale(1) translate(0,0);opacity:.65}
  to{transform:scale(1.08) translate(-2%, -1%);opacity:1}
}

.fomo-subhead{
  margin:18px 0 0;
  max-width:760px;
  font-size:clamp(22px,3vw,40px);
  line-height:1.05;
  letter-spacing:-.04em;
  color:#f5f7ff;
  font-weight:950;
}
.fomo-subhead span{
  background:linear-gradient(90deg,var(--green),var(--cyan),var(--pink));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.origin-story-btn {
  cursor: pointer;
}

.origin-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
}

.origin-modal.is-open {
  display: flex;
}

.origin-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 6, 18, .78);
  backdrop-filter: blur(14px);
}

.origin-card {
  position: relative;
  width: min(920px, 96vw);
  max-height: 86vh;
  overflow: auto;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 28px;
  padding: 28px;
  background: linear-gradient(145deg, rgba(13,18,38,.97), rgba(28,17,54,.97));
  box-shadow: 0 30px 90px rgba(0,0,0,.55), 0 0 50px rgba(122,92,255,.22);
}

.origin-card h2 {
  margin: 6px 0 18px;
  font-size: clamp(30px, 5vw, 58px);
  line-height: .95;
  letter-spacing: -.06em;
}

.origin-story-copy {
  display: grid;
  gap: 14px;
  color: rgba(245,247,255,.86);
  font-size: 16px;
  line-height: 1.65;
}

.origin-story-copy p {
  margin: 0;
}

.origin-close {
  position: sticky;
  top: 0;
  float: right;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  padding: 10px 14px;
  color: #fff;
  background: rgba(255,255,255,.10);
  cursor: pointer;
}

.origin-open {
  overflow: hidden;
}

@media (max-width: 640px) {
  .origin-card {
    padding: 22px;
    border-radius: 22px;
  }

  .origin-story-copy {
    font-size: 15px;
  }
}


.story-section {
  margin: 70px auto;
  padding: 34px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 32px;
  background: linear-gradient(145deg, rgba(13,18,38,.72), rgba(19,31,58,.62));
  box-shadow: 0 24px 80px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08);
}

.story-section h2 {
  margin: 8px 0 14px;
  font-size: clamp(34px, 6vw, 72px);
  line-height: .92;
  letter-spacing: -.07em;
}

.story-preview {
  max-width: 820px;
  color: rgba(245,247,255,.78);
  font-size: clamp(18px, 2vw, 24px);
  line-height: 1.45;
  margin: 0 0 22px;
}

.origin-story-btn {
  cursor: pointer;
}

.origin-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
}

.origin-modal.is-open {
  display: flex;
}

.origin-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 6, 18, .78);
  backdrop-filter: blur(14px);
}

.origin-card {
  position: relative;
  width: min(920px, 96vw);
  max-height: 86vh;
  overflow: auto;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 28px;
  padding: 28px;
  background: linear-gradient(145deg, rgba(13,18,38,.97), rgba(28,17,54,.97));
  box-shadow: 0 30px 90px rgba(0,0,0,.55), 0 0 50px rgba(122,92,255,.22);
}

.origin-card h2 {
  margin: 6px 0 18px;
  font-size: clamp(30px, 5vw, 58px);
  line-height: .95;
  letter-spacing: -.06em;
}

.origin-story-copy {
  display: grid;
  gap: 14px;
  color: rgba(245,247,255,.86);
  font-size: 16px;
  line-height: 1.65;
}

.origin-story-copy p {
  margin: 0;
}

.origin-close {
  position: sticky;
  top: 0;
  float: right;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  padding: 10px 14px;
  color: #fff;
  background: rgba(255,255,255,.10);
  cursor: pointer;
}

.origin-open {
  overflow: hidden;
}

@media (max-width: 640px) {
  .story-section {
    margin: 46px auto;
    padding: 24px;
    border-radius: 24px;
  }

  .origin-card {
    padding: 22px;
    border-radius: 22px;
  }

  .origin-story-copy {
    font-size: 15px;
  }
}


.lore-story-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 26px;
  padding: 16px 24px;
  border-radius: 999px;
  font-weight: 950;
  letter-spacing: .01em;
  cursor: pointer;
  transform: translateZ(0);
  box-shadow: 0 16px 44px rgba(80, 255, 170, .18), 0 0 0 1px rgba(255,255,255,.12) inset;
}

.lore-story-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 58px rgba(80, 255, 170, .28), 0 0 0 1px rgba(255,255,255,.18) inset;
}






/* v47 brighter neon nav/buttons - no green, less dark */
html{
  background:#12051f !important;
}
body{
  background:
    radial-gradient(circle at 17% 16%, rgba(255,79,198,.30), transparent 34%),
    radial-gradient(circle at 74% 14%, rgba(85,223,255,.24), transparent 34%),
    radial-gradient(circle at 50% 70%, rgba(142,108,255,.28), transparent 34%),
    radial-gradient(circle at 83% 82%, rgba(255,200,90,.16), transparent 26%),
    linear-gradient(135deg,#19082d 0%,#2b135d 47%,#18265c 100%) !important;
  color:#fffaff !important;
}
body::before{
  background:
    radial-gradient(circle, rgba(255,79,198,.42) 0 1px, transparent 1.8px),
    radial-gradient(circle, rgba(85,223,255,.36) 0 1px, transparent 1.8px),
    radial-gradient(circle, rgba(255,200,90,.28) 0 1px, transparent 1.8px) !important;
  background-size:120px 120px, 175px 175px, 250px 250px !important;
  background-position:0 0, 66px 42px, 118px 88px !important;
  opacity:.24 !important;
}
.hero{
  background:
    radial-gradient(circle at 25% 30%, rgba(255,79,198,.16), transparent 35%),
    radial-gradient(circle at 78% 32%, rgba(85,223,255,.12), transparent 32%),
    linear-gradient(115deg,rgba(50,16,86,.32),rgba(38,20,94,.30),rgba(24,39,92,.32)) !important;
}

/* Brighter actual nav bar base */
.site-header{
  background:
    linear-gradient(90deg,rgba(36,12,67,.96),rgba(26,25,86,.94),rgba(67,16,75,.92)) !important;
  border-bottom:1px solid rgba(255,79,198,.40) !important;
  box-shadow:0 18px 48px rgba(0,0,0,.34), 0 0 26px rgba(142,108,255,.16) !important;
}
.brand img{
  box-shadow:0 0 22px rgba(255,200,90,.34), 0 0 34px rgba(255,79,198,.20) !important;
}
nav a{
  color:rgba(255,250,255,.82) !important;
}
nav a:hover{
  color:#55dfff !important;
  text-shadow:0 0 12px rgba(85,223,255,.36) !important;
}
.eyebrow{
  color:#55dfff !important;
  text-shadow:0 0 18px rgba(85,223,255,.32) !important;
}
.hero h1 span,
.fomo-subhead span{
  background:linear-gradient(90deg,#55dfff 0%,#8e6cff 35%,#ff4fc6 68%,#ffc85a 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
}
.lead,
.section-lead{
  color:rgba(255,250,255,.78) !important;
}
.btn.primary{
  background:linear-gradient(135deg,#55dfff 0%,#8e6cff 45%,#ff4fc6 100%) !important;
  color:#080512 !important;
  border:0 !important;
  box-shadow:0 16px 42px rgba(142,108,255,.26), 0 0 34px rgba(255,79,198,.20) !important;
}

/* Make Telegram pop instead of looking muddy */
.actions a[href*="t.me"],
a[href*="telegram"],
a[href*="Telegram"]{
  background:linear-gradient(135deg,#55dfff 0%,#8e6cff 42%,#ff4fc6 74%,#ffc85a 100%) !important;
  color:#07040f !important;
  border:0 !important;
  box-shadow:0 16px 42px rgba(85,223,255,.24),0 0 34px rgba(255,79,198,.18) !important;
}
.actions a[href*="t.me"]:hover,
a[href*="telegram"]:hover,
a[href*="Telegram"]:hover{
  transform:translateY(-2px) !important;
  filter:saturate(1.18) brightness(1.04) !important;
}

.btn.ghost,
.btn:not(.primary){
  background:rgba(37,16,70,.72) !important;
  border-color:rgba(255,79,198,.34) !important;
  color:#fffaff !important;
}
.btn:hover{
  border-color:rgba(85,223,255,.70) !important;
  filter:saturate(1.12) brightness(1.04) !important;
}
.mint-box,
.panel,
.card,
.token-card,
.roadmap article,
.dex-panel,
.wallet-panel,
.link-grid a,
.official-links .link-grid a{
  background:linear-gradient(180deg,rgba(45,18,88,.82),rgba(18,8,35,.78)) !important;
  border-color:rgba(255,79,198,.30) !important;
  box-shadow:0 18px 58px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.075) !important;
}
.mint-box{
  background:linear-gradient(180deg,rgba(44,20,92,.88),rgba(20,9,42,.82)) !important;
}
.coin-stage{
  filter:drop-shadow(0 32px 68px rgba(0,0,0,.42)) drop-shadow(0 0 36px rgba(255,200,90,.18)) !important;
}
.cat-planet-art{
  filter:drop-shadow(0 24px 36px rgba(0,0,0,.44)) drop-shadow(0 0 20px rgba(142,108,255,.22)) !important;
}
.checklist p span{
  background:linear-gradient(135deg,#55dfff,#ff4fc6) !important;
}
footer{
  border-top:1px solid rgba(255,79,198,.28) !important;
  background:linear-gradient(90deg,rgba(36,12,67,.86),rgba(26,25,86,.82),rgba(67,16,75,.80)) !important;
}
::selection{
  background:rgba(255,79,198,.32) !important;
}




/* v49 auto-hide navbar */
.site-header{
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  transform: translateY(0) !important;
  transition: transform .24s ease, opacity .20s ease, box-shadow .20s ease !important;
  will-change: transform !important;
  backdrop-filter: blur(14px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.08) !important;
}

.site-header.nav-hidden{
  transform: translateY(calc(-100% - 8px)) !important;
  opacity: .98 !important;
  pointer-events: none !important;
}

.site-header.nav-visible{
  transform: translateY(0) !important;
  pointer-events: auto !important;
}

section[id],
.hero,
#about,
#tokenomics,
#trade,
#roadmap,
#join,
#lore{
  scroll-margin-top: 112px !important;
}

html{
  scroll-padding-top: 112px !important;
}

@media (max-width: 768px){
  section[id],
  .hero,
  #about,
  #tokenomics,
  #trade,
  #roadmap,
  #join,
  #lore{
    scroll-margin-top: 126px !important;
  }

  html{
    scroll-padding-top: 126px !important;
  }
}
/* end v49 auto-hide navbar */








/* v52 real nav fade */
.site-header{
  border-bottom: 0 !important;
  box-shadow: none !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
  overflow: visible !important;
  background:
    linear-gradient(
      90deg,
      rgba(36,12,67,.98) 0%,
      rgba(28,22,86,.97) 48%,
      rgba(67,16,75,.96) 100%
    ) !important;
  isolation: isolate !important;
  backdrop-filter: blur(14px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.08) !important;
}

.site-header > *{
  position: relative !important;
  z-index: 5 !important;
}

/* Start inside the navbar by 2px so there is no hard seam, then fade over the hero */
.site-header::after{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: calc(100% - 2px) !important;
  height: 92px !important;
  pointer-events: none !important;
  z-index: 4 !important;
  background:
    linear-gradient(
      to bottom,
      rgba(42,14,76,.96) 0%,
      rgba(46,18,88,.78) 18%,
      rgba(56,24,104,.52) 38%,
      rgba(60,34,118,.28) 58%,
      rgba(55,50,124,.12) 78%,
      rgba(55,50,124,0) 100%
    ) !important;
  filter: blur(14px) !important;
  transform: translateY(-10px) scaleY(1.15) !important;
}

/* Extra soft wash to blend the first hero strip under the nav */
.hero::before{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: 95px !important;
  pointer-events: none !important;
  z-index: 1 !important;
  background:
    linear-gradient(
      to bottom,
      rgba(42,14,76,.40) 0%,
      rgba(46,18,88,.28) 35%,
      rgba(55,50,124,.10) 70%,
      rgba(55,50,124,0) 100%
    ) !important;
  filter: blur(18px) !important;
}

.hero{
  position: relative !important;
  border-top: 0 !important;
  margin-top: 0 !important;
  overflow: hidden !important;
}

.hero > *{
  position: relative !important;
  z-index: 2 !important;
}

/* keep auto-hide behavior clean with the fade attached */
.site-header.nav-hidden{
  transform: translateY(calc(-100% - 80px)) !important;
}

.site-header.nav-visible{
  transform: translateY(0) !important;
}
/* end v52 real nav fade */


/* v53 green checkmarks */
.checklist p span,
.checklist li span,
.token-status span,
.status-list span,
.status-card span{
  background: linear-gradient(135deg, #b7ff7a 0%, #48f06c 58%, #18c94f 100%) !important;
  box-shadow:
    0 0 16px rgba(72, 240, 108, .34),
    0 0 30px rgba(72, 240, 108, .16) !important;
  color: transparent !important;
}

/* keep the check itself clean and readable */
.checklist p span::before,
.checklist li span::before,
.token-status span::before,
.status-list span::before,
.status-card span::before{
  border-left-color: #07130a !important;
  border-bottom-color: #07130a !important;
}

/* direct check text fallback if any check icon is text instead of CSS */
.checkmark,
.check,
.icon-check,
[aria-label*="check" i],
[title*="check" i]{
  color: #48f06c !important;
}
/* end v53 green checkmarks */


/* v56 white gradient button text */
.gradient-text-light,
.btn.primary,
.actions .btn.primary,
.actions a[href*="t.me"],
.actions a[href*="telegram" i],
a[href*="jup.ag"].btn,
a[href*="raydium"].btn,
a[href*="pump"].btn,
a[href*="buy" i].btn,
button[class*="buy" i],
a[class*="buy" i]{
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 2px 4px rgba(0,0,0,.68), 0 0 10px rgba(0,0,0,.30) !important;
}

.gradient-text-light *,
.btn.primary *,
.actions .btn.primary *,
.actions a[href*="t.me"] *,
.actions a[href*="telegram" i] *,
a[href*="jup.ag"].btn *,
a[href*="raydium"].btn *,
a[href*="pump"].btn *,
a[href*="buy" i].btn *,
button[class*="buy" i] *,
a[class*="buy" i] *{
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 2px 4px rgba(0,0,0,.68), 0 0 10px rgba(0,0,0,.30) !important;
}
/* end v56 white gradient button text */


/* v58 soft panels no hard borders */
main :is(
  section,
  article,
  .panel,
  .card,
  .token-card,
  .mint-box,
  .wallet-panel,
  .dex-panel,
  .link-grid a,
  .official-links,
  .mini-links a,
  .roadmap article,
  .steps article,
  .cta,
  .checklist,
  .tokenomics,
  .trade-layout > *,
  .official-links .link-grid a
){
  border: 0 !important;
  outline: 0 !important;
}

/* soft card surfaces that fade into the page instead of outlined boxes */
main :is(
  .panel,
  .card,
  .token-card,
  .mint-box,
  .wallet-panel,
  .dex-panel,
  .link-grid a,
  .mini-links a,
  .roadmap article,
  .steps article,
  .cta,
  .checklist,
  .official-links .link-grid a
){
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 22% 0%, rgba(255,79,198,.13), transparent 38%),
    radial-gradient(circle at 88% 22%, rgba(85,223,255,.09), transparent 34%),
    linear-gradient(180deg, rgba(36,16,72,.58), rgba(17,8,36,.42)) !important;
  box-shadow:
    0 28px 70px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.045),
    inset 0 -1px 0 rgba(255,255,255,.018) !important;
}

/* feathered edge instead of visible border */
main :is(
  .panel,
  .card,
  .token-card,
  .mint-box,
  .wallet-panel,
  .dex-panel,
  .link-grid a,
  .mini-links a,
  .roadmap article,
  .steps article,
  .cta,
  .checklist,
  .official-links .link-grid a
)::after{
  content: "" !important;
  position: absolute !important;
  inset: -1px !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background:
    linear-gradient(135deg, rgba(255,79,198,.12), rgba(85,223,255,.07), rgba(255,200,90,.06)) !important;
  opacity: .38 !important;
  filter: blur(18px) !important;
  z-index: 0 !important;
}

main :is(
  .panel,
  .card,
  .token-card,
  .mint-box,
  .wallet-panel,
  .dex-panel,
  .link-grid a,
  .mini-links a,
  .roadmap article,
  .steps article,
  .cta,
  .checklist,
  .official-links .link-grid a
) > *{
  position: relative !important;
  z-index: 1 !important;
}

/* keep buttons from becoming washed-out cards */
main :is(.btn, button, .actions a){
  overflow: visible !important;
}

/* keep iframe/chart containers clean but not outlined */
.dex-panel{
  background:
    radial-gradient(circle at 50% 0%, rgba(85,223,255,.10), transparent 36%),
    linear-gradient(180deg, rgba(27,14,58,.58), rgba(9,6,24,.48)) !important;
}

/* big CTA should melt into the section more softly */
.cta{
  background:
    radial-gradient(circle at 50% 16%, rgba(255,255,255,.08), transparent 30%),
    radial-gradient(circle at 25% 20%, rgba(255,79,198,.14), transparent 42%),
    radial-gradient(circle at 76% 30%, rgba(85,223,255,.10), transparent 38%),
    linear-gradient(180deg, rgba(58,36,111,.38), rgba(20,12,48,.24)) !important;
  box-shadow:
    0 34px 90px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.05) !important;
}
/* end v58 soft panels no hard borders */


/* v60 soft depth shadows */
main :is(
  .panel,
  .card,
  .token-card,
  .mint-box,
  .wallet-panel,
  .dex-panel,
  .link-grid a,
  .mini-links a,
  .roadmap article,
  .steps article,
  .cta,
  .checklist,
  .official-links .link-grid a
){
  border: 0 !important;
  outline: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.105), transparent 36%),
    radial-gradient(circle at 86% 12%, rgba(85,223,255,.055), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.028)) !important;
  box-shadow:
    0 18px 34px rgba(0,0,0,.18),
    0 36px 90px rgba(0,0,0,.20),
    0 0 46px rgba(255,79,198,.055),
    inset 0 1px 0 rgba(255,255,255,.085),
    inset 0 -18px 34px rgba(0,0,0,.075) !important;
}

/* soft highlight inside top-left, not a border */
main :is(
  .panel,
  .card,
  .token-card,
  .mint-box,
  .wallet-panel,
  .dex-panel,
  .link-grid a,
  .mini-links a,
  .roadmap article,
  .steps article,
  .cta,
  .checklist,
  .official-links .link-grid a
)::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  z-index: 0 !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.025) 28%, rgba(255,255,255,0) 62%),
    radial-gradient(circle at 12% 8%, rgba(255,79,198,.10), transparent 34%) !important;
  opacity: .85 !important;
}

/* soft outer glow/feather replacing the removed border */
main :is(
  .panel,
  .card,
  .token-card,
  .mint-box,
  .wallet-panel,
  .dex-panel,
  .link-grid a,
  .mini-links a,
  .roadmap article,
  .steps article,
  .cta,
  .checklist,
  .official-links .link-grid a
)::after{
  content: "" !important;
  position: absolute !important;
  inset: -18px !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  z-index: 0 !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,79,198,.11), transparent 38%),
    radial-gradient(circle at 92% 20%, rgba(85,223,255,.08), transparent 42%),
    radial-gradient(circle at 50% 110%, rgba(0,0,0,.18), transparent 46%) !important;
  filter: blur(16px) !important;
  opacity: .80 !important;
}

main :is(
  .panel,
  .card,
  .token-card,
  .mint-box,
  .wallet-panel,
  .dex-panel,
  .link-grid a,
  .mini-links a,
  .roadmap article,
  .steps article,
  .cta,
  .checklist,
  .official-links .link-grid a
) > *{
  position: relative !important;
  z-index: 1 !important;
}

/* small lift on interactive card links only */
main :is(.link-grid a, .mini-links a, .official-links .link-grid a){
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

main :is(.link-grid a, .mini-links a, .official-links .link-grid a):hover{
  transform: translateY(-2px) !important;
  box-shadow:
    0 22px 42px rgba(0,0,0,.20),
    0 42px 105px rgba(0,0,0,.24),
    0 0 60px rgba(255,79,198,.08),
    inset 0 1px 0 rgba(255,255,255,.10) !important;
}

/* give large sections depth without drawing lines */
.official-links,
.cta-section,
.trading-space,
.roadmap,
.tokenomics{
  position: relative !important;
}

.official-links::before,
.cta-section::before,
.trading-space::before,
.roadmap::before,
.tokenomics::before{
  content: "" !important;
  position: absolute !important;
  left: 4vw !important;
  right: 4vw !important;
  top: 8px !important;
  height: 90px !important;
  pointer-events: none !important;
  z-index: -1 !important;
  background:
    radial-gradient(ellipse at center, rgba(255,79,198,.075), rgba(85,223,255,.035) 45%, transparent 72%) !important;
  filter: blur(34px) !important;
  opacity: .95 !important;
}

/* footer gets depth, no hard divider */
footer{
  border-top: 0 !important;
  box-shadow:
    inset 0 28px 55px rgba(0,0,0,.10),
    0 -28px 80px rgba(255,79,198,.045) !important;
}
/* end v60 soft depth shadows */





/* v69 official links polish */
.official-links .links-lead{
  color: rgba(245,247,255,.92) !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.16) !important;
}

.official-links .link-grid{
  align-items: stretch !important;
  gap: clamp(18px, 2vw, 28px) !important;
}

.official-links .link-grid a{
  min-height: 132px !important;
  padding: 24px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 26px !important;
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 14% 14%, rgba(255,255,255,.14), transparent 28%),
    radial-gradient(circle at 82% 16%, rgba(110,196,255,.10), transparent 36%),
    radial-gradient(circle at 50% 115%, rgba(0,0,0,.16), transparent 45%),
    linear-gradient(135deg, rgba(108,58,170,.36) 0%, rgba(71,86,188,.26) 54%, rgba(72,114,209,.28) 100%) !important;
  box-shadow:
    0 18px 42px rgba(5,10,30,.24),
    0 8px 20px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.15),
    inset 0 -16px 26px rgba(0,0,0,.10),
    0 0 0 1px rgba(255,255,255,.03) !important;
  backdrop-filter: blur(12px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(120%) !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

.official-links .link-grid a::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0) 34%),
    radial-gradient(circle at 22% 0%, rgba(255,101,194,.12), transparent 34%),
    radial-gradient(circle at 88% 0%, rgba(95,220,255,.10), transparent 30%) !important;
  opacity: .95 !important;
  z-index: -1 !important;
}

.official-links .link-grid a::after{
  content: "" !important;
  position: absolute !important;
  inset: -16px !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 20% 15%, rgba(255,101,194,.11), transparent 38%),
    radial-gradient(circle at 80% 20%, rgba(95,220,255,.09), transparent 42%) !important;
  filter: blur(18px) !important;
  opacity: .72 !important;
  z-index: -2 !important;
}

.official-links .link-grid a:hover{
  transform: translateY(-3px) scale(1.01) !important;
  box-shadow:
    0 24px 52px rgba(5,10,30,.28),
    0 10px 24px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -16px 26px rgba(0,0,0,.12),
    0 0 40px rgba(126,147,255,.10) !important;
  filter: brightness(1.04) !important;
}

.official-links .link-grid a span,
.official-links .link-grid a strong{
  position: relative !important;
  z-index: 1 !important;
}

.official-links .link-grid a span{
  margin: 0 !important;
  color: rgba(248,250,255,.96) !important;
  font-size: .98rem !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  line-height: 1.15 !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.22) !important;
}

.official-links .link-grid a strong{
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(1.35rem, 1.05rem + .55vw, 1.75rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  text-shadow: 0 4px 18px rgba(0,0,0,.26) !important;
}

@media (max-width: 900px){
  .official-links .link-grid a{
    min-height: 118px !important;
    padding: 22px 20px !important;
  }
  .official-links .link-grid a strong{
    font-size: clamp(1.15rem, 1rem + .8vw, 1.45rem) !important;
  }
}
/* end v69 official links polish */




/* v71 account frontend final design */
.hama-login-nav{
  border: 0 !important;
  border-radius: 999px !important;
  padding: .78rem 1.08rem !important;
  cursor: pointer !important;
  color: #fff !important;
  font-weight: 900 !important;
  letter-spacing: .01em !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.28), transparent 36%),
    linear-gradient(135deg, #ff4fc6, #7c5cff 52%, #4fdcff) !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.24), 0 0 32px rgba(255,79,198,.18) !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.32) !important;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
}

.hama-login-nav:hover{
  transform: translateY(-1px) !important;
  filter: brightness(1.08) !important;
  box-shadow: 0 18px 38px rgba(0,0,0,.28), 0 0 42px rgba(79,220,255,.16) !important;
}

.hama-account-zone{
  width: min(1180px, calc(100% - 32px)) !important;
  margin: 0 auto clamp(56px, 8vw, 108px) !important;
  padding: clamp(26px, 4vw, 48px) !important;
  border: 0 !important;
  border-radius: 36px !important;
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(255,79,198,.16), transparent 34%),
    radial-gradient(circle at 88% 10%, rgba(79,220,255,.12), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.026)) !important;
  box-shadow:
    0 28px 80px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -24px 46px rgba(0,0,0,.10) !important;
}

.hama-account-zone::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.09), transparent 43%),
    radial-gradient(circle at 50% 120%, rgba(0,0,0,.20), transparent 48%) !important;
}

.hama-account-head,
.hama-account-grid,
.hama-rewards-shell,
.hama-task-strip{
  position: relative !important;
  z-index: 1 !important;
}

.hama-account-head{
  max-width: 780px !important;
  margin-bottom: 24px !important;
}

.hama-account-head h2{
  margin: 0 0 10px !important;
  color: #fff !important;
  letter-spacing: -.03em !important;
}

.hama-account-head p{
  color: rgba(245,247,255,.86) !important;
}

.hama-account-grid{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.hama-account-card,
.hama-rewards-shell,
.hama-task-strip div{
  border: 0 !important;
  border-radius: 28px !important;
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 15% 0%, rgba(255,255,255,.14), transparent 34%),
    radial-gradient(circle at 88% 0%, rgba(79,220,255,.07), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.080), rgba(255,255,255,.030)) !important;
  box-shadow:
    0 18px 42px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -18px 32px rgba(0,0,0,.08) !important;
}

.hama-account-card{
  padding: 24px !important;
  min-height: 214px !important;
}

.hama-card-icon{
  width: 44px !important;
  height: 44px !important;
  display: grid !important;
  place-items: center !important;
  margin-bottom: 14px !important;
  border-radius: 16px !important;
  color: #fff !important;
  font-weight: 900 !important;
  background: linear-gradient(135deg, rgba(255,79,198,.86), rgba(124,92,255,.72), rgba(79,220,255,.68)) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.18), 0 0 28px rgba(255,79,198,.12) !important;
}

.hama-card-label{
  display: block !important;
  margin-bottom: 9px !important;
  color: rgba(255,255,255,.70) !important;
  font-size: .76rem !important;
  font-weight: 950 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.hama-account-card strong{
  display: block !important;
  color: #fff !important;
  font-size: clamp(1.22rem, 1rem + .75vw, 1.75rem) !important;
  line-height: 1.12 !important;
  word-break: break-word !important;
  text-shadow: 0 4px 18px rgba(0,0,0,.26) !important;
}

.hama-account-card small{
  display: block !important;
  margin-top: 8px !important;
  min-height: 36px !important;
  color: rgba(245,247,255,.74) !important;
  line-height: 1.42 !important;
}

.hama-mini-btn,
.hama-auth-submit,
.hama-google-btn{
  border: 0 !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  color: #fff !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.22), transparent 35%),
    linear-gradient(135deg, #ff4fc6, #7c5cff 56%, #4fdcff) !important;
  box-shadow: 0 13px 30px rgba(0,0,0,.20), 0 0 30px rgba(255,79,198,.13) !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.26) !important;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
}

.hama-mini-btn{
  margin-top: 18px !important;
  padding: .78rem 1rem !important;
}

.hama-mini-btn.ghost{
  background: rgba(255,255,255,.080) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 12px 28px rgba(0,0,0,.12) !important;
}

.hama-mini-btn:hover,
.hama-auth-submit:hover,
.hama-google-btn:hover{
  transform: translateY(-1px) !important;
  filter: brightness(1.08) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.24), 0 0 38px rgba(79,220,255,.14) !important;
}

.hama-rewards-shell{
  margin-top: 18px !important;
  padding: 24px !important;
  display: grid !important;
  grid-template-columns: 1.22fr .78fr !important;
  align-items: stretch !important;
  gap: 20px !important;
}

.hama-rewards-main h3{
  margin: 0 0 8px !important;
  color: #fff !important;
  font-size: clamp(1.35rem, 1.05rem + .85vw, 2rem) !important;
  letter-spacing: -.025em !important;
}

.hama-rewards-main p{
  margin-bottom: 18px !important;
  color: rgba(245,247,255,.78) !important;
  line-height: 1.55 !important;
}

.hama-reward-list{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.hama-reward-list span{
  border-radius: 999px !important;
  padding: .65rem .82rem !important;
  color: rgba(255,255,255,.86) !important;
  background: rgba(255,255,255,.075) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.hama-reward-list b{
  color: #fff !important;
}

.hama-convert-box{
  display: grid !important;
  gap: 10px !important;
  align-content: center !important;
  padding: 18px !important;
  border-radius: 24px !important;
  background: rgba(0,0,0,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.hama-convert-box label{
  color: rgba(255,255,255,.78) !important;
  font-weight: 900 !important;
}

.hama-convert-box input,
.hama-auth-form input{
  width: 100% !important;
  box-sizing: border-box !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 18px !important;
  padding: 1rem 1rem !important;
  color: #fff !important;
  background: rgba(0,0,0,.24) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.12) !important;
}

.hama-convert-box input::placeholder,
.hama-auth-form input::placeholder{
  color: rgba(255,255,255,.46) !important;
}

.hama-convert-box small{
  color: rgba(245,247,255,.62) !important;
  line-height: 1.4 !important;
}

.hama-preview-result{
  display: flex !important;
  justify-content: space-between !important;
  gap: 14px !important;
  align-items: center !important;
  border-radius: 20px !important;
  padding: 14px 16px !important;
  background: linear-gradient(135deg, rgba(255,79,198,.13), rgba(79,220,255,.10)) !important;
  color: rgba(255,255,255,.78) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.hama-preview-result strong{
  color: #fff !important;
  font-size: 1.5rem !important;
}

.hama-task-strip{
  margin-top: 18px !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 14px !important;
}

.hama-task-strip div{
  padding: 18px !important;
}

.hama-task-strip span{
  display: block !important;
  color: rgba(255,255,255,.66) !important;
  font-weight: 900 !important;
  font-size: .78rem !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
}

.hama-task-strip strong{
  display: block !important;
  margin-top: 6px !important;
  color: #fff !important;
  font-size: 1.08rem !important;
}

.hama-auth-overlay{
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
  background: rgba(2,4,12,.70) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

.hama-auth-overlay.is-open{
  display: flex !important;
}

.hama-auth-modal{
  width: min(520px, 100%) !important;
  max-height: min(88vh, 760px) !important;
  overflow: auto !important;
  border-radius: 34px !important;
  padding: 30px !important;
  position: relative !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(255,79,198,.20), transparent 34%),
    radial-gradient(circle at 86% 8%, rgba(79,220,255,.14), transparent 36%),
    linear-gradient(180deg, rgba(28,25,58,.97), rgba(7,10,24,.97)) !important;
  box-shadow:
    0 34px 110px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -22px 42px rgba(0,0,0,.14) !important;
}

.hama-auth-close{
  position: absolute !important;
  right: 18px !important;
  top: 18px !important;
  width: 42px !important;
  height: 42px !important;
  border: 0 !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  color: #fff !important;
  font-size: 1.5rem !important;
  background: rgba(255,255,255,.09) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.hama-auth-top{
  padding-right: 44px !important;
}

.hama-auth-top h2{
  margin: 0 0 8px !important;
}

.hama-auth-top p{
  color: rgba(245,247,255,.78) !important;
}

.hama-auth-tabs{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  padding: 8px !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.18) !important;
  margin: 20px 0 !important;
}

.hama-auth-tabs button{
  border: 0 !important;
  border-radius: 999px !important;
  padding: .82rem 1rem !important;
  cursor: pointer !important;
  color: rgba(255,255,255,.72) !important;
  font-weight: 900 !important;
  background: transparent !important;
}

.hama-auth-tabs button.is-active{
  color: #fff !important;
  background: linear-gradient(135deg, rgba(255,79,198,.78), rgba(124,92,255,.76), rgba(79,220,255,.70)) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.18) !important;
}

.hama-google-btn,
.hama-auth-submit{
  width: 100% !important;
  min-height: 50px !important;
  padding: .92rem 1rem !important;
}

.hama-google-btn{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
}

.hama-google-btn span{
  display: grid !important;
  place-items: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.18) !important;
}

.hama-divider{
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 18px 0 !important;
  color: rgba(255,255,255,.55) !important;
  font-size: .84rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}

.hama-divider::before,
.hama-divider::after{
  content: "" !important;
  height: 1px !important;
  flex: 1 !important;
  background: rgba(255,255,255,.12) !important;
}

.hama-auth-form{
  display: grid !important;
  gap: 14px !important;
}

.hama-auth-form label{
  display: grid !important;
  gap: 7px !important;
  color: rgba(255,255,255,.78) !important;
  font-weight: 900 !important;
}

.hama-auth-form small{
  color: rgba(255,255,255,.55) !important;
  font-weight: 650 !important;
}

.hama-auth-actions{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 16px !important;
}

.hama-auth-safe{
  margin: 18px 0 0 !important;
  color: rgba(245,247,255,.72) !important;
  font-size: .92rem !important;
  line-height: 1.45 !important;
}

@media (max-width: 980px){
  .hama-account-grid,
  .hama-rewards-shell,
  .hama-task-strip{
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 620px){
  .hama-login-nav{
    padding: .72rem .95rem !important;
  }
  .hama-account-zone{
    width: min(100% - 22px, 1180px) !important;
    padding: 22px !important;
    border-radius: 28px !important;
  }
  .hama-auth-modal{
    padding: 22px !important;
    border-radius: 28px !important;
  }
}
/* end v71 account frontend final design */


/* v72 auth pages no scroll */
.hama-auth-overlay{
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
  background: rgba(2,4,12,.72) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

.hama-auth-overlay.is-open{
  display: flex !important;
}

.hama-auth-modal{
  width: min(448px, calc(100vw - 30px)) !important;
  max-height: none !important;
  overflow: visible !important;
  border-radius: 28px !important;
  padding: 22px !important;
  position: relative !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 15% 0%, rgba(255,79,198,.20), transparent 34%),
    radial-gradient(circle at 86% 8%, rgba(79,220,255,.14), transparent 36%),
    linear-gradient(180deg, rgba(28,25,58,.98), rgba(7,10,24,.98)) !important;
  box-shadow:
    0 34px 110px rgba(0,0,0,.44),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -20px 38px rgba(0,0,0,.14) !important;
}

.hama-auth-close{
  position: absolute !important;
  right: 16px !important;
  top: 16px !important;
  width: 38px !important;
  height: 38px !important;
  border: 0 !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  color: #fff !important;
  font-size: 1.35rem !important;
  line-height: 1 !important;
  background: rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.hama-auth-page{
  display: none !important;
}

.hama-auth-page.is-active{
  display: block !important;
}

.hama-auth-top.compact{
  padding-right: 46px !important;
  margin-bottom: 14px !important;
}

.hama-auth-top.compact .eyebrow{
  margin-bottom: 8px !important;
  font-size: .78rem !important;
}

.hama-auth-top.compact h2{
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(1.55rem, 1.2rem + 1.2vw, 2.05rem) !important;
  line-height: 1.05 !important;
}

.hama-short-note{
  margin: 10px 0 0 !important;
  color: rgba(245,247,255,.78) !important;
  line-height: 1.35 !important;
}

.hama-google-btn,
.hama-auth-submit{
  width: 100% !important;
  min-height: 46px !important;
  padding: .78rem 1rem !important;
  border: 0 !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  color: #fff !important;
  font-weight: 900 !important;
  font-size: .98rem !important;
  text-decoration: none !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.24), transparent 35%),
    linear-gradient(135deg, #ff4fc6, #7c5cff 56%, #4fdcff) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.20), 0 0 30px rgba(255,79,198,.13) !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.26) !important;
}

.hama-google-btn{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
}

.hama-google-btn span{
  display: grid !important;
  place-items: center !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.18) !important;
}

.hama-divider{
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 14px 0 !important;
  color: rgba(255,255,255,.55) !important;
  font-size: .76rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}

.hama-divider::before,
.hama-divider::after{
  content: "" !important;
  height: 1px !important;
  flex: 1 !important;
  background: rgba(255,255,255,.12) !important;
}

.hama-auth-form{
  display: grid !important;
  gap: 11px !important;
}

.hama-auth-form label{
  display: grid !important;
  gap: 6px !important;
  color: rgba(255,255,255,.82) !important;
  font-weight: 900 !important;
  font-size: .95rem !important;
}

.hama-auth-form input{
  width: 100% !important;
  box-sizing: border-box !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 16px !important;
  padding: .88rem .95rem !important;
  color: #fff !important;
  background: rgba(0,0,0,.25) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.12) !important;
}

.hama-auth-form input::placeholder{
  color: rgba(255,255,255,.46) !important;
}

.hama-auth-links{
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-top: 12px !important;
}

.hama-auth-links.single{
  justify-content: center !important;
}

.hama-auth-links button{
  border: 0 !important;
  cursor: pointer !important;
  color: rgba(255,255,255,.86) !important;
  font-weight: 900 !important;
  background: transparent !important;
  text-decoration: none !important;
  padding: .25rem .1rem !important;
}

.hama-auth-links button:hover{
  color: #fff !important;
  text-decoration: underline !important;
}

.hama-mini-btn.full-width{
  width: 100% !important;
  margin-top: 12px !important;
  padding: .74rem 1rem !important;
}

.hama-auth-safe{
  margin: 12px 0 0 !important;
  color: rgba(245,247,255,.66) !important;
  font-size: .82rem !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

@media (max-height: 720px){
  .hama-auth-overlay{
    align-items: flex-start !important;
    padding-top: 10px !important;
  }
  .hama-auth-modal{
    padding: 18px !important;
    border-radius: 24px !important;
  }
  .hama-auth-top.compact{
    margin-bottom: 10px !important;
  }
  .hama-divider{
    margin: 10px 0 !important;
  }
  .hama-auth-form{
    gap: 8px !important;
  }
  .hama-auth-form input{
    padding: .76rem .88rem !important;
  }
  .hama-google-btn,
  .hama-auth-submit{
    min-height: 42px !important;
    padding: .68rem .9rem !important;
  }
  .hama-auth-safe{
    margin-top: 8px !important;
  }
}

@media (max-width: 520px){
  .hama-auth-modal{
    width: calc(100vw - 22px) !important;
    padding: 18px !important;
    border-radius: 24px !important;
  }
  .hama-auth-links{
    flex-direction: column !important;
    align-items: center !important;
  }
}
/* end v72 auth pages no scroll */


/* v73 copy mint label address */
.supply-card .supply-mint-card{
  min-width: 0 !important;
}

.supply-card .supply-mint-address{
  display: block !important;
  max-width: 100% !important;
  margin: 8px 0 12px !important;
  padding: .72rem .85rem !important;
  border-radius: 16px !important;
  color: rgba(255,255,255,.92) !important;
  background: rgba(0,0,0,.20) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 10px 22px rgba(0,0,0,.12) !important;
  font-size: clamp(.72rem, .68rem + .22vw, .9rem) !important;
  line-height: 1.35 !important;
  letter-spacing: .01em !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

.supply-card .supply-mint-card button,
.supply-card button[data-copy="2FBNzzkA31EU7cj2Mb12VeFbDh3SszDWhZNntsMppump"]{
  color: #fff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.30) !important;
}

@media (max-width: 720px){
  .supply-card .supply-mint-address{
    font-size: .72rem !important;
  }
}
/* end v73 copy mint label address */


/* v74 compact mint display */
.supply-card{
  align-items: start !important;
}

.supply-card .supply-mint-card{
  justify-self: start !important;
  align-self: start !important;
  width: auto !important;
  max-width: 360px !important;
  min-width: 0 !important;
}

.supply-card .supply-mint-address{
  width: fit-content !important;
  max-width: 260px !important;
  margin: 8px 0 12px !important;
  padding: .70rem .90rem !important;
  border-radius: 16px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  color: rgba(255,255,255,.95) !important;
  background: rgba(0,0,0,.20) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 10px 22px rgba(0,0,0,.12) !important;
  font-size: .84rem !important;
  line-height: 1.2 !important;
  letter-spacing: .01em !important;
}

.supply-card .supply-mint-card button,
.supply-card button[data-copy="2FBNzzkA31EU7cj2Mb12VeFbDh3SszDWhZNntsMppump"]{
  width: auto !important;
  min-width: 126px !important;
}

@media (max-width: 860px){
  .supply-card .supply-mint-card{
    max-width: 100% !important;
  }

  .supply-card .supply-mint-address{
    max-width: min(100%, 300px) !important;
  }
}
/* end v74 compact mint display */






/* v77 tokenomics height restore */
.supply-card{
  min-height: unset !important;
  height: auto !important;
  padding-top: clamp(18px, 2vw, 28px) !important;
  padding-bottom: clamp(18px, 2vw, 28px) !important;
  align-items: center !important;
}

.supply-card > div{
  min-height: 0 !important;
}

.supply-card .supply-mint-card{
  display: grid !important;
  grid-template-columns: auto auto !important;
  grid-template-areas:
    "label label"
    "addr button" !important;
  align-items: center !important;
  justify-content: start !important;
  column-gap: 12px !important;
  row-gap: 8px !important;
  width: auto !important;
  max-width: none !important;
}

.supply-card .supply-mint-card > span{
  grid-area: label !important;
  margin: 0 !important;
}

.supply-card .supply-mint-address{
  grid-area: addr !important;
  width: auto !important;
  max-width: 190px !important;
  margin: 0 !important;
  padding: .58rem .78rem !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.supply-card .supply-mint-card button{
  grid-area: button !important;
  margin: 0 !important;
  width: auto !important;
  min-width: 118px !important;
  padding: .68rem .95rem !important;
  line-height: 1.1 !important;
}

@media (max-width: 700px){
  .supply-card .supply-mint-card{
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "label"
      "addr"
      "button" !important;
    row-gap: 8px !important;
  }

  .supply-card .supply-mint-address{
    max-width: min(100%, 260px) !important;
  }
}
/* end v77 tokenomics height restore */




/* v79 separate account page */
.hama-login-nav.is-account{
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.28), transparent 36%),
    linear-gradient(135deg, #7c5cff, #4fdcff 58%, #ff4fc6) !important;
}

.hama-private-dashboard{
  display: none !important;
}

.account-page-body{
  min-height: 100vh !important;
}

.account-page-main{
  width: min(1180px, calc(100% - 32px)) !important;
  margin: 0 auto !important;
  padding: clamp(110px, 12vw, 142px) 0 clamp(58px, 8vw, 96px) !important;
}

.account-shell{
  display: grid !important;
  gap: 22px !important;
}

.account-hero-panel{
  position: relative !important;
  overflow: hidden !important;
  border-radius: 36px !important;
  padding: clamp(26px, 4vw, 46px) !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(255,79,198,.18), transparent 34%),
    radial-gradient(circle at 90% 8%, rgba(79,220,255,.13), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.028)) !important;
  box-shadow:
    0 28px 80px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -24px 46px rgba(0,0,0,.12) !important;
}

.account-hero-panel::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.09), transparent 44%),
    radial-gradient(circle at 50% 120%, rgba(0,0,0,.22), transparent 50%) !important;
}

.account-hero-inner{
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: 1.2fr .8fr !important;
  gap: 22px !important;
  align-items: center !important;
}

.account-hero-panel h1{
  margin: 0 0 10px !important;
  color: #fff !important;
  font-size: clamp(2.1rem, 1.2rem + 4vw, 4.4rem) !important;
  line-height: .95 !important;
  letter-spacing: -.06em !important;
}

.account-hero-panel p{
  margin: 0 !important;
  color: rgba(245,247,255,.82) !important;
  line-height: 1.55 !important;
  max-width: 680px !important;
}

.account-status-card{
  justify-self: end !important;
  width: min(100%, 360px) !important;
  border-radius: 28px !important;
  padding: 22px !important;
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.14), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.030)) !important;
  box-shadow:
    0 18px 42px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -18px 32px rgba(0,0,0,.08) !important;
}

.account-pill-row{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 18px !important;
}

.account-pill{
  border-radius: 999px !important;
  padding: .62rem .78rem !important;
  color: rgba(255,255,255,.86) !important;
  background: rgba(255,255,255,.075) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
  font-weight: 850 !important;
}

.account-dashboard-grid{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.account-panel,
.account-action-panel,
.account-locked-panel{
  border-radius: 30px !important;
  padding: 24px !important;
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 15% 0%, rgba(255,255,255,.14), transparent 34%),
    radial-gradient(circle at 88% 0%, rgba(79,220,255,.07), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.080), rgba(255,255,255,.030)) !important;
  box-shadow:
    0 18px 42px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -18px 32px rgba(0,0,0,.08) !important;
}

.account-panel-label{
  display: block !important;
  margin-bottom: 10px !important;
  color: rgba(255,255,255,.66) !important;
  font-size: .76rem !important;
  font-weight: 950 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.account-panel strong{
  display: block !important;
  color: #fff !important;
  font-size: clamp(1.35rem, 1rem + 1vw, 2.05rem) !important;
  line-height: 1.1 !important;
  word-break: break-word !important;
}

.account-panel small{
  display: block !important;
  margin-top: 8px !important;
  color: rgba(245,247,255,.72) !important;
  line-height: 1.42 !important;
}

.account-wide-grid{
  display: grid !important;
  grid-template-columns: 1.15fr .85fr !important;
  gap: 18px !important;
}

.account-action-panel h2,
.account-locked-panel h1{
  margin: 0 0 10px !important;
  color: #fff !important;
  letter-spacing: -.03em !important;
}

.account-action-panel p,
.account-locked-panel p{
  color: rgba(245,247,255,.78) !important;
  line-height: 1.55 !important;
}

.account-task-list{
  display: grid !important;
  gap: 12px !important;
  margin-top: 16px !important;
}

.account-task{
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 14px !important;
  border-radius: 20px !important;
  padding: 14px 16px !important;
  background: rgba(0,0,0,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
}

.account-task span{
  color: rgba(255,255,255,.78) !important;
  font-weight: 800 !important;
}

.account-task strong{
  color: #fff !important;
}

.account-button-row{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 18px !important;
}

.account-btn{
  border: 0 !important;
  border-radius: 999px !important;
  padding: .84rem 1.05rem !important;
  cursor: pointer !important;
  color: #fff !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.22), transparent 35%),
    linear-gradient(135deg, #ff4fc6, #7c5cff 56%, #4fdcff) !important;
  box-shadow: 0 13px 30px rgba(0,0,0,.20), 0 0 30px rgba(255,79,198,.13) !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.26) !important;
}

.account-btn.ghost{
  background: rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 12px 28px rgba(0,0,0,.12) !important;
}

.account-input{
  width: 100% !important;
  box-sizing: border-box !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 18px !important;
  padding: 1rem 1rem !important;
  color: #fff !important;
  background: rgba(0,0,0,.24) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.12) !important;
}

.account-input::placeholder{
  color: rgba(255,255,255,.46) !important;
}

.account-locked-panel{
  width: min(680px, 100%) !important;
  margin: 0 auto !important;
  text-align: center !important;
}

.account-hidden{
  display: none !important;
}

@media (max-width: 960px){
  .account-hero-inner,
  .account-dashboard-grid,
  .account-wide-grid{
    grid-template-columns: 1fr !important;
  }

  .account-status-card{
    justify-self: stretch !important;
    width: auto !important;
  }
}

@media (max-width: 620px){
  .account-page-main{
    width: min(100% - 22px, 1180px) !important;
    padding-top: 98px !important;
  }

  .account-hero-panel,
  .account-panel,
  .account-action-panel,
  .account-locked-panel{
    border-radius: 26px !important;
    padding: 20px !important;
  }
}
/* end v79 separate account page */


/* v80 backdrop copy feedback */
html,
body{
  min-height: 100% !important;
}

body{
  background-color: #08031a !important;
  background-image:
    linear-gradient(180deg, rgba(6,3,24,.42), rgba(6,3,24,.68) 46%, rgba(6,3,24,.82)),
    radial-gradient(circle at 50% 0%, rgba(255,79,198,.10), transparent 34%),
    url("assets/hama-backdrop.png") !important;
  background-size: cover, cover, cover !important;
  background-position: center top, center top, center top !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}

.noise{
  opacity: .17 !important;
}

.stars{
  opacity: .56 !important;
}

button[data-copy].is-copied,
.btn[data-copy].is-copied{
  filter: brightness(1.12) !important;
  box-shadow:
    0 16px 34px rgba(0,0,0,.24),
    0 0 34px rgba(79,220,255,.18),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}

@media (max-width: 820px){
  body{
    background-attachment: scroll !important;
  }
}
/* end v80 backdrop copy feedback */


/* v81 stronger backdrop */
body{
  background-color: #07021a !important;
  background-image:
    linear-gradient(180deg, rgba(5,2,20,.10), rgba(5,2,20,.28) 48%, rgba(5,2,20,.48)),
    radial-gradient(circle at 16% 28%, rgba(255,79,198,.24), transparent 34%),
    radial-gradient(circle at 84% 30%, rgba(79,220,255,.22), transparent 36%),
    url("assets/hama-backdrop.png") !important;
  background-size: cover, cover, cover, cover !important;
  background-position: center top, center top, center top, center top !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}

body::before{
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 22% 22%, rgba(255,79,198,.16), transparent 32%),
    radial-gradient(circle at 82% 30%, rgba(79,220,255,.15), transparent 34%) !important;
  opacity: .95 !important;
}

body{
  position: relative !important;
}

.noise{
  opacity: .10 !important;
}

.stars{
  opacity: .42 !important;
}

.site-header{
  background:
    linear-gradient(180deg, rgba(17,8,48,.78), rgba(17,8,48,.45)) !important;
  backdrop-filter: blur(18px) saturate(128%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(128%) !important;
}

.hero,
.panel-grid,
.tokenomics,
.trading-space,
.roadmap,
.join,
.official-links,
.account-page-main{
  position: relative !important;
}

.hero::before{
  content: "" !important;
  position: absolute !important;
  inset: -80px -8vw auto -8vw !important;
  height: min(76vh, 720px) !important;
  pointer-events: none !important;
  z-index: -1 !important;
  background:
    radial-gradient(ellipse at 20% 35%, rgba(255,79,198,.16), transparent 52%),
    radial-gradient(ellipse at 78% 34%, rgba(79,220,255,.14), transparent 50%) !important;
  filter: blur(8px) !important;
  opacity: .95 !important;
}

@media (max-width: 820px){
  body{
    background-attachment: scroll !important;
  }
}
/* end v81 stronger backdrop */








/* v88 stable login favicon animation */
body{
  overflow-x: hidden !important;
  background-color: #07021a !important;
  background-image:
    linear-gradient(180deg, rgba(5,2,20,.08), rgba(5,2,20,.24) 48%, rgba(5,2,20,.44)),
    url("assets/hama-backdrop.png") !important;
  background-size: cover, cover !important;
  background-position: center top, center top !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}

/* real visible animation layer */
.hama-cosmic-animation{
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}

.hama-cosmic-animation::before{
  content: "" !important;
  position: absolute !important;
  inset: -20vh -20vw !important;
  background:
    radial-gradient(circle at 18% 24%, rgba(255,79,198,.34), transparent 30%),
    radial-gradient(circle at 82% 31%, rgba(79,220,255,.30), transparent 32%),
    radial-gradient(circle at 50% 90%, rgba(124,92,255,.24), transparent 42%) !important;
  filter: blur(8px) !important;
  opacity: .92 !important;
  animation: hamaAuroraV88 10s ease-in-out infinite alternate !important;
}

.hama-cosmic-animation::after{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(circle at 16% 22%, rgba(255,255,255,.24) 0 1px, transparent 2px),
    radial-gradient(circle at 74% 18%, rgba(79,220,255,.26) 0 1px, transparent 2px),
    radial-gradient(circle at 86% 72%, rgba(255,79,198,.22) 0 1px, transparent 2px),
    radial-gradient(circle at 38% 78%, rgba(255,255,255,.18) 0 1px, transparent 2px) !important;
  background-size: 220px 220px, 320px 320px, 400px 400px, 470px 470px !important;
  mix-blend-mode: screen !important;
  opacity: .50 !important;
  animation: hamaStarsV88 22s linear infinite !important;
}

.hama-glow-orb{
  position: absolute !important;
  display: block !important;
  width: 24vw !important;
  height: 24vw !important;
  min-width: 170px !important;
  min-height: 170px !important;
  border-radius: 50% !important;
  filter: blur(42px) !important;
  opacity: .26 !important;
  mix-blend-mode: screen !important;
}

.hama-glow-orb.orb-one{
  left: -8vw !important;
  top: 18vh !important;
  background: #ff4fc6 !important;
  animation: hamaOrbOneV88 15s ease-in-out infinite alternate !important;
}

.hama-glow-orb.orb-two{
  right: -8vw !important;
  top: 24vh !important;
  background: #4fdcff !important;
  animation: hamaOrbTwoV88 17s ease-in-out infinite alternate !important;
}

.hama-glow-orb.orb-three{
  left: 36vw !important;
  bottom: -10vh !important;
  background: #7c5cff !important;
  animation: hamaOrbThreeV88 19s ease-in-out infinite alternate !important;
}

.hama-comet{
  position: absolute !important;
  width: 130px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.72), rgba(79,220,255,.0)) !important;
  opacity: 0 !important;
  transform: rotate(-18deg) !important;
  filter: drop-shadow(0 0 8px rgba(79,220,255,.45)) !important;
}

.hama-comet.comet-one{
  top: 22vh !important;
  left: -12vw !important;
  animation: hamaCometV88 14s linear infinite !important;
}

.hama-comet.comet-two{
  top: 64vh !important;
  left: -18vw !important;
  animation: hamaCometV88 19s linear infinite 6s !important;
}

.site-header,
main,
footer,
.toast,
.hama-auth-overlay,
.account-page-main{
  position: relative !important;
  z-index: 2 !important;
}

/* stable auth modal */
#hamaAuthOverlay.hama-auth-overlay{
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
  background: rgba(2,4,12,.72) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

#hamaAuthOverlay.hama-auth-overlay.is-open{
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.hama-auth-modal{
  width: min(448px, calc(100vw - 30px)) !important;
  overflow: visible !important;
  border-radius: 28px !important;
  padding: 22px !important;
  position: relative !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 15% 0%, rgba(255,79,198,.20), transparent 34%),
    radial-gradient(circle at 86% 8%, rgba(79,220,255,.14), transparent 36%),
    linear-gradient(180deg, rgba(28,25,58,.98), rgba(7,10,24,.98)) !important;
  box-shadow:
    0 34px 110px rgba(0,0,0,.44),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -20px 38px rgba(0,0,0,.14) !important;
}

.hama-auth-page{ display: none !important; }
.hama-auth-page.is-active{ display: block !important; }

.hama-auth-close{
  position: absolute !important;
  right: 16px !important;
  top: 16px !important;
  width: 38px !important;
  height: 38px !important;
  border: 0 !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  color: #fff !important;
  font-size: 1.35rem !important;
  line-height: 1 !important;
  background: rgba(255,255,255,.10) !important;
}

.hama-auth-top.compact{
  padding-right: 46px !important;
  margin-bottom: 14px !important;
}

.hama-auth-top.compact h2{
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(1.55rem, 1.2rem + 1.2vw, 2.05rem) !important;
  line-height: 1.05 !important;
}

.hama-short-note{
  margin: 10px 0 0 !important;
  color: rgba(245,247,255,.78) !important;
}

.hama-google-btn,
.hama-auth-submit{
  width: 100% !important;
  min-height: 46px !important;
  padding: .78rem 1rem !important;
  border: 0 !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  color: #fff !important;
  font-weight: 900 !important;
  font-size: .98rem !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.24), transparent 35%),
    linear-gradient(135deg, #ff4fc6, #7c5cff 56%, #4fdcff) !important;
}

.hama-google-btn{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
}

.hama-google-btn span{
  display: grid !important;
  place-items: center !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.18) !important;
}

.hama-divider{
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 14px 0 !important;
  color: rgba(255,255,255,.55) !important;
  font-size: .76rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
}

.hama-divider::before,
.hama-divider::after{
  content: "" !important;
  height: 1px !important;
  flex: 1 !important;
  background: rgba(255,255,255,.12) !important;
}

.hama-auth-form{
  display: grid !important;
  gap: 11px !important;
}

.hama-auth-form label{
  display: grid !important;
  gap: 6px !important;
  color: rgba(255,255,255,.82) !important;
  font-weight: 900 !important;
  font-size: .95rem !important;
}

.hama-auth-form input{
  width: 100% !important;
  box-sizing: border-box !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 16px !important;
  padding: .88rem .95rem !important;
  color: #fff !important;
  background: rgba(0,0,0,.25) !important;
}

.hama-auth-links{
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-top: 12px !important;
}

.hama-auth-links.single{ justify-content: center !important; }

.hama-auth-links button{
  border: 0 !important;
  cursor: pointer !important;
  color: rgba(255,255,255,.86) !important;
  font-weight: 900 !important;
  background: transparent !important;
  padding: .25rem .1rem !important;
}

.hama-mini-btn.full-width{
  width: 100% !important;
  margin-top: 12px !important;
  padding: .74rem 1rem !important;
}

.hama-auth-safe{
  margin: 12px 0 0 !important;
  color: rgba(245,247,255,.66) !important;
  font-size: .82rem !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

@keyframes hamaAuroraV88{
  0%{ transform: translate3d(-2.5%, -1%, 0) scale(1); opacity: .68; }
  50%{ transform: translate3d(2.5%, 1.6%, 0) scale(1.05); opacity: 1; }
  100%{ transform: translate3d(3.5%, -1.8%, 0) scale(1.09); opacity: .78; }
}

@keyframes hamaStarsV88{
  from{ background-position: 0 0, 0 0, 0 0, 0 0; }
  to{ background-position: 220px 165px, -320px 240px, 400px -290px, -470px -250px; }
}

@keyframes hamaOrbOneV88{ from{ transform: translate3d(0,0,0) scale(1); } to{ transform: translate3d(10vw, 5vh, 0) scale(1.18); } }
@keyframes hamaOrbTwoV88{ from{ transform: translate3d(0,0,0) scale(1.05); } to{ transform: translate3d(-9vw, 8vh, 0) scale(1.2); } }
@keyframes hamaOrbThreeV88{ from{ transform: translate3d(0,0,0) scale(1); } to{ transform: translate3d(4vw, -9vh, 0) scale(1.18); } }

@keyframes hamaCometV88{
  0%, 74%{ transform: translate3d(0,0,0) rotate(-18deg); opacity: 0; }
  78%{ opacity: .75; }
  88%{ opacity: .48; }
  100%{ transform: translate3d(130vw, 34vh, 0) rotate(-18deg); opacity: 0; }
}

@media (prefers-reduced-motion: reduce){
  .hama-cosmic-animation,
  .hama-cosmic-animation::before,
  .hama-cosmic-animation::after,
  .hama-glow-orb,
  .hama-comet{
    animation: none !important;
  }
}
/* end v88 stable login favicon animation */





/* HAMA 2WIP V3 FINAL SCROLL NAV SEAM START */
:root {
  --hama-nav-height: 76px;
  --hama-scroll-track: rgba(12, 5, 31, .96);
  --hama-scroll-thumb: linear-gradient(180deg, #55dfff 0%, #8e6cff 46%, #ff4fc6 100%);
}

html {
  scroll-behavior: smooth !important;
  scroll-padding-top: calc(var(--hama-nav-height) + 22px) !important;
  scrollbar-width: thin !important;
  scrollbar-color: #ff4fc6 #140728 !important;
  background: #07021a !important;
}

body {
  margin: 0 !important;
  min-height: 100% !important;
  overflow-x: hidden !important;
  isolation: isolate !important;
  background: #07021a !important;
  background-image: none !important;
}

/* Custom site scrollbar / scroll wheel track */
::-webkit-scrollbar {
  width: 14px !important;
  height: 14px !important;
}
::-webkit-scrollbar-track {
  background: linear-gradient(180deg, rgba(12,5,31,.98), rgba(23,10,50,.98)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05) !important;
}
::-webkit-scrollbar-thumb {
  background: var(--hama-scroll-thumb) !important;
  border: 3px solid rgba(12,5,31,.98) !important;
  border-radius: 999px !important;
  box-shadow: 0 0 18px rgba(255,79,198,.32), inset 0 1px 0 rgba(255,255,255,.35) !important;
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #74f2ff 0%, #a37bff 44%, #ff6bd0 100%) !important;
}
::-webkit-scrollbar-corner {
  background: #140728 !important;
}

/* One fixed backdrop layer for the whole page. This stops section-by-section background seams. */
body::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(5,2,20,.03), rgba(5,2,20,.15) 52%, rgba(5,2,20,.25)),
    url("assets/hama-backdrop.png") center center / cover no-repeat !important;
  transform: translateZ(0) !important;
}
body::after {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 14% 26%, rgba(255,79,198,.18), transparent 38%),
    radial-gradient(circle at 82% 30%, rgba(79,220,255,.14), transparent 42%),
    linear-gradient(90deg, rgba(30,5,55,.16), rgba(5,32,72,.12)) !important;
  mix-blend-mode: screen !important;
}

.noise,
.stars,
.hama-cosmic-animation {
  position: fixed !important;
  z-index: 2 !important;
  pointer-events: none !important;
}

.site-header,
main,
footer,
.toast,
.hama-auth-overlay,
.account-page-main {
  position: relative !important;
  z-index: 5 !important;
}

/* Kill the actual visible seam: no section may restart, tint, or cap the backdrop. */
main,
main > section,
.hero,
.stats,
.panel-grid,
.tokenomics,
.trading-space,
.roadmap,
.join,
.official-links,
.hama-account-zone,
section[id] {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.hero::before,
.hero::after,
.stats::before,
.stats::after,
.panel-grid::before,
.panel-grid::after,
.tokenomics::before,
.tokenomics::after,
.trading-space::before,
.trading-space::after,
.roadmap::before,
.roadmap::after,
.join::before,
.join::after,
.official-links::before,
.official-links::after,
section[id]::before,
section[id]::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Keep glass cards, but not whole-section glass bars. */
.stats article,
.panel,
.roadmap article,
.join,
.tokenomics article,
.supply-card,
.trade-card,
.chart-panel,
.wallet-panel,
.dex-panel,
.official-links .link-grid a,
.hama-account-card {
  background: linear-gradient(180deg, rgba(255,255,255,.088), rgba(255,255,255,.045)) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* Sticky auto-hide nav: visible at top, hides scrolling down, returns scrolling up or mouse near top. */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 99999 !important;
  transform: translate3d(0,0,0) !important;
  transition: transform .24s ease, opacity .18s ease, box-shadow .18s ease !important;
  will-change: transform !important;
  background: linear-gradient(90deg, rgba(36,12,67,.985), rgba(28,22,86,.975) 48%, rgba(67,16,75,.965)) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
  border-bottom: 0 !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.13) !important;
}
.site-header::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: calc(100% - 1px) !important;
  height: 58px !important;
  pointer-events: none !important;
  z-index: -1 !important;
  background: linear-gradient(to bottom, rgba(42,14,76,.62), rgba(42,14,76,0)) !important;
  filter: blur(12px) !important;
}
.site-header.nav-hidden {
  transform: translate3d(0, calc(-100% - 18px), 0) !important;
  opacity: .98 !important;
  pointer-events: none !important;
}
.site-header.nav-visible {
  transform: translate3d(0,0,0) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.btn.is-copied,
button.is-copied,
a.is-copied {
  filter: brightness(1.16) !important;
  box-shadow: 0 0 28px rgba(79,220,255,.28), inset 0 1px 0 rgba(255,255,255,.18) !important;
}

@media (max-width: 820px) {
  :root { --hama-nav-height: 74px; }
  body::before { background-attachment: scroll !important; }
  html { scroll-padding-top: calc(var(--hama-nav-height) + 24px) !important; }
}
/* HAMA 2WIP V3 FINAL SCROLL NAV SEAM END */


/* HAMA V4 ACCOUNT + NAV FINAL FIX START */
.account-auth-panel {
  width: min(920px, 100%) !important;
  text-align: left !important;
}
.account-auth-panel > .eyebrow,
.account-auth-panel > h1,
.account-auth-panel > p {
  text-align: center !important;
}
.account-auth-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin-top: 22px !important;
}
.account-mini-form {
  display: grid !important;
  gap: 12px !important;
  border-radius: 24px !important;
  padding: 18px !important;
  background: rgba(0,0,0,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.account-mini-form label {
  display: grid !important;
  gap: 7px !important;
  color: rgba(255,255,255,.78) !important;
  font-weight: 800 !important;
  font-size: .9rem !important;
}
.site-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 999999 !important;
}
body:not(.account-page-body) {
  padding-top: var(--hama-nav-height, 76px) !important;
}
.account-page-body {
  padding-top: var(--hama-nav-height, 76px) !important;
}
.account-page-main {
  padding-top: clamp(42px, 7vw, 72px) !important;
}
.site-header.nav-hidden {
  transform: translate3d(0, calc(-100% - 20px), 0) !important;
  pointer-events: none !important;
}
.site-header.nav-visible {
  transform: translate3d(0,0,0) !important;
  pointer-events: auto !important;
}
@media (max-width: 760px) {
  .account-auth-grid { grid-template-columns: 1fr !important; }
}
/* HAMA V4 ACCOUNT + NAV FINAL FIX END */

/* HAMA V5 POINTS + AD PROOF START */
.account-points-lab {
  display: grid !important;
  gap: 18px !important;
  margin-top: 22px !important;
}

.account-points-head,
.account-admin-review {
  border-radius: 28px !important;
  padding: clamp(20px, 3vw, 32px) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.105), rgba(255,255,255,.045)) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter: blur(18px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(120%) !important;
}

.account-points-head h2,
.account-ad-proof-panel h3,
.account-proof-panel h3,
.account-admin-review h3 {
  margin: 8px 0 10px !important;
  color: #fff !important;
}

.account-points-head p,
.account-muted,
.account-admin-review p {
  color: rgba(255,255,255,.76) !important;
  line-height: 1.65 !important;
}

.account-points-grid {
  display: grid !important;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr) !important;
  gap: 18px !important;
}

.account-ad-form {
  display: grid !important;
  gap: 12px !important;
  margin-top: 14px !important;
}

.account-ad-form label {
  display: grid !important;
  gap: 7px !important;
  color: rgba(255,255,255,.82) !important;
  font-weight: 900 !important;
  font-size: .9rem !important;
}

.account-proof-list,
.account-review-list {
  display: grid !important;
  gap: 10px !important;
  margin-top: 14px !important;
}

.account-proof-card {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 14px !important;
  align-items: center !important;
  padding: 14px !important;
  border-radius: 20px !important;
  background: rgba(0,0,0,.17) !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.account-proof-main,
.account-proof-side,
.account-proof-actions {
  display: grid !important;
  gap: 6px !important;
}

.account-proof-main a {
  color: #64e6ff !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  overflow-wrap: anywhere !important;
}

.account-proof-main a:hover {
  text-decoration: underline !important;
}

.account-proof-platform,
.account-status-pill {
  width: fit-content !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  padding: 5px 9px !important;
  font-size: .73rem !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: #68f2ff !important;
  background: rgba(104,242,255,.12) !important;
  border: 1px solid rgba(104,242,255,.18) !important;
  font-weight: 1000 !important;
}

.account-proof-side {
  text-align: right !important;
  justify-items: end !important;
}

.account-proof-side strong {
  color: #fff !important;
  font-size: .95rem !important;
}

.account-proof-main small,
.account-reject-note,
.account-approved-note,
.account-empty-proof {
  color: rgba(255,255,255,.66) !important;
}

.account-proof-actions {
  grid-column: 1 / -1 !important;
  grid-template-columns: repeat(auto-fit, minmax(130px, max-content)) !important;
  align-items: center !important;
}

.account-btn.mini {
  min-height: 36px !important;
  padding: 0 14px !important;
  font-size: .86rem !important;
}

.account-btn.danger {
  color: #ffc6df !important;
  border-color: rgba(255,88,145,.28) !important;
}

.account-btn:disabled,
.account-btn[disabled] {
  opacity: .48 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

.account-proof-card.status-approved {
  border-color: rgba(91,255,190,.24) !important;
}

.account-proof-card.status-approved .account-status-pill {
  color: #8cffd0 !important;
  background: rgba(91,255,190,.12) !important;
  border-color: rgba(91,255,190,.18) !important;
}

.account-proof-card.status-rejected {
  border-color: rgba(255,88,145,.24) !important;
}

.account-proof-card.status-rejected .account-status-pill {
  color: #ffc6df !important;
  background: rgba(255,88,145,.12) !important;
  border-color: rgba(255,88,145,.18) !important;
}

@media (max-width: 900px) {
  .account-points-grid,
  .account-proof-card {
    grid-template-columns: 1fr !important;
  }
  .account-proof-side {
    text-align: left !important;
    justify-items: start !important;
  }
}
/* HAMA V5 POINTS + AD PROOF END */


/* HAMA V7 TOKEN TO POINTS CONVERSION START */
.hama-convert-grid {
  margin-top: 18px;
}
.account-convert-preview {
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(255,255,255,.07);
  color: rgba(255,255,255,.88);
  font-weight: 800;
  line-height: 1.4;
}
.account-convert-panel .account-btn,
.account-convert-list-panel .account-btn {
  white-space: nowrap;
}
.account-proof-side small {
  display: block;
  color: rgba(255,255,255,.68);
  font-weight: 700;
  margin-top: 4px;
}
/* HAMA V7 TOKEN TO POINTS CONVERSION END */


/* HAMA V8 CLEAN AUTH RULES START */
/* The main login modal is the only login/create-account UI. Account/admin pages redirect logged-out users back to index.html#login. */
.account-locked-panel.account-hidden { display: none !important; }
.hama-x-user-link { font-weight: 900; }
/* HAMA V8 CLEAN AUTH RULES END */


/* HAMA V11 LORE ANCHOR FIX START */
.hama-lore-anchor {
  display: block !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  scroll-margin-top: 112px !important;
}
@media (max-width: 768px) {
  .hama-lore-anchor {
    scroll-margin-top: 126px !important;
  }
}
/* HAMA V11 LORE ANCHOR FIX END */
















/* HAMA V18 TRUE NO INITIAL COIN BOX START */
.hero-art {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

.coin-stage[data-created-by="hama-3d-coin"] {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: min(86vw, 540px) !important;
  height: min(86vw, 540px) !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  transform-style: preserve-3d !important;
  z-index: 3 !important;
}

.coin-stage[data-created-by="hama-3d-coin"] .coin-stage-glow {
  z-index: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(circle, rgba(255,209,102,.26), rgba(81,231,255,.08) 48%, transparent 70%) !important;
}

#coinCanvas {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  display: block;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  z-index: 3 !important;
  touch-action: none !important;
  cursor: grab !important;
}

#coinCanvas:active {
  cursor: grabbing !important;
}

.coin-help {
  z-index: 4 !important;
}

.coin-help.is-hidden {
  display: none !important;
}

@media (max-width: 520px) {
  .coin-stage[data-created-by="hama-3d-coin"] {
    width: min(92vw, 360px) !important;
    height: min(92vw, 360px) !important;
  }
}
/* HAMA V18 TRUE NO INITIAL COIN BOX END */


/* HAMA V19 WEBGL WHITE FLASH KILL PATCH START
   Keep the 3D coin canvas/stage transparent and opacity-hidden until JS marks the first real frame ready.
   Do not use display:none or visibility:hidden on the WebGL canvas; those can trigger a one-frame white buffer on reload. */
.hero-art,
.coin-stage[data-created-by="hama-3d-coin"],
.coin-stage[data-created-by="hama-3d-coin"] *,
#coinCanvas {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

.coin-stage[data-created-by="hama-3d-coin"] {
  visibility: visible !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
  contain: paint !important;
}

.coin-stage[data-created-by="hama-3d-coin"].coin-rendered,
.coin-stage[data-created-by="hama-3d-coin"].coin-ready {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

#coinCanvas,
#coinCanvas:not([data-hama-ready="1"]) {
  display: block !important;
  visibility: visible !important;
  opacity: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  transition: none !important;
  contain: paint !important;
}

#coinCanvas[data-hama-ready="1"] {
  visibility: visible !important;
  opacity: 1 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}
/* HAMA V19 WEBGL WHITE FLASH KILL PATCH END */