@font-face{
  font-family:"Bytesized";
  src:url("./fonts/Bytesized-Regular.ttf") format("truetype");
  font-display:swap;
}
@font-face{
  font-family:"DotGothic16";
  src:url("./fonts/DotGothic16-Regular.ttf") format("truetype");
  font-display:swap;
}
@font-face{
  font-family:"Pond Mono";
  src:url("./fonts/DMMono-Regular.ttf") format("truetype");
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"Pond Mono";
  src:url("./fonts/DMMono-Medium.ttf") format("truetype");
  font-weight:500 700;
  font-display:swap;
}

:root{
  --ink:#07100d;
  --ink-2:#0a1814;
  --swamp-deep:#102b1e;
  --swamp:#1b442d;
  --swamp-mid:#2d6841;
  --swamp-light:#4c8455;
  --indigo-deep:#111832;
  --indigo:#1d2850;
  --indigo-light:#33416f;
  --lily:#e88eb4;
  --lily-light:#f7bdd3;
  --lily-deep:#924661;
  --firefly:#f2dc63;
  --firefly-light:#fff3a1;
  --paper:#e9efd0;
  --paper-dim:#b8c9ad;
  --paper-faint:#83977e;
  --line:rgba(242,220,99,.24);
  --line-soft:rgba(233,239,208,.13);
  --line-lily:rgba(232,142,180,.42);
  --display:"Bytesized","DotGothic16",sans-serif;
  --body:"DotGothic16","Pond Mono",sans-serif;
  --mono:"Pond Mono","DotGothic16",monospace;
  --card-shadow:9px 9px 0 rgba(3,9,7,.64),0 28px 70px rgba(0,0,0,.36);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{
  margin:0;
  color:var(--paper);
  background:
    radial-gradient(720px 480px at 88% 4%,rgba(29,40,80,.78),transparent 67%),
    radial-gradient(900px 620px at 8% 35%,rgba(45,104,65,.22),transparent 71%),
    linear-gradient(180deg,#07100d 0%,#0a1814 46%,#07100d 100%);
  font:16px/1.62 var(--body);
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(242,220,99,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(242,220,99,.025) 1px,transparent 1px),
    radial-gradient(circle at 3px 3px,rgba(76,132,85,.23) 0 1px,transparent 1.4px);
  background-size:34px 34px,34px 34px,17px 17px;
  mask-image:linear-gradient(#000 0%,rgba(0,0,0,.9) 70%,transparent 100%);
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:80;
  pointer-events:none;
  opacity:.09;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.75) 3px 4px);
}
::selection{background:var(--lily);color:var(--ink)}
a{color:var(--firefly-light);text-decoration:none}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
[hidden]{display:none!important}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
:focus-visible{
  outline:3px solid var(--firefly);
  outline-offset:3px;
}

.pond-glow,
.pixel-rain{
  position:fixed;
  inset:0;
  pointer-events:none;
}
.pond-glow{
  z-index:-1;
  opacity:.48;
  background:
    radial-gradient(circle at 12% 18%,rgba(242,220,99,.11),transparent 18%),
    radial-gradient(circle at 84% 42%,rgba(232,142,180,.09),transparent 20%),
    radial-gradient(circle at 42% 87%,rgba(45,104,65,.17),transparent 24%);
}
.pixel-rain{
  z-index:40;
  opacity:.2;
  background-image:
    radial-gradient(circle at 15% 24%,var(--firefly) 0 1px,transparent 1.6px),
    radial-gradient(circle at 76% 63%,var(--lily) 0 1px,transparent 1.6px),
    radial-gradient(circle at 58% 12%,var(--firefly-light) 0 1px,transparent 1.6px);
  background-size:127px 111px,173px 149px,211px 191px;
  animation:firefly-drift 18s linear infinite;
}

.pond-wrap{
  width:min(1200px,calc(100% - 36px));
  margin-inline:auto;
}

.hud{
  position:sticky;
  top:0;
  z-index:70;
  background:rgba(7,16,13,.93);
  border-bottom:2px solid var(--indigo-light);
  box-shadow:0 1px 0 var(--line),0 12px 32px rgba(0,0,0,.28);
  backdrop-filter:blur(15px) saturate(1.15);
}
.hud::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-6px;
  height:6px;
  pointer-events:none;
  background:
    repeating-linear-gradient(90deg,var(--indigo-light) 0 8px,transparent 8px 16px);
  opacity:.38;
}
.hud-shell{
  width:min(1240px,calc(100% - 28px));
  min-height:70px;
  margin-inline:auto;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
}
.wordmark{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-width:max-content;
  color:var(--paper);
  font:26px/1 var(--display);
  letter-spacing:.035em;
  text-shadow:3px 3px 0 rgba(29,40,80,.9);
}
.wordmark b{color:var(--firefly);font-weight:400}
.wordmark small{
  align-self:flex-end;
  margin:0 0 2px -4px;
  color:var(--lily-light);
  font:8px/1 var(--mono);
  letter-spacing:.18em;
}
.toad-glyph{
  position:relative;
  width:30px;
  height:24px;
  flex:none;
  background:var(--swamp-mid);
  clip-path:polygon(0 42%,9% 42%,9% 20%,29% 20%,29% 5%,44% 5%,44% 20%,56% 20%,56% 5%,71% 5%,71% 20%,91% 20%,91% 42%,100% 42%,100% 82%,84% 82%,84% 100%,16% 100%,16% 82%,0 82%);
  box-shadow:inset 0 -6px 0 var(--swamp-deep);
}
.toad-glyph i{
  position:absolute;
  top:9px;
  width:5px;
  height:5px;
  background:var(--firefly-light);
  box-shadow:2px 2px 0 var(--ink);
}
.toad-glyph i:first-child{left:7px}
.toad-glyph i:last-child{right:7px}
.hud-index{
  min-width:0;
  display:flex;
  align-items:stretch;
  justify-content:center;
  gap:1px;
  overflow-x:auto;
  scrollbar-width:none;
}
.hud-index::-webkit-scrollbar{display:none}
.hud-index a{
  min-width:max-content;
  display:flex;
  flex-direction:column;
  gap:1px;
  padding:9px 8px 7px;
  color:var(--paper-dim);
  border-left:1px solid transparent;
  border-right:1px solid transparent;
  transition:color .16s,background .16s,border-color .16s;
}
.hud-index a:hover{
  color:var(--firefly-light);
  background:rgba(29,40,80,.62);
  border-color:var(--line);
}
.hud-index b{
  color:var(--lily);
  font:9px/1 var(--mono);
  letter-spacing:.12em;
}
.hud-index span{
  font:10px/1.25 var(--mono);
  letter-spacing:.055em;
  text-transform:uppercase;
}
.hud-tools{
  display:flex;
  align-items:center;
  gap:8px;
  flex:none;
}
.lang-wrap{display:block}
select,input,textarea{
  color:var(--paper);
  border:1px solid var(--line-soft);
  border-radius:0;
  background:rgba(7,16,13,.9);
  outline:none;
}
select{
  height:38px;
  max-width:116px;
  padding:0 28px 0 9px;
  color:var(--firefly-light);
  font:10px var(--mono);
  border-color:var(--line);
}
input:focus,textarea:focus,select:focus{
  border-color:var(--firefly);
  box-shadow:0 0 0 3px rgba(242,220,99,.12);
}
.connect-key{
  min-height:40px;
  padding:8px 15px;
  color:var(--ink);
  background:var(--firefly);
  border:0;
  border-radius:0;
  box-shadow:4px 4px 0 var(--lily-deep);
  font:700 12px var(--mono);
  letter-spacing:.04em;
  text-transform:uppercase;
  transition:transform .15s,box-shadow .15s,background .15s;
}
.connect-key:hover{
  transform:translate(-1px,-1px);
  background:var(--firefly-light);
  box-shadow:6px 6px 0 var(--lily-deep);
}
.connect-key:disabled{opacity:.6;cursor:wait}

.first-screen{
  position:relative;
  padding:34px 0 78px;
}
.first-screen::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:520px;
  pointer-events:none;
  background:
    radial-gradient(700px 340px at 76% 12%,rgba(232,142,180,.13),transparent 68%),
    linear-gradient(180deg,rgba(29,40,80,.2),transparent);
}
.deck-card{
  position:relative;
  border:2px solid var(--line);
  border-radius:0;
  background:
    linear-gradient(135deg,rgba(242,220,99,.025),transparent 34%),
    repeating-linear-gradient(0deg,rgba(233,239,208,.015) 0 2px,transparent 2px 6px),
    var(--ink-2);
  box-shadow:var(--card-shadow);
}
.deck-card::before{
  content:"";
  position:absolute;
  top:-2px;
  left:18px;
  width:78px;
  height:5px;
  background:var(--lily);
  box-shadow:86px 0 0 var(--firefly);
  pointer-events:none;
}
.deck-card::after{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(233,239,208,.055);
  pointer-events:none;
}
.hero-sheet{
  min-height:470px;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);
  overflow:hidden;
  transform:rotate(-.15deg);
}
.hero-type{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:46px 50px 39px;
}
.board-label{
  margin:0;
  color:var(--firefly);
  font:10px/1.5 var(--mono);
  letter-spacing:.16em;
  text-transform:uppercase;
}
.board-label::before{
  content:"";
  display:inline-block;
  width:7px;
  height:7px;
  margin-right:8px;
  background:var(--lily);
  box-shadow:9px 0 0 var(--firefly);
  vertical-align:1px;
}
.hero-type h1{
  max-width:760px;
  margin:15px 0 20px;
  color:var(--paper);
  font:clamp(54px,6.2vw,94px)/.88 var(--display);
  letter-spacing:.005em;
  text-transform:uppercase;
  text-wrap:balance;
  text-shadow:
    5px 0 0 rgba(232,142,180,.22),
    -4px 0 0 rgba(242,220,99,.16),
    7px 7px 0 rgba(17,24,50,.8);
}
.hero-type h1 span{display:block}
.hero-type h1 span:first-child{color:var(--firefly-light)}
.hero-note{
  max-width:690px;
  margin:0;
  color:var(--paper-dim);
  font-size:16px;
  line-height:1.72;
}
.hero-keys{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:27px 0 24px;
}
.action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:11px 21px;
  border:1px solid transparent;
  border-radius:0;
  font:700 13px/1.2 var(--mono);
  letter-spacing:.04em;
  text-align:center;
  text-transform:uppercase;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
  transition:transform .15s,filter .15s,background .15s,border-color .15s;
}
.action:hover{transform:translateY(-2px);filter:brightness(1.06)}
.action:disabled{opacity:.4;cursor:not-allowed;transform:none;filter:none}
.action-firefly{
  color:var(--ink);
  background:var(--firefly);
  box-shadow:4px 4px 0 var(--lily-deep);
}
.action-firefly:hover{background:var(--firefly-light)}
.action-ghost{
  color:var(--paper);
  background:rgba(17,24,50,.58);
  border-color:var(--line);
}
.action-ghost:hover{border-color:var(--lily);background:rgba(29,40,80,.8)}
.action-small{
  min-height:36px;
  padding:8px 13px;
  font-size:10px;
}
.hero-facts{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin:0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.hero-facts div{
  min-width:0;
  padding:12px 12px 10px;
  border-right:1px solid var(--line-soft);
}
.hero-facts div:last-child{border-right:0}
.hero-facts dt{
  color:var(--paper);
  font:18px/1 var(--display);
  letter-spacing:.025em;
}
.hero-facts dd{
  margin:4px 0 0;
  color:var(--paper-faint);
  font:8px/1.4 var(--mono);
  letter-spacing:.06em;
  text-transform:uppercase;
}
.hero-plate{
  position:relative;
  min-height:100%;
  margin:0;
  overflow:hidden;
  border-left:2px solid var(--line);
  background:var(--indigo-deep);
}
.hero-plate::before{
  content:"";
  position:absolute;
  inset:16px;
  z-index:2;
  border:2px solid rgba(242,220,99,.55);
  clip-path:polygon(0 0,18% 0,18% 2px,82% 2px,82% 0,100% 0,100% 18%,calc(100% - 2px) 18%,calc(100% - 2px) 82%,100% 82%,100% 100%,82% 100%,82% calc(100% - 2px),18% calc(100% - 2px),18% 100%,0 100%,0 82%,2px 82%,2px 18%,0 18%);
  pointer-events:none;
}
.hero-plate::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(7,16,13,.54),transparent 23%),
    linear-gradient(0deg,rgba(7,16,13,.82),transparent 41%),
    radial-gradient(circle at 72% 26%,transparent 0 22%,rgba(17,24,50,.24) 77%);
}
.hero-plate img{
  width:100%;
  height:100%;
  min-height:470px;
  object-fit:cover;
  object-position:center;
  image-rendering:auto;
}
.hero-plate figcaption{
  position:absolute;
  right:26px;
  bottom:24px;
  left:26px;
  z-index:3;
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 12px;
  color:var(--paper);
  border:1px solid rgba(242,220,99,.38);
  background:rgba(7,16,13,.82);
  font:10px var(--mono);
  letter-spacing:.13em;
}
.hero-plate figcaption b{
  margin-left:auto;
  color:var(--firefly);
  font:21px var(--display);
  letter-spacing:.02em;
}
.firefly-pip{
  width:7px;
  height:7px;
  background:var(--firefly);
  box-shadow:0 0 12px var(--firefly);
  animation:firefly-blink 2.8s steps(2,end) infinite;
}
.plate-corner{
  position:absolute;
  z-index:4;
  width:28px;
  height:28px;
  border-color:var(--lily);
  pointer-events:none;
}
.plate-corner-a{top:10px;left:10px;border-top:5px solid;border-left:5px solid}
.plate-corner-b{right:10px;bottom:10px;border-right:5px solid;border-bottom:5px solid}

.mint-sheet{
  margin-top:24px;
  padding:0;
  background:
    linear-gradient(135deg,rgba(232,142,180,.05),transparent 29%),
    repeating-linear-gradient(90deg,rgba(233,239,208,.012) 0 1px,transparent 1px 7px),
    #0b1b16;
  transform:rotate(.1deg);
}
.sheet-cap{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  padding:25px 28px 20px;
  border-bottom:1px solid var(--line-soft);
}
.sheet-title{
  display:flex;
  align-items:center;
  gap:18px;
  min-width:0;
}
.tab-tag{
  display:grid;
  place-items:center;
  flex:none;
  width:75px;
  min-height:64px;
  padding:9px 7px;
  color:var(--firefly-light);
  border:1px solid var(--line);
  background:var(--indigo-deep);
  text-align:center;
  font:8px/1.3 var(--mono);
  letter-spacing:.06em;
  text-transform:uppercase;
}
.tab-tag b{
  display:block;
  color:var(--lily);
  font:28px/1 var(--display);
}
.sheet-title h2{
  margin:0;
  color:var(--paper);
  font:clamp(31px,4vw,48px)/.98 var(--display);
  letter-spacing:.01em;
  text-transform:uppercase;
}
.mint-signal{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:6px;
  flex:none;
}
.mint-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:32px;
  padding:6px 10px;
  color:var(--firefly-light);
  border:1px solid var(--line);
  background:rgba(17,24,50,.75);
  font:9px var(--mono);
  letter-spacing:.06em;
  text-transform:uppercase;
}
.mint-chip.live{border-color:var(--lily);color:var(--lily-light)}
.mint-chip.warn{border-color:var(--lily-deep);color:var(--lily-light)}
.status-pulse{
  width:7px;
  height:7px;
  background:var(--firefly);
  box-shadow:0 0 10px var(--firefly);
  animation:firefly-blink 2s steps(2,end) infinite;
}
.mint-chip.live .status-pulse{background:var(--lily);box-shadow:0 0 10px var(--lily)}
.countdown-note{
  color:var(--paper-faint);
  font:9px var(--mono);
  letter-spacing:.04em;
}
.pond-progress{
  display:grid;
  grid-template-columns:minmax(125px,.6fr) minmax(260px,1.35fr) minmax(300px,.9fr);
  align-items:center;
  gap:20px;
  padding:17px 28px;
  border-bottom:1px solid var(--line-soft);
  background:rgba(17,24,50,.2);
}
.progress-copy{
  display:flex;
  align-items:baseline;
  gap:6px;
  white-space:nowrap;
}
.progress-copy span{color:var(--paper-faint);font:11px var(--mono)}
.progress-copy b{color:var(--paper);font:30px/1 var(--display);letter-spacing:.02em}
.progress-copy em{
  color:var(--lily);
  font:8px var(--mono);
  font-style:normal;
  text-transform:uppercase;
}
.reed-meter{
  display:grid;
  grid-template-columns:repeat(20,minmax(2px,1fr));
  gap:3px;
  height:22px;
}
.reed-meter i{
  border:1px solid rgba(242,220,99,.17);
  background:var(--ink);
  transition:background .3s,box-shadow .3s;
}
.reed-meter i.on{
  background:linear-gradient(180deg,var(--lily),var(--firefly));
  box-shadow:0 0 8px rgba(242,220,99,.28);
}
.ripple-clock{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border:1px solid var(--line);
  background:var(--ink);
}
.ripple-clock div{
  min-width:0;
  padding:8px 5px 7px;
  text-align:center;
  border-right:1px solid var(--line-soft);
}
.ripple-clock div:last-child{border-right:0}
.ripple-clock strong{
  display:block;
  color:var(--firefly-light);
  font:22px/1 var(--display);
}
.ripple-clock span{
  display:block;
  margin-top:3px;
  color:var(--paper-faint);
  font:7px var(--mono);
  letter-spacing:.05em;
  text-transform:uppercase;
}

.mint-table{
  display:grid;
  grid-template-columns:minmax(0,.98fr) minmax(370px,1.02fr);
  border-bottom:1px solid var(--line);
}
.mint-paid,
.free-lanes{
  position:relative;
  min-width:0;
  padding:25px 27px 27px;
}
.mint-paid::before{
  content:"";
  position:absolute;
  top:18px;
  right:-1px;
  bottom:18px;
  width:2px;
  background:
    repeating-linear-gradient(0deg,var(--lily) 0 7px,transparent 7px 14px);
}
.free-lanes{
  background:
    radial-gradient(circle at 87% 12%,rgba(242,220,99,.09),transparent 30%),
    rgba(17,24,50,.52);
}
.column-cap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:17px;
}
.price-stamp{
  flex:none;
  padding:5px 8px;
  color:var(--ink);
  background:var(--lily);
  font:17px/1 var(--display);
  letter-spacing:.02em;
}
.price-stamp small{font:8px var(--mono);letter-spacing:.08em}
.slot-key{
  color:var(--paper-faint);
  font:8px var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.eligibility{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:9px 11px 9px 14px;
  border:1px solid var(--line-soft);
  border-left:4px solid var(--lily);
  background:rgba(232,142,180,.055);
}
.eligibility i{
  width:7px;
  height:7px;
  flex:none;
  background:var(--lily);
  box-shadow:0 0 10px var(--lily);
}
.eligibility p{margin:0;color:var(--paper-dim);font-size:12px;line-height:1.5}
.eligibility.eligible{
  border-color:var(--line);
  border-left-color:var(--firefly);
  background:rgba(242,220,99,.07);
}
.eligibility.eligible i{background:var(--firefly);box-shadow:0 0 10px var(--firefly)}
.eligibility.eligible p{color:var(--firefly-light)}
.quantity-line{
  display:flex;
  align-items:center;
  gap:9px;
  margin:17px 0 13px;
  padding-top:15px;
  border-top:1px solid var(--line-soft);
}
.quantity-line label{
  margin-right:auto;
  color:var(--paper-dim);
  font:10px var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.stepper{
  display:flex;
  align-items:center;
  border:1px solid var(--line);
  background:var(--ink);
}
.stepper button{
  width:36px;
  height:36px;
  padding:0;
  color:var(--firefly);
  border:0;
  background:transparent;
  font:18px var(--mono);
}
.stepper button:hover{background:rgba(242,220,99,.08)}
.stepper input{
  width:54px;
  height:36px;
  padding:0;
  border:0;
  border-inline:1px solid var(--line-soft);
  border-radius:0;
  text-align:center;
  font:12px var(--mono);
  -moz-appearance:textfield;
}
.stepper input::-webkit-outer-spin-button,
.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.max-key{
  min-height:38px;
  padding:7px 10px;
  color:var(--paper);
  border:1px solid var(--line);
  background:var(--indigo-deep);
  font:9px var(--mono);
  letter-spacing:.08em;
}
.max-key:hover{border-color:var(--firefly);color:var(--firefly-light)}
.cost-board{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  border:1px solid var(--line-soft);
}
.cost-board>div{
  min-width:0;
  padding:9px 10px;
  border-right:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}
.cost-board>div:nth-child(2n){border-right:0}
.cost-board>div:nth-last-child(-n+2){border-bottom:0}
.cost-board span{
  display:block;
  color:var(--paper-faint);
  font:7px var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.cost-board b{
  display:block;
  min-width:0;
  margin-top:2px;
  overflow:hidden;
  color:var(--paper);
  font:10px var(--mono);
  text-overflow:ellipsis;
  white-space:nowrap;
}
.cost-board .cost-earn{background:rgba(232,142,180,.06)}
.cost-board .cost-earn b{color:var(--lily-light)}
.mint-key{
  width:100%;
  min-height:58px;
  margin-top:13px;
  padding:12px 18px;
  color:var(--ink);
  border:0;
  border-radius:0;
  background:
    linear-gradient(90deg,var(--firefly) 0 72%,var(--lily-light) 72%);
  box-shadow:5px 5px 0 var(--lily-deep);
  font:700 13px/1.25 var(--mono);
  letter-spacing:.04em;
  text-transform:uppercase;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
}
.mint-key:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-1px)}
.mint-key:disabled{opacity:.46;cursor:not-allowed}
.status-line{
  display:none;
  margin-top:10px;
  padding:9px 10px;
  border:1px solid var(--line-soft);
  color:var(--paper-dim);
  font-size:11px;
}
.status-line.show{display:block}
.status-line.ok{
  border-color:var(--line);
  background:rgba(242,220,99,.06);
  color:var(--firefly-light);
}
.status-line.err{
  border-color:var(--line-lily);
  background:rgba(232,142,180,.08);
  color:var(--lily-light);
}
.referral-note{
  margin:9px 0 0;
  color:var(--lily-light);
  font:9px var(--mono);
}

.lane-ticket{
  position:relative;
  padding:13px 14px 12px 16px;
  border:1px solid var(--line-soft);
  background:rgba(7,16,13,.67);
}
.lane-ticket+.lane-ticket{margin-top:9px}
.lane-ticket::before{
  content:"";
  position:absolute;
  left:-1px;
  top:9px;
  bottom:9px;
  width:3px;
  background:var(--firefly);
}
.lane-x::before{background:var(--lily)}
.ticket-head{
  display:grid;
  grid-template-columns:30px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
}
.lane-icon{
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  color:var(--ink);
  background:var(--firefly);
  font:15px/1 var(--display);
}
.lane-x .lane-icon{background:var(--lily)}
.ticket-head h3{
  margin:0;
  color:var(--paper);
  font:19px/1 var(--display);
  letter-spacing:.02em;
  text-transform:uppercase;
}
.ticket-head>b{
  color:var(--paper-faint);
  font:9px var(--mono);
  font-weight:400;
  white-space:nowrap;
}
.ticket-head>b i{color:var(--firefly-light);font-style:normal}
.lane-x .ticket-head>b i{color:var(--lily-light)}
.lane-ticket p{
  margin:8px 0 8px 39px;
  color:var(--paper-dim);
  font-size:11px;
  line-height:1.46;
}
.lane-gauge{
  height:6px;
  margin-left:39px;
  overflow:hidden;
  border:1px solid var(--line-soft);
  background:var(--ink);
}
.lane-gauge i{
  display:block;
  width:0;
  height:100%;
  background:var(--firefly);
  transition:width .4s;
}
.lane-x .lane-gauge i{background:var(--lily)}
.lane-ticket small{
  display:block;
  margin:5px 0 0 39px;
  color:var(--paper-faint);
  font:8px/1.45 var(--mono);
}
.lane-choice{
  display:grid;
  grid-template-columns:32px minmax(0,1fr);
  align-items:center;
  gap:10px;
  margin-top:10px;
  padding:8px 9px;
  border:1px dashed var(--line-lily);
}
.lane-choice>span{
  display:grid;
  place-items:center;
  width:31px;
  height:24px;
  color:var(--ink);
  background:var(--lily);
  font:9px var(--mono);
}
.lane-choice p{margin:0;color:var(--paper-dim);font-size:10px;line-height:1.45}
.odds-rack{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:5px 11px;
  margin-top:13px;
  padding-top:12px;
  border-top:1px solid var(--line-soft);
}
.odds-pip{
  display:grid;
  grid-template-columns:7px minmax(0,1fr) auto;
  align-items:center;
  gap:6px;
  min-width:0;
}
.odds-pip i{
  width:6px;
  height:6px;
  background:var(--tier);
  box-shadow:0 0 6px var(--tier);
}
.odds-pip span{
  overflow:hidden;
  color:var(--paper-dim);
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.odds-pip b{color:var(--paper-faint);font:8px var(--mono);font-weight:400}

.pond-rules-table{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  border-bottom:1px solid var(--line);
  background:var(--indigo-deep);
}
.pond-rules-table>div{
  min-width:0;
  padding:12px 14px;
  border-right:1px solid var(--line-soft);
}
.pond-rules-table>div:last-child{border-right:0}
.pond-rules-table b{
  display:block;
  color:var(--firefly);
  font:20px/1 var(--display);
  letter-spacing:.02em;
}
.pond-rules-table span{
  display:block;
  margin-top:5px;
  color:var(--paper-dim);
  font-size:10px;
  line-height:1.45;
}
.pond-rules-table .rule-accent{background:rgba(232,142,180,.075)}
.pond-rules-table .rule-accent b{color:var(--lily-light)}

.x-dock{
  margin:22px 28px 28px;
  padding:22px;
  border:1px solid var(--line);
  background:
    linear-gradient(120deg,rgba(232,142,180,.075),transparent 43%),
    linear-gradient(180deg,rgba(29,40,80,.7),rgba(17,24,50,.5));
}
.x-dock-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  margin-bottom:16px;
}
.x-dock h3{
  margin:5px 0 5px;
  color:var(--paper);
  font:29px/1 var(--display);
  letter-spacing:.015em;
  text-transform:uppercase;
}
.x-dock-head p:not(.board-label){
  max-width:700px;
  margin:0;
  color:var(--paper-dim);
  font-size:11px;
}
.x-badge{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  flex:none;
  color:var(--ink);
  background:var(--firefly);
  box-shadow:4px 4px 0 var(--lily-deep);
  font:23px/1 var(--display);
}
.x-steps{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:17px;
}
.x-step{
  min-width:0;
  padding:13px;
  border:1px solid var(--line-soft);
  background:rgba(7,16,13,.48);
}
.x-step label{
  display:block;
  margin-bottom:7px;
  color:var(--firefly-light);
  font:9px var(--mono);
  letter-spacing:.055em;
  text-transform:uppercase;
}
.x-step textarea{
  width:100%;
  min-height:179px;
  padding:11px;
  resize:vertical;
  border-radius:0;
  font:10px/1.62 var(--mono);
}
.x-step input{
  width:100%;
  min-height:43px;
  padding:10px 11px;
  border-radius:0;
  font:10px var(--mono);
}
.inline-keys,
.x-actions{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.inline-keys{margin-top:7px}
.x-step-label{
  margin:13px 0 7px;
  color:var(--paper-dim);
  font:9px/1.45 var(--mono);
  text-transform:uppercase;
}
.x-actions .action{flex:1}
.turnstile-box{margin-top:10px}
.turnstile-box:empty{display:none}
.x-note{
  margin:9px 0 0;
  color:var(--paper-faint);
  font:8px/1.55 var(--mono);
}

.chapter{
  position:relative;
  padding:34px 0 62px;
  scroll-margin-top:94px;
}
.chapter-card{
  padding:27px 30px 30px;
}
.chapter-cap{
  display:flex;
  align-items:flex-start;
  gap:17px;
  margin-bottom:21px;
}
.index-tab{
  display:grid;
  place-items:center;
  width:52px;
  min-height:48px;
  flex:none;
  color:var(--ink);
  background:var(--lily);
  box-shadow:4px 4px 0 var(--indigo);
  font:27px/1 var(--display);
}
.chapter-cap>div{min-width:0}
.chapter-card h2{
  margin:5px 0 8px;
  color:var(--paper);
  font:clamp(36px,4.5vw,58px)/.95 var(--display);
  letter-spacing:.01em;
  text-transform:uppercase;
}
.chapter-lede{
  max-width:760px;
  margin:0;
  color:var(--paper-dim);
  font-size:14px;
  line-height:1.65;
}
.chapter-deck{
  display:grid;
  gap:24px;
}
.rewards-deck{
  grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);
  align-items:start;
}
.reward-chart{
  padding-bottom:25px;
  background:
    radial-gradient(circle at 82% 19%,rgba(242,220,99,.1),transparent 31%),
    repeating-linear-gradient(0deg,rgba(233,239,208,.013) 0 2px,transparent 2px 7px),
    var(--ink-2);
}
.ramp-copy{
  max-width:770px;
  margin:0 0 18px 69px;
  color:var(--paper-dim);
  font-size:12px;
}
.firefly-chart{
  position:relative;
  height:172px;
  display:grid;
  grid-template-columns:repeat(8,1fr);
  align-items:end;
  gap:8px;
  margin:8px 0 0 69px;
  padding:17px 10px 0;
  border-left:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:
    repeating-linear-gradient(0deg,rgba(242,220,99,.05) 0 1px,transparent 1px 34px);
}
.firefly-chart span{
  position:relative;
  height:100%;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.firefly-chart i{
  width:min(35px,70%);
  height:var(--rise);
  min-height:10px;
  display:block;
  background:
    repeating-linear-gradient(0deg,var(--swamp-mid) 0 5px,var(--firefly) 5px 7px);
  box-shadow:0 0 11px rgba(242,220,99,.18);
}
.firefly-chart b{
  position:absolute;
  bottom:-20px;
  color:var(--paper-faint);
  font:8px var(--mono);
}
.firefly-chart .chart-peak i{background:var(--lily);box-shadow:0 0 14px rgba(232,142,180,.36)}
.next-croak{
  width:max-content;
  max-width:calc(100% - 69px);
  display:flex;
  align-items:center;
  gap:14px;
  margin:30px 0 0 69px;
  padding:8px 13px;
  border:1px solid var(--line);
  background:var(--indigo-deep);
}
.next-croak span{
  color:var(--paper-faint);
  font:8px var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.next-croak strong{color:var(--firefly-light);font:20px var(--display)}
.supply-card{
  transform:translateY(26px) rotate(.3deg);
  background:
    linear-gradient(145deg,rgba(232,142,180,.06),transparent 38%),
    var(--ink-2);
}
.supply-total{
  margin:5px 0 0;
  color:var(--paper);
  font:18px/1.25 var(--display);
}
.supply-orbit{
  position:relative;
  width:min(205px,72%);
  aspect-ratio:1;
  display:grid;
  place-items:center;
  margin:6px auto 18px;
}
.pond-ring{
  position:absolute;
  inset:7%;
  display:grid;
  place-items:center;
  border:9px solid var(--swamp-mid);
  border-right-color:var(--lily);
  border-top-color:var(--firefly);
  box-shadow:0 0 0 1px var(--line),0 0 35px rgba(45,104,65,.3);
  transform:rotate(-18deg);
}
.pond-ring::before{
  content:"";
  position:absolute;
  inset:16%;
  border:2px dashed var(--line);
}
.pond-ring span{
  color:var(--paper);
  font:31px/.95 var(--display);
  text-align:center;
  transform:rotate(18deg);
}
.pond-ring small{display:block;color:var(--firefly);font:9px var(--mono)}
.orbit-firefly{
  position:absolute;
  width:8px;
  height:8px;
  background:var(--firefly);
  box-shadow:0 0 14px var(--firefly);
}
.orbit-firefly.one{top:8%;left:17%}
.orbit-firefly.two{right:7%;top:46%;background:var(--lily);box-shadow:0 0 14px var(--lily)}
.orbit-firefly.three{left:28%;bottom:6%}
.supply-list{border-top:1px solid var(--line-soft)}
.supply-list>div{
  display:grid;
  grid-template-columns:10px minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  padding:8px 0;
  border-bottom:1px solid var(--line-soft);
}
.supply-list>div:last-child{border-bottom:0}
.supply-list span{min-width:0;color:var(--paper-dim);font-size:10px}
.supply-list strong{color:var(--paper-faint);font:7px var(--mono);font-weight:400;white-space:nowrap}
.swatch{width:8px;height:8px;display:block}
.swatch-mint{background:var(--firefly)}
.swatch-invite{background:var(--lily)}
.swatch-remain{background:var(--swamp-light)}

.tier-ledger{padding-bottom:18px}
.tier-cap{align-items:center}
.ledger-stamp{
  display:grid;
  place-items:center;
  width:88px;
  height:64px;
  margin-left:auto;
  flex:none;
  color:var(--firefly);
  border:2px solid var(--firefly);
  background:var(--indigo-deep);
  box-shadow:inset 0 0 0 5px var(--ink-2);
  font:16px/1.05 var(--display);
  text-align:center;
  transform:rotate(3deg);
}
.tier-grid{display:grid;border-top:1px solid var(--line)}
.tier-row{
  display:grid;
  grid-template-columns:84px minmax(0,1.35fr) minmax(130px,.6fr) minmax(155px,.65fr);
  align-items:center;
  gap:16px;
  min-width:0;
  padding:10px 4px;
  border-bottom:1px solid var(--line-soft);
  transition:background .16s,padding .16s;
}
.tier-row:hover{background:rgba(29,40,80,.42);padding-inline:10px}
.tier-thumb{
  position:relative;
  width:72px;
  aspect-ratio:1;
  overflow:hidden;
  border:2px solid var(--tier);
  background:var(--indigo-deep);
}
.tier-thumb img{width:100%;height:100%;object-fit:cover}
.tier-rank{
  position:absolute;
  left:0;
  bottom:0;
  padding:2px 5px;
  color:var(--ink);
  background:var(--tier);
  font:9px var(--mono);
}
.tier-copy{min-width:0}
.tier-title-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tier-copy h3{
  margin:0;
  color:var(--paper);
  font:25px/1 var(--display);
  letter-spacing:.015em;
  text-transform:uppercase;
}
.tier-badge{
  padding:2px 5px;
  color:var(--tier);
  border:1px solid var(--tier);
  font:7px var(--mono);
  letter-spacing:.04em;
  text-transform:uppercase;
}
.tier-copy p{
  margin:4px 0 0;
  color:var(--paper-faint);
  font:9px/1.45 var(--mono);
  text-transform:uppercase;
}
.tier-supply{min-width:0}
.tier-supply strong{
  display:block;
  color:var(--paper);
  font:23px/1 var(--display);
}
.tier-supply span{display:block;margin-top:3px;color:var(--paper-faint);font:8px var(--mono)}
.tier-drop{min-width:0;text-align:right}
.tier-drop b{display:block;color:var(--tier);font:17px/1 var(--display)}
.tier-drop span{display:block;margin-top:4px;color:var(--paper-faint);font:8px var(--mono)}

.story-deck{
  display:grid;
  grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);
  align-items:start;
  gap:24px;
}
.story-card{
  background:
    radial-gradient(circle at 20% 18%,rgba(45,104,65,.22),transparent 38%),
    var(--ink-2);
  transform:rotate(-.22deg);
}
.tongue-route{
  display:flex;
  align-items:center;
  gap:8px;
  margin:28px 0;
}
.tongue-route span{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  flex:none;
  color:var(--ink);
  background:var(--firefly);
  font:19px/1 var(--display);
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
}
.tongue-route span:nth-of-type(2){background:var(--lily)}
.tongue-route span:nth-of-type(3){background:var(--swamp-light)}
.tongue-route i{
  height:5px;
  flex:1;
  background:repeating-linear-gradient(90deg,var(--lily) 0 7px,transparent 7px 13px);
}
.step-tiles{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:0;
  padding:0;
  list-style:none;
}
.step-tiles li{
  position:relative;
  min-height:145px;
  padding:20px 18px 17px 58px;
  border:1px solid var(--line-soft);
  background:
    linear-gradient(145deg,rgba(29,40,80,.7),rgba(10,24,20,.8));
  box-shadow:5px 5px 0 rgba(3,9,7,.42);
}
.step-tiles li:nth-child(2){transform:translateY(13px)}
.step-tiles li:nth-child(3){transform:translateY(-4px)}
.step-tiles li:nth-child(4){transform:translateY(9px)}
.step-tiles li>span{
  position:absolute;
  top:18px;
  left:15px;
  color:var(--lily);
  font:22px/1 var(--display);
}
.step-tiles p{margin:0;color:var(--paper-dim);font-size:12px;line-height:1.6}

.index-board{
  background:
    linear-gradient(150deg,rgba(17,24,50,.7),transparent 50%),
    repeating-linear-gradient(90deg,rgba(233,239,208,.012) 0 1px,transparent 1px 8px),
    var(--ink-2);
}
.index-cap{align-items:center}
.index-cap>.action{margin-left:auto;flex:none}
.model-lineup{min-width:0}
.lineup-group{margin-top:10px}
.lineup-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin:18px 0 9px;
  padding-bottom:7px;
  border-bottom:1px solid var(--line-soft);
}
.lineup-head i{width:8px;height:8px;background:var(--tier)}
.lineup-head h3{
  margin:0;
  color:var(--paper);
  font:21px/1 var(--display);
  text-transform:uppercase;
}
.lineup-head span{
  margin-left:auto;
  color:var(--paper-faint);
  font:8px var(--mono);
}
.lineup-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:10px;
}
.lineup-card{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--line-soft);
  background:rgba(7,16,13,.7);
  transition:transform .16s,border-color .16s;
}
.lineup-card:hover{transform:translateY(-3px);border-color:var(--tier)}
.lineup-picture{
  position:relative;
  aspect-ratio:1;
  overflow:hidden;
  border-bottom:2px solid var(--tier);
  background:var(--indigo-deep);
}
.lineup-picture img{width:100%;height:100%;object-fit:cover}
.lineup-number{
  position:absolute;
  top:6px;
  left:6px;
  padding:2px 5px;
  color:var(--ink);
  background:var(--firefly);
  font:8px var(--mono);
}
.lineup-copy{min-width:0;padding:8px 9px 9px}
.lineup-copy small{
  display:block;
  overflow:hidden;
  color:var(--paper-faint);
  font:7px var(--mono);
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}
.lineup-copy strong{
  display:block;
  margin:2px 0;
  overflow:hidden;
  color:var(--paper);
  font:17px/1.05 var(--display);
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}
.lineup-copy span{color:var(--tier);font:7px var(--mono)}

.market-board{
  display:grid;
  grid-template-columns:minmax(0,1.24fr) minmax(330px,.76fr);
  align-items:start;
  gap:24px;
}
.market-list-card{padding-bottom:22px}
.market-cap{align-items:center}
.fee-seal{
  margin-left:auto;
  flex:none;
  padding:8px 11px;
  color:var(--ink);
  background:var(--lily);
  box-shadow:3px 3px 0 var(--indigo);
  font:10px var(--mono);
  text-transform:uppercase;
}
.market-state{
  margin:0 0 14px;
  padding:8px 10px;
  color:var(--paper-faint);
  border-left:3px solid var(--lily);
  background:rgba(232,142,180,.04);
  font:9px var(--mono);
}
.market-state:empty{display:none}
.market-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(158px,1fr));
  gap:11px;
}
.lily-listing{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--line-soft);
  background:rgba(10,24,20,.72);
}
.listing-picture{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  background:var(--indigo-deep);
}
.listing-picture img{width:100%;height:100%;object-fit:cover}
.listing-id{
  position:absolute;
  top:6px;
  left:6px;
  padding:2px 5px;
  color:var(--ink);
  background:var(--firefly);
  font:8px var(--mono);
}
.listing-data{min-width:0;padding:9px}
.listing-row{
  display:flex;
  justify-content:space-between;
  gap:6px;
  color:var(--paper-faint);
  font:7px var(--mono);
  text-transform:uppercase;
}
.listing-row:first-child span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.listing-name{
  display:block;
  margin:5px 0 8px;
  overflow:hidden;
  color:var(--paper);
  font:18px/1 var(--display);
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}
.listing-price{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:7px;
  padding-top:7px;
  border-top:1px solid var(--line-soft);
}
.listing-price strong{color:var(--firefly-light);font:14px/1 var(--display)}
.listing-price span{color:var(--paper-faint);font:7px var(--mono)}
.listing-buy{
  width:100%;
  min-height:33px;
  margin-top:8px;
  padding:7px;
  color:var(--ink);
  border:0;
  background:var(--lily);
  font:8px var(--mono);
  text-transform:uppercase;
}
.listing-buy:hover{background:var(--lily-light)}
.listing-buy:disabled{opacity:.45;cursor:not-allowed}
.seller-card{
  padding:20px;
  background:
    linear-gradient(160deg,rgba(232,142,180,.07),transparent 40%),
    var(--ink-2);
}
.seller-cap{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.seller-note{
  margin:5px 0 0;
  color:var(--paper-dim);
  font-size:10px;
}
.field-label{
  display:block;
  margin:0 0 6px;
  color:var(--paper-dim);
  font:8px var(--mono);
  letter-spacing:.06em;
  text-transform:uppercase;
}
.seller-picker{
  margin:17px 0 15px;
  padding-top:14px;
  border-top:1px solid var(--line-soft);
}
.frog-picker{
  max-height:286px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  overflow:auto;
  scrollbar-color:var(--lily) var(--ink);
}
.picker-token{
  min-width:0;
  padding:0;
  overflow:hidden;
  color:var(--paper);
  border:1px solid var(--line-soft);
  background:var(--ink);
  text-align:left;
}
.picker-token:hover,
.picker-token.selected{border-color:var(--firefly);background:rgba(242,220,99,.08)}
.picker-token img{width:100%;aspect-ratio:1;object-fit:cover}
.picker-token span{
  display:block;
  padding:5px 4px;
  overflow:hidden;
  font:7px var(--mono);
  text-overflow:ellipsis;
  white-space:nowrap;
}
.seller-price input{
  width:100%;
  min-height:43px;
  padding:9px 10px;
  border-radius:0;
  font:11px var(--mono);
}
.seller-price p{
  margin:6px 0 0;
  color:var(--paper-faint);
  font:8px/1.5 var(--mono);
}
.seller-keys{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  margin-top:14px;
}
.seller-keys .action{width:100%}

.nest-board{
  display:grid;
  grid-template-columns:minmax(280px,.42fr) minmax(0,1.58fr);
  align-items:start;
  gap:24px;
}
.nest-rail{display:grid;gap:18px}
.claim-card{
  padding:22px;
  background:
    radial-gradient(circle at 78% 20%,rgba(242,220,99,.13),transparent 34%),
    linear-gradient(140deg,rgba(232,142,180,.08),transparent 52%),
    var(--ink-2);
}
.claim-card .index-tab{margin-bottom:18px}
.claim-amount{
  display:block;
  margin:7px 0 16px;
  color:var(--firefly-light);
  font:clamp(46px,5vw,67px)/.9 var(--display);
  letter-spacing:.01em;
  text-shadow:0 0 24px rgba(242,220,99,.18);
}
.invite-card{padding:21px}
.invite-copy{margin:8px 0 14px;color:var(--paper-dim);font-size:11px}
.copy-key{display:flex;margin-bottom:13px}
.copy-key input{
  width:100%;
  min-width:0;
  padding:9px;
  border-right:0;
  font:8px var(--mono);
}
.copy-key .action{flex:none}
.invite-counter{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}
.invite-counter div{padding:9px 0}
.invite-counter div+div{padding-left:12px;border-left:1px solid var(--line-soft)}
.invite-counter span{display:block;color:var(--paper-faint);font:7px var(--mono);text-transform:uppercase}
.invite-counter strong{display:block;margin-top:2px;color:var(--lily-light);font:20px var(--display)}
.referred-note{margin:8px 0 0;color:var(--paper-faint);font:8px/1.5 var(--mono)}
.nest-card{padding:23px}
.nest-cap{align-items:center}
.nest-cap .action{margin-left:auto;flex:none}
.nest-note{
  margin:0 0 13px;
  color:var(--paper-faint);
  font:9px var(--mono);
}
.frog-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(158px,1fr));
  gap:11px;
}
.nest-token{
  position:relative;
  min-width:0;
  overflow:hidden;
  border:1px solid var(--line-soft);
  background:rgba(7,16,13,.72);
}
.token-picture{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  background:var(--indigo-deep);
}
.token-picture img{width:100%;height:100%;object-fit:cover;filter:hue-rotate(var(--hue,0deg))}
.nest-token.sealed .token-picture img{object-fit:contain;padding:13px;filter:drop-shadow(0 0 18px rgba(242,220,99,.16))}
.token-stamp{
  position:absolute;
  top:6px;
  left:6px;
  z-index:2;
  padding:2px 5px;
  color:var(--firefly);
  border:1px solid var(--line);
  background:rgba(7,16,13,.86);
  font:7px var(--mono);
}
.token-copy{min-width:0;padding:8px 9px 9px}
.token-tier{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:7px;
  color:var(--paper-faint);
  font:7px var(--mono);
  text-transform:uppercase;
}
.token-tier i{width:6px;height:6px;flex:none;background:var(--tier);box-shadow:0 0 6px var(--tier)}
.token-copy>strong{
  display:block;
  margin:4px 0 6px;
  overflow:hidden;
  color:var(--paper);
  font:18px/1 var(--display);
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}
.token-action{
  width:100%;
  min-height:31px;
  padding:6px;
  color:var(--paper);
  border:1px solid var(--line);
  background:var(--indigo-deep);
  font:8px var(--mono);
  text-transform:uppercase;
}
.token-action:hover{border-color:var(--firefly)}
.empty-slot{
  grid-column:1/-1;
  min-height:135px;
  display:grid;
  place-items:center;
  padding:24px;
  color:var(--paper-faint);
  border:1px dashed var(--line);
  background:rgba(7,16,13,.35);
  font:9px/1.6 var(--mono);
  text-align:center;
}

.faq-chapter{padding-bottom:74px}
.faq-board{
  background:
    linear-gradient(135deg,rgba(45,104,65,.12),transparent 42%),
    var(--ink-2);
}
.faq-cap{align-items:center}
.faq-frog{
  position:relative;
  width:112px;
  height:67px;
  margin-left:auto;
  flex:none;
  background:var(--swamp-mid);
  clip-path:polygon(0 35%,13% 35%,13% 14%,35% 14%,35% 0,48% 0,48% 14%,62% 14%,62% 0,77% 0,77% 14%,91% 14%,91% 35%,100% 35%,100% 80%,86% 80%,86% 100%,14% 100%,14% 80%,0 80%);
  box-shadow:inset 0 -18px 0 var(--swamp-deep);
}
.faq-frog i{
  position:absolute;
  top:30px;
  width:14px;
  height:14px;
  background:var(--firefly-light);
  box-shadow:inset 3px 3px 0 var(--ink);
}
.faq-frog i:first-child{left:31px}
.faq-frog b{position:absolute;right:31px;top:30px;width:14px;height:14px;background:var(--firefly-light);box-shadow:inset 3px 3px 0 var(--ink)}
.faq-frog span{
  position:absolute;
  left:42px;
  bottom:15px;
  width:31px;
  height:5px;
  background:var(--lily);
}
.faq-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 13px;
}
.pond-faq{
  min-width:0;
  border:1px solid var(--line-soft);
  background:rgba(7,16,13,.48);
}
.pond-faq[open]{border-color:var(--line);background:rgba(17,24,50,.45)}
.pond-faq summary{
  position:relative;
  display:block;
  padding:13px 34px 13px 13px;
  color:var(--paper);
  cursor:pointer;
  font-size:11px;
  line-height:1.5;
  list-style:none;
}
.pond-faq summary::-webkit-details-marker{display:none}
.pond-faq summary::after{
  content:"+";
  position:absolute;
  top:50%;
  right:11px;
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  color:var(--ink);
  background:var(--lily);
  font:14px/1 var(--mono);
  transform:translateY(-50%);
}
.pond-faq[open] summary::after{content:"-";background:var(--firefly)}
.pond-faq p{
  margin:0;
  padding:0 13px 14px;
  color:var(--paper-dim);
  font-size:10px;
  line-height:1.65;
}

.pond-footer{
  padding:20px 0 46px;
  border-top:2px solid var(--indigo-light);
  background:rgba(7,16,13,.86);
}
.footer-board{
  display:grid;
  grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);
  gap:30px;
  padding-top:22px;
}
.footer-brand p{
  margin:12px 0 4px;
  color:var(--paper);
  font:24px/1.1 var(--display);
  text-transform:uppercase;
}
.footer-brand small{color:var(--paper-faint);font:8px/1.5 var(--mono)}
.footer-ledger{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.footer-ledger>div{
  min-width:0;
  padding:10px;
  border:1px solid var(--line-soft);
  background:rgba(17,24,50,.34);
}
.footer-ledger span{
  display:block;
  color:var(--paper-faint);
  font:7px var(--mono);
  letter-spacing:.06em;
  text-transform:uppercase;
}
.footer-ledger a,
.footer-ledger code{
  display:block;
  margin-top:5px;
  overflow:hidden;
  color:var(--firefly-light);
  font:9px var(--mono);
  text-overflow:ellipsis;
  white-space:nowrap;
}
.footer-key{
  margin-top:5px;
  padding:0;
  color:var(--lily-light);
  border:0;
  background:none;
  font:9px var(--mono);
  text-decoration:underline;
  text-underline-offset:3px;
}

.wallet-veil{
  position:fixed;
  inset:0;
  z-index:100;
  display:none;
  place-items:center;
  padding:20px;
  background:rgba(3,9,7,.82);
  backdrop-filter:blur(7px);
}
.wallet-veil.show{display:grid}
.wallet-sheet{
  width:min(430px,100%);
  padding:19px;
  border:2px solid var(--line);
  background:var(--ink-2);
  box-shadow:10px 10px 0 var(--indigo),0 28px 70px rgba(0,0,0,.65);
}
.wallet-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  margin-bottom:13px;
  padding-bottom:10px;
  border-bottom:1px solid var(--line-soft);
}
.wallet-head strong{color:var(--paper);font:28px/1 var(--display);text-transform:uppercase}
.close-key{
  width:34px;
  height:34px;
  color:var(--paper);
  border:1px solid var(--line);
  background:var(--indigo-deep);
  font:21px/1 var(--mono);
}
.wallet-list{display:grid;gap:8px}
.wallet-option{
  width:100%;
  min-height:45px;
  padding:10px 13px;
  color:var(--paper);
  border:1px solid var(--line);
  background:var(--indigo-deep);
  font:11px var(--mono);
  text-align:left;
}
.wallet-option:hover{border-color:var(--firefly);background:rgba(29,40,80,.9)}
.pond-toast{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:110;
  max-width:min(360px,calc(100% - 40px));
  padding:11px 15px;
  color:var(--ink);
  border:2px solid var(--firefly-light);
  background:var(--firefly);
  box-shadow:5px 5px 0 var(--lily-deep);
  font:10px/1.5 var(--mono);
  opacity:0;
  pointer-events:none;
  transform:translateY(12px);
  transition:opacity .2s,transform .2s;
}
.pond-toast.show{opacity:1;transform:translateY(0)}

.art-missing img{display:none}
.hero-plate.art-missing{
  background:
    radial-gradient(circle at 50% 38%,rgba(242,220,99,.18),transparent 28%),
    linear-gradient(140deg,var(--indigo),var(--swamp-deep));
}
.hero-plate.art-missing::after{
  content:"FROGROOT";
  inset:auto 24px 90px;
  color:rgba(242,220,99,.18);
  font:64px/1 var(--display);
  text-align:center;
}
.picture-shell.art-missing{
  background:
    repeating-linear-gradient(45deg,rgba(45,104,65,.3) 0 8px,rgba(17,24,50,.55) 8px 16px);
}

@keyframes firefly-drift{
  from{background-position:0 0,0 0,0 0}
  to{background-position:-54px 83px,71px -62px,-36px 97px}
}
@keyframes firefly-blink{
  0%,100%{opacity:1}
  50%{opacity:.28}
}

@media (max-width:1050px){
  .hud-index span{font-size:9px}
  .hud-index a{padding-inline:6px}
  .hero-type{padding:38px 34px}
  .hero-type h1{font-size:clamp(50px,6vw,76px)}
  .pond-progress{grid-template-columns:120px 1fr 290px;gap:13px;padding-inline:22px}
  .mint-paid,.free-lanes{padding-inline:21px}
  .pond-rules-table>div{padding-inline:10px}
  .rewards-deck,.market-board{grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr)}
  .tier-row{grid-template-columns:76px minmax(0,1fr) 112px 135px;gap:12px}
  .tier-thumb{width:64px}
}

@media (max-width:860px){
  .hud-shell{
    grid-template-columns:auto auto;
    justify-content:space-between;
    gap:6px 14px;
    padding:9px 0 7px;
  }
  .hud-index{
    grid-column:1/-1;
    grid-row:2;
    justify-content:flex-start;
    padding-top:3px;
    border-top:1px solid var(--line-soft);
  }
  .hud-index a{
    flex-direction:row;
    align-items:center;
    gap:5px;
    padding:7px 7px;
  }
  .hud-index b{font-size:8px}
  .hud-index span{font-size:9px}
  .hero-sheet{grid-template-columns:1fr}
  .hero-type{padding:34px 30px}
  .hero-type h1{font-size:clamp(48px,9.3vw,78px)}
  .hero-plate{border-top:2px solid var(--line);border-left:0}
  .hero-plate img{height:360px;min-height:0}
  .pond-progress{grid-template-columns:auto 1fr;gap:11px 16px}
  .ripple-clock{grid-column:1/-1}
  .mint-table{grid-template-columns:1fr}
  .mint-paid::before{
    top:auto;
    right:18px;
    bottom:-1px;
    left:18px;
    width:auto;
    height:2px;
    background:repeating-linear-gradient(90deg,var(--lily) 0 7px,transparent 7px 14px);
  }
  .pond-rules-table{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pond-rules-table>div{border-bottom:1px solid var(--line-soft)}
  .pond-rules-table>div:nth-child(2n){border-right:0}
  .pond-rules-table>div:last-child{grid-column:1/-1;border-bottom:0}
  .x-steps{grid-template-columns:1fr}
  .rewards-deck,
  .market-board,
  .nest-board{grid-template-columns:1fr}
  .supply-card{transform:none}
  .story-deck{grid-template-columns:1fr}
  .story-card{transform:none}
  .step-tiles li{transform:none!important}
  .tier-row{grid-template-columns:72px minmax(0,1fr) 120px}
  .tier-drop{grid-column:2/-1;padding:0 0 7px;text-align:left}
  .tier-drop b,
  .tier-drop span{display:inline;margin-right:7px}
  .nest-rail{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-board{grid-template-columns:1fr}
}

@media (max-width:600px){
  .pond-wrap{width:calc(100% - 20px)}
  .hud-shell{width:calc(100% - 16px)}
  .wordmark{font-size:22px}
  .wordmark small{display:none}
  .toad-glyph{width:26px;height:21px}
  select{max-width:91px;font-size:9px}
  .connect-key{min-height:38px;padding:7px 10px;font-size:10px}
  .first-screen{padding-top:20px}
  .hero-type{padding:27px 21px 24px}
  .hero-type h1{font-size:clamp(44px,13.2vw,62px)}
  .hero-note{font-size:13px}
  .hero-keys{display:grid;grid-template-columns:1fr}
  .hero-keys .action{width:100%}
  .hero-facts{grid-template-columns:repeat(2,1fr)}
  .hero-facts div:nth-child(2){border-right:0}
  .hero-facts div:nth-child(-n+2){border-bottom:1px solid var(--line-soft)}
  .hero-plate img{height:285px}
  .hero-plate::before{inset:10px}
  .hero-plate figcaption{right:17px;bottom:15px;left:17px}
  .mint-sheet{margin-top:16px}
  .sheet-cap{display:block;padding:20px 17px 15px}
  .sheet-title{display:block}
  .tab-tag{
    width:max-content;
    min-height:0;
    display:flex;
    align-items:center;
    gap:6px;
    padding:4px 7px;
    margin-bottom:8px;
    font-size:7px;
  }
  .tab-tag b{font-size:13px}
  .sheet-title h2{font-size:32px}
  .mint-signal{align-items:flex-start;margin-top:12px}
  .pond-progress{display:block;padding:14px 17px}
  .progress-copy{margin-bottom:8px}
  .reed-meter{height:18px;margin-bottom:11px}
  .ripple-clock strong{font-size:20px}
  .mint-paid,.free-lanes{padding:19px 16px 21px}
  .quantity-line{flex-wrap:wrap}
  .quantity-line label{width:100%}
  .cost-board b{font-size:9px}
  .mint-key{font-size:10px}
  .ticket-head{grid-template-columns:28px minmax(0,1fr) auto}
  .lane-ticket p,
  .lane-gauge,
  .lane-ticket small{margin-left:0}
  .odds-rack{grid-template-columns:1fr}
  .pond-rules-table{grid-template-columns:1fr}
  .pond-rules-table>div{grid-column:auto!important;border-right:0}
  .x-dock{margin:16px 10px 18px;padding:15px 12px}
  .x-dock h3{font-size:24px}
  .x-badge{width:32px;height:32px;font-size:19px}
  .x-step{padding:10px}
  .x-step textarea{min-height:155px}
  .inline-keys .action,
  .x-actions .action{width:100%;flex:none}
  .chapter{padding:23px 0 42px}
  .chapter-card{padding:20px 16px 22px}
  .chapter-cap{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px}
  .index-tab{width:42px;min-height:41px;font-size:22px}
  .chapter-cap>div{grid-column:2}
  .chapter-cap>.action,
  .ledger-stamp,
  .fee-seal{grid-column:1/-1;margin:6px 0 0;justify-self:start}
  .chapter-card h2{font-size:34px}
  .rewards-deck{gap:15px}
  .ramp-copy,
  .firefly-chart,
  .next-croak{margin-left:0;max-width:100%}
  .firefly-chart{height:145px;gap:4px}
  .next-croak{width:100%}
  .supply-orbit{width:175px}
  .tier-cap{display:grid}
  .tier-cap>div{grid-column:2}
  .ledger-stamp{grid-column:2;width:72px;height:52px;font-size:13px}
  .tier-row{grid-template-columns:58px minmax(0,1fr);gap:9px;padding:9px 2px}
  .tier-thumb{width:52px}
  .tier-copy h3{font-size:21px}
  .tier-supply{grid-column:2;display:flex;align-items:baseline;gap:8px}
  .tier-supply strong{font-size:18px}
  .tier-supply span{font-size:7px}
  .tier-drop{grid-column:2}
  .story-deck{gap:15px}
  .tongue-route{margin:20px 0}
  .step-tiles{grid-template-columns:1fr}
  .step-tiles li{min-height:0}
  .index-cap>.action{justify-self:stretch;width:100%}
  .lineup-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .market-cap{display:grid}
  .fee-seal{grid-column:2}
  .market-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .seller-cap{display:block}
  .seller-cap>.action{margin-top:9px}
  .frog-picker{grid-template-columns:repeat(3,minmax(0,1fr))}
  .seller-keys{grid-template-columns:1fr}
  .nest-rail{grid-template-columns:1fr}
  .nest-cap{display:grid}
  .nest-cap>.action{grid-column:1/-1;justify-self:stretch;width:100%}
  .frog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .faq-cap{grid-template-columns:44px minmax(0,1fr)}
  .faq-frog{display:none}
  .faq-list{grid-template-columns:1fr}
  .footer-ledger{grid-template-columns:1fr}
  .pond-toast{right:10px;bottom:10px;max-width:calc(100% - 20px)}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,
  *::before,
  *::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}