@font-face{font-family:"Antonio";src:url("/waitlist/antonio.woff2") format("woff2");font-weight:100 700;font-style:normal;font-display:swap}
:root{--black:#0e0e0e;--ink:#161616;--grey:#282828;--lime:#c8ff00;--plime:#e4ff6e;--white:#fff;--muted:#c4c4c4;--line:#2e2e2e}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--black)}
body{margin:0;background:var(--black);color:var(--white);font:400 17px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;min-height:100vh;overflow-x:hidden;position:relative}
.wrap{position:relative;z-index:1;max-width:480px;margin:0 auto;padding:max(18px,env(safe-area-inset-top)) 22px 56px}
.top{display:flex;align-items:center;gap:10px;padding:6px 0 22px}
.top img{width:40px;height:40px;border-radius:11px;display:block}
.top b{font:700 28px/1 "Antonio",Impact,"Arial Narrow",sans-serif;letter-spacing:.04em;text-transform:uppercase}
.top .tag{margin-left:auto;font:600 13px/1 "Antonio",Impact,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--black);background:var(--lime);padding:7px 10px;border-radius:99px}
h1,h2,.display{font-family:"Antonio",Impact,"Arial Narrow",sans-serif;font-weight:700;text-transform:uppercase;margin:0;letter-spacing:.01em}
h1{font-size:clamp(56px,17.5vw,96px);line-height:.88}
h1 span{display:block}
h1 .l{color:var(--lime)}
h1 .s{font-size:.52em;line-height:.95;margin-top:.12em}
.lead{font-size:19px;line-height:1.45;color:var(--muted);margin:18px 0 26px;max-width:30em}
.lead b{color:var(--white);font-weight:600}
.card{background:var(--ink);border:1.5px solid var(--line);border-radius:22px;padding:22px 20px 20px;box-shadow:0 0 0 1px rgba(200,255,0,.05),0 18px 50px rgba(0,0,0,.5)}
label,.lbl{display:block;font:600 15px/1.2 "Antonio",Impact,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--plime);margin:0 0 8px}
.opt{font-weight:400;color:#a9a9a9;letter-spacing:.06em}
input[type=email],select{width:100%;height:56px;border-radius:14px;border:2px solid #3a3a3a;background:#0b0b0b;color:var(--white);font:500 17px/1 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;padding:0 16px;margin:0 0 18px;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
input::placeholder{color:#8e8e8e}
select{background-image:linear-gradient(45deg,transparent 50%,var(--lime) 50%),linear-gradient(135deg,var(--lime) 50%,transparent 50%);background-position:calc(100% - 22px) 24px,calc(100% - 16px) 24px;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:40px}
input:focus,select:focus{outline:none;border-color:var(--lime);box-shadow:0 0 0 4px rgba(200,255,0,.22)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
button,.btn{display:block;width:100%;border:0;cursor:pointer;text-align:center;text-decoration:none;background:var(--lime);color:var(--black);font:700 30px/1 "Antonio",Impact,"Arial Narrow",sans-serif;letter-spacing:.05em;text-transform:uppercase;padding:19px 14px 17px;border-radius:16px;position:relative;overflow:hidden;box-shadow:0 6px 0 #7da000,0 14px 30px rgba(200,255,0,.25);transition:transform .15s,box-shadow .15s;animation:ring 2s ease-out infinite}
button:after,.btn:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:shine 4.5s ease-in-out 2s infinite}
button:hover,.btn:hover{transform:translateY(-2px)}
button:active,.btn:active{transform:translateY(4px)}
button:focus-visible,.btn:focus-visible,a:focus-visible{outline:3px solid var(--white);outline-offset:3px}
button[disabled]{opacity:.8;cursor:wait;animation:none;box-shadow:0 6px 0 #7da000}
.fine{margin:14px 2px 0;font-size:14px;line-height:1.4;color:#a9a9a9;text-align:center}
.perks{list-style:none;padding:0;margin:30px 0 0;display:grid;gap:12px}
.perks li{display:flex;gap:14px;align-items:center;background:var(--ink);border:1.5px solid var(--line);border-radius:18px;padding:14px 16px}
.perks .n{flex:none;width:44px;height:44px;border-radius:12px;background:var(--lime);color:var(--black);display:grid;place-items:center;font:700 26px/1 "Antonio",Impact,sans-serif}
.perks b{display:block;font:700 24px/1.05 "Antonio",Impact,"Arial Narrow",sans-serif;text-transform:uppercase;letter-spacing:.03em}
.perks span.d{display:block;font-size:15px;line-height:1.35;color:var(--muted);margin-top:3px}
h2{font-size:clamp(40px,12.5vw,56px);line-height:.95}
h2 .l{color:var(--lime)}
.sec{margin-top:46px}
.sec p{color:var(--muted);margin:12px 0 0}
.art{margin:20px 0 0;border-radius:24px;overflow:hidden;border:1.5px solid var(--line);background:#000;position:relative}
.art img{display:block;width:100%;height:auto}
.art.env img{animation:bob 6s ease-in-out infinite}
.art.app{background:#fff0}
.art.app img{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 16%);mask-image:linear-gradient(to bottom,transparent 0,#000 16%)}
.cap{font:600 15px/1.2 "Antonio",Impact,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);margin:14px 0 0}
.bottom{margin-top:44px;text-align:center}
.bottom h2{margin-bottom:18px}
footer{margin-top:44px;padding-top:20px;border-top:1px solid var(--line);font-size:14px;color:#a0a0a0;text-align:center;line-height:1.7}
footer a,.fine a,.link{color:var(--plime);text-underline-offset:3px}
.rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.rv.in{opacity:1;transform:none}
.pop{animation:pop .7s cubic-bezier(.2,1.4,.4,1) both}
.d1{animation-delay:.08s}.d2{animation-delay:.18s}.d3{animation-delay:.3s}.d4{animation-delay:.42s}
@keyframes pop{from{opacity:0;transform:translateY(22px) scale(.97)}to{opacity:1;transform:none}}
@keyframes shine{0%,60%{left:-60%}100%{left:140%}}
@keyframes bob{0%,100%{transform:translateY(0) scale(1.0)}50%{transform:translateY(-6px) scale(1.015)}}
@keyframes heart{0%{transform:translateY(0) scale(.8);opacity:0}15%{opacity:1}100%{transform:translateY(-70px) scale(1.1);opacity:0}}
.hearts{position:relative;height:0}
.hearts i{position:absolute;right:18px;top:-8px;color:var(--lime);font-style:normal;font-size:20px;opacity:0;animation:heart 3.6s ease-in infinite}
.hearts i:nth-child(2){right:52px;animation-delay:1.2s;font-size:15px;color:#fff}
.hearts i:nth-child(3){right:88px;animation-delay:2.3s;font-size:17px}

/* animated background: slow drifting lime / dark blobs (transform only, GPU) */
.bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:var(--black)}
.bg i{position:absolute;display:block;border-radius:50%;will-change:transform;opacity:.9}
.bg i:nth-child(1){width:150vmax;height:150vmax;left:-60vmax;top:-85vmax;background:radial-gradient(closest-side,rgba(200,255,0,.30),rgba(200,255,0,.10) 55%,transparent 100%);animation:drift1 22s ease-in-out infinite alternate}
.bg i:nth-child(2){width:130vmax;height:130vmax;right:-80vmax;top:25vh;background:radial-gradient(closest-side,rgba(150,210,0,.24),rgba(120,170,0,.08) 55%,transparent 100%);animation:drift2 28s ease-in-out infinite alternate}
.bg i:nth-child(3){width:120vmax;height:120vmax;left:-70vmax;bottom:-80vmax;background:radial-gradient(closest-side,rgba(228,255,110,.20),rgba(200,255,0,.06) 55%,transparent 100%);animation:drift3 34s ease-in-out infinite alternate}
@keyframes drift1{0%{transform:translate3d(-6vmax,0,0) scale(1)}50%{transform:translate3d(22vmax,14vmax,0) scale(1.08)}100%{transform:translate3d(46vmax,36vmax,0) scale(.95)}}
@keyframes drift2{0%{transform:translate3d(0,-10vmax,0) scale(1)}50%{transform:translate3d(-28vmax,-30vmax,0) scale(1.1)}100%{transform:translate3d(-60vmax,-4vmax,0) scale(.92)}}
@keyframes drift3{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(30vmax,-20vmax,0) scale(1.12)}100%{transform:translate3d(60vmax,10vmax,0) scale(.95)}}
/* shrinking headline stack */
.echo{display:block;margin-top:.1em;container-type:inline-size;--w:100vw}
.echo span{display:block;white-space:nowrap;line-height:.92;letter-spacing:.01em;color:var(--lime)}
.echo .r1{font-size:calc((100vw - 44px)*.30);font-size:29.8cqw}
.echo .r2{font-size:calc((100vw - 44px)*.205);font-size:20.4cqw;color:var(--white)}
.echo .r3{font-size:calc((100vw - 44px)*.121);font-size:12.1cqw;margin-top:.22em}
.echo .r4{font-size:calc((100vw - 44px)*.100);font-size:10cqw;color:var(--white);opacity:.9}
.echo .r5{font-size:calc((100vw - 44px)*.082);font-size:8.2cqw;opacity:.78}
.echo .r6{font-size:calc((100vw - 44px)*.067);font-size:6.7cqw;color:var(--white);opacity:.62}
.echo .r7{font-size:calc((100vw - 44px)*.055);font-size:5.5cqw;opacity:.48}
.echo .r8{font-size:calc((100vw - 44px)*.045);font-size:4.5cqw;color:var(--white);opacity:.36}
/* pulsing glow rings on every join button */
.ctaw{display:block;position:relative;border-radius:16px}
.ctaw:before,.ctaw:after{content:"";position:absolute;inset:0;border-radius:16px;pointer-events:none;box-shadow:0 0 0 0 rgba(200,255,0,.7);opacity:0;animation:ringx 2s ease-out infinite}
.ctaw:before{animation-delay:.67s}
.ctaw:after{animation-delay:1.33s}
.ctaw.off:before,.ctaw.off:after{animation:none}
@keyframes ring{0%{box-shadow:0 6px 0 #7da000,0 0 22px 2px rgba(200,255,0,.35),0 0 0 0 rgba(200,255,0,.7)}70%{box-shadow:0 6px 0 #7da000,0 0 34px 6px rgba(200,255,0,.5),0 0 0 22px rgba(200,255,0,0)}100%{box-shadow:0 6px 0 #7da000,0 0 22px 2px rgba(200,255,0,.35),0 0 0 22px rgba(200,255,0,0)}}
@keyframes ringx{0%{opacity:1;box-shadow:0 0 0 0 rgba(200,255,0,.65)}80%{opacity:1;box-shadow:0 0 0 24px rgba(200,255,0,0)}100%{opacity:0;box-shadow:0 0 0 24px rgba(200,255,0,0)}}

/* badge wobble */
.top .tag{display:inline-block;transform-origin:50% 60%;animation:wobble 5s ease-in-out 2.5s infinite}
@keyframes wobble{0%,14%,100%{transform:rotate(0)}2%{transform:rotate(-9deg) scale(1.06)}4%{transform:rotate(8deg) scale(1.06)}6%{transform:rotate(-6deg)}8%{transform:rotate(5deg)}10%{transform:rotate(-2.5deg)}12%{transform:rotate(1deg)}}
/* share row */
.share{margin-top:26px}
.share .lbl{margin:0 0 10px}
.center .share .lbl{text-align:center}
.srow{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.share .sb{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-width:0;height:54px;padding:0 10px;border-radius:14px;border:2px solid #3a3a3a;background:var(--ink);color:var(--white);font:700 20px/1 "Antonio",Impact,"Arial Narrow",sans-serif;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;box-shadow:none;animation:none;overflow:visible;cursor:pointer;transition:border-color .2s,color .2s,background .2s,transform .15s;-webkit-tap-highlight-color:transparent}
.share .sb:after{display:none}
.share .sb svg{flex:none;width:22px;height:22px;fill:var(--lime);transition:fill .2s}
.share .sb span{white-space:nowrap}
.share .sb:hover,.share .sb:focus-visible{border-color:var(--lime);color:var(--lime)}
.share .sb:active{transform:scale(.97);box-shadow:none}
.share .sb.wide{grid-column:1/-1}
.share .sb.st{background:var(--lime);border-color:var(--lime);color:var(--black)}
.share .sb.st svg{fill:none;stroke:var(--black)}
.share .sb.st:hover{background:var(--plime);color:var(--black)}
.toast{position:fixed;left:0;right:0;margin:0 auto;bottom:max(18px,env(safe-area-inset-bottom));z-index:20;width:fit-content;max-width:calc(100vw - 32px);background:var(--lime);color:var(--black);border-radius:14px;padding:12px 16px;font:600 15px/1.35 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 10px 30px rgba(0,0,0,.6);text-align:center;animation:pop .35s ease both}
.toast[hidden]{display:none}
.toast a{color:var(--black);font-weight:800;text-underline-offset:3px;white-space:nowrap}
/* thanks */
.center{text-align:center}
.big{width:112px;height:112px;margin:30px auto 18px;border-radius:30px;display:block;animation:pop .8s cubic-bezier(.2,1.5,.4,1) both,float 4s ease-in-out 1s infinite}
@keyframes float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(2deg)}}
.stack{display:grid;gap:12px;margin-top:26px}
.btn.ghost{background:transparent;color:var(--white);box-shadow:inset 0 0 0 2px #444;animation:none;font-size:26px}
.btn.ghost:after{display:none}
.btn.ghost:hover{box-shadow:inset 0 0 0 2px var(--lime);color:var(--lime)}
@media (min-width:700px){.wrap{max-width:520px;padding-top:40px}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.ctaw:before,.ctaw:after{opacity:0}.bg i:nth-child(1){transform:translate3d(20vmax,10vmax,0)}.rv{opacity:1;transform:none}}

/* ===== DRAFT v1: receding headline + mostly-black colour-drift background ===== */
.bg{background:#0e0e0e}
.bg i{opacity:1;filter:blur(30px)}
.bg i:nth-child(1){background:radial-gradient(closest-side,rgba(0,215,200,.20),rgba(0,215,200,.06) 55%,transparent 100%);animation:drift1 26s ease-in-out infinite alternate,hue 40s linear infinite}
.bg i:nth-child(2){background:radial-gradient(closest-side,rgba(130,70,255,.22),rgba(130,70,255,.06) 55%,transparent 100%);animation:drift2 32s ease-in-out infinite alternate,hue 52s linear infinite reverse}
.bg i:nth-child(3){background:radial-gradient(closest-side,rgba(255,40,160,.16),rgba(255,40,160,.05) 55%,transparent 100%);animation:drift3 38s ease-in-out infinite alternate,hue 64s linear infinite}
@keyframes hue{from{filter:blur(30px) hue-rotate(0deg)}to{filter:blur(30px) hue-rotate(360deg)}}
/* headline lines glide backwards: a wave of light travels from front to back while the stack slowly recedes */
.echo{perspective:700px;perspective-origin:50% 0}
.echo span{transform-origin:50% 0;animation:recede 7s cubic-bezier(.4,0,.2,1) infinite;animation-delay:calc(var(--i)*.35s)}
.echo .r1{--i:0}.echo .r2{--i:1}.echo .r3{--i:2}.echo .r4{--i:3}.echo .r5{--i:4}.echo .r6{--i:5}.echo .r7{--i:6}.echo .r8{--i:7}
@keyframes recede{
  0%,100%{transform:translate3d(0,0,0) scale(1);filter:brightness(1)}
  20%{transform:translate3d(0,-3%,-60px) scale(.97);filter:brightness(1.5) drop-shadow(0 0 14px rgba(200,255,0,.55))}
  45%{transform:translate3d(0,-6%,-140px) scale(.94);filter:brightness(1)}
}
@media (prefers-reduced-motion:reduce){.echo span{animation:none!important}}

/* DRAFT v2: hide "Got a bill?" but keep its space */
h1 > .pop.d1{visibility:hidden}
