:root{
--bg:#ffffff; --bg-2:#f5f6fc; --surface:#ffffff; --surface-2:#f5f6fb; --surface-3:#edeef7;
--ink:#1D2433; --ink-2:hsl(223 20% 32%); --mut:hsl(223 12% 48%); --faint:hsl(223 16% 68%);
--bd:hsl(230 32% 89%); --line:hsl(230 36% 93%); --track:hsl(230 34% 95%);
--violet:#4F4FEA; --violet-2:#6D6DEE; --violet-press:#2D2DE6; --lav:#8E93F2; --lav-2:#cbd3fb;
--violetT:hsl(240 79% 61% / .10); --violetT2:hsl(240 79% 61% / .055);
--mint:#01f083; --mint-ink:#065f46; --mintT:hsl(153 99% 47% / .16);
--danger:#b91c1c; --dangerT:hsl(0 74% 42% / .11);
--block:#3d3dd6; --block-2:#4F4FEA; --block-deep:#25239c; --on-block:#ffffff; --on-block-2:hsl(240 60% 90%);
--dock:hsla(0 0% 100% / .74); --dock-bd:hsl(230 32% 86%);
--shadow:0 1px 3px hsl(230 40% 20% / .07), 0 1px 2px hsl(230 40% 20% / .05);
--shadow-md:0 6px 18px hsl(230 40% 25% / .10);
--shadow-lg:0 18px 46px hsl(230 45% 22% / .18);
--shadow-3d:0 16px 34px hsl(230 45% 25% / .16), 0 5px 12px hsl(230 45% 25% / .12), 0 1px 2px hsl(230 45% 25% / .10);
--glow:0 3px 14px hsl(240 79% 61% / .32);
--sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
--display:'Space Grotesk','Inter',system-ui,sans-serif;
--mono:'Space Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
--r-chip:6px; --r-btn:11px; --r-tile:13px; --r-card:16px; --r-modal:20px; --r-pill:999px;
--ease-out:cubic-bezier(.16,1,.3,1);
--ease-std:cubic-bezier(.4,0,.2,1);
--t-micro:.14s; --t-fast:.2s; --t-base:.28s; --t-enter:.7s; --t-hero:1s;
--stagger:55ms;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
--bg:hsl(220 4% 9%); --bg-2:hsl(225 5% 11%); --surface:hsl(240 4% 13%); --surface-2:hsl(240 4% 16%); --surface-3:hsl(240 4% 20%);
--ink:hsl(230 10% 95%); --ink-2:hsl(230 7% 78%); --mut:hsl(230 6% 63%); --faint:hsl(230 6% 47%);
--bd:hsl(230 8% 26%); --line:hsl(230 8% 20%); --track:hsl(230 7% 22%);
--violet:#8888F1; --violet-2:#ADADF5; --violet-press:#CDCDF9; --lav-2:#5b53b8;
--violetT:hsl(240 79% 74% / .18); --violetT2:hsl(240 79% 74% / .10);
--mint-ink:#bbf7d8; --mintT:hsl(153 99% 47% / .18);
--danger:#f87171; --dangerT:hsl(0 80% 68% / .16);
--dock:hsla(230 5% 17% / .72); --dock-bd:hsl(230 5% 26% / .6);
--shadow:0 1px 3px hsl(230 15% 3% / .5); --shadow-md:0 6px 20px hsl(230 15% 3% / .5);
--shadow-lg:0 20px 50px hsl(230 15% 2% / .66);
--shadow-3d:0 18px 38px hsl(230 15% 2% / .62), 0 5px 12px hsl(230 15% 2% / .5), 0 1px 2px hsl(230 15% 2% / .4);
--glow:0 3px 16px hsl(240 79% 61% / .40);
color-scheme:dark;
}}
:root[data-theme="dark"]{
--bg:hsl(220 4% 9%); --bg-2:hsl(225 5% 11%); --surface:hsl(240 4% 13%); --surface-2:hsl(240 4% 16%); --surface-3:hsl(240 4% 20%);
--ink:hsl(230 10% 95%); --ink-2:hsl(230 7% 78%); --mut:hsl(230 6% 63%); --faint:hsl(230 6% 47%);
--bd:hsl(230 8% 26%); --line:hsl(230 8% 20%); --track:hsl(230 7% 22%);
--violet:#8888F1; --violet-2:#ADADF5; --violet-press:#CDCDF9; --lav-2:#5b53b8;
--violetT:hsl(240 79% 74% / .18); --violetT2:hsl(240 79% 74% / .10);
--mint-ink:#bbf7d8; --mintT:hsl(153 99% 47% / .18);
--danger:#f87171; --dangerT:hsl(0 80% 68% / .16);
--dock:hsla(230 5% 17% / .72); --dock-bd:hsl(230 5% 26% / .6);
--shadow:0 1px 3px hsl(230 15% 3% / .5); --shadow-md:0 6px 20px hsl(230 15% 3% / .5);
--shadow-lg:0 20px 50px hsl(230 15% 2% / .66);
--shadow-3d:0 18px 38px hsl(230 15% 2% / .62), 0 5px 12px hsl(230 15% 2% / .5), 0 1px 2px hsl(230 15% 2% / .4);
--glow:0 3px 16px hsl(240 79% 61% / .40);
color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{margin:0;font-family:var(--display);font-weight:700;letter-spacing:-.025em;line-height:1.05;text-wrap:balance}
p{margin:0}
a{color:var(--violet-2)}
:focus-visible{outline:2px solid var(--violet);outline-offset:3px;border-radius:6px}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
@media (min-width:720px){.wrap{padding-left:max(30px,env(safe-area-inset-left,0px));padding-right:max(30px,env(safe-area-inset-right,0px))}}
.eyebrow{font:700 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--violet-2);display:flex;align-items:center;gap:8px}
.eyebrow::before{content:"";width:16px;height:2px;border-radius:2px;background:var(--lav)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 22px;border-radius:var(--r-btn);font:600 15px/1 var(--sans);border:1px solid transparent;cursor:pointer;text-decoration:none;
transition:transform var(--t-micro) var(--ease-std),box-shadow var(--t-fast),background var(--t-fast),color var(--t-fast)}
.btn:active{transform:translateY(1px) scale(.99)}
.btn .arr{transition:transform var(--t-base) var(--ease-out)}
.btn:hover .arr{transform:translateX(4px)}
.btn.primary{background:var(--violet);color:#fff;box-shadow:var(--glow)}
.btn.primary:hover{background:var(--violet-2)}
:root[data-theme="dark"] .btn.primary{color:#14143a}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn.primary{color:#14143a}}
.btn.mint{background:var(--mint);color:#053d29;font-weight:700;box-shadow:0 6px 22px hsl(153 99% 40% / .35)}
.btn.mint:hover{filter:brightness(1.04);transform:translateY(-2px)}
.btn.ghost-on-block{background:hsl(0 0% 100% / .08);color:var(--on-block);border-color:hsl(0 0% 100% / .22)}
.btn.ghost-on-block:hover{background:hsl(0 0% 100% / .16)}
.hero{position:relative;overflow:hidden;color:var(--on-block);
background:radial-gradient(90% 120% at 85% 10%, var(--block-2), transparent 60%),linear-gradient(160deg,var(--block) 0%,var(--block-deep) 100%);
padding-top:22px;padding-bottom:0;isolation:isolate}
.aurora{position:absolute;inset:-20%;z-index:-1;pointer-events:none}
.aurora span{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;animation:aurora 18s var(--ease-std) infinite alternate}
.aurora span:nth-child(1){width:46vw;height:46vw;left:48%;top:4%;background:#6f74f5}
.aurora span:nth-child(2){width:30vw;height:30vw;left:6%;top:56%;background:hsl(153 99% 47% / .30);animation-duration:24s}
.aurora span:nth-child(3){width:26vw;height:26vw;left:70%;top:58%;background:#8E93F2;animation-duration:21s;opacity:.4}
@keyframes aurora{to{transform:translate(-6vw,4vw) scale(1.15)}}
.hero-spiral{position:absolute;right:-120px;top:-60px;width:620px;height:620px;z-index:-1;opacity:.10;color:#fff;animation:spin 80s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{display:inline-flex;color:inherit}
.logo svg{height:34px;width:auto;display:block}
.logo .sp{fill:var(--sp,#8E93F2)}
.hero .logo{--sp:#fff}
.topbar .when{font:700 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on-block-2);display:flex;align-items:center;gap:8px}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 0 hsl(153 99% 47% / .6);animation:ping 1.8s var(--ease-out) infinite}
@keyframes ping{to{box-shadow:0 0 0 10px hsl(153 99% 47% / 0)}}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:24px;align-items:end;margin-top:34px}
.hero-copy{padding-bottom:56px;min-width:0}
.tag{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--r-pill);background:hsl(0 0% 100% / .14);border:1px solid hsl(0 0% 100% / .22);font:700 11.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.hero h1{font-size:clamp(38px,6.2vw,68px);margin-top:20px;letter-spacing:-.035em;line-height:1}
.hero h1 .hl{color:var(--mint)}
.hero .lede{font-size:clamp(16px,1.5vw,18px);color:var(--on-block-2);max-width:46ch;margin-top:18px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.countdown{display:flex;align-items:center;gap:14px;margin-top:30px;flex-wrap:wrap}
.countdown .lbl{font:700 10.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--on-block-2);max-width:12ch}
.cd{display:flex;gap:8px}
.cd div{min-width:58px;padding:9px 6px 7px;border-radius:12px;background:hsl(0 0% 100% / .10);border:1px solid hsl(0 0% 100% / .18);text-align:center}
.cd b{display:block;font:700 24px/1 var(--display);font-variant-numeric:tabular-nums;overflow:hidden;height:24px}
.cd b span{display:block}
.cd b span.tick{animation:tick .45s var(--ease-out)}
@keyframes tick{from{transform:translateY(-60%);opacity:.2}to{transform:none;opacity:1}}
.cd small{font:400 9.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--on-block-2)}
.hero-photo{position:relative;align-self:end;min-width:0}
.crop{position:relative;overflow:hidden;width:100%;max-width:100%}
.crop img{position:absolute;max-width:none;display:block;user-select:none}
.hero-photo .crop{aspect-ratio:520/325;-webkit-mask-image:linear-gradient(180deg,#000 82%,transparent);mask-image:linear-gradient(180deg,#000 82%,transparent)}
.hero-photo .crop img{width:100%;left:0;top:0}
.name{position:absolute;display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:var(--r-pill);background:hsl(240 79% 72% / .92);color:#fff;font:600 14px/1 var(--sans);box-shadow:0 8px 24px hsl(240 70% 20% / .35);white-space:nowrap}
.name small{font:400 10px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;opacity:.85}
.name.n1{left:12%;bottom:12%}
.name.n2{right:2%;bottom:20%}
.choose{background:var(--bg-2);padding-block:72px 64px;position:relative}
.sec-head{text-align:left;max-width:720px}
.sec-head h2{font-size:clamp(28px,3.6vw,42px);margin-top:12px}
.sec-head h2 em{font-style:normal;color:var(--violet)}
.sec-head p{color:var(--mut);margin-top:10px;max-width:60ch}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:18px;margin-top:34px}
.mc{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 40%;background:var(--surface);box-shadow:var(--shadow-3d);border-radius:var(--r-card);overflow:hidden;
transition:transform var(--t-base) var(--ease-out),box-shadow var(--t-base) var(--ease-out),opacity var(--t-base)}
.mc::after{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid var(--violet);opacity:0;pointer-events:none;transition:opacity var(--t-fast)}
.mc:hover{transform:translateY(-4px);box-shadow:var(--shadow-3d),0 24px 50px hsl(240 60% 40% / .14)}
.mc.sel::after{opacity:1}
.cards.has-sel .mc:not(.sel){opacity:.72}
.mc-body{padding:24px 22px 22px;display:flex;flex-direction:column;gap:12px;min-width:0}
.date{display:flex;align-items:center;gap:11px}
.date .tile{width:40px;height:40px;border-radius:var(--r-tile);background:var(--violetT);color:var(--violet);display:grid;place-items:center;flex:none}
.date b{display:block;font:700 18px/1.1 var(--display)}
.date span{font-size:13px;color:var(--mut)}
.mc h3{font-size:clamp(21px,2.2vw,25px);line-height:1.12;margin-top:4px}
.mc h3 em{font-style:normal;color:var(--violet)}
.mc .who{font:700 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.mc .who b{color:var(--ink)}
.mc p.desc{font-size:14px;color:var(--mut)}
.mc .btn{margin-top:auto;align-self:flex-start}
.mc .btn .ok{display:none}
.mc.sel .btn{background:var(--mint);color:#053d29;box-shadow:none}
.mc.sel .btn .ok{display:inline}
.mc.sel .btn .go{display:none}
.mc-photo{position:relative;background:radial-gradient(80% 60% at 70% 20%,#6a5ff0,transparent),linear-gradient(170deg,#4d42e3,#3328bf);overflow:hidden}
.mc-photo .crop{position:absolute;bottom:0;left:50%;height:100%;width:auto;max-width:none;translate:-50% 0;
-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.mc-photo .crop img{transition:transform 1.2s var(--ease-out)}
.mc:hover .mc-photo .crop img{transform:scale(1.04)}
.c-lucas .crop{aspect-ratio:170/314}
.c-lucas .crop img{width:305.88%;left:-29.41%;top:-2.55%}
.c-pedro .crop{aspect-ratio:160/292}
.c-pedro .crop img{width:325%;left:-175%;top:-10.27%}
.mc .num{position:absolute;top:14px;right:14px;z-index:2;font:700 11px/1 var(--mono);letter-spacing:.12em;color:#fff;background:hsl(0 0% 100% / .16);padding:7px 9px;border-radius:var(--r-pill)}
@media (max-width:560px){
.mc{grid-template-columns:1fr}
.mc-photo{order:-1;height:260px}
}
.perks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:0;margin-top:22px;background:var(--surface);box-shadow:var(--shadow-3d);border-radius:var(--r-card)}
.perk{display:flex;gap:14px;align-items:center;padding:18px 22px;min-width:0}
.perk + .perk{border-left:1px solid var(--line)}
@media (max-width:760px){.perk + .perk{border-left:none;border-top:1px solid var(--line)}}
.perk .tile{width:44px;height:44px;border-radius:var(--r-tile);background:var(--violetT);color:var(--violet);display:grid;place-items:center;flex:none}
.perk .tile path,.perk .tile rect,.perk .tile circle{stroke-dasharray:80;stroke-dashoffset:0}
.mo .perk.rv:not(.in) .tile :is(path,rect,circle){stroke-dashoffset:80}
.perk.in .tile :is(path,rect,circle){transition:stroke-dashoffset 1.1s var(--ease-out) .15s}
.perk b{display:block;font-size:14.5px;line-height:1.3}
.perk span{font-size:13px;color:var(--mut)}
.signup{padding-block:76px 80px}
.duo{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:28px;align-items:start;margin-top:30px}
@media (max-width:860px){.duo{grid-template-columns:1fr}.summary{position:relative;top:auto}}
.summary{position:sticky;top:24px;background:linear-gradient(160deg,var(--block),var(--block-deep));color:var(--on-block);border-radius:var(--r-card);padding:26px;overflow:hidden;isolation:isolate;min-width:0}
.summary .bgsp{position:absolute;right:-70px;bottom:-80px;width:260px;height:260px;opacity:.12;color:#fff;z-index:-1}
.summary .k{font:700 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--on-block-2)}
.sum-swap{display:grid;margin-top:14px}
.sum-swap > div{grid-area:1/1;transition:opacity var(--t-base) var(--ease-std),transform var(--t-enter) var(--ease-out)}
.sum-swap > div[aria-hidden="true"]{opacity:0;transform:translateY(10px);pointer-events:none}
.summary h3{font-size:24px;line-height:1.12}
.summary .meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chip{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:var(--r-pill);background:hsl(0 0% 100% / .12);font-size:13px;font-weight:500}
.summary p{color:var(--on-block-2);font-size:14px;margin-top:14px}
.summary .empty{color:var(--on-block-2)}
.summary ul{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:9px;border-top:1px solid hsl(0 0% 100% / .16);padding-top:18px}
.summary li{display:flex;gap:10px;font-size:13.5px;color:var(--on-block-2)}
.summary li svg{flex:none;color:var(--mint);margin-top:3px}
.formcard{background:var(--surface);box-shadow:var(--shadow-3d);border-radius:var(--r-card);padding:26px;min-width:0;position:relative}
.formcard h3{font-size:22px}
.formcard .hint{font-size:13.5px;color:var(--mut);margin-top:6px}
.rule{display:flex;gap:10px;align-items:flex-start;margin-top:16px;padding:12px 14px;border-radius:12px;background:var(--violetT2);font-size:13px;color:var(--ink-2)}
.rule svg{flex:none;color:var(--violet);margin-top:2px}
form{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.f{display:flex;flex-direction:column;gap:6px;min-width:0}
.f.full{grid-column:1/-1}
@media (max-width:520px){form{grid-template-columns:1fr}}
label{font-size:12px;font-weight:600;color:var(--ink-2)}
.field{height:46px;border:1px solid var(--bd);border-radius:10px;background:var(--surface);padding:0 13px;font:15px var(--sans);color:var(--ink);width:100%;transition:border-color var(--t-micro),box-shadow var(--t-fast)}
.field::placeholder{color:var(--faint)}
.field:focus{outline:none;border-color:var(--violet);box-shadow:0 0 0 4px var(--violetT)}
select.field{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238a90a3' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center}
.f.err .field{border-color:var(--danger);box-shadow:0 0 0 4px var(--dangerT);animation:shake .38s var(--ease-std)}
.f .msg{font-size:12px;color:var(--danger);min-height:0;display:none}
.f.err .msg{display:block}
@keyframes shake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
.consent{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:var(--mut);font-weight:400}
.consent input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--violet);flex:none}
.consent.err{color:var(--danger)}
.submit{grid-column:1/-1;width:100%;padding:16px 22px;font-size:16px;position:relative}
.submit .spin{display:none;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
.submit.busy .spin{display:inline-block}
.submit.busy .arr{display:none}
.done{display:none;text-align:left}
.formcard.ok form,.formcard.ok .rule,.formcard.ok .head{display:none}
.formcard.ok .done{display:block;animation:fadeup var(--t-enter) var(--ease-out) both}
.check{width:64px;height:64px;border-radius:50%;background:var(--mintT);display:grid;place-items:center;position:relative}
.check::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--mint);animation:ring 1s var(--ease-out) .2s both}
@keyframes ring{from{transform:scale(.6);opacity:1}to{transform:scale(1.6);opacity:0}}
.check path{stroke-dasharray:30;stroke-dashoffset:30;animation:draw .6s var(--ease-out) .25s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.done h3{margin-top:18px;font-size:26px}
.done p{color:var(--mut);margin-top:8px}
.done dl{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:20px 0 0;padding:16px;border-radius:12px;background:var(--surface-2);font-size:14px}
.done dt{font:700 10.5px/1.9 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.done dd{margin:0;font-weight:600}
.done .row{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.btn.soft{background:var(--violetT);color:var(--violet-2)}
.demo-note{font:400 11px/1.4 var(--mono);color:var(--faint);margin-top:16px}
footer{border-top:1px solid var(--line);padding-block:34px 120px;background:var(--bg-2)}
.foot{display:flex;flex-wrap:wrap;gap:20px 40px;justify-content:space-between;align-items:flex-start}
.foot .logo svg{height:28px}
.foot .logo{color:var(--ink)}
.foot p{font-size:13px;color:var(--mut);max-width:52ch;margin-top:10px}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:13.5px}
.foot nav a{color:var(--ink-2);text-decoration:none}
.foot nav a:hover{color:var(--violet)}
.foot .copy{width:100%;font:400 11px/1 var(--mono);color:var(--faint);letter-spacing:.04em}
.dock-wrap{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:0 max(12px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));pointer-events:none;
transform:translateY(calc(100% + 20px));transition:transform .45s var(--ease-out)}
.dock-wrap.show{transform:none}
.dock{pointer-events:auto;max-width:1160px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:9px 10px 9px 14px;border-radius:20px;
background:var(--dock);backdrop-filter:blur(14px) saturate(1.7);-webkit-backdrop-filter:blur(14px) saturate(1.7);border:1px solid var(--dock-bd);box-shadow:var(--shadow-lg);position:relative;overflow:hidden}
.dock .prog{position:absolute;left:0;top:0;height:2px;width:100%;background:var(--violet);transform-origin:left;transform:scaleX(var(--p,0))}
.dock .logo{color:var(--ink)}
.dock .logo svg{height:26px}
.dock .div{width:1px;height:28px;background:var(--dock-bd);flex:none}
.dock .info{flex:1;min-width:0;display:flex;align-items:center;gap:10px;font-size:13px;color:var(--mut);white-space:nowrap;overflow:hidden}
.dock .info b{color:var(--ink);font-weight:600}
.dock .info .mono{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--violet-2)}
.dock .btn{padding:11px 16px;font-size:14px;flex:none}
.themebtn{width:38px;height:38px;border-radius:11px;border:1px solid var(--dock-bd);background:var(--surface);color:var(--mut);display:grid;place-items:center;cursor:pointer;flex:none;transition:color var(--t-micro),border-color var(--t-micro)}
.themebtn:hover{color:var(--violet-2);border-color:var(--lav)}
@media (max-width:640px){.dock .div,.dock .info .long,.dock .logo{display:none}.dock .btn{flex:1}}
.toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;z-index:60;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:12px;font-size:13px;font-weight:500;pointer-events:none;transition:opacity var(--t-fast),transform var(--t-base) var(--ease-out);max-width:calc(100% - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}
@keyframes fadeup{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.mo .rv{opacity:0;transform:translateY(18px);transition:opacity var(--t-enter) var(--ease-out),transform var(--t-hero) var(--ease-out);transition-delay:calc(var(--i,0) * 90ms)}
.mo .rv.in{opacity:1;transform:none}
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.w > span{display:inline-block}
.mo .split:not(.in) .w > span{transform:translateY(105%)}
.mo .split .w > span{transition:transform var(--t-hero) var(--ease-out);transition-delay:calc(var(--wi) * var(--stagger))}
.mo .hero .seq{animation:fadeup var(--t-enter) var(--ease-out) both;animation-delay:var(--d,0s)}
.mo .hero-photo .crop{animation:photo 1.3s var(--ease-out) .25s both}
@keyframes photo{from{clip-path:inset(100% 0 0 0);transform:scale(1.06)}to{clip-path:inset(0 0 0 0);transform:none}}
.mo .name{animation:pop .7s var(--ease-out) both,float 7s ease-in-out 1.6s infinite}
.mo .name.n1{animation-delay:1s,1.7s}
.mo .name.n2{animation-delay:1.15s,2.4s}
@keyframes pop{0%{opacity:0;transform:scale(.6)}70%{transform:scale(1.06)}100%{opacity:1;transform:none}}
@keyframes float{50%{translate:0 -6px}}
.btn.pulse{animation:pulse 2.4s var(--ease-out) 2.2s infinite}
@keyframes pulse{0%{box-shadow:0 6px 22px hsl(153 99% 40% / .35),0 0 0 0 hsl(153 99% 47% / .55)}70%,100%{box-shadow:0 6px 22px hsl(153 99% 40% / .35),0 0 0 16px hsl(153 99% 47% / 0)}}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation:none!important;transition:none!important}
html{scroll-behavior:auto}
}
@media (max-width:860px){
.hero-grid{grid-template-columns:1fr;margin-top:26px}
.hero-copy{padding-bottom:8px}
.hero-spiral{width:420px;height:420px;right:-160px}
}
