
:root{
  color-scheme:dark; --bg:#04050a; --ink:#f4f5f8; --dim:#8b90a3; --line:rgba(255,255,255,.10);
  --glass:rgba(16,18,28,.55); --fire:#ff5a1f; --fire2:#ffb347; --neb:#6b3cff;
  --mono:'JetBrains Mono',ui-monospace,Menlo,monospace; --sans:'Space Grotesk','Onest',system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--sans);overflow:hidden}
canvas{position:fixed;inset:0;width:100%;height:100%;display:block}
#sky{z-index:0}
#fx{z-index:3;pointer-events:none}
.neb{position:fixed;inset:-20%;z-index:1;pointer-events:none;
  background:radial-gradient(40% 30% at 80% 15%,rgba(107,60,255,.18),transparent 70%),
             radial-gradient(35% 28% at 10% 60%,rgba(255,90,31,.10),transparent 70%),
             radial-gradient(60% 40% at 50% 115%,rgba(255,120,40,.22),transparent 70%);
  animation:drift 40s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate3d(-3%,2%,0) scale(1.05)}}

#stage{position:fixed;inset:0;z-index:2;display:flex;justify-content:center}
.app{position:relative;width:100%;max-width:440px;height:100%;display:flex;flex-direction:column;
  padding:max(14px,env(safe-area-inset-top)) 18px max(14px,env(safe-area-inset-bottom))}

/* top bar */
.top{display:flex;align-items:center;justify-content:space-between;height:34px;flex:0 0 auto}
.brand{display:flex;align-items:center;gap:9px;font-weight:700;letter-spacing:.14em;font-size:13px}
.brand svg{width:26px;height:26px}
.live{font:600 10.5px var(--mono);letter-spacing:.12em;color:var(--dim);display:flex;align-items:center;gap:7px;
  border:1px solid var(--line);border-radius:99px;padding:6px 10px;background:rgba(0,0,0,.25)}
.live i{width:6px;height:6px;border-radius:50%;background:var(--fire);box-shadow:0 0 10px var(--fire);animation:pulse 1.4s infinite}
.live b{color:var(--ink);font-weight:600}
@keyframes pulse{50%{opacity:.35}}

/* hero */
.hero{margin-top:18px;flex:0 0 auto}
.kicker{font:600 10.5px var(--mono);letter-spacing:.24em;color:var(--fire)}
h1{font-size:clamp(30px,8.6vw,40px);line-height:1.02;letter-spacing:-.03em;margin:8px 0 0;font-weight:700}
h1 em{font-style:normal;background:linear-gradient(90deg,#fff,#ffcf9a 60%,var(--fire));-webkit-background-clip:text;background-clip:text;color:transparent}

/* pad + rocket */
.pad{position:relative;flex:1 1 auto;min-height:190px;display:flex;align-items:flex-end;justify-content:center}
.beam{position:absolute;bottom:0;width:180px;height:120%;pointer-events:none;opacity:.55;
  background:conic-gradient(from 180deg at 50% 100%,transparent 160deg,rgba(255,240,220,.16) 175deg,rgba(255,240,220,.22) 180deg,rgba(255,240,220,.16) 185deg,transparent 200deg)}
.beam.l{left:-30px;transform:rotate(14deg);transform-origin:50% 100%}
.beam.r{right:-30px;transform:rotate(-14deg);transform-origin:50% 100%}
.ground{position:absolute;left:-18px;right:-18px;bottom:0;height:46px;
  background:radial-gradient(60% 100% at 50% 100%,rgba(255,150,80,.18),transparent 70%),linear-gradient(transparent,rgba(0,0,0,.6))}
.tower{position:absolute;bottom:6px;left:calc(50% + 38px);width:26px;height:78%;max-height:300px;opacity:.55}
#rocketWrap{position:relative;z-index:2;height:86%;max-height:330px;aspect-ratio:120/360;transform-origin:50% 100%;will-change:transform}
#rocketWrap svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 18px 30px rgba(0,0,0,.6))}
.steam{position:absolute;bottom:4px;left:50%;width:220px;height:40px;transform:translateX(-50%);
  background:radial-gradient(50% 60% at 50% 70%,rgba(220,225,240,.22),transparent 70%);filter:blur(6px);animation:steam 3.5s ease-in-out infinite}
@keyframes steam{50%{transform:translateX(-50%) scale(1.12);opacity:.7}}

/* control panel */
.panel{flex:0 0 auto;background:var(--glass);border:1px solid var(--line);border-radius:22px;padding:14px;
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 20px 60px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);transition:transform .6s cubic-bezier(.7,0,.2,1),opacity .4s}
.label{font:600 9.5px var(--mono);letter-spacing:.22em;color:var(--dim);display:flex;justify-content:space-between}
.field{display:flex;align-items:center;gap:10px;margin-top:7px;border-bottom:1px solid var(--line);padding-bottom:9px}
.field input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--ink);font:700 26px var(--sans);letter-spacing:-.01em;text-transform:none}
.field input::placeholder{color:#3c4154}
.cap{width:100%;margin-top:8px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;
  color:var(--ink);font:500 13px var(--sans);padding:9px 11px;outline:0}
.cap:focus{border-color:rgba(255,90,31,.5)}
.chips{display:flex;gap:6px;margin-top:10px;overflow-x:auto;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;font:500 12.5px var(--sans);color:#cfd2dd;border:1px solid var(--line);background:rgba(255,255,255,.03);
  border-radius:99px;padding:7px 11px;cursor:pointer;transition:.2s}
.chip:active,.chip.on{border-color:var(--fire);color:#fff;background:rgba(255,90,31,.12)}
.dest{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:12px}
.opt{position:relative;border:1px solid var(--line);border-radius:14px;padding:10px 6px 9px;text-align:center;cursor:pointer;
  background:rgba(255,255,255,.025);transition:.25s}
.opt .p{font:700 17px var(--sans)}
.opt .n{font:600 9.5px var(--mono);letter-spacing:.14em;color:var(--dim);margin-top:3px}
.opt .ic{height:26px;display:flex;align-items:center;justify-content:center;margin-bottom:5px}
.opt.on{border-color:var(--fire);background:linear-gradient(180deg,rgba(255,90,31,.16),rgba(255,90,31,.03));box-shadow:0 0 0 1px rgba(255,90,31,.25),0 8px 24px rgba(255,90,31,.15)}
.opt .tag{position:absolute;top:-8px;left:50%;transform:translateX(-50%);white-space:nowrap;font:600 8px var(--mono);letter-spacing:.14em;
  background:var(--fire);color:#160600;padding:3px 6px;border-radius:5px}
.go{margin-top:12px;width:100%;height:56px;border:0;border-radius:16px;cursor:pointer;position:relative;overflow:hidden;
  font:700 16px var(--sans);letter-spacing:.16em;color:#1a0700;
  background:linear-gradient(180deg,#ff8a4c,var(--fire));box-shadow:0 10px 30px rgba(255,90,31,.35),inset 0 1px 0 rgba(255,255,255,.4)}
.go::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%);animation:shine 3.2s infinite}
@keyframes shine{60%,100%{transform:translateX(120%)}}
.go small{display:block;font:600 9px var(--mono);letter-spacing:.14em;opacity:.75;margin-top:2px}
.ticker{margin-top:9px;height:16px;overflow:hidden;font:400 10.5px var(--mono);color:var(--dim);text-align:center;white-space:nowrap}
.ticker span{display:inline-block;animation:tick .5s ease}
@keyframes tick{from{transform:translateY(100%);opacity:0}}

/* HUD during launch */
.hud{position:fixed;inset:0;z-index:4;pointer-events:none;display:flex;justify-content:center;opacity:0;transition:opacity .4s}
.hud.on{opacity:1}
.hud .in{width:100%;max-width:440px;padding:max(18px,env(safe-area-inset-top)) 18px;position:relative}
.hrow{display:flex;justify-content:space-between;font:600 10px var(--mono);letter-spacing:.18em;color:var(--dim)}
.hrow b{color:var(--ink);font-weight:600}
.count{position:absolute;left:0;right:0;top:13%;text-align:center;font:700 112px var(--mono);letter-spacing:-.05em;color:#fff;
  text-shadow:0 0 40px rgba(255,90,31,.6);opacity:0}
.count.pop{animation:pop .7s cubic-bezier(.2,.9,.3,1)}
@keyframes pop{0%{opacity:0;transform:scale(1.8)}25%{opacity:1;transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:scale(.85)}}
.adios{position:absolute;left:0;right:0;top:22%;text-align:center;font:700 64px var(--sans);letter-spacing:-.03em;opacity:0}
.adios.pop{animation:adios 1.6s ease forwards}
@keyframes adios{0%{opacity:0;transform:scale(.6) rotate(-4deg);filter:blur(8px)}20%{opacity:1;transform:scale(1.05);filter:blur(0)}75%{opacity:1}100%{opacity:0;transform:scale(1.25)}}
.capt{position:absolute;left:18px;right:18px;top:calc(max(18px,env(safe-area-inset-top)) + 64px);display:flex;gap:10px;align-items:flex-end;opacity:0;transform:translateY(10px);transition:.45s}
.capt.on{opacity:1;transform:none}
.capt svg{width:46px;height:46px;flex:0 0 auto}
.bubble{background:rgba(16,18,28,.75);border:1px solid var(--line);border-radius:14px 14px 14px 4px;padding:10px 12px;
  font:500 13.5px var(--sans);backdrop-filter:blur(10px)}
.bubble .who{font:600 9px var(--mono);letter-spacing:.18em;color:var(--fire);margin-bottom:3px}

/* destination body */
#world{position:fixed;left:50%;top:40%;z-index:2;width:240px;height:240px;transform:translate(-50%,-50%) scale(.2);opacity:0;pointer-events:none;transition:transform 1.6s cubic-bezier(.15,.8,.2,1),opacity 1s}
#world.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
#mini{position:fixed;left:50%;bottom:-80px;z-index:3;width:22px;height:66px;margin-left:-11px;pointer-events:none;opacity:0}
#mini svg{width:100%;height:100%}
#mini i{position:absolute;left:50%;top:100%;width:8px;height:26px;margin-left:-4px;border-radius:50%;background:radial-gradient(50% 50% at 50% 30%,#fff3d6,#ff7a32 50%,transparent 75%);filter:blur(1px)}
#ring{position:fixed;left:50%;top:40%;z-index:3;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:2px solid #ffd9b8;opacity:0;pointer-events:none}
#ring.boom{animation:ring .9s ease-out forwards}
@keyframes ring{0%{opacity:1;transform:scale(.2);box-shadow:0 0 40px #ff7a32}100%{opacity:0;transform:scale(9);border-width:.5px}}
.pad{transition:opacity .6s}
.spag{position:fixed;left:50%;top:40%;z-index:3;font:700 30px var(--sans);transform:translate(-50%,-50%);opacity:0;pointer-events:none;white-space:nowrap}
.spag.go2{animation:spag 2s ease-in forwards}
@keyframes spag{0%{opacity:1;transform:translate(-50%,120%) scale(1)}55%{opacity:1;transform:translate(-50%,-50%) scale(1.3,.7) rotate(0)}100%{opacity:0;transform:translate(-50%,-50%) scale(.02,6) rotate(540deg)}}

/* result sheet */
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:5;display:flex;justify-content:center;transform:translateY(105%);transition:transform .7s cubic-bezier(.2,.9,.2,1)}
.sheet.on{transform:none}
.sheet .in{width:100%;max-width:440px;margin:0 10px max(10px,env(safe-area-inset-bottom));background:rgba(12,13,20,.82);border:1px solid var(--line);border-radius:26px;padding:18px;
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:0 -10px 60px rgba(0,0,0,.5)}
.stamp{display:inline-block;font:600 9.5px var(--mono);letter-spacing:.2em;color:#7dffb0;border:1px solid rgba(125,255,176,.35);border-radius:6px;padding:4px 7px}
.sheet h2{margin:10px 0 2px;font-size:25px;letter-spacing:-.02em;line-height:1.1}
.sheet h2 span{color:var(--fire)}
.sheet .q{color:#c9ccd8;font-size:14px;margin:4px 0 0}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.stat{border:1px solid var(--line);border-radius:12px;padding:9px}
.stat .k{font:600 8.5px var(--mono);letter-spacing:.16em;color:var(--dim)}
.stat .v{font:700 14px var(--sans);margin-top:3px}
.acts{display:grid;grid-template-columns:1.4fr 1fr;gap:8px;margin-top:14px}
.btn{height:50px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink);font:700 14px var(--sans);cursor:pointer}
.btn.pri{background:linear-gradient(180deg,#ff8a4c,var(--fire));color:#1a0700;border:0;box-shadow:0 10px 30px rgba(255,90,31,.3)}
.gift{margin-top:10px;font-size:12.5px;color:var(--dim);text-align:center}
.gift b{color:var(--ink)}
.again{display:block;margin:10px auto 0;background:none;border:0;color:var(--dim);font:600 11px var(--mono);letter-spacing:.16em;cursor:pointer}

.shake{animation:shake .09s linear infinite}
@keyframes shake{25%{transform:translate(1.5px,-1px)}50%{transform:translate(-1.5px,1px)}75%{transform:translate(1px,1.5px)}}
.hide-ui .panel{transform:translateY(130%);opacity:0}
.hide-ui .hero,.hide-ui .top{opacity:0;transition:opacity .4s}
.hide-ui .mc{opacity:0}

:root{--gold:#ffd27a}
.ign{position:fixed;left:0;right:0;bottom:max(22px,env(safe-area-inset-bottom));z-index:5;display:flex;flex-direction:column;align-items:center;gap:12px;
  opacity:0;transform:translateY(40px);pointer-events:none;transition:opacity .45s,transform .45s}
.ign.on{opacity:1;transform:none;pointer-events:auto}
.paid{font:600 9.5px var(--mono);letter-spacing:.2em;color:#7dffb0}
.hwrap{position:relative;width:168px;height:168px;display:flex;align-items:center;justify-content:center}
.hwrap svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
#hold{position:relative;width:124px;height:124px;border-radius:50%;border:0;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;
  background:radial-gradient(circle at 50% 35%,#ffa06a,var(--fire) 55%,#a92e00);color:#1a0700;font:700 12px var(--sans);letter-spacing:.16em;line-height:1.35;
  box-shadow:0 0 0 10px rgba(255,90,31,.10),0 20px 60px rgba(255,90,31,.45),inset 0 2px 0 rgba(255,255,255,.35);transition:transform .15s,box-shadow .2s}
#hold:focus-visible{outline:2px solid #fff;outline-offset:6px}
.ign.hold #hold{transform:scale(.93)}
.ign.gold #hold{box-shadow:0 0 0 12px rgba(255,210,122,.35),0 0 80px rgba(255,210,122,.75),inset 0 2px 0 rgba(255,255,255,.5)}
.ign.gold #ringP{stroke:var(--gold)}
#ringP{transition:stroke .15s}
.thr{font:600 10px var(--mono);letter-spacing:.2em;color:var(--dim);text-align:center}
.thr b{color:var(--ink);display:inline-block;min-width:4ch;text-align:left}
.thr i{font-style:normal;color:var(--gold)}
.adios.gold{color:var(--gold);text-shadow:0 0 50px rgba(255,210,122,.6)}
#flash{position:fixed;inset:0;z-index:6;pointer-events:none;opacity:0;background:radial-gradient(60% 50% at 50% 60%,rgba(255,230,170,.9),rgba(255,160,60,.3) 50%,transparent 80%)}
#flash.go3{animation:flash .7s ease-out}
@keyframes flash{0%{opacity:0}15%{opacity:1}100%{opacity:0}}
#earth{position:fixed;left:50%;top:100%;z-index:1;width:280vw;height:280vw;max-width:1600px;max-height:1600px;border-radius:50%;transform:translate(-50%,0);pointer-events:none;
  background:radial-gradient(circle at 50% 8%,#3f8cff 0,#1d4fb8 18%,#0b1f4d 40%,#020611 62%);
  box-shadow:0 -6px 40px rgba(110,180,255,.55),0 -30px 120px rgba(60,130,255,.35),inset 0 10px 30px rgba(190,225,255,.5);
  transition:transform 2.2s cubic-bezier(.2,.8,.2,1),opacity 1s;opacity:0}
#earth.on{opacity:1;transform:translate(-50%,-26vh)}
#earth.away{opacity:0;transform:translate(-50%,10vh);transition:transform 1.2s ease-in,opacity 1s}
.mc{position:absolute;top:6px;left:0;z-index:3;display:flex;gap:8px;align-items:center;max-width:62%;transition:opacity .3s}
.mc svg{width:30px;height:30px;flex:0 0 auto}
.mc span{font:500 12px var(--sans);color:#d9dbe4;background:rgba(16,18,28,.6);border:1px solid var(--line);border-radius:12px 12px 12px 3px;padding:7px 10px;backdrop-filter:blur(8px)}
.mc span.pop{animation:mcp .35s ease}
@keyframes mcp{from{transform:translateY(4px) scale(.96);opacity:.2}}
.stats{grid-template-columns:repeat(2,1fr)!important}
.stat .v.gold{color:var(--gold)}

/* ---------- production additions ---------- */
.foot{margin-top:8px;display:flex;justify-content:center;gap:10px;font:500 9.5px var(--mono);letter-spacing:.08em;color:#5d6276;flex-wrap:wrap}
.foot a{color:inherit;text-decoration:none}
.foot a:hover{color:var(--ink)}
.foot button{background:none;border:0;color:inherit;font:inherit;letter-spacing:inherit;cursor:pointer;padding:0}
.foot button b{color:var(--ink);font-weight:600}
.field.err{border-bottom-color:var(--fire);animation:nudge .35s}
@keyframes nudge{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.go[disabled]{filter:saturate(.6) brightness(.85);cursor:progress}
.go .spin{display:inline-block;width:14px;height:14px;border:2px solid rgba(26,7,0,.35);border-top-color:#1a0700;border-radius:50%;animation:rot .8s linear infinite;vertical-align:-2px;margin-right:8px}
@keyframes rot{to{transform:rotate(360deg)}}
.live.quiet i{background:#7dffb0;box-shadow:0 0 10px #7dffb0}
.rrow{display:flex;gap:12px;align-items:flex-start}
.rrow .txt{flex:1;min-width:0}
.prev{flex:0 0 auto;width:84px;aspect-ratio:9/16;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#000;position:relative}
.prev canvas,.prev video,.prev img{position:static;width:100%;height:100%;display:block;object-fit:cover}
.prev .pct{position:absolute;left:0;right:0;bottom:6px;text-align:center;font:600 9px var(--mono);letter-spacing:.1em;color:#fff;text-shadow:0 1px 4px #000}
.reason{font:500 12px var(--sans);color:var(--dim);margin-top:4px}
.reason b{color:var(--ink);font-weight:600}
.btn[disabled]{opacity:.65;cursor:progress}
.note{margin-top:8px;font-size:11.5px;color:var(--dim);text-align:center;min-height:14px}
.verify{position:fixed;inset:0;z-index:7;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;background:rgba(4,5,10,.6);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .3s}
.verify.on{opacity:1;pointer-events:auto}
.verify .ring{width:46px;height:46px;border-radius:50%;border:3px solid rgba(255,255,255,.12);border-top-color:var(--fire);animation:rot 1s linear infinite}
.verify p{font:600 11px var(--mono);letter-spacing:.2em;color:var(--dim);margin:0;text-align:center;padding:0 24px}
@media (prefers-reduced-motion:reduce){.neb,.go::after,.steam,.live i{animation:none}}

/* Captain Adiós 2.0 idle life */
.lid{transform-box:fill-box;transform-origin:50% 0;animation:capBlink 5.5s infinite}
@keyframes capBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(3.2)}}
.ear.l{transform-box:fill-box;transform-origin:80% 100%;animation:capTwitch 8s infinite}
@keyframes capTwitch{0%,86%,100%{transform:rotate(0)}89%{transform:rotate(-9deg)}92%{transform:rotate(3deg)}}
.pupil{transform-box:fill-box;transform-origin:50% 50%;animation:capLook 9s ease-in-out infinite}
@keyframes capLook{0%,40%,100%{transform:translateX(0)}48%,62%{transform:translateX(3px)}70%,80%{transform:translateX(-2px)}}
.brand svg{width:30px;height:30px}
.mc svg{width:36px;height:36px}
.capt svg{width:56px;height:56px}
@media (prefers-reduced-motion:reduce){.lid,.ear.l,.pupil{animation:none}}

/* Telegram Mini App */
html.tg .foot a[href^="/contact"]{display:none}
