/* Come Back Home. Flat poster: coral roof, mustard body, black door, on near-black. */
:root {
  --ink: #050402;
  --coral: #DE5C3D;
  --mustard: #D09639;
  --mustard-hi: #DE9E46;
  --paper: #EFE6D3;
  --paper-dim: #A89F8C;
  --rule: #2A2620;
  --pad: clamp(16px, 4vw, 56px);
  --max: 1440px;
  --display: 'Archivo Black', 'Helvetica Neue', Arial, sans-serif;
  --text: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --r: 3px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--ink); color: var(--paper);
  font: 400 17px/1.5 var(--text); font-variation-settings: 'wdth' 100;
  min-height: 100vh; display: flex; flex-direction: column;
}
/* the banner's paper grain, very faint */
body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: .045;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyMjAnIGhlaWdodD0nMjIwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nLjknIG51bU9jdGF2ZXM9JzInIHN0aXRjaFRpbGVzPSdzdGl0Y2gnLz48L2ZpbHRlcj48cmVjdCB3aWR0aD0nMTAwJScgaGVpZ2h0PScxMDAlJyBmaWx0ZXI9J3VybCgjbiknLz48L3N2Zz4=");
}
body > * { position: relative; z-index: 1; }
main { flex: 1; width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--pad) 72px; }
a { color: var(--mustard-hi); text-underline-offset: 3px; text-decoration-thickness: 2px; }
a:hover { color: var(--coral); }
:focus-visible { outline: 3px solid var(--mustard-hi); outline-offset: 3px; }
strong { font-weight: 700; }
code { font: 600 .92em var(--text); font-variation-settings: 'wdth' 80; color: var(--mustard-hi); overflow-wrap: anywhere; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 12px; top: 12px; z-index: 50; background: var(--mustard); color: var(--ink); padding: 8px 12px; }
p { margin: 0 0 1em; }
h1, h2, h3 { font-family: var(--display); font-weight: 400; margin: 0; letter-spacing: -0.02em; }
.num, .tnum { font-variant-numeric: tabular-nums; }

/* ---------- header ---------- */
.top {
  width: 100%; max-width: var(--max); margin: 0 auto; padding: 18px var(--pad);
  display: flex; align-items: center; gap: 18px 28px; flex-wrap: wrap;
}
.brand { display: flex; align-items: center; gap: 12px; color: var(--paper); text-decoration: none; font-family: var(--display); font-size: 19px; letter-spacing: -0.02em; }
.brand .mark { width: 38px; height: 37px; flex: none; }
.brand:hover { color: var(--paper); }
.links { display: flex; gap: 4px 22px; flex-wrap: wrap; margin-left: auto; }
.links a { color: var(--paper); text-decoration: none; font-weight: 700; font-size: 16px; padding: 6px 0; border-bottom: 3px solid transparent; }
.links a:hover { color: var(--mustard-hi); }
.links a[aria-current="page"] { border-bottom-color: var(--coral); }
.wallet-btn {
  font: 700 15px var(--text); color: var(--ink); background: var(--mustard); border: 0; border-radius: var(--r);
  padding: 10px 16px; cursor: pointer; white-space: nowrap;
}
.wallet-btn:hover { background: var(--mustard-hi); }
.wallet-btn.on { background: transparent; color: var(--mustard-hi); box-shadow: inset 0 0 0 2px var(--mustard); }
.fork-flag { font: 700 15px var(--text); color: var(--ink); background: var(--coral); padding: 3px 8px; border-radius: var(--r); }

/* ---------- buttons ---------- */
.door, .btn-line, .doorway, .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font: 400 18px/1.1 var(--display); letter-spacing: -0.01em; text-decoration: none; cursor: pointer;
  border-radius: var(--r); padding: 16px 24px; border: 0; min-height: 52px;
}
.door { background: var(--coral); color: var(--ink); }
.door:hover { background: var(--mustard-hi); color: var(--ink); }
.btn-line { background: transparent; color: var(--paper); box-shadow: inset 0 0 0 2px var(--paper); }
.btn-line:hover { color: var(--mustard-hi); box-shadow: inset 0 0 0 2px var(--mustard-hi); }
.btn { background: var(--paper); color: var(--ink); font-size: 16px; padding: 12px 18px; min-height: 44px; }
.btn:hover { background: var(--mustard-hi); }
.btn.coral { background: var(--coral); }
.btn.ghost { background: transparent; color: var(--paper); box-shadow: inset 0 0 0 2px var(--rule); }
.btn[disabled], .doorway[disabled] { opacity: .45; cursor: not-allowed; }
.door[disabled] { background: transparent; color: var(--paper-dim); box-shadow: inset 0 0 0 2px var(--rule); cursor: not-allowed; }
/* the door: a black opening in a mustard wall */
.doorway { background: var(--ink); color: var(--coral); width: 100%; min-height: 64px; font-size: 22px; }
.doorway:hover:not([disabled]) { color: var(--paper); }

/* ---------- section marker: the roof ---------- */
.roof { display: flex; align-items: flex-start; gap: 12px; }
.roof::before {
  content: ''; flex: none; width: 1.05em; height: .62em; margin-top: .2em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='78 78 244 112'%3E%3Cpath d='M200 80Q205 80 209 84L318 184Q322 189 316 189L84 189Q78 189 82 184L191 84Q195 80 200 80Z' fill='%23DE5C3D'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* ---------- page heads ---------- */
.page-head { padding: clamp(20px, 5vw, 64px) 0 clamp(24px, 4vw, 48px); max-width: 1100px; }
.page-title { font-size: clamp(56px, 13vw, 176px); line-height: .86; letter-spacing: -0.045em; color: var(--coral); margin-bottom: 20px; overflow-wrap: anywhere; }
.lede { font-size: clamp(18px, 1.9vw, 23px); line-height: 1.4; max-width: 44ch; margin: 0; }
.split-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px 48px; align-items: end; max-width: none; }
@media (min-width: 900px) { .split-head { grid-template-columns: auto minmax(0, 1fr); } .split-head .page-title { margin-bottom: 0; } }

/* ---------- landing ---------- */
.hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px 56px; padding: clamp(16px, 4vw, 48px) 0 clamp(40px, 6vw, 80px); align-items: end; }
@media (min-width: 1000px) { .hero { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); } }
.stack { display: flex; flex-direction: column; font-size: clamp(84px, 19vw, 256px); line-height: .84; letter-spacing: -0.05em; }
.stack span { display: block; }
.w-come, .w-home { color: var(--coral); }
.w-back { color: var(--mustard-hi); }
@media (prefers-reduced-motion: no-preference) {
  .stack span { animation: drop .7s cubic-bezier(.2, .9, .25, 1) both; }
  .stack .w-back { animation-delay: .09s; }
  .stack .w-home { animation-delay: .18s; }
  @keyframes drop { from { transform: translateY(-.18em); opacity: 0; } to { transform: none; opacity: 1; } }
}
.hero-side { padding-bottom: .4em; }
.pitch { font-size: clamp(20px, 2.1vw, 27px); line-height: 1.35; max-width: 30ch; margin-bottom: 28px; }
.ctas { display: flex; gap: 12px; flex-wrap: wrap; }

.ledger { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin-bottom: 18px; }
@media (min-width: 760px) { .ledger { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cell { padding: 22px 24px 20px; min-height: 190px; display: flex; flex-direction: column; }
.cell .k { font-weight: 700; font-size: 16px; margin: 0; }
.cell .v { font: 400 clamp(44px, 5.6vw, 84px)/1 var(--display); letter-spacing: -0.04em; margin: auto 0 6px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.cell .s { margin: 0; font-size: 15px; }
.cell-coral { background: var(--coral); color: var(--ink); }
.cell-mustard { background: var(--mustard); color: var(--ink); }
.cell-line { box-shadow: inset 0 0 0 3px var(--paper); }
.deploy-state { color: var(--paper-dim); font-size: 15px; margin-bottom: clamp(48px, 7vw, 96px); }
.deploy-state strong { color: var(--paper); }

.steps h2, .plain h2 { font-size: clamp(28px, 3.6vw, 44px); margin-bottom: 24px; }
.steps ol { list-style: none; counter-reset: s; margin: 0 0 clamp(48px, 7vw, 96px); padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
@media (min-width: 700px) { .steps ol { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .steps ol { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.steps li { counter-increment: s; padding: 18px 20px 20px 0; border-top: 3px solid var(--rule); display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 0 10px; }
.steps li::before { content: counter(s); font: 400 44px/1 var(--display); color: var(--mustard-hi); }
.steps li p { margin: 0; }
.steps li strong { display: block; font-family: var(--display); font-weight: 400; font-size: 22px; }
.plain p { font-size: 19px; max-width: 64ch; }

/* ---------- forms ---------- */
.form fieldset { border: 0; border-top: 3px solid var(--rule); margin: 0 0 12px; padding: 22px 0 10px; min-width: 0; }
.form legend { font-family: var(--display); font-size: clamp(24px, 2.6vw, 32px); padding: 0; margin-bottom: 18px; float: left; width: 100%; }
.form legend + * { clear: both; }
.row2 { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 20px; }
@media (min-width: 640px) { .row2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.field { display: block; margin-bottom: 20px; min-width: 0; }
.field > span { display: block; font-weight: 700; margin-bottom: 8px; }
.field > span::after { content: ''; display: table; clear: both; }
.field > span em { font-style: normal; font-weight: 400; color: var(--paper-dim); float: right; }
.field > span b { font: 400 20px var(--display); color: var(--mustard-hi); float: right; }
.field small { display: block; margin-top: 6px; color: var(--paper-dim); font-size: 15px; }
.field small.bad { color: var(--coral); font-weight: 700; }
input:not([type]), input[type="text"], input.num, select, .field input:not([type="range"]):not([type="checkbox"]):not([type="radio"]) {
  width: 100%; font: 600 18px var(--text); color: var(--paper); background: transparent;
  border: 0; border-bottom: 3px solid var(--paper-dim); border-radius: 0; padding: 10px 2px; min-height: 48px;
}
select { background: var(--ink); cursor: pointer; }
input:focus, select:focus { outline: none; border-bottom-color: var(--mustard-hi); }
input.invalid { border-bottom-color: var(--coral); }
input::placeholder { color: #6f675a; }
input[type="range"] { width: 100%; accent-color: var(--coral); height: 32px; cursor: pointer; }
.slider-pair { display: grid; grid-template-columns: minmax(0, 1fr) 84px; gap: 16px; align-items: center; }
.slider-pair .num { text-align: right; }
.capbar { position: relative; height: 14px; margin: 8px 0 26px; background: var(--rule); display: flex; }
.capbar i { display: block; height: 100%; }
.capbar .lp { background: var(--paper-dim); }
.capbar .hk { background: var(--coral); }
.capbar::after { content: '5% cap'; position: absolute; right: 0; top: 16px; font-size: 15px; color: var(--paper-dim); }
.clamp-msg { background: var(--coral); color: var(--ink); font-weight: 700; padding: 10px 14px; border-radius: var(--r); }
.note { color: var(--paper); max-width: 60ch; }
.check { display: flex; gap: 12px; align-items: flex-start; margin: 4px 0 20px; cursor: pointer; }
.check input { width: 22px; height: 22px; accent-color: var(--coral); margin-top: 2px; flex: none; }
.choice { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.choice label { cursor: pointer; }
.choice input { position: absolute; opacity: 0; pointer-events: none; }
.choice span { display: inline-block; padding: 10px 16px; border-radius: var(--r); box-shadow: inset 0 0 0 2px var(--paper-dim); font-weight: 700; }
.choice input:checked + span { background: var(--paper); color: var(--ink); box-shadow: none; }
.choice input:focus-visible + span { outline: 3px solid var(--mustard-hi); outline-offset: 2px; }
.calc { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin: 4px 0 18px; }
@media (min-width: 560px) { .calc { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.calc div { padding: 10px 0; border-top: 1px solid var(--rule); }
.calc dt { font-size: 15px; color: var(--paper-dim); }
.calc dd { margin: 0; font-weight: 700; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

/* ---------- the house (launch summary) ---------- */
.house-roof {
  background: var(--coral); color: var(--ink); text-align: center;
  clip-path: polygon(50% 0, 100% 100%, 0 100%); padding: clamp(70px, 9vw, 110px) 18% 22px;
  border-radius: var(--r);
}
.hr-k { margin: 0; font-weight: 700; font-size: 15px; }
.hr-v { font: 400 clamp(22px, 2.5vw, 32px)/1.05 var(--display); margin: 4px 0; letter-spacing: -0.02em; }
.hr-v .slash { opacity: .5; }
.hr-s { font-size: 15px; margin: 0; }
.house-body { background: var(--mustard); color: var(--ink); margin: 12px 5% 0; padding: 20px 22px 18px; border-radius: var(--r); }
.hb-k { font-weight: 700; margin-bottom: 10px; }
.split { display: flex; height: 26px; background: var(--ink); }
.split i { display: block; height: 100%; }
.split .op { background: var(--ink); }
.split .bn { background: var(--paper); }
.split .tr { background: var(--coral); }
.split-legend { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 10px 0 18px; font-size: 15px; }
.split-legend dt { font-weight: 700; display: flex; align-items: center; gap: 6px; }
.split-legend dt::before { content: ''; width: 12px; height: 12px; flex: none; background: var(--c); box-shadow: inset 0 0 0 1px var(--ink); }
.split-legend dd { margin: 0; font: 400 20px var(--display); }
.summary { margin: 0 0 18px; font-size: 15px; }
.summary div { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-top: 1px solid rgba(5, 4, 2, .25); }
.summary dt { flex: none; }
.summary dd { margin: 0; font-weight: 700; text-align: right; overflow-wrap: anywhere; min-width: 0; }
.warn-line { box-shadow: inset 4px 0 0 var(--coral); padding: 4px 0 4px 16px; }

/* ---------- markets ---------- */
.mk-bar { display: flex; justify-content: space-between; gap: 8px 24px; flex-wrap: wrap; border-top: 3px solid var(--paper); padding-top: 12px; margin-bottom: 8px; font-weight: 700; }
.mk-bar p { margin: 0; }
.liq-tag { color: var(--coral); }
.mk-head, .mk-row { display: grid; grid-template-columns: minmax(0, 2.3fr) repeat(5, minmax(0, 1fr)) minmax(0, 1.2fr); gap: 16px; align-items: center; }
.mk-head { font-size: 15px; color: var(--paper-dim); padding: 10px 0; border-bottom: 1px solid var(--rule); }
.mk-row { padding: 16px 0; border-bottom: 1px solid var(--rule); color: var(--paper); text-decoration: none; font-variant-numeric: tabular-nums; }
.mk-row:hover { background: #120f0a; color: var(--paper); }
.mk-tok { display: flex; align-items: center; gap: 14px; min-width: 0; }
.mk-tok img { width: 48px; height: 48px; border-radius: var(--r); flex: none; object-fit: cover; background: var(--rule); }
.mk-tok b { font: 400 26px/1 var(--display); color: var(--mustard-hi); display: block; overflow-wrap: anywhere; }
.mk-tok span { color: var(--paper-dim); font-size: 15px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk-cell small { display: none; }
.mk-liq { color: var(--coral); font-weight: 700; font-size: 15px; }
.mk-empty { padding: 48px 0; max-width: 52ch; }
.mk-empty h2 { font-size: clamp(32px, 4vw, 52px); color: var(--mustard-hi); margin-bottom: 14px; }
.mk-more { padding-top: 24px; }
@media (max-width: 899px) {
  .mk-head { display: none; }
  .mk-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; }
  .mk-tok { grid-column: 1 / -1; }
  .mk-cell small { display: block; font-size: 15px; color: var(--paper-dim); }
}

/* ---------- market detail ---------- */
.m-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px 40px; padding: clamp(16px, 4vw, 48px) 0 24px; align-items: end; }
@media (min-width: 900px) { .m-head { grid-template-columns: auto minmax(0, 1fr) auto; } }
.m-img { width: clamp(88px, 11vw, 150px); aspect-ratio: 1; border-radius: var(--r); object-fit: cover; background: var(--rule); }
.m-sym { font-size: clamp(36px, calc(88vw / (var(--len, 5) * .8)), 150px); line-height: .86; letter-spacing: -0.045em; color: var(--mustard-hi); overflow-wrap: anywhere; }
@media (min-width: 900px) { .m-sym { font-size: clamp(36px, calc(40vw / (var(--len, 5) * .78)), 150px); overflow-wrap: normal; } }
.m-name { font-size: 20px; margin: 10px 0 0; }
.m-name a { font-size: 16px; }
.m-price { text-align: left; }
@media (min-width: 900px) { .m-price { text-align: right; } }
.m-price .v { font: 400 clamp(36px, 4.6vw, 64px)/1 var(--display); letter-spacing: -0.03em; margin: 0; overflow-wrap: anywhere; }
.m-price .s { color: var(--paper-dim); margin: 4px 0 0; font-size: 15px; }
.liq-band { background: var(--coral); color: var(--ink); padding: 16px 20px; border-radius: var(--r); margin-bottom: 32px; font-size: 17px; }
.liq-band strong { font-family: var(--display); font-weight: 400; font-size: 20px; display: block; margin-bottom: 2px; }
.liq-band a { color: var(--ink); }
.liq-band.removed { background: var(--paper); }
.m-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; align-items: start; }
@media (min-width: 1080px) { .m-grid { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 56px; } }
.m-grid > * { min-width: 0; }
.block { margin-bottom: 40px; }
.block > h2 { font-size: clamp(24px, 2.6vw, 32px); margin-bottom: 16px; }
.facts { display: grid; grid-template-columns: minmax(0, 1fr); margin: 0; }
@media (min-width: 600px) { .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; } }
.facts div { padding: 12px 0; border-top: 1px solid var(--rule); min-width: 0; }
.facts dt { font-size: 15px; color: var(--paper-dim); }
.facts dd { margin: 2px 0 0; font-weight: 700; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.facts dd .big { font: 400 30px/1.1 var(--display); }
.fee-now { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-bottom: 14px; }
.fee-now div { padding: 18px 20px; }
.fee-now div:first-child { background: var(--mustard); color: var(--ink); }
.fee-now div:last-child { box-shadow: inset 0 0 0 3px var(--mustard); }
.fee-now p { margin: 0; }
.fee-now .v { font: 400 clamp(36px, 4vw, 56px)/1 var(--display); letter-spacing: -0.03em; margin: 6px 0 4px; }
.fee-now .s { font-size: 15px; }
.pending { box-shadow: inset 0 0 0 3px var(--coral); padding: 18px 20px; border-radius: var(--r); }
.pending h3 { font-size: 22px; color: var(--coral); margin-bottom: 8px; }
.countdown { font: 400 clamp(32px, 4vw, 48px)/1 var(--display); margin: 8px 0 12px; font-variant-numeric: tabular-nums; }
.none { color: var(--paper-dim); }
.hist { list-style: none; margin: 0; padding: 0; }
.hist li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; padding: 12px 0; border-top: 1px solid var(--rule); }
.hist b { font-weight: 700; }
.hist .when { color: var(--paper-dim); font-size: 15px; text-align: right; }
.hist .what { grid-column: 1 / -1; color: var(--paper-dim); font-size: 15px; overflow-wrap: anywhere; }
.addr { font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ctl-panel { background: #15110b; padding: 22px; border-radius: var(--r); box-shadow: inset 0 0 0 2px var(--rule); }
.ctl-panel h3 { font-size: 20px; margin: 18px 0 10px; }
.ctl-panel h3:first-child { margin-top: 0; }
.ctl-row { display: flex; gap: 10px; flex-wrap: wrap; align-items: end; }
.ctl-row .field { flex: 1 1 140px; margin-bottom: 10px; }
.ctl-panel .warn { color: var(--coral); font-weight: 700; font-size: 15px; }

/* ---------- trade box: a mustard wall with a black door ---------- */
.trade { background: var(--mustard); color: var(--ink); border-radius: var(--r); padding: 22px 22px 0; }
.trade h2 { font-size: 28px; margin-bottom: 14px; }
.tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-bottom: 18px; box-shadow: inset 0 0 0 3px var(--ink); border-radius: var(--r); }
.tabs button { font: 400 18px var(--display); background: transparent; color: var(--ink); border: 0; padding: 12px; cursor: pointer; border-radius: var(--r); min-height: 48px; }
.tabs button[aria-selected="true"] { background: var(--ink); color: var(--mustard-hi); }
.trade .field > span { color: var(--ink); }
.trade .field input { color: var(--ink); border-bottom-color: var(--ink); font: 400 clamp(26px, 3vw, 34px) var(--display); padding: 6px 2px; min-height: 56px; }
.trade .field input::placeholder { color: rgba(5, 4, 2, .35); }
.trade .bal { font-weight: 400; font-size: 15px; background: none; border: 0; color: var(--ink); cursor: pointer; text-decoration: underline; padding: 0; font-family: var(--text); }
.trade .out { font: 400 clamp(26px, 3vw, 34px)/1.2 var(--display); margin: 0; overflow-wrap: anywhere; }
.trade dl { margin: 12px 0 16px; font-size: 15px; }
.trade dl div { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; border-top: 1px solid rgba(5, 4, 2, .25); }
.trade dd { margin: 0; font-weight: 700; text-align: right; overflow-wrap: anywhere; min-width: 0; }
.slip { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: 15px; margin-bottom: 14px; }
.slip button { font: 700 15px var(--text); background: transparent; border: 0; box-shadow: inset 0 0 0 2px var(--ink); border-radius: var(--r); padding: 6px 10px; cursor: pointer; color: var(--ink); min-height: 36px; }
.slip button[aria-pressed="true"] { background: var(--ink); color: var(--mustard-hi); }
.trade .doorway { width: 50%; min-width: 200px; margin: 6px auto 0; display: flex; border-radius: var(--r) var(--r) 0 0; min-height: 110px; padding: 18px 12px; text-align: center; }
.trade .t-status { background: var(--ink); color: var(--paper); margin: 0 -22px; padding: 0 22px; font-size: 15px; }
.trade .t-status:not(:empty) { padding: 12px 22px; }
.trade .t-status a { color: var(--mustard-hi); }
.trade .off { padding-bottom: 22px; font-weight: 700; }

/* ---------- quote page: the house turned inside out ---------- */
.page-home { background: var(--mustard); color: var(--ink); }
.page-home::before { opacity: .09; }
.page-home a { color: var(--ink); }
.page-home .links a, .page-home .brand { color: var(--ink); }
.page-home .links a:hover { color: var(--paper); }
.page-home .links a[aria-current="page"] { border-bottom-color: var(--ink); }
.page-home .wallet-btn { background: var(--ink); color: var(--mustard-hi); }
.page-home .wallet-btn.on { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 2px var(--ink); }
.page-home .foot { color: var(--ink); border-top-color: rgba(5, 4, 2, .3); }
.page-home .brand .mark rect:first-of-type { fill: var(--ink); }
.page-home .brand .mark rect:last-of-type { fill: var(--mustard); }
.q-hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px 40px; padding: clamp(16px, 4vw, 48px) 0 clamp(24px, 4vw, 48px); align-items: end; }
@media (min-width: 760px) { .q-hero { grid-template-columns: auto minmax(0, 1fr); } }
.q-house { width: clamp(120px, 20vw, 260px); height: auto; }
.quote .page-title { color: var(--ink); }
.q-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; align-items: start; }
@media (min-width: 1000px) { .q-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; } }
.q-grid > * { min-width: 0; }
.q-facts { margin: 0; }
.q-facts div { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; padding: 14px 0; border-top: 3px solid var(--ink); }
@media (min-width: 560px) { .q-facts div { grid-template-columns: 160px minmax(0, 1fr); gap: 16px; } }
.q-facts dt { font-weight: 700; }
.q-facts dd { margin: 0; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.q-facts .big { font: 400 26px/1.15 var(--display); }
.page-home .trade { background: var(--ink); color: var(--paper); }
.page-home .trade .field > span, .page-home .trade .bal, .page-home .trade .slip button { color: var(--paper); }
.page-home .trade .field input { color: var(--paper); border-bottom-color: var(--paper); }
.page-home .trade .field input::placeholder { color: rgba(239, 230, 211, .35); }
.page-home .trade .tabs { box-shadow: inset 0 0 0 3px var(--paper); }
.page-home .trade .tabs button { color: var(--paper); }
.page-home .trade .tabs button[aria-selected="true"] { background: var(--paper); color: var(--ink); }
.page-home .trade .slip button { box-shadow: inset 0 0 0 2px var(--paper); }
.page-home .trade .slip button[aria-pressed="true"] { background: var(--paper); color: var(--ink); }
.page-home .trade dl div { border-top-color: rgba(239, 230, 211, .2); }
.page-home .trade .doorway { background: var(--mustard); color: var(--ink); }
.page-home .trade .doorway:hover:not([disabled]) { background: var(--coral); }
.page-home .trade .t-status { background: var(--mustard); color: var(--ink); }
.page-home .trade .t-status a { color: var(--ink); }
.page-home .trade a { color: var(--mustard-hi); }

/* ---------- guardrail ---------- */
.guard-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px 64px; }
@media (min-width: 1000px) { .guard-grid { grid-template-columns: 220px minmax(0, 1fr); } .toc { position: sticky; top: 16px; align-self: start; } }
.toc { display: flex; flex-direction: column; gap: 2px; border-top: 3px solid var(--coral); padding-top: 12px; }
.toc a { color: var(--paper); text-decoration: none; font-weight: 700; padding: 5px 0; }
.toc a:hover { color: var(--mustard-hi); }
@media (max-width: 999px) { .toc { flex-direction: row; flex-wrap: wrap; gap: 4px 18px; } }
.doc { max-width: 72ch; min-width: 0; }
.doc section { padding: 8px 0 36px; scroll-margin-top: 16px; }
.doc h2 { font-size: clamp(28px, 3.4vw, 42px); margin-bottom: 18px; }
.doc p, .doc li { font-size: 18px; }
.big-rule { font: 400 clamp(24px, 3vw, 36px)/1.15 var(--display); color: var(--mustard-hi); letter-spacing: -0.02em; }
.ticks { list-style: none; padding: 0; margin: 0 0 1em; }
.ticks li { padding: 10px 0 10px 28px; border-top: 1px solid var(--rule); position: relative; }
.ticks li::before { content: ''; position: absolute; left: 2px; top: 19px; width: 12px; height: 12px; background: var(--mustard); }
.seq { list-style: none; counter-reset: q; padding: 0; margin: 0 0 1em; }
.seq li { counter-increment: q; padding: 12px 0 12px 56px; border-top: 1px solid var(--rule); position: relative; }
.seq li::before { content: counter(q); position: absolute; left: 0; top: 8px; font: 400 34px/1 var(--display); color: var(--coral); }
.example { background: var(--mustard); color: var(--ink); padding: 20px 22px; border-radius: var(--r); margin: 0 0 1em; }
.example .ex-head { font-weight: 700; }
.example dl { margin: 0; }
.example div { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-top: 1px solid rgba(5, 4, 2, .25); }
.example dd { margin: 0; font: 400 20px var(--display); }
.liq-section .big-rule { color: var(--coral); }
.diverge { background: var(--coral); color: var(--ink); padding: 16px 20px; border-radius: var(--r); }
.addr-list { margin: 0; }
.addr-list div { padding: 10px 0; border-top: 1px solid var(--rule); display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; }
@media (min-width: 700px) { .addr-list div { grid-template-columns: 200px minmax(0, 1fr); gap: 16px; } }
.addr-list dt { font-weight: 700; }
.addr-list dd { margin: 0; overflow-wrap: anywhere; }
.addr-list dd small { display: block; color: var(--paper-dim); }

/* ---------- misc ---------- */
.foot { width: 100%; max-width: var(--max); margin: 0 auto; padding: 22px var(--pad) 28px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; border-top: 1px solid var(--rule); color: var(--paper-dim); font-size: 15px; }
.foot p { margin: 0; }
.loading, .err { padding: 40px 0; font-size: 18px; }
.err { color: var(--coral); font-weight: 700; }
.toast { position: fixed; left: 16px; right: 16px; bottom: 16px; max-width: 520px; background: var(--paper); color: var(--ink); padding: 14px 18px; border-radius: var(--r); font-weight: 700; z-index: 40; box-shadow: 6px 6px 0 var(--coral); overflow-wrap: anywhere; }
.toast.bad { background: var(--coral); box-shadow: 6px 6px 0 var(--paper); }
.toast a { color: var(--ink); }
.wallet-modal { position: fixed; inset: 0; background: rgba(5, 4, 2, .82); display: grid; place-items: center; z-index: 60; padding: 16px; }
.wallet-modal[hidden] { display: none; }
.wallet-sheet { background: var(--paper); color: var(--ink); padding: 24px; border-radius: var(--r); width: min(420px, 100%); }
.wallet-sheet h2 { font-size: 28px; margin-bottom: 16px; }
.wallet-sheet #walletList { display: grid; gap: 8px; margin-bottom: 16px; }
.wallet-sheet #walletList button { display: flex; align-items: center; gap: 12px; font: 700 17px var(--text); background: var(--ink); color: var(--paper); border: 0; border-radius: var(--r); padding: 12px 14px; cursor: pointer; text-align: left; min-height: 52px; }
.wallet-sheet #walletList img { width: 28px; height: 28px; }
.wallet-sheet .btn-line { color: var(--ink); box-shadow: inset 0 0 0 2px var(--ink); width: 100%; }
sub { font-size: .62em; vertical-align: -0.25em; }
[hidden] { display: none !important; }
@media (max-width: 900px) {
  .top { gap: 8px 16px; }
  .links { order: 3; width: 100%; margin-left: 0; gap: 4px 18px; }
  .wallet-btn { margin-left: auto; }
}
@media (max-width: 600px) { .brand span { font-size: 16px; } }
.trade .bal { float: right; }
@media (max-width: 1079px) { .m-grid > .m-side { order: -1; } }
@media (max-width: 999px) { .q-grid > .trade { order: -1; } }

/* ---------- launch: guided flow ---------- */
.launch-head { padding: clamp(16px, 4vw, 48px) 0 20px; }
.launch-head .page-title { font-size: clamp(56px, 11vw, 140px); margin-bottom: 12px; }
.progress { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.progress button { width: 100%; min-height: 56px; background: transparent; border: 0; padding: 0; cursor: pointer; color: var(--paper-dim); font: 700 15px var(--text); display: grid; grid-template-rows: 8px auto; justify-items: start; text-align: left; }
.progress button[disabled] { cursor: default; }
.pr-roof { width: 100%; height: 8px; background: var(--rule); border-radius: 2px; }
.progress li.now .pr-t::before { content: ''; display: inline-block; width: 18px; height: 10px; margin-right: 8px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='78 78 244 112'%3E%3Cpath d='M200 80Q205 80 209 84L318 184Q322 189 316 189L84 189Q78 189 82 184L191 84Q195 80 200 80Z' fill='%23DE5C3D'/%3E%3C/svg%3E") no-repeat center / contain; }
.pr-n { display: none; }
.pr-t { padding-top: 8px; line-height: 1.2; }
.progress li.done .pr-roof { background: var(--mustard); }
.progress li.done button { color: var(--paper); }
.progress li.now .pr-roof { background: var(--coral); }
.progress li.now button { color: var(--paper); }
.progress li.done button:not([disabled]):hover .pr-t { text-decoration: underline; }
@media (max-width: 520px) { .pr-t { font-size: 15px; } .progress li:not(.now) .pr-t { font-size: 0; } .progress li:not(.now) .pr-n { display: block; padding-top: 8px; font-size: 15px; } }
.wizard-wrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; align-items: start; }
@media (min-width: 1080px) { .wizard-wrap { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 64px; } .preview { position: sticky; top: 16px; } }
@media (max-width: 1079px) { .preview { display: none; } }
.wizard { min-width: 0; max-width: 720px; }
.step h2 { font-size: clamp(30px, 4.4vw, 48px); line-height: 1.02; margin-bottom: 14px; }
.step h2:focus { outline: none; }
.step-lede { font-size: 18px; max-width: 58ch; }
.step-nav { display: flex; justify-content: space-between; gap: 12px; padding: 16px 0; margin-top: 12px; border-top: 3px solid var(--rule); }
.step-nav .door { flex: 1 1 auto; max-width: 360px; margin-left: auto; }
@media (max-width: 700px) {
  .step-nav { position: sticky; bottom: 0; z-index: 5; background: var(--ink); margin: 12px calc(-1 * var(--pad)) 0; padding: 12px var(--pad) calc(12px + env(safe-area-inset-bottom)); border-top-color: var(--mustard); }
  .step-nav .btn-line { flex: 0 0 auto; }
}
.cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin: 8px 0 20px; }
@media (min-width: 560px) { .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.card { cursor: pointer; display: block; }
.card input { position: absolute; opacity: 0; pointer-events: none; }
.c-in { display: flex; flex-direction: column; gap: 2px; height: 100%; min-height: 44px; padding: 16px 18px; border-radius: var(--r); box-shadow: inset 0 0 0 2px var(--paper-dim); }
.card:hover .c-in { box-shadow: inset 0 0 0 2px var(--mustard-hi); }
.card input:checked + .c-in { background: var(--mustard); color: var(--ink); box-shadow: none; }
.card input:focus-visible + .c-in { outline: 3px solid var(--mustard-hi); outline-offset: 3px; }
.c-t { font-weight: 700; }
.c-v { font: 400 clamp(22px, 2.4vw, 28px)/1.15 var(--display); letter-spacing: -0.02em; overflow-wrap: anywhere; }
.c-s { font-size: 15px; font-variant-numeric: tabular-nums; }
.c-b { font-size: 15px; margin-top: 6px; opacity: .85; }
.supply-line { font-size: 16px; color: var(--paper-dim); }
.supply-line strong { color: var(--paper); }
.supply-line .bad { color: var(--coral); font-weight: 700; }
details.custom, details.advanced { border-top: 3px solid var(--rule); margin: 8px 0 16px; }
details.custom > summary, details.advanced > summary { cursor: pointer; font: 400 20px var(--display); min-height: 56px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; list-style: none; }
details > summary::-webkit-details-marker { display: none; }
details.custom > summary::before, details.advanced > summary::before { content: '+'; font: 400 22px var(--display); color: var(--coral); width: 18px; }
details[open].custom > summary::before, details[open].advanced > summary::before { content: '–'; }
details.advanced > summary span { font: 400 15px var(--text); color: var(--paper-dim); }
details[open] > summary { margin-bottom: 12px; }
.field-set { border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
.field-set legend { font-weight: 700; margin-bottom: 8px; padding: 0; }
.hint { display: block; color: var(--paper-dim); font-size: 15px; }
.tech { color: var(--paper-dim); font-size: 15px; overflow-wrap: anywhere; }
.review { background: var(--mustard); color: var(--ink); border-radius: var(--r); padding: 6px 20px; margin-bottom: 18px; }
.rv { list-style: none; margin: 0; padding: 0; }
.rv li { display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; padding: 14px 0; border-top: 1px solid rgba(5, 4, 2, .25); }
.rv li:first-child { border-top: 0; }
.rv p { margin: 0; font-size: 18px; line-height: 1.4; min-width: 0; overflow-wrap: anywhere; }
.edit { flex: none; font: 700 15px var(--text); color: var(--ink); background: transparent; border: 0; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; min-height: 44px; min-width: 44px; padding: 0 4px; }
.liq-note { box-shadow: inset 4px 0 0 var(--coral); padding: 4px 0 4px 16px; font-size: 16px; }
.launch-status { color: var(--paper); font-size: 16px; }
.launch-status:empty { display: none; }
.done { text-align: left; }
.done-house { width: 120px; height: auto; margin-bottom: 12px; }
.addr-copy { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 12px 0 18px; }
.addr-copy code { font-size: 16px; background: #15110b; padding: 10px 12px; border-radius: var(--r); overflow-wrap: anywhere; min-width: 0; flex: 1 1 260px; }
.done-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.preview .pv-sym { font: 400 clamp(28px, 3vw, 40px)/1 var(--display); margin-bottom: 10px; overflow-wrap: anywhere; }
.preview .summary { margin-bottom: 14px; }

/* ---------- responsive pass ---------- */
.links a { min-height: 44px; display: inline-flex; align-items: center; }
.wallet-btn { min-height: 44px; }
.slip button { min-height: 44px; min-width: 52px; }
.trade .bal { min-height: 44px; }
.toc a { min-height: 44px; display: flex; align-items: center; }
.choice span { min-height: 44px; display: inline-flex; align-items: center; }
.check { min-height: 44px; }
@media (max-width: 1079px) {
  .trade .doorway { position: sticky; bottom: 0; z-index: 4; width: 100%; min-height: 72px; border-radius: var(--r); }
  .trade { padding-bottom: 12px; }
  .trade .t-status { margin: 12px -22px -12px; }
}
@media (max-width: 899px) {
  .mk-row { border: 2px solid var(--rule); border-radius: var(--r); padding: 16px; margin-bottom: 12px; }
  .mk-row:hover { border-color: var(--mustard); }
}
@media (max-width: 600px) {
  .top { padding-top: 12px; padding-bottom: 8px; }
  .links { justify-content: space-between; gap: 0 12px; }
  .links a { font-size: 16px; }
  .cell { min-height: 150px; }
  .facts div, .q-facts div { padding: 12px 0; }
  .m-price .v { font-size: 34px; }
}
@media (max-width: 380px) {
  .brand span { font-size: 15px; }
  .wallet-btn { padding: 10px 12px; font-size: 15px; }
}
@media (max-width: 520px) { .progress { display: flex; } .progress li { flex: 1 1 0; } .progress li.now { flex: 3 1 0; } .progress li.now .pr-t { white-space: nowrap; } }
small { font-size: 15px; }
/* two-column hero: the words must fit their column, never clip */
@media (min-width: 1000px) { .stack { font-size: min(256px, calc((100vw - 2 * var(--pad) - 56px) * .6 / 3.1)); } }
@media (max-width: 420px) { .wl-long { display: none; } .brand .mark { width: 32px; height: 31px; } .brand { gap: 8px; } }
/* ---------- image uploader ---------- */
.uploader > span { display: block; font-weight: 700; margin-bottom: 8px; }
.uploader > span em { font-style: normal; font-weight: 400; color: var(--paper-dim); float: right; }
.drop { position: relative; display: flex; align-items: center; justify-content: center; min-height: 128px; padding: 20px; border-radius: var(--r); box-shadow: inset 0 0 0 2px var(--paper-dim); background: repeating-linear-gradient(135deg, transparent 0 14px, #120f0a 14px 16px); cursor: pointer; text-align: center; }
.drop:hover, .drop.over { box-shadow: inset 0 0 0 3px var(--mustard-hi); }
.drop.over { background: #1c160d; }
.drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.drop:focus-within { outline: 3px solid var(--mustard-hi); outline-offset: 3px; }
.drop-in { display: flex; flex-direction: column; gap: 4px; pointer-events: none; }
.drop-t { font: 400 20px/1.2 var(--display); }
.drop-s { font-size: 15px; color: var(--paper-dim); }
.img-prev { display: flex; gap: 16px; align-items: center; padding: 12px; border-radius: var(--r); box-shadow: inset 0 0 0 2px var(--rule); }
.img-prev img { width: 112px; height: 112px; object-fit: cover; border-radius: var(--r); background: var(--rule); flex: none; }
.img-prev p { margin: 0 0 10px; font-size: 15px; overflow-wrap: anywhere; }
.img-prev p.bad { color: var(--coral); font-weight: 700; }
.img-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.uploader small { display: block; margin-top: 6px; color: var(--paper-dim); font-size: 15px; }
.uploader small.bad { color: var(--coral); font-weight: 700; }
.pv-head { display: flex; gap: 12px; align-items: center; margin-bottom: 10px; min-width: 0; }
.pv-head img { width: 64px; height: 64px; object-fit: cover; border-radius: var(--r); flex: none; }
.pv-head .pv-sym { margin: 0; }
@media (max-width: 420px) { .img-prev img { width: 88px; height: 88px; } }
/* ---------- launch guard + launch check ---------- */
.guard-banner { background: var(--ink); color: var(--mustard-hi); border-radius: var(--r); padding: 12px 14px; margin-bottom: 16px; font-size: 15px; }
.guard-banner strong { color: var(--paper); }
#tMaxBuy { margin: -6px 0 14px; }
.lc { box-shadow: inset 0 0 0 3px var(--rule); border-radius: var(--r); padding: 20px; }
.lc-sum { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.lc-sum .st { font-size: 17px; padding: 8px 12px; }
.lc-meta, .lc-loading { color: var(--paper-dim); font-size: 15px; }
.lc-fail { color: var(--coral); }
.lc-fail .btn { margin-left: 8px; }
.st { display: inline-flex; align-items: center; font: 700 15px var(--text); padding: 3px 10px; border-radius: var(--r); white-space: nowrap; }
.st-pass { background: var(--paper); color: var(--ink); }
.st-watch { background: var(--mustard); color: var(--ink); }
.st-flag { background: var(--coral); color: var(--ink); }
.lc-list { list-style: none; margin: 0; padding: 0; }
.lc-item { padding: 14px 0; border-top: 1px solid var(--rule); min-width: 0; }
.lc-head { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 4px; }
.lc-head b { font-size: 17px; }
.lc-res { margin: 0 0 2px; font-weight: 600; overflow-wrap: anywhere; }
.lc-rule, .lc-note { margin: 0; color: var(--paper-dim); font-size: 15px; }
.lc-note { margin-top: 6px; color: var(--paper); }
.lc-det > summary, .lc-how > summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 700; color: var(--mustard-hi); }
.lc-ev { margin: 4px 0 0; padding-left: 18px; font-size: 15px; }
.lc-ev li { margin-bottom: 4px; overflow-wrap: anywhere; }
.lc-how { border-top: 3px solid var(--rule); margin-top: 8px; }
.lc-how ol { padding-left: 20px; }
.lc-how li, .lc-how p { font-size: 16px; }
.lc-badge { display: block; margin-top: 4px; font-size: 15px; color: var(--paper-dim); white-space: normal !important; }
.lc-badge[data-status="flag"] { color: var(--coral); font-weight: 700; }
.lc-badge[data-status="watch"] { color: var(--mustard-hi); }
@media (max-width: 600px) { .lc { padding: 16px 14px; } }
.owed { box-shadow: inset 0 0 0 3px var(--mustard); border-radius: var(--r); padding: 20px; }
.owed-list { list-style: none; margin: 0; padding: 0; }
.owed-list li { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; padding: 10px 0; border-top: 1px solid var(--rule); }
.owed-list span { min-width: 0; overflow-wrap: anywhere; }
.lc-badge[data-status="proto"] { color: var(--mustard-hi); font-weight: 700; }
.mk-home { box-shadow: inset 4px 0 0 var(--mustard); padding-left: 12px; }
