@font-face{font-family:"Nunito";src:url("fonts/Nunito-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito";src:url("fonts/Nunito-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito";src:url("fonts/Nunito-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito";src:url("fonts/Nunito-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
/* Values from the Blit design system: tokens/colors.css and tokens/effects.css */
:root{--bg:#1A1619;--s1:#211C20;--s2:#262024;--s3:#322B30;--s4:#3C333A;--bf:#2F282D;--b1:#3C333A;--bs:#50434D;--t1:#F6F0EA;--t2:#DDD3CA;--t3:#B5A99F;--t4:#A89D94;--t5:#958A83;--v7:#7C3AED;--ve:#5B14D6;--v4:#B9A2FB;--v3:#D6CBFE;--green:#5FCB9F;--amber:#F4B455;--grad:linear-gradient(135deg,#6D28D9,#A855F7);--ease:cubic-bezier(.22,1,.36,1);--f:"Nunito",ui-rounded,system-ui,sans-serif;--ps:1}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--t2);font:400 17px/1.55 var(--f);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
main{overflow-x:clip}
h1,h2,h3,p{margin:0}
h1,h2,h3{color:var(--t1);font-weight:700;text-wrap:balance}
p{text-wrap:pretty}
a{color:var(--v4);text-decoration:none;transition:color .15s}
a:hover{color:var(--v3)}
::selection{background:rgba(185,162,251,.32);color:var(--t1)}
:focus-visible{outline:2px solid var(--v4);outline-offset:3px;border-radius:6px}
button,input{font:inherit}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 24px}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--t1)}
.brand:hover{color:var(--t1)}
.tile{display:inline-grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:var(--grad)}
.tile svg{width:62%;height:62%;overflow:visible}
.zt{transform:translateX(-1.1px)}
.zb{transform:translateX(1.1px)}
.nav .zt,.cta-in.in .zt{animation:zt 1s .5s var(--ease) backwards}
.nav .zb,.cta-in.in .zb{animation:zb 1s .5s var(--ease) backwards}
@keyframes zt{from{transform:none}}
@keyframes zb{from{transform:none}}
.word{font-weight:700;font-size:25px;letter-spacing:-.03em;line-height:1}
.nav{position:sticky;top:0;z-index:30;background:var(--bg);border-bottom:1px solid transparent;transition:border-color .25s}
.nav.scrolled{border-color:var(--bf)}
.nav-in{height:68px;display:flex;align-items:center;gap:32px}
.links{display:flex;gap:28px;margin-left:auto}
.links a{color:var(--t3);font-size:15px;font-weight:600}
.links a:hover{color:var(--t1)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 22px;border:0;border-radius:14px;background:var(--v7);color:#fff;font-weight:700;font-size:16px;line-height:1;white-space:nowrap;box-shadow:inset 0 -3px 0 var(--ve);cursor:pointer;transition:transform .15s var(--ease),filter .15s}
.btn:hover{color:#fff;filter:brightness(1.08)}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.55;cursor:default;filter:none;transform:none}
.btn.sm{height:40px;padding:0 16px;font-size:15px;border-radius:12px}
.btn.full{width:100%}
.av{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:color-mix(in srgb,var(--c) 22%,#1A1619);color:var(--c);font-weight:700;font-size:11px;line-height:1}
.stk{display:flex}
.stk .av{margin-left:-6px;box-shadow:0 0 0 2px var(--bg)}
.stk .av:first-child{margin-left:0}

/* Story: hero and the four steps, with the pinned phone */
.story{display:grid;grid-template-columns:minmax(0,1fr) 380px;column-gap:56px}
.hero-copy,.step{grid-column:1;display:flex;flex-direction:column;justify-content:center}
.hero-copy{grid-row:1;min-height:calc(100vh - 68px);padding:40px 0 72px;gap:26px;max-width:600px}
.step:nth-of-type(1){grid-row:2}
.step:nth-of-type(2){grid-row:3}
.step:nth-of-type(3){grid-row:4}
.step:nth-of-type(4){grid-row:5}
.step{min-height:86vh;max-width:500px;scroll-margin-top:68px}
.sc-in{display:flex;flex-direction:column;gap:16px}
h1{font-size:clamp(46px,6.2vw,82px);line-height:1;letter-spacing:-.03em}
.lede{font-size:clamp(18px,1.6vw,21px);color:var(--t3);max-width:520px}
.proof{display:flex;align-items:center;gap:12px;color:var(--t4);font-size:15px}
.proof .av{width:32px;height:32px;margin-left:-8px;box-shadow:0 0 0 3px var(--bg)}
.proof .av:first-child{margin-left:0}
.kick{display:flex;align-items:center;gap:10px;color:var(--v4);font-size:15px;font-weight:700}
.kick span{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(185,162,251,.14);font-size:14px;font-variant-numeric:tabular-nums}
.step h2{font-size:clamp(30px,3.2vw,42px);line-height:1.08;letter-spacing:-.02em}
.step p{font-size:18px;color:var(--t3);max-width:460px}
.facts{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.facts li{display:flex;align-items:center;gap:10px;color:var(--t2);font-size:16px}
.facts svg{width:18px;height:18px;flex:none;color:var(--green)}
.phone-col{grid-column:2;grid-row:1/6;align-self:start;position:sticky;top:68px;height:calc(100vh - 68px);display:flex;align-items:center;justify-content:center;pointer-events:none}
.lift{flex:none}
.js .lift{animation:lift .9s .15s var(--ease) both}
@keyframes lift{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
.stage{position:relative;width:340px;height:700px;transform:scale(var(--ps))}
@media (min-width:860px){.step .sc-in{opacity:.32;transition:opacity .45s var(--ease)}.step.act .sc-in{opacity:1}}
@media (max-width:859px){
.links{display:none}
.nav-in .btn{margin-left:auto}
.story{grid-template-columns:minmax(0,1fr)}
.hero-copy{min-height:0;padding:48px 0 40px}
.story{--ph:calc(var(--ps) * 700px + 24px)}
.phone-col{grid-column:1;grid-row:2/6;height:var(--ph);z-index:2;background:var(--bg)}
/* Text shows only in the strip below the pinned phone, so each step is that
   strip's height and the next text follows the last with no empty stretch.
   The first step also holds the space the phone pins over. */
.step{min-height:calc(100vh - 68px - var(--ph));min-height:calc(100svh - 68px - var(--ph));justify-content:center;padding:20px 0;position:relative;z-index:1}
.step:nth-of-type(1){padding-top:calc(var(--ph) + 20px)}
.step h2{font-size:28px}
.step p{font-size:16px}
.paper{display:none}
}

/* Paper receipt behind the phone, hero only */
.paper{position:absolute;z-index:0;top:-28px;left:180px;width:240px;padding:20px 18px 24px;border-radius:6px;background:#F3ECE4;color:#2A2326;font:500 11.5px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;box-shadow:0 30px 60px rgba(0,0,0,.45);transform:rotate(8deg);transition:opacity .5s var(--ease),transform .7s var(--ease)}
.paper p{display:flex;justify-content:space-between;gap:10px}
.paper .h{justify-content:center;font-weight:700;font-size:13px;letter-spacing:.08em}
.paper .s{justify-content:center;opacity:.7}
.paper hr{border:0;border-top:1.5px dashed rgba(42,35,38,.4);margin:10px 0}
.paper .t{font-weight:700;font-size:12.5px}
.phone-col:not([data-state="hero"]) .paper{opacity:0;transform:rotate(14deg) translate(30px,20px)}

/* Phone */
.phone{position:relative;z-index:1;width:340px;height:700px;padding:10px;border-radius:52px;background:#0E0B0D;box-shadow:0 0 0 1px #2F282D,inset 0 0 0 1px rgba(246,240,234,.04),0 40px 90px rgba(0,0,0,.5)}
.screen{position:relative;height:100%;overflow:hidden;border-radius:42px;background:var(--bg);color:var(--t2);font-size:13px;line-height:1.4}
.clock{position:absolute;z-index:6;top:15px;left:30px;color:var(--t1);font-size:13px;font-weight:700}
.notch{position:absolute;z-index:6;top:11px;left:50%;width:94px;height:27px;margin-left:-47px;border-radius:20px;background:#0E0B0D}
.scr{position:absolute;inset:0;padding:52px 14px 14px;display:flex;flex-direction:column;gap:10px;opacity:0;transform:translateX(16px);transition:opacity .35s var(--ease),transform .5s var(--ease)}
.scr.on{opacity:1;transform:none}
.tb{display:flex;align-items:center;gap:10px}
.ib{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:var(--s2);box-shadow:inset 0 0 0 1px var(--bf);color:var(--t1)}
.ib svg{width:16px;height:16px}
.tt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.tt b{color:var(--t1);font-size:16px;font-weight:700;line-height:1.2}
.tt small{color:var(--t4);font-size:12px}
.tb .stk .av{width:22px;height:22px;font-size:9px}
.cd{background:var(--s2);border:1px solid var(--bf);border-radius:16px}
.lbl{display:flex;justify-content:space-between;align-items:center;margin-top:4px;color:var(--t1);font-size:13px;font-weight:700}
.lbl>span{color:var(--t4);font-weight:600;font-variant-numeric:tabular-nums}
.rw{display:flex;align-items:center;gap:10px;padding:10px 12px}
.rw+.rw{border-top:1px solid var(--b1)}
.rw .tt b{font-size:14px}
.rw .tt small{font-size:11.5px}
.rw.j{opacity:0;transform:translateY(8px);transition:opacity .35s var(--ease),transform .45s var(--ease)}
.rw.j.in{opacity:1;transform:none}
.bd{flex:none;padding:3px 8px;border-radius:99px;background:rgba(246,240,234,.08);color:var(--t3);font-size:10.5px;font-weight:700;transition:background .25s,color .25s}
.bd.am{background:rgba(244,180,85,.16);color:var(--amber)}
.bd.gr{background:rgba(95,203,159,.16);color:var(--green)}

/* Phone: claim */
.pgr{display:flex;justify-content:space-between;color:var(--t4);font-size:12px}
.pgr b{color:var(--t1);font-weight:700}
.bar{height:5px;margin-top:-4px;border-radius:9px;background:var(--s3);overflow:hidden}
.bar i{display:block;width:0;height:100%;border-radius:9px;background:var(--v7);transition:width .4s var(--ease)}
.list{overflow:hidden}
.row{position:relative;display:flex;align-items:center;gap:10px;padding:5px 10px}
.row+.row{border-top:1px solid var(--b1)}
.wash{position:absolute;inset:0;background:rgba(124,58,237,.16);opacity:0;transition:opacity .12s}
.disc{position:relative;display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--s3);color:var(--t2)}
.disc svg{width:15px;height:15px;stroke-width:1.75}
.ck{position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;background:var(--v7);color:#fff;opacity:0;transition:opacity .12s}
.disc .ck svg{width:14px;height:14px;stroke-width:2.5}
.row.sel .wash,.row.sel .ck{opacity:1;transition-duration:.06s}
.nm{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.nm b{color:var(--t1);font-size:12.5px;font-weight:600;line-height:18px;white-space:nowrap}
.nm em{font-style:normal;font-weight:500;color:var(--t4)}
.owl{height:0;transition:height .3s var(--ease)}
.row.own .owl{height:16px}
.ow{display:inline-block;padding:1px 7px;border-radius:99px;background:color-mix(in srgb,var(--c) 22%,transparent);color:var(--c);font-size:10px;font-weight:700;line-height:14px;transform-origin:0 50%;opacity:0;transform:scale(.6);transition:opacity .25s var(--ease),transform .35s var(--ease)}
.row.own .ow{opacity:1;transform:none}
.row .pr{position:relative;color:var(--t1);font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.sheet{margin:auto -14px -14px;padding:12px 14px 18px;border-radius:22px 22px 0 0;background:var(--bg);box-shadow:0 -12px 28px rgba(0,0,0,.3),inset 0 1px 0 var(--bf)}
.sh-l{position:relative;height:18px;margin-bottom:10px;color:var(--t1);font-size:13px;font-weight:700}
.sh-l span{position:absolute;inset:0;display:flex;align-items:center;gap:6px;transition:opacity .3s,transform .35s var(--ease)}
.sh-l .b{opacity:0;transform:translateY(6px);color:var(--green)}
.sh-l .b svg{width:15px;height:15px}
.sh-l.done .a{opacity:0;transform:translateY(-6px)}
.sh-l.done .b{opacity:1;transform:none}
.chips{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.chip{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 2px;border-radius:12px;background:var(--s2);box-shadow:inset 0 0 0 1px var(--bf);transition:background .3s,box-shadow .3s}
.chip b{color:var(--t1);font-size:11.5px;font-weight:600;line-height:1.2}
.chip .pv{color:var(--t4);font-size:11.5px;line-height:1.2;font-variant-numeric:tabular-nums;transition:color .3s}
.chip.hit{background:color-mix(in srgb,var(--c) 16%,var(--s2));box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--c) 70%,transparent)}
.chip.hit .pv{color:var(--c)}

/* Phone: scan */
.vf{position:relative;flex:1;display:grid;place-items:center;overflow:hidden;border-radius:18px;background:#0F0C0E}
.br{position:absolute;width:26px;height:26px;border:2.5px solid var(--v4)}
.br.a{top:14px;left:14px;border-right:0;border-bottom:0;border-radius:9px 0 0 0}
.br.b{top:14px;right:14px;border-left:0;border-bottom:0;border-radius:0 9px 0 0}
.br.c{bottom:14px;left:14px;border-right:0;border-top:0;border-radius:0 0 0 9px}
.br.d{bottom:14px;right:14px;border-left:0;border-top:0;border-radius:0 0 9px 0}
.mr{width:200px;padding:14px 12px 16px;border-radius:4px;background:#F3ECE4;color:#2A2326;font:500 9.5px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;transform:rotate(-1.5deg);box-shadow:0 12px 30px rgba(0,0,0,.45)}
.mr .h{text-align:center;font-weight:700;font-size:10.5px;letter-spacing:.06em}
.mr hr{border:0;border-top:1px dashed rgba(42,35,38,.45);margin:6px 0}
.ml{display:flex;justify-content:space-between;gap:8px;margin:0 -4px;padding:0 4px;border-radius:3px;transition:background .25s}
.ml.hit{background:rgba(124,58,237,.2)}
.ml.t{font-weight:700}
.sl{position:absolute;left:7%;right:7%;top:9%;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--v4) 20%,var(--v4) 80%,transparent);opacity:0}
.ok{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,#5FCB9F 13%,var(--s2));border:1px solid color-mix(in srgb,#5FCB9F 28%,transparent);opacity:0;transform:translateY(12px);transition:opacity .35s var(--ease),transform .45s var(--ease)}
.ok.in{opacity:1;transform:none}
.okc{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:rgba(95,203,159,.2);color:var(--green)}
.okc svg{width:16px;height:16px;stroke-width:2.5}
.ok b{display:block;color:var(--t1);font-size:13.5px;font-weight:700}
.ok small{color:var(--t3);font-size:11.5px}

/* Phone: share */
.code{padding:14px}
.code small{color:var(--t4);font-size:12px}
.cv{display:block;margin:2px 0 12px;color:var(--t1);font-size:28px;font-weight:700;letter-spacing:.05em;font-variant-numeric:tabular-nums}
.bb{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pb{display:flex;align-items:center;justify-content:center;gap:6px;height:38px;border-radius:12px;font-size:13px;font-weight:700}
.pb svg{width:15px;height:15px}
.pb.p{background:var(--v7);color:#fff;box-shadow:inset 0 -3px 0 var(--ve)}
.pb.s{background:var(--s3);color:var(--t1)}

/* Phone: share, the room leading with its invite while friends join */
.inv{margin-top:10px;color:var(--t4);font-size:11.5px;line-height:1.35}
[data-screen="share"] .list{flex:1 1 auto;min-height:0}
.stk .av.j{opacity:0;transform:scale(.6);transition:opacity .3s var(--ease),transform .4s var(--ease)}
.stk .av.j.in{opacity:1;transform:none}
.chips.join{display:flex}
.chips.join .chip{flex:1 1 0;min-width:0;transition:flex-grow .45s var(--ease),opacity .3s var(--ease),margin .45s var(--ease),padding .45s var(--ease)}
.chips.join .chip+.chip{margin-left:6px}
.chips.join .chip.j{flex-grow:0;opacity:0;margin-left:0;padding-left:0;padding-right:0}
.chips.join .chip.j.in{flex-grow:1;opacity:1;margin-left:6px;padding-left:2px;padding-right:2px}

/* Phone: settle */
.tot{padding:14px}
.tot small{color:var(--t4);font-size:12px}
.big{display:block;margin:2px 0 10px;color:var(--t1);font-size:32px;font-weight:700;line-height:1.1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.tri{display:flex;gap:18px;padding-top:10px;border-top:1px solid var(--b1)}
.tri span{display:flex;flex-direction:column;color:var(--t4);font-size:11px}
.tri b{color:var(--t2);font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.pay{padding:14px}
.pay-h{display:flex;justify-content:space-between;color:var(--t4);font-size:12px}
.pay-h b{color:var(--t1);font-weight:700;font-variant-numeric:tabular-nums}
.pay-amt{margin:4px 0 10px;color:var(--t4);font-size:13px;font-variant-numeric:tabular-nums}
.pay-amt b{color:var(--t1);font-size:22px;font-weight:700;letter-spacing:-.01em}
.pay-bar{transition:width .45s var(--ease)}
.pay-done{display:flex;align-items:center;gap:6px;height:0;margin-top:0;overflow:hidden;opacity:0;color:var(--green);font-size:12.5px;font-weight:700;transition:opacity .3s var(--ease),height .35s var(--ease),margin .35s var(--ease)}
.pay-done svg{width:14px;height:14px;stroke-width:2.5}
.pay-done.in{height:18px;margin-top:10px;opacity:1}
.you{display:flex;align-items:center;gap:10px;padding:10px 12px}
.amt{color:var(--t1);font-size:14px;font-weight:700;font-variant-numeric:tabular-nums}

/* Sections */
.sec{padding:120px 0;scroll-margin-top:68px}
.vid{position:relative;aspect-ratio:16/9;margin-top:40px;overflow:hidden;border-radius:24px;border:1px solid var(--bf);background:var(--s2);box-shadow:0 24px 60px rgba(0,0,0,.28)}
.vid video{display:block;width:100%;height:100%;object-fit:cover}
.snd{position:absolute;right:14px;bottom:14px;display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:var(--s2);box-shadow:inset 0 0 0 1px var(--b1);color:var(--t2);cursor:pointer;transition:color .15s,transform .15s var(--ease)}
.snd:hover{color:var(--t1)}
.snd:active{transform:scale(.94)}
.snd svg{width:18px;height:18px}
.snd[aria-pressed="false"] .lucide-volume-2,.snd[aria-pressed="true"] .lucide-volume-x{display:none}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.two.rev .copy{order:2}
.copy{display:flex;flex-direction:column;gap:18px;max-width:500px}
.copy h2,.sec-h{font-size:clamp(34px,4vw,52px);line-height:1.05;letter-spacing:-.025em}
.copy p{font-size:18px;color:var(--t3)}
.copy .fine{font-size:16px;color:var(--t4)}
.demo{padding:22px;border-radius:24px;background:var(--s2);border:1px solid var(--bf);box-shadow:0 24px 60px rgba(0,0,0,.28)}
.dh{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px}
.dh b{color:var(--t1);font-size:17px}
.dh span{color:var(--t4);font-size:14px;font-variant-numeric:tabular-nums}
.seg{display:flex;gap:4px;padding:4px;border-radius:14px;background:var(--s3)}
.seg button{flex:1;min-width:0;height:40px;padding:0 8px;border:0;border-radius:10px;background:none;color:var(--t3);font-size:14px;font-weight:700;white-space:nowrap;cursor:pointer;transition:background .2s,color .2s}
.seg button:hover{color:var(--t1)}
.seg button.on{background:var(--t1);color:var(--bg)}
.seg button:disabled{cursor:default}
.snote{min-height:24px;margin:14px 0 4px;color:var(--t3);font-size:15px}
.srow{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;align-items:center;padding:12px 0}
.srow+.srow{border-top:1px solid var(--b1)}
.srow .av{width:40px;height:40px;font-size:13px}
.sm{display:flex;flex-direction:column;gap:6px;min-width:0}
.sn{display:flex;justify-content:space-between;gap:10px}
.sn b{color:var(--t1);font-weight:700}
.sv{color:var(--t1);font-weight:700;font-variant-numeric:tabular-nums}
.sbar{display:flex;gap:2px;height:8px;border-radius:9px;background:var(--s3);overflow:hidden}
.sbar i{display:block;height:100%;transition:width .55s var(--ease)}
.bi{background:var(--c);border-radius:9px 0 0 9px}
.bx{background:color-mix(in srgb,var(--c) 45%,var(--s3))}
.sm small{color:var(--t4);font-size:13.5px;font-variant-numeric:tabular-nums}
.sfoot{display:flex;align-items:center;gap:8px;margin-top:6px;padding-top:14px;border-top:1px solid var(--b1);color:var(--t2);font-size:15px;font-weight:600}
.sfoot svg{width:17px;height:17px;flex:none;color:var(--green)}
.wwrap{position:relative;width:min(300px,100%);aspect-ratio:1;margin:24px auto 18px}
.wheel{position:absolute;inset:0;border-radius:50%;container-type:inline-size;background:conic-gradient(#B9A2FB 0 90deg,#62D3E3 0 180deg,#F4B455 0 270deg,#5FCB9F 0 360deg);box-shadow:0 18px 40px rgba(0,0,0,.35);transition:transform 3.8s cubic-bezier(.12,.7,.1,1)}
.wheel::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 5px rgba(26,22,25,.28)}
.wlabel{position:absolute;left:50%;top:50%;color:#1A1619;font-size:15px;font-weight:700;white-space:nowrap;transform:translate(-50%,-50%) rotate(var(--a)) translateY(-31cqw) rotate(var(--flip,0deg))}
.hub{position:absolute;left:50%;top:50%;width:22%;aspect-ratio:1;border-radius:50%;background:var(--s2);box-shadow:0 0 0 5px var(--bg);transform:translate(-50%,-50%)}
.ptr{position:absolute;z-index:2;top:-10px;left:50%;width:26px;height:24px;margin-left:-13px;background:var(--t1);clip-path:polygon(0 0,100% 0,50% 100%)}
.res{min-height:30px;text-align:center;color:var(--t1);font-size:20px;font-weight:700}
.res-sub{min-height:24px;margin:2px 0 18px;text-align:center;color:var(--t4);font-size:15px}
.gh{margin:80px 0 18px;font-size:20px}
.games{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin:0;padding:0;list-style:none}
.g{display:flex;align-items:flex-start;gap:14px;padding:16px;border-radius:18px;background:var(--s2);border:1px solid var(--bf)}
.gi{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--s3);color:var(--t2)}
.gi svg{width:19px;height:19px;stroke-width:1.75}
.g b{display:block;color:var(--t1);font-size:16px;font-weight:700;line-height:1.3}
.g p{margin-top:2px;color:var(--t4);font-size:14.5px;line-height:1.45}
.faq-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:64px;align-items:start}
.qa{border-top:1px solid var(--b1)}
.qa:last-child{border-bottom:1px solid var(--b1)}
.q{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;padding:22px 0;border:0;background:none;color:var(--t1);font-size:19px;font-weight:700;text-align:left;cursor:pointer}
.q svg{width:20px;height:20px;flex:none;color:var(--t4);transition:transform .3s var(--ease)}
.qa.open .q svg{transform:rotate(180deg)}
.qa .a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s var(--ease)}
.qa.open .a{grid-template-rows:1fr}
.qa .a>div{overflow:hidden}
.qa .a p{padding:0 40px 22px 0;color:var(--t3);font-size:17px}
.cta-in{display:flex;flex-direction:column;align-items:center;gap:20px;max-width:640px;margin:0 auto;text-align:center}
.cta-in .tile{width:64px;height:64px;border-radius:18px}
.cta-in>p{max-width:480px;color:var(--t3);font-size:18px}
.wl-box{display:flex;flex-direction:column;gap:8px;width:100%;max-width:480px}
.cta-in .wl-box{align-items:center}
.wl{display:flex;gap:8px;width:100%}
.wl input{flex:1;min-width:0;height:52px;padding:0 16px;border-radius:14px;border:1px solid var(--b1);background:var(--s2);color:var(--t1);font-size:16px;outline:none;transition:border-color .15s}
.wl input::placeholder{color:var(--t5)}
.wl input:focus{border-color:var(--v4)}
.wl.err input{border-color:#F2828C}
.wl-msg{color:#F2828C;font-size:14px}
.wl-ok{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:12px 16px;border-radius:14px;background:color-mix(in srgb,#5FCB9F 12%,var(--s2));color:var(--t1);font-weight:600;text-align:left}
.wl-ok svg{width:18px;height:18px;flex:none;color:var(--green)}
.wl-ok:focus{outline:none}
.wl-note{color:var(--t5);font-size:14px}
.foot{border-top:1px solid var(--bf)}
/* Three columns of equal outer width, so the tagline sits at the page's centre */
.foot-in{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px 24px;padding-top:28px;padding-bottom:40px}
.foot-in>.brand{justify-self:start}
.foot .tag{color:var(--t4);font-size:15px;text-align:center}
.foot small{color:var(--t5);font-size:14px}
.foot-meta{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px 20px}
@media (max-width:719px){.foot-in{grid-template-columns:minmax(0,1fr);justify-items:center}.foot-in>.brand{justify-self:center}.foot-meta{justify-content:center}}
.foot-meta a{color:var(--t5);font-size:14px}
.foot-meta a:hover{color:var(--t3)}
@media (max-width:859px){
.sec{padding:80px 0}
.vid{margin-top:28px}
.two,.faq-in{grid-template-columns:minmax(0,1fr);gap:32px}
.two.rev .copy{order:0}
}
@media (max-width:520px){.wl{flex-direction:column}.wl input{flex:none}.wl .btn{width:100%}.seg button{font-size:13px}}

/* Privacy policy */
.nav-in>.brand+.btn{margin-left:auto}
.legal{max-width:768px;padding-top:64px;padding-bottom:112px}
.legal h1{font-size:clamp(40px,5vw,56px);line-height:1.05;letter-spacing:-.025em}
.upd{margin-top:12px;color:var(--t4);font-size:15px}
.intro{margin-top:28px;color:var(--t3);font-size:19px}
.legal h2{margin-top:56px;font-size:26px;line-height:1.2;letter-spacing:-.015em}
.legal h3{margin-top:32px;font-size:19px;line-height:1.3}
.legal p{margin-top:12px}
.legal ul{margin:12px 0 0;padding-left:22px}
.legal li+li{margin-top:10px}
.legal li::marker{color:var(--t5)}
.legal a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.legal strong{color:var(--t1);font-weight:700}
@media (max-width:859px){.legal{padding-top:40px;padding-bottom:80px}.legal h2{margin-top:44px;font-size:23px}.intro{font-size:18px}}

/* Entrances */
.js .hero-copy>*{animation:rise .8s var(--ease) both}
.js .hero-copy>:nth-child(2){animation-delay:.08s}
.js .hero-copy>:nth-child(3){animation-delay:.16s}
.js .hero-copy>:nth-child(4){animation-delay:.24s}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.games .rv:nth-child(2){transition-delay:.05s}
.games .rv:nth-child(3){transition-delay:.1s}
.games .rv:nth-child(4){transition-delay:.15s}
.games .rv:nth-child(5){transition-delay:.2s}
.games .rv:nth-child(6){transition-delay:.25s}
.games .rv:nth-child(7){transition-delay:.3s}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}
}