.wrap{width:min(var(--column),calc(100% - 48px));margin-inline:auto}
.brand{display:inline-flex;gap:8px;align-items:center;text-decoration:none;font-size:var(--size-brand);font-weight:500;letter-spacing:-.04em;white-space:nowrap}
.hero{padding:72px 0 80px;min-height:792px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.hero-side{display:grid;gap:36px;min-width:0}
.ca-card{padding:24px}
.ca-row{display:flex;align-items:center;gap:16px;margin:16px 0}
.ca-row code{flex:1}
.ca-row .btn{flex-shrink:0}
.publication-note{margin-top:36px;max-width:54ch}
.stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:24px 0 0}
.stat-row>div{min-width:0;display:flex;flex-direction:column-reverse;justify-content:end;min-height:48px;gap:8px}
.stat-row dt{color:var(--muted);font:400 var(--size-mono)/1.4 var(--mono)}
.stat-row dd{font-weight:500;white-space:nowrap;overflow-wrap:normal}
.hero-object{isolation:isolate;position:relative;width:100%;aspect-ratio:860 / 520}
.hero-object canvas,.hero-object img{z-index:0;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.object-tag{position:absolute;z-index:3;pointer-events:none;padding:4px 8px;border-radius:var(--r-pill);background:var(--tag-ground);color:var(--tag-ink);font:400 12px/1.4 var(--mono);white-space:nowrap}
.tag-supply{left:16px;top:16px}
.tag-fraction{right:16px;top:16px}
.tag-cycle{right:16px;bottom:16px}
.band{padding:96px 0 112px}
.band-alt{background:var(--band-alt)}
#rebase.band{padding-top:64px}
.sec-head{margin-bottom:36px}
.page-intro{padding:72px 0 12px}
.page-intro+.band{padding-top:48px}
.fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.calculator .fine{margin-top:20px}
.chart{margin:32px 0}
.chart svg{width:100%;height:auto;max-height:280px;overflow:visible}
.chart path{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.supply-line{stroke:var(--accent)}
.fraction-line{stroke:var(--ink)}
.chart figcaption{margin-top:16px;font-family:var(--mono)}
.history{padding-left:20px;font:var(--size-mono)/1.8 var(--mono);overflow-wrap:anywhere}
.history li+li{margin-top:16px}
.ledger-head{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:32px 0 20px;font:var(--size-mono) var(--mono);color:var(--muted)}
.mechanism-steps{counter-reset:step;display:grid;grid-template-columns:repeat(3,1fr);gap:48px;list-style:none;padding:0;margin:0}
.mechanism-steps li{counter-increment:step}
.mechanism-steps li::before{content:counter(step,decimal-leading-zero);display:block;font:var(--size-mono) var(--mono);margin-bottom:20px;color:var(--muted)}
.mechanism-steps p,.qa p,.phase-list p{margin-top:12px;color:var(--muted)}
.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 80px}
.anchor-nav{display:flex;flex-wrap:wrap;gap:24px;margin-top:36px;font-size:var(--size-mono)}
.formula{font-family:var(--mono);font-size:var(--size-body);margin-bottom:24px;overflow-wrap:anywhere}
.phase-list{list-style:none;padding:0;margin:0;display:grid;gap:28px;max-width:760px}
.chain-strip{padding:40px 0;font:var(--size-mono)/1.6 var(--mono)}
.chain-strip .result-rows{max-width:720px}
.footer{padding:64px 0 40px}
.footer-grid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:48px}
.footer-grid h3{font:var(--size-mono) var(--mono);letter-spacing:.08em;color:var(--muted);margin-bottom:20px}
.footer-grid>div>a:not(.brand){display:block;text-decoration:none;font-size:var(--size-mono);margin-bottom:12px}
.footer-grid p{margin-top:16px;font-size:var(--size-mono)}
.risk{max-width:80ch;margin-top:48px;color:var(--muted);font-size:var(--size-mono)}
.colophon{margin-top:28px;font:var(--size-mono) var(--mono);color:var(--muted)}

@media(max-width:980px){.hero-grid{gap:32px}
.hero .lede br{display:none}

.hero{min-height:auto}
.footer-grid{gap:32px}
}
@media(max-width:767px){.pill-clock{display:none}
.wrap{width:calc(100% - 36px)}
.hero,.page-intro{padding-top:48px}
.hero{padding-bottom:64px}
.hero-grid{grid-template-columns:1fr;gap:40px}
.hero h1{max-width:8ch}
.hero-side{gap:24px}
.band{padding:64px 0}
.card{padding:24px}
.fields,.mechanism-steps,.faq-grid{grid-template-columns:1fr;gap:28px}
.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.stat-row{gap:12px}
.ca-row{gap:8px}
.ca-row .btn{padding-inline:16px}




.chart svg{min-height:180px}
}
@media(max-width:370px){.row-btns .btn{width:100%}

.footer-grid{grid-template-columns:1fr}
}
.sub,.publication-note,.stat-row dt,.mechanism-steps p,.mechanism-steps li::before,.qa p,.phase-list p,.footer-grid h3,.footer-grid p,.footer-grid .text-button:disabled,.risk,.colophon,.pill-clock>span:first-child,.chain-strip .result-rows dt{color:var(--ink)}
.btn:disabled{color:var(--ink)}
.chart-key{display:block;margin-bottom:8px;color:var(--ink)}

/* Keep five columns for copy and seven for the responsive orb stage. */
.brand img{width:22px;height:22px}

@media(min-width:768px){.hero-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}}
@media(max-width:1499px){.stat-row dt,.stat-row dd{font-size:12px}}
@media(max-width:1279px){.stat-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.hero-object{min-height:40vh;max-width:62vw}}
@media(max-width:767px){.hero-object{aspect-ratio:1200 / 1000}
.hero-object img{width:100%;height:auto;aspect-ratio:1200 / 1000}}



.wallet-control{display:grid;gap:8px;max-width:100%}
#navWalletBalance{display:block;white-space:nowrap;max-width:100%;overflow-x:auto}
@media(max-width:767px){
.hero-object{width:100%;min-height:200px}
.hero-object img{display:block;position:relative;width:100%;height:auto;min-height:200px;object-fit:contain}
.hero-object canvas{display:none}
}

/* Haze polish */
.band,.section{
  --section-top:96px;
  --section-bottom:112px;
  padding-block:var(--section-top) var(--section-bottom);
}
@media(max-width:767px){
  .band,.section{
    --section-top:64px;
    --section-bottom:64px;
  }
}
.card{
  background:var(--card);
  border:1px solid color-mix(in oklch, var(--ink) 8%, transparent);
  border-radius:var(--r-card);
  box-shadow:0 1px 2px oklch(0.2 0.03 285 / 0.05),0 18px 40px -26px oklch(0.2 0.03 285 / 0.25);
  padding:clamp(20px,2.6vw,32px);
}
.card .card{
  box-shadow:none;
  border:0;
  padding:0;
  background:transparent;
}
.card:has(a.btn,button,input,form){
  transition:transform 220ms var(--ease),box-shadow 240ms var(--ease);
}
.card:has(a.btn,button,input,form):hover{
  transform:translateY(-2px);
  box-shadow:0 1px 2px oklch(0.2 0.03 285 / 0.06),0 24px 48px -22px oklch(0.2 0.03 285 / 0.38);
}
.hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.hero::before,
#prestake::before{
  content:"";
  position:absolute;
  inset:-18%;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse 42% 36% at 18% 28%, color-mix(in oklch, var(--accent) 10%, transparent), transparent 70%),
    radial-gradient(ellipse 48% 40% at 82% 72%, color-mix(in oklch, var(--band-alt) 60%, transparent), transparent 72%);
  filter:blur(40px);
  animation:haze-drift 24s ease-in-out infinite alternate;
}
#prestake{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
#prestake::before{
  opacity:0.55;
  inset:-12%;
}
.hero > *,
#prestake > *{
  position:relative;
  z-index:1;
}
@keyframes haze-drift{
  from{transform:translate3d(-2.4%,-1.6%,0) scale(1)}
  to{transform:translate3d(2.8%,2.2%,0) scale(1.05)}
}
@media(prefers-reduced-motion:reduce){
  .hero::before,
  #prestake::before{animation:none}
  .card:has(a.btn,button,input,form),
  .card:has(a.btn,button,input,form):hover{
    transform:none;
    transition:none;
  }
}
.mechanic-lottie{
  aspect-ratio:2 / 1;
  width:100%;
  max-width:640px;
  margin-top:8px;
  border-radius:var(--r-card);
  background:var(--card);
  overflow:hidden;
}
.mechanic-caption{
  margin-top:12px;
  margin-bottom:36px;
  max-width:60ch;
  font-size:var(--size-body);
}
section.history{
  padding-left:0;
  font:inherit;
  overflow-wrap:anywhere;
}
section.history .sub{max-width:60ch}
#historyStatus{
  margin:0 0 12px;
  max-width:60ch;
}
#historyList{
  list-style:none;
  margin:0;
  padding:0;
  max-width:100%;
  min-width:0;
}
.condensation-row{
  display:grid;
  grid-template-columns:12px minmax(0,1fr);
  gap:12px;
  align-items:start;
  padding:16px 0;
  border-top:1px solid color-mix(in oklch, var(--band-alt) 80%, var(--ink));
  max-width:100%;
  min-width:0;
}
.condensation-row:first-child{border-top-color:color-mix(in oklch, var(--ink) 8%, transparent)}
.condensation-mark{
  display:block;
  width:8px;
  height:8px;
  margin-top:8px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 12px color-mix(in oklch, var(--accent) 45%, transparent);
}
.condensation-row.is-refund .condensation-mark{
  background:transparent;
  border:1.5px solid var(--accent);
  box-shadow:none;
}
.condensation-body{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:8px 16px;
  min-width:0;
  max-width:100%;
}
.condensation-amount{
  font-family:var(--font);
  font-weight:600;
  font-size:var(--size-body);
  min-width:0;
  overflow-wrap:anywhere;
}
.condensation-action,
.condensation-wallet,
.condensation-time,
.condensation-tx{
  font-size:var(--size-mono);
  font-family:var(--mono);
  min-width:0;
  overflow-wrap:anywhere;
}
.condensation-wallet,
.condensation-time,
.condensation-tx{
  color:var(--muted);
}
#historyList a{
  min-width:0;
  min-height:0;
  display:inline;
}
@media(max-width:390px){
  .condensation-body{gap:6px 12px}
  .condensation-amount{flex:1 1 100%}
}

/* Presale block: Dev locked CTA and glowing full-length contract (2026-09-15) */
.hero-presale:not([hidden]) { display: grid; gap: 10px; justify-items: start; margin-top: 20px; max-width: 34rem; }
.hero-presale__cta { min-height: 48px; padding-inline: 26px; animation: haze-presale-cta 2.8s ease-in-out infinite; }
.hero-presale__label { margin-top: 6px; font: 500 0.72rem/1.4 var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.hero-presale__ca { display: block; width: 100%; padding: 14px 18px; border: 1px solid color-mix(in oklch, var(--accent) 55%, transparent); border-radius: 16px; background: var(--card); color: var(--ink); font: 500 clamp(0.78rem, 0.72rem + 0.35vw, 0.98rem)/1.5 var(--mono); letter-spacing: 0.02em; text-align: left; white-space: normal; overflow-wrap: anywhere; word-break: break-all; cursor: copy; opacity: 0; transform: translateY(6px); animation: haze-presale-appear 0.9s var(--ease) 0.15s forwards, haze-presale-glow 2.6s ease-in-out 1.05s infinite; }
.hero-presale__ca:hover, .hero-presale__ca:focus-visible { border-color: var(--accent); outline: none; }
.hero-presale__ca[data-copied]::after { content: " \00B7 copied"; color: var(--accent-text); }
.ca-card[hidden] { display: none !important; }
@keyframes haze-presale-appear { to { opacity: 1; transform: none; } }
@keyframes haze-presale-glow {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in oklch, var(--accent) 0%, transparent), 0 8px 24px -14px color-mix(in oklch, var(--accent) 45%, transparent); }
  50% { box-shadow: 0 0 0 3px color-mix(in oklch, var(--accent) 22%, transparent), 0 0 32px color-mix(in oklch, var(--accent) 55%, transparent); }
}
@keyframes haze-presale-cta { 0%, 100% { box-shadow: 0 0 0 0 color-mix(in oklch, var(--ink) 30%, transparent); } 50% { box-shadow: 0 0 0 7px color-mix(in oklch, var(--ink) 0%, transparent); } }
@media (prefers-reduced-motion: reduce) {
  .hero-presale__cta { animation: none; }
  .hero-presale__ca { opacity: 1; transform: none; animation: none; box-shadow: 0 0 0 3px color-mix(in oklch, var(--accent) 22%, transparent), 0 0 24px color-mix(in oklch, var(--accent) 40%, transparent); }
}
@media (max-width: 767px) { .hero-presale:not([hidden]) { max-width: 100%; } }
/* Wallet picker fallback links and staker wallet links */
a.wallet-picker__row--link { text-decoration: none; color: inherit; }
a.wallet-picker__row--link:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.stakers-wallet-link { color: var(--ink); font-family: var(--mono); text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 3px; overflow-wrap: anywhere; }
.stakers-wallet-link:hover { color: var(--accent-text); }