:root{
  --ink:#080808;
  --ink-2:#141414;
  --ink-3:#1e1e1e;
  --bone:#f6f5ef;
  --white:#ffffff;
  --txt:#e4e4e0;
  --mute:#8d8d88;
  --mute-d:#6b6b66;
  --line:#2a2a2a;
  --up:#3ecf8e;
  --down:#ff6b5b;
  --wash:linear-gradient(135deg,#d9f99d 0%,#86efac 45%,#5eead4 100%);
  --r-lip:32px;
  --r-card:28px;
  --sans:"Geist",system-ui,-apple-system,Segoe UI,sans-serif;
  --mono:"Geist Mono",ui-monospace,Menlo,monospace;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--ink);color:var(--txt);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
[hidden]{display:none!important}
img{display:block}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* nav: fixed, picks up a frosted bar once you leave the top */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:16px clamp(16px,4vw,40px);transition:background .3s ease,padding .3s ease}
.nav.solid{background:rgba(8,8,8,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding-top:10px;padding-bottom:10px}
.nav.on-bone{background:rgba(246,245,239,.8)}
.nav.on-bone .brand{color:var(--ink)}
.nav.on-bone .brand .chain{border-color:#d6d4cb;color:#77776f}
.brand{display:flex;align-items:center;gap:10px;font-weight:600;font-size:20px;letter-spacing:-.03em;color:var(--white);transition:color .3s}
.mark{width:28px;height:28px;flex:none;object-fit:contain;transition:filter .3s}
.nav.on-bone .mark{filter:invert(1)}
.brand .chain{font-size:12px;font-weight:500;letter-spacing:0;color:var(--mute);border:1px solid var(--line);border-radius:99px;padding:2px 9px;margin-left:2px}
.pill{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 8px 0 22px;border-radius:99px;background:var(--white);color:var(--ink);font-weight:500;font-size:15px;border:0;cursor:pointer;transition:transform .2s ease}
.pill:hover{transform:translateY(-1px)}
.pill .ico{width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--white);display:grid;place-items:center;font-size:14px}
.pill.dark{background:var(--ink);color:var(--white)}
.pill.dark .ico{background:var(--white);color:var(--ink)}
.pill.sm{height:42px;padding-left:18px;font-size:14px}
.pill.sm .ico{width:28px;height:28px}
.nav.on-bone .pill{background:var(--ink);color:var(--white)}
.nav.on-bone .pill .ico{background:var(--white);color:var(--ink)}

/* slabs */
.slab{position:relative;padding:clamp(72px,10vw,128px) clamp(16px,4vw,40px)}
.slab.dark{background:var(--ink);color:var(--txt)}
.slab.bone{background:var(--bone);color:var(--ink)}
.slab.lip{border-radius:var(--r-lip) var(--r-lip) 0 0;margin-top:calc(-1 * var(--r-lip));z-index:2}
.wrap{max-width:1180px;margin:0 auto}
.h1,.h2{font-weight:600;letter-spacing:-.045em;line-height:.98;text-align:center}
.h1{font-size:clamp(46px,8.4vw,112px);color:var(--white)}
.h2{font-size:clamp(36px,5.6vw,72px)}
.bone .h2{color:var(--ink)}
.dark .h2{color:var(--white)}
.lede{max-width:560px;margin:24px auto 0;text-align:center;font-size:clamp(16px,1.6vw,19px);color:var(--mute)}
.bone .lede{color:#55554f}

.inline-logos{display:inline-flex;vertical-align:middle;margin:0 .12em;transform:translateY(-.06em)}
.inline-logos img{width:.78em;height:.78em;border-radius:50%;border:.05em solid var(--ink);margin-left:-.2em;background:var(--ink)}
.inline-logos img:first-child{margin-left:0}

/* hero */
.hero{min-height:100svh;display:flex;align-items:center;padding-top:120px;padding-bottom:64px}
.hero .wrap{width:100%}
.hero .cta{display:flex;justify-content:center;margin-top:36px}
.scroll-cue{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:clamp(48px,9vh,96px);font-size:13px;color:var(--mute-d)}
.scroll-cue span{width:1px;height:48px;background:linear-gradient(var(--mute),transparent);animation:cue 2.2s ease-in-out infinite;transform-origin:top}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* the story */
.story{position:relative;background:var(--ink);padding:0 clamp(16px,4vw,40px)}
.story-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 380px;gap:clamp(32px,6vw,96px)}
.beat{min-height:100svh;display:flex;align-items:center}
.beat-in{max-width:440px;opacity:.18;transform:translateY(24px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.beat.on .beat-in{opacity:1;transform:none}
.beat-n{font-size:13px;color:var(--mute-d)}
.beat h3{margin-top:14px;font-size:clamp(32px,4.2vw,54px);font-weight:600;letter-spacing:-.045em;line-height:1;color:var(--white)}
.beat p{margin-top:18px;font-size:17px;color:var(--mute)}
.beat-pairs{display:flex;flex-wrap:wrap;gap:28px;margin-top:28px}
.beat-pairs .k{font-size:12px;color:var(--mute-d)}
.beat-pairs .v{font-size:18px;color:var(--white);margin-top:2px;overflow-wrap:anywhere}

.story-pin{align-self:start;position:sticky;top:0;height:100svh;display:flex;align-items:center;justify-content:center;gap:22px}
.rail{display:flex;flex-direction:column;gap:10px}
.rail i{width:6px;height:6px;border-radius:6px;background:var(--line);transition:height .4s var(--ease),background .4s}
.rail i.on{height:26px;background:var(--white)}

.phone-s{position:relative;width:330px;height:640px;transform:scale(var(--ps-scale,1));border-radius:50px;background:var(--ink-2);border:1px solid var(--line);overflow:hidden;box-shadow:0 30px 120px rgba(134,239,172,.08);flex:none}
.ps-top{position:absolute;top:0;left:0;right:0;height:52px;display:flex;justify-content:space-between;align-items:center;padding:0 28px;font-size:13px;color:var(--mute);z-index:3}
.ps-isle{width:92px;height:26px;border-radius:99px;background:#000}
.ps{position:absolute;inset:52px 0 0;padding:14px 18px 20px;opacity:0;transform:translateY(18px) scale(.985);transition:opacity .5s var(--ease),transform .5s var(--ease);pointer-events:none}
.ps.on{opacity:1;transform:none}
.ps.past{transform:translateY(-18px) scale(.985)}
.ps-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.ps-brand{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--white);letter-spacing:-.03em}
.ps-brand .mark{width:22px;height:22px}
.ps-chip{font-size:12px;color:var(--mute);background:var(--ink-3);border-radius:99px;padding:5px 10px}
.ps-title{font-size:28px;font-weight:600;letter-spacing:-.04em;color:var(--white);margin:6px 2px 14px}

.dv-note{border-radius:18px;background:var(--wash);color:var(--ink);padding:12px 14px;font-size:14px;display:flex;align-items:center;gap:10px}
.dv-note img{width:26px;height:26px;border-radius:50%}
.dv-big{margin:22px 4px 4px}
.dv-big .k{font-size:13px;color:var(--mute)}
.dv-big .v{font-size:40px;color:var(--white);letter-spacing:-.04em;line-height:1.1}
.dv-big .s{font-size:12px;color:var(--mute-d)}
.dv-rows{margin-top:16px;border-radius:20px;background:var(--ink-3);padding:2px 16px}
.dv-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;font-size:14px;border-bottom:1px solid var(--line)}
.dv-row:last-child{border:0}
.dv-row span:first-child{color:var(--mute)}
.dv-row span:last-child{color:var(--white)}
.dv-btn{margin-top:18px;height:54px;border-radius:99px;background:var(--white);color:var(--ink);display:flex;align-items:center;justify-content:center;font-weight:600}

.ps-ad{display:flex;flex-direction:column;background:#000;padding:10px 16px 22px}
.ad-top{display:flex;justify-content:space-between;align-items:center}
.ad-tag{font-size:12px;color:var(--ink);background:var(--white);border-radius:99px;padding:5px 11px;font-weight:500}
.ad-left{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--white);font-size:14px}
.ad-art{position:relative;flex:1;margin:16px 0;border-radius:26px;overflow:hidden;background:#0d0d0d}
.blob{position:absolute;border-radius:50%;filter:blur(40px);opacity:.75}
.b1{width:240px;height:240px;background:#86efac;left:-60px;top:30px;animation:drift 9s ease-in-out infinite alternate}
.b2{width:200px;height:200px;background:#5eead4;right:-50px;top:200px;animation:drift 11s ease-in-out infinite alternate-reverse}
.b3{width:190px;height:190px;background:#d9f99d;left:50px;bottom:-40px;animation:drift 13s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate(0,0) scale(1)}to{transform:translate(40px,-30px) scale(1.15)}}
.ad-copy{position:absolute;left:20px;right:20px;bottom:22px;font-size:24px;font-weight:600;letter-spacing:-.035em;line-height:1.1;color:var(--white)}
.ad-copy span{display:block;font-size:13px;font-weight:400;letter-spacing:0;color:rgba(255,255,255,.7);margin-top:8px}
.ad-bar{height:4px;border-radius:4px;background:var(--ink-3);overflow:hidden}
.ad-bar i{display:block;height:100%;width:0;background:var(--white)}

.ps-fill{text-align:center}
.fl-steps{display:flex;flex-direction:column;gap:9px;text-align:left;margin:8px 4px 26px}
.fl-step{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--mute)}
.fl-step i{width:10px;height:10px;border-radius:50%;background:#86efac}
.fl-logo{width:56px;height:56px;border-radius:50%;margin:0 auto 12px}
.fl-amt{font-size:26px;color:var(--white);letter-spacing:-.03em}
.fl-worth{font-size:13px;color:var(--mute);margin-top:2px;min-height:20px}
.fl-pairs{display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:left;margin-top:22px;padding:16px;border-radius:20px;background:var(--ink-3)}
.fl-pairs .k{font-size:12px;color:var(--mute)}
.fl-pairs .v{font-size:14px;color:var(--white);margin-top:2px}

.pk-list{display:flex;flex-direction:column;gap:7px}
.pk{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:18px;background:var(--ink-3);border:1px solid transparent}
.pk.on{border-color:#86efac}
.pk img{width:32px;height:32px;border-radius:50%}
.pk .n{flex:1;min-width:0}
.pk .n b{display:block;color:var(--white);font-weight:500;font-size:14px}
.pk .n small{color:var(--mute);font-size:12px}
.pk .p{text-align:right;font-size:13px;color:var(--white)}
.pk .p small{display:block;font-size:11px}

.wl-card{border-radius:20px;background:var(--ink-3);padding:16px;margin-bottom:10px}
.wl-card .k{font-size:12px;color:var(--mute);margin-bottom:6px}
.wl-addr{font-size:13px;color:var(--white);overflow-wrap:anywhere}
.wl-apps{color:var(--white);font-size:14px}
.wl-btns{display:flex;gap:8px;margin-bottom:10px}
.wl-btns span{flex:1;height:42px;border-radius:99px;border:1px solid var(--line);display:grid;place-items:center;font-size:13px;color:var(--white)}
.wl-btns span:last-child{background:var(--white);color:var(--ink);border-color:var(--white)}

.up{color:#138a57}
.down{color:#c8402f}
.story .up,.dark .up{color:var(--up)}
.story .down,.dark .down{color:var(--down)}

/* stocks grid on bone */
.grid6{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:56px}
.card{border-radius:var(--r-card);padding:26px;background:var(--white)}
.stock{opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.stock.in{opacity:1;transform:none}
.stock .top{display:flex;align-items:center;gap:14px}
.stock .top img{width:44px;height:44px;border-radius:50%}
.stock .nm{font-weight:600;font-size:19px;letter-spacing:-.02em}
.stock .gp{font-size:13px;color:#77776f}
.pairs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:28px}
.pairs .k{font-size:12px;color:#77776f}
.pairs .v{font-size:17px;margin-top:2px}
.src{margin-top:22px;text-align:center;font-size:13px;color:#77776f}

/* treasury, read live from the chain */
.treasury{background:var(--ink-2);border-radius:var(--r-card);padding:28px;margin-bottom:14px}
.tr-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.tr-t{font-size:clamp(24px,2.6vw,32px);font-weight:600;letter-spacing:-.035em;color:var(--white)}
.tr-addr{display:inline-block;margin-top:6px;font-size:13px;color:#86efac;overflow-wrap:anywhere}
.tr-pairs{display:flex;gap:32px}
.tr-pairs .k{font-size:12px;color:var(--mute)}
.tr-pairs .v{font-size:20px;color:var(--white);margin-top:2px}
.tr-feed{margin-top:22px;border-top:1px solid var(--line)}
.tr-row{display:grid;grid-template-columns:28px 1fr auto auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--txt)}
.tr-row img{width:28px;height:28px;border-radius:50%}
.tr-row .w{color:var(--mute)}
.tr-row .s{color:#86efac}
.tr-row:hover .n{color:var(--white)}
.tr-empty{padding:16px 0 0;font-size:14px;color:var(--mute)}

/* contract address */
.ca-row{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px}
.ca{display:inline-flex;align-items:center;gap:10px;max-width:100%;height:40px;padding:0 6px 0 6px;border-radius:99px;border:1px solid var(--line);background:rgba(20,20,20,.7);color:var(--txt);font:inherit;font-size:13px;cursor:pointer;transition:border-color .2s}
.ca:hover{border-color:#3a3a3a}
.ca-k{background:var(--white);color:var(--ink);border-radius:99px;padding:3px 9px;font-weight:600;font-size:11px}
.ca-v{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ca-c{background:var(--ink-3);border-radius:99px;padding:5px 11px;color:var(--white);font-size:12px;flex:none}
.ca.copied .ca-c{background:#86efac;color:var(--ink)}
.ca-link{font-size:13px;color:#86efac}
.foot-ca{grid-column:1 / -1;min-width:0}
.ca-foot{margin-top:8px;padding-left:14px;max-width:100%}
.ca-side{align-self:flex-start;padding-left:6px}
@media (max-width:600px){.ca-row .ca{width:100%}.ca-row{flex-direction:column;gap:10px}}

/* ending */
.end{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.washcard{background:var(--wash);color:var(--ink);border-radius:var(--r-card);padding:32px;display:flex;flex-direction:column;justify-content:space-between;gap:32px}
.washcard .t{font-size:clamp(26px,2.8vw,36px);font-weight:600;letter-spacing:-.035em;line-height:1.05}
.washcard .pairs{grid-template-columns:1fr 1fr}
.washcard .pairs .k{color:rgba(8,8,8,.6)}
.washcard .pairs .v{font-size:22px;color:var(--ink)}
.washcard .fine{font-size:13px;color:rgba(8,8,8,.65)}
.closer{background:var(--white);color:var(--ink);border-radius:var(--r-card);padding:clamp(40px,5vw,64px) 28px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.closer .h2{color:var(--ink)}
.closer p{max-width:420px;margin:18px auto 30px;color:#55554f}
.foot{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:72px;font-size:14px}
.foot .k{color:var(--mute-d)}
.foot .v{color:var(--txt);margin-top:4px}
.wordmark{font-weight:600;letter-spacing:-.07em;line-height:.8;font-size:clamp(72px,17vw,250px);text-align:center;color:#141414;margin-top:56px;user-select:none;white-space:nowrap}

@media (prefers-reduced-motion:reduce){
  .beat-in,.ps,.stock{transition:none}
  .blob,.scroll-cue span{animation:none}
}

@media (max-width:900px){
  .grid6{grid-template-columns:1fr 1fr}
  .end{grid-template-columns:1fr}
  /* story: phone pinned on top, beats scroll up over its lower edge */
  .story-grid{display:flex;flex-direction:column;gap:0}
  .story-pin{order:0;height:auto;top:64px;padding-top:8px;z-index:1}
  .story-text{order:1;position:relative;z-index:2;margin-top:-30svh}
  .rail{display:none}
  .phone-s{width:300px;height:560px;transform:scale(var(--ps-scale,1));transform-origin:top center;margin-bottom:calc(560px * (var(--ps-scale,1) - 1))}
  .beat{align-items:flex-end;padding-bottom:16px;min-height:100svh}
  .beat-in{position:sticky;bottom:max(16px,env(safe-area-inset-bottom));max-width:none;width:100%;background:rgba(20,20,20,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:26px;padding:22px}
  .beat:not(.on) .beat-in{opacity:0}
  .beat h3{font-size:28px}
  .beat p{font-size:15px;margin-top:10px}
  .beat-pairs{margin-top:16px;gap:20px}
}
@media (max-width:600px){
  .tr-pairs{gap:20px;flex-wrap:wrap}
  .tr-row{grid-template-columns:24px 1fr auto}
  .tr-row .w{display:none}
  .grid6{grid-template-columns:1fr}
  .foot{grid-template-columns:minmax(0,1fr)}
  .nav .pill .lbl{display:none}
  .nav .pill{padding:0 7px}
}
