:root{
  --g:#00EC97; --g-ink:#04140e;
  --bg:#fff; --fg:#0a0a0a; --muted:#6f6f6b; --soft:#f5f5f3; --card:#f7f7f5; --line:#e7e7e3;
  --glow:rgba(0,236,151,.18); --shadow:0 30px 80px -30px rgba(0,0,0,.25);
  --maxw:1160px; --r:26px;
  --font:"Inter","SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;
}
[data-theme=dark]{
  --bg:#000; --fg:#f6f6f3; --muted:#8d8d89; --soft:#0b0b0b; --card:#0f0f0f; --line:#1f1f1e;
  --glow:rgba(0,236,151,.22); --shadow:0 30px 90px -30px rgba(0,236,151,.18);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden;transition:background .35s,color .35s}
a{color:inherit}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
section{padding:110px 0;position:relative}
.eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:inline-flex;align-items:center;gap:10px;font-weight:500}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--g);border-radius:2px}
h1,h2,h3{letter-spacing:-.035em;line-height:1.02;font-weight:650}
h2{font-size:clamp(34px,5vw,60px);margin:16px 0 18px;max-width:16ch}
h2 em,h1 em{font-style:normal;color:var(--muted)}
.lead{font-size:clamp(17px,1.6vw,20px);color:var(--muted);max-width:56ch}
.mono{font-family:var(--mono)}
.g{color:var(--g)}
:focus-visible{outline:2px solid var(--g);outline-offset:3px;border-radius:8px}

/* nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.scrolled{background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px);border-color:var(--line)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:68px}
.brand{display:flex;align-items:center;gap:10px;font-weight:650;letter-spacing:-.03em;font-size:20px;text-decoration:none}
.mark{width:26px;height:26px;border-radius:50%;border:5px solid var(--g);position:relative}
.mark::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:2px solid color-mix(in srgb,var(--fg) 22%,transparent)}
.links{display:flex;gap:26px;margin-left:auto;font-size:14.5px;color:var(--muted)}
.links a{text-decoration:none;transition:color .2s}.links a:hover{color:var(--fg)}
.theme{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;transition:transform .3s,border-color .2s}
.theme:hover{border-color:var(--g);transform:rotate(18deg)}
.theme svg{width:18px;height:18px}
.theme .sun{display:none}[data-theme=dark] .theme .sun{display:block}[data-theme=dark] .theme .moon{display:none}
@media(max-width:860px){.links{display:none}.nav .wrap{gap:12px}.nav .btn.sm{margin-left:auto}}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:0 26px;height:56px;border-radius:40px;font-weight:600;font-size:16px;text-decoration:none;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .3s,background .2s;white-space:nowrap;position:relative}
.btn:active{transform:scale(.97)}
.btn.primary{background:var(--g);color:var(--g-ink);box-shadow:0 0 0 0 var(--glow)}
.btn.primary:hover{transform:translateY(-2px);box-shadow:0 14px 40px -8px rgba(0,236,151,.55)}
.btn.ghost{border:1px solid var(--line)}.btn.ghost:hover{border-color:var(--fg)}
.btn.dark{background:var(--fg);color:var(--bg)}
.btn.sm{height:42px;padding:0 18px;font-size:14px}
.btn svg{width:20px;height:20px}

/* hero */
.hero{padding:150px 0 90px;overflow:hidden;max-width:100vw}
html,body{max-width:100%}
body{overflow-x:clip}
.hero .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.pill{display:inline-flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:30px;padding:7px 14px 7px 8px;font-size:13px;color:var(--muted);background:var(--card)}
.pill b{background:var(--g);color:var(--g-ink);border-radius:20px;padding:2px 10px;font-size:11px;letter-spacing:.06em}
h1{font-size:clamp(46px,6.5vw,92px);margin:24px 0 24px;letter-spacing:-.05em;line-height:.92}
.hero .lead{margin-bottom:34px}
.cta{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.dlmeta{margin-top:26px;display:flex;flex-wrap:wrap;gap:8px 22px;font-size:13px;color:var(--muted)}
.dlmeta span{display:inline-flex;gap:7px;align-items:center}
.dlmeta i{width:6px;height:6px;border-radius:50%;background:var(--g);display:inline-block}
.hero-visual{position:relative;display:grid;place-items:center;min-height:620px}
.ringbox{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.ring{position:absolute;width:300px;height:300px;border-radius:50%;border:2px solid var(--g);opacity:0;animation:ring 3.6s cubic-bezier(.2,.6,.3,1) infinite}
.ring:nth-child(2){animation-delay:1.2s}.ring:nth-child(3){animation-delay:2.4s}
@keyframes ring{0%{transform:scale(.35);opacity:.7}100%{transform:scale(2.1);opacity:0}}
.float{position:absolute;background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:12px 16px;box-shadow:var(--shadow);font-size:13px;display:flex;gap:10px;align-items:center;animation:bob 6s ease-in-out infinite}
.float b{display:block;font-size:15px;letter-spacing:-.02em}
.float small{color:var(--muted);font-size:12px}
.float .dot{width:34px;height:34px;border-radius:50%;background:var(--g);display:grid;place-items:center;color:var(--g-ink)}
.float .dot svg{width:18px;height:18px}
.f1{left:-4%;top:22%}.f2{right:-2%;bottom:20%;animation-delay:-3s}
@keyframes bob{50%{transform:translateY(-12px)}}
@media(max-width:960px){.hero .grid{grid-template-columns:1fr}.hero-visual{min-height:560px}.f1{left:0}.f2{right:0}}

/* phone */
.phone{--pw:270px;width:var(--pw);aspect-ratio:9/19;border-radius:42px;background:#101010;padding:9px;position:relative;box-shadow:0 0 0 1.5px #2a2a2a inset,0 40px 80px -30px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.4);flex:none}
[data-theme=dark] .phone{box-shadow:0 0 0 1.5px #333 inset,0 40px 90px -30px rgba(0,236,151,.25)}
.phone::before{content:"";position:absolute;top:16px;left:50%;width:70px;height:20px;border-radius:12px;background:#000;transform:translateX(-50%);z-index:5}
.screen{width:100%;height:100%;border-radius:34px;overflow:hidden;position:relative;font-size:12px;display:flex;flex-direction:column;padding:42px 16px 16px;--sb:#fff;--sf:#0a0a0a;--sm:#8a8a86;--sc:#f4f4f2;--sl:#e6e6e3;background:var(--sb);color:var(--sf)}
.screen.dk{--sb:#000;--sf:#f7f7f5;--sm:#8c8c8c;--sc:#111;--sl:#222}
.s-top{display:flex;align-items:center;gap:6px;margin-bottom:14px}
.s-mark{width:14px;height:14px;border-radius:50%;border:3px solid var(--g)}
.s-chip{background:var(--sc);border-radius:20px;padding:4px 9px;font-size:10.5px;display:flex;gap:5px;align-items:center}
.s-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--g)}
.s-lab{font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--sm)}
.s-bal{font-size:38px;font-weight:600;letter-spacing:-.06em;line-height:1.05;margin:2px 0 0}
.s-bal small{font-size:12px;color:var(--sm);letter-spacing:0;font-weight:400;margin-left:4px}
.s-orb{width:104px;height:104px;border-radius:50%;background:var(--sf);color:var(--sb);margin:16px auto 8px;display:grid;place-items:center;text-align:center;font-size:10.5px;font-weight:600;position:relative;box-shadow:0 0 0 14px color-mix(in srgb,var(--g) 14%,transparent)}
.s-orb svg{width:24px;height:24px;margin:0 auto 3px;color:var(--g)}
.s-row3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}
.s-q{background:var(--sc);border-radius:12px;padding:9px 8px 8px;font-size:10px;font-weight:500}
.s-q i{display:block;width:12px;height:12px;border:2px solid var(--sf);border-radius:50%;margin-bottom:10px}
.s-tx{display:flex;gap:8px;align-items:center;padding:7px 0;font-size:10px}
.s-tx .av{width:24px;height:24px;border-radius:50%;background:var(--sc);flex:none;display:grid;place-items:center;font-size:10px}
.s-tx .av.in{background:color-mix(in srgb,var(--g) 22%,transparent)}
.s-tx div{flex:1;min-width:0}.s-tx small{display:block;color:var(--sm);font-size:8.5px}
.s-tx b{font-weight:600}
.s-btn{height:34px;border-radius:20px;background:var(--sf);color:var(--sb);display:grid;place-items:center;font-weight:600;font-size:11px}
.s-btn.gr{background:var(--g);color:var(--g-ink)}
.s-btn.ol{background:transparent;border:1px solid var(--sl);color:var(--sf)}
.s-big{font-size:34px;font-weight:600;letter-spacing:-.06em;text-align:center;line-height:1}
.s-big small{font-size:12px;color:var(--sm);letter-spacing:0;font-weight:400}
.s-av{width:44px;height:44px;border-radius:50%;background:var(--g);color:var(--g-ink);font-weight:700;font-size:18px;display:grid;place-items:center;margin:6px auto}
.s-center{text-align:center}.s-mut{color:var(--sm)}
.s-spacer{flex:1}
.s-check{width:70px;height:70px;margin:0 auto}
.s-check circle{fill:color-mix(in srgb,var(--g) 15%,transparent);stroke:var(--g);stroke-width:3;stroke-dasharray:190;stroke-dashoffset:190}
.s-check path{fill:none;stroke:var(--g);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:50;stroke-dashoffset:50}
.s-check.go circle{animation:dash .5s .05s forwards}.s-check.go path{animation:dash .35s .5s forwards}
@keyframes dash{to{stroke-dashoffset:0}}
.s-rings{position:relative;width:150px;height:150px;margin:12px auto;display:grid;place-items:center}
.s-rings i{position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--g);opacity:0;animation:ring2 2.4s linear infinite}
.s-rings i:nth-child(2){animation-delay:.8s}.s-rings i:nth-child(3){animation-delay:1.6s}
.s-rings svg{width:30px;height:30px;color:var(--sf)}
@keyframes ring2{0%{transform:scale(.3);opacity:.7}100%{transform:scale(1);opacity:0}}
.s-qr{width:130px;height:130px;margin:10px auto;background:#fff;border-radius:14px;padding:8px;display:grid;grid-template-columns:repeat(25,1fr);gap:0}
.s-qr i{background:#0a0a0a;aspect-ratio:1}.s-qr i.o{background:transparent}
.s-acc{background:var(--sc);border-radius:14px;padding:10px;display:flex;gap:8px;align-items:center;margin-bottom:7px}
.s-acc .d{width:8px;height:8px;border-radius:50%;background:var(--sl)}.s-acc .d.on{background:var(--g)}
.s-acc div{flex:1;font-size:11px;font-weight:500}.s-acc small{display:block;font-size:8.5px;color:var(--sm);font-weight:400}
.s-tag{border:1.5px dashed var(--sl);border-radius:16px;padding:16px;margin:10px 0;text-align:center}
.s-tag .st{width:70px;height:44px;border-radius:10px;background:var(--sc);margin:0 auto 8px;position:relative;border:1px solid var(--sl)}
.s-tag .st::after{content:"";position:absolute;inset:10px 18px;border:2px solid var(--g);border-radius:50%}
.s-seg{display:flex;gap:5px;margin-bottom:10px}.s-seg span{border:1px solid var(--sl);border-radius:20px;padding:4px 9px;font-size:9.5px}.s-seg span.on{background:var(--sf);color:var(--sb);border-color:var(--sf)}
.s-in{border:1px solid var(--sl);border-radius:12px;padding:8px 10px;margin-bottom:7px;font-size:10.5px}.s-in small{display:block;color:var(--sm);font-size:8.5px}
.hero .phone{--pw:290px;transform:rotate(-4deg);animation:tilt 8s ease-in-out infinite}
@keyframes tilt{50%{transform:rotate(2deg) translateY(-10px)}}

/* stats */
.stats{padding:0 0 40px}
.stats .row{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--card)}
.stat{padding:34px 28px;border-right:1px solid var(--line)}.stat:last-child{border:0}
.stat b{display:block;font-size:clamp(34px,4.4vw,56px);letter-spacing:-.05em;font-weight:600;line-height:1}
.stat b sup{font-size:.4em;color:var(--g);letter-spacing:0;margin-left:3px;vertical-align:baseline;position:relative;top:-.9em}
.stat span{display:block;margin-top:10px;color:var(--muted);font-size:13.5px}
@media(max-width:800px){.stats .row{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}}

/* tap demo */
.demo{background:var(--soft);border-block:1px solid var(--line);overflow:hidden}
.demo-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:30px}
.controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.amt{border:1px solid var(--line);background:var(--bg);border-radius:30px;padding:10px 18px;font-weight:600;font-size:14.5px;transition:all .2s}
.amt:hover{border-color:var(--fg)}.amt.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.replay{display:inline-flex;gap:8px;align-items:center;height:42px;padding:0 18px;border-radius:30px;background:var(--g);color:var(--g-ink);font-weight:600;font-size:14px}
.replay svg{width:16px;height:16px;transition:transform .5s}.replay:hover svg{transform:rotate(-360deg)}
.stage-outer{position:relative;width:100%;overflow:hidden;contain:paint}
.stage{position:absolute;left:50%;top:0;width:700px;height:520px;transform-origin:top center;margin-left:-350px}
.stage .phone{--pw:230px;position:absolute;top:30px;transition:transform 1.1s cubic-bezier(.65,0,.25,1)}
#pRecv{left:calc(50% + 20px);transform:rotate(3deg)}
#pSend{left:calc(50% - 250px);transform:translateX(-90px) rotate(-3deg)}
.stage[data-s=approach] #pSend,.stage[data-s=tap] #pSend,.stage[data-s=auth] #pSend,.stage[data-s=send] #pSend,.stage[data-s=done] #pSend{transform:translateX(26px) rotate(0)}
.stage[data-s=approach] #pRecv,.stage[data-s=tap] #pRecv,.stage[data-s=auth] #pRecv,.stage[data-s=send] #pRecv,.stage[data-s=done] #pRecv{transform:rotate(0)}
.stage[data-s=leave] #pSend{transform:translateX(-90px) rotate(-3deg)}
.who{position:absolute;top:-24px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.burst{position:absolute;left:50%;top:230px;width:0;height:0;pointer-events:none;z-index:15}
.burst i{position:absolute;left:-90px;top:-90px;width:180px;height:180px;border-radius:50%;border:2px solid var(--g);opacity:0}
.stage[data-s=tap] .burst i,.stage[data-s=auth] .burst i{animation:burst 1.4s ease-out infinite}
.burst i:nth-child(2){animation-delay:.35s!important}.burst i:nth-child(3){animation-delay:.7s!important}
@keyframes burst{0%{transform:scale(.2);opacity:.9}100%{transform:scale(2.2);opacity:0}}
.coin{position:absolute;top:260px;left:calc(50% - 150px);z-index:20;background:var(--g);color:var(--g-ink);font-weight:700;border-radius:30px;padding:8px 14px;font-size:14px;opacity:0;transform:scale(.6);box-shadow:0 10px 30px -6px rgba(0,236,151,.7);transition:none}
.stage[data-s=send] .coin{animation:fly 1.1s cubic-bezier(.5,0,.2,1) forwards}
@keyframes fly{0%{opacity:0;left:calc(50% - 130px);top:300px;transform:scale(.6)}15%{opacity:1;transform:scale(1)}50%{top:190px}100%{opacity:1;left:calc(50% + 70px);top:300px;transform:scale(.9)}}
.stage[data-s=done] .coin{opacity:0}
.sim-note{text-align:center;color:var(--muted);font-size:12.5px;margin-top:10px}
/* swap screens in sim */
.st{display:none;flex:1;flex-direction:column}
.stage[data-s=idle] .st.i,.stage[data-s=leave] .st.i,.stage[data-s=approach] .st.i{display:flex}
.stage[data-s=tap] .st.t,.stage[data-s=auth] .st.t{display:flex}
.stage[data-s=send] .st.sd{display:flex}
.stage[data-s=done] .st.d{display:flex}
.stage[data-s=auth] .st.t .fp{opacity:1}
.fp{width:46px;height:46px;border-radius:50%;border:2px solid var(--g);margin:0 auto 8px;display:grid;place-items:center;opacity:.35;transition:opacity .3s}
.fp svg{width:24px;height:24px;color:var(--g)}
.stage[data-s=auth] .fp{animation:fpulse .8s ease-in-out infinite}
@keyframes fpulse{50%{box-shadow:0 0 0 10px color-mix(in srgb,var(--g) 20%,transparent)}}
.spin{width:44px;height:44px;border-radius:50%;border:3px solid var(--sl);border-top-color:var(--g);animation:rot .8s linear infinite;margin:20px auto}
@keyframes rot{to{transform:rotate(360deg)}}
.stage[data-s=tap] .buzz{animation:buzz .35s}
@keyframes buzz{20%{translate:-2px 0}40%{translate:2px 0}60%{translate:-2px 0}80%{translate:2px 0}}
.timeline{display:flex;gap:6px;justify-content:center;margin-top:30px;flex-wrap:wrap}
.timeline span{font-size:12px;border:1px solid var(--line);border-radius:20px;padding:5px 12px;color:var(--muted);transition:all .3s;background:var(--bg)}
.timeline span.on{background:var(--g);color:var(--g-ink);border-color:var(--g);font-weight:600}

/* passkey */
.pk{background:var(--fg);color:var(--bg);border-radius:40px;margin:0 16px;overflow:hidden}
.pk .wrap{padding-top:10px}
.pk-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.pk .eyebrow,.pk .lead{color:color-mix(in srgb,var(--bg) 62%,transparent)}
.pk h2 em{color:color-mix(in srgb,var(--bg) 55%,transparent)}
.badge{display:inline-block;background:var(--g);color:var(--g-ink);font-size:11px;font-weight:700;letter-spacing:.1em;border-radius:20px;padding:4px 11px;margin-bottom:14px}
.pk ul{list-style:none;margin-top:26px;display:grid;gap:12px}
.pk li{display:block;position:relative;padding-left:32px;font-size:15.5px}
.pk li::before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:var(--g) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-6.5' fill='none' stroke='%2304140e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");}
.flow{border:1px solid color-mix(in srgb,var(--bg) 16%,transparent);border-radius:28px;padding:28px;display:grid;gap:0;position:relative}
.fstep{display:flex;gap:16px;align-items:flex-start;padding:16px 0;position:relative}
.fstep:not(:last-child)::after{content:"";position:absolute;left:19px;top:58px;bottom:-10px;width:2px;background:linear-gradient(var(--g),transparent);opacity:.5}
.fstep .n{flex:none;width:40px;height:40px;border-radius:50%;border:2px solid var(--g);display:grid;place-items:center;font-weight:700;color:var(--g);font-size:14px}
.fstep b{display:block;font-size:16px;letter-spacing:-.01em}.fstep small{color:color-mix(in srgb,var(--bg) 58%,transparent);font-size:13.5px;display:block;margin-top:3px}
.fstep code{font-family:var(--mono);font-size:11.5px;color:var(--g)}
@media(max-width:900px){.pk-grid{grid-template-columns:1fr}.pk{border-radius:28px}}

/* features */
.fgrid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;margin-top:50px}
.fc{grid-column:span 4;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:28px;position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .3s}
.fc:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--g) 55%,var(--line))}
.fc.w{grid-column:span 8}.fc.h{grid-column:span 6}
.fc .ic{width:44px;height:44px;border-radius:14px;background:var(--bg);border:1px solid var(--line);display:grid;place-items:center;margin-bottom:22px;color:var(--fg)}
.fc .ic svg{width:22px;height:22px}
.fc:hover .ic{background:var(--g);color:var(--g-ink);border-color:var(--g)}
.fc h3{font-size:21px;margin-bottom:8px;letter-spacing:-.025em;line-height:1.15}
.fc p{color:var(--muted);font-size:15px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}.tags span{font-size:11.5px;border:1px solid var(--line);border-radius:20px;padding:3px 10px;color:var(--muted);background:var(--bg)}
@media(max-width:960px){.fc,.fc.w,.fc.h{grid-column:span 6}}
@media(max-width:620px){.fc,.fc.w,.fc.h{grid-column:span 12}}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:50px;counter-reset:s}
.step{border-top:2px solid var(--fg);padding-top:22px;counter-increment:s}
.step::before{content:"0" counter(s);font-family:var(--mono);color:var(--g);font-size:14px;display:block;margin-bottom:34px}
.step h3{font-size:26px;margin-bottom:10px}.step p{color:var(--muted)}
.step .mini{margin-top:26px;height:120px;border-radius:20px;background:var(--card);border:1px solid var(--line);display:grid;place-items:center;overflow:hidden;position:relative}
.step .mini .s-rings{width:100px;height:100px;margin:0}
.mini .tx{font-family:var(--mono);font-size:12px;color:var(--muted);text-align:center;line-height:1.7}
.mini .tx b{color:var(--g);font-weight:500}
@media(max-width:860px){.steps{grid-template-columns:1fr}}

/* gallery */
.gallery{overflow:hidden;max-width:100vw}
.gal-scroll{display:flex;gap:26px;overflow-x:auto;padding:50px max(24px,calc((100vw - var(--maxw))/2 + 24px)) 40px;scroll-snap-type:x mandatory;scrollbar-width:none;margin-top:10px}
.gal-scroll::-webkit-scrollbar{display:none}
.gal-item{scroll-snap-align:center;flex:none}
.gal-item .phone{--pw:244px}
.gal-item figcaption{text-align:center;margin-top:18px;font-size:13.5px;color:var(--muted)}
.gal-item figcaption b{display:block;color:var(--fg);font-size:15px}
.note-s{font-size:12.5px;color:var(--muted);margin-top:4px}

/* security */
.sec-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:60px;align-items:start;margin-top:10px}
.sec-list{display:grid;gap:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--card)}
.sec-item{padding:22px 26px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:34px 1fr;gap:16px}
.sec-item:last-child{border:0}
.sec-item svg{width:24px;height:24px;color:var(--g);margin-top:2px}
.sec-item b{display:block;font-size:16.5px;letter-spacing:-.015em}.sec-item span{color:var(--muted);font-size:14.5px}
@media(max-width:900px){.sec-grid{grid-template-columns:1fr;gap:30px}}
.diagram{margin-top:34px;border:1px solid var(--line);border-radius:var(--r);padding:22px;background:var(--card);font-family:var(--mono);font-size:12px;color:var(--muted);line-height:1.8;overflow-x:auto;white-space:pre}
.diagram b{color:var(--g);font-weight:500}

/* contract */
.code{background:#050505;color:#d8d8d4;border-radius:22px;padding:24px;font-family:var(--mono);font-size:12.5px;line-height:1.75;overflow-x:auto;border:1px solid #1d1d1d;white-space:pre}
.code .k{color:#00EC97}.code .c{color:#6b6b66}.code .s{color:#f2d58a}
.two{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.checks{list-style:none;display:grid;gap:11px;margin-top:24px}
.checks li{display:block;position:relative;padding-left:32px;color:var(--fg);font-size:15.5px}
.checks li::before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:var(--g) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-6.5' fill='none' stroke='%2304140e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
@media(max-width:900px){.two{grid-template-columns:1fr;gap:34px}}

/* compat */
.compat{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px}
.cm{border:1px solid var(--line);border-radius:var(--r);padding:26px;background:var(--card)}
.cm h3{font-size:19px;margin-bottom:10px;display:flex;gap:10px;align-items:center}
.cm .ok,.cm .no{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700}
.cm .ok{background:var(--g);color:var(--g-ink)}.cm .no{background:var(--fg);color:var(--bg)}
.cm p{color:var(--muted);font-size:14.5px}
@media(max-width:860px){.compat{grid-template-columns:1fr}}

/* download */
.dl{padding-top:60px}
.dl-card{border:1px solid var(--line);border-radius:40px;padding:56px;background:radial-gradient(900px 400px at 85% -10%,var(--glow),transparent 60%),var(--card);display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.dl-card h2{max-width:12ch}
.spec{display:grid;gap:0;border:1px solid var(--line);border-radius:20px;background:var(--bg);overflow:hidden;font-size:14px}
.spec div{display:flex;justify-content:space-between;gap:20px;padding:13px 18px;border-bottom:1px solid var(--line)}
.spec div:last-child{border:0}.spec span{color:var(--muted)}.spec b{font-weight:550;text-align:right}
.hash{font-family:var(--mono);font-size:11.5px;word-break:break-all;text-align:right;max-width:100%;font-weight:400!important}
.copy{font-size:12px;border:1px solid var(--line);border-radius:20px;padding:3px 10px;margin-left:8px;color:var(--muted);transition:all .2s}.copy:hover{border-color:var(--g);color:var(--fg)}
.install{margin-top:30px;display:grid;gap:12px;counter-reset:i}
.install li{list-style:none;display:flex;gap:14px;font-size:15px;counter-increment:i;align-items:flex-start}
.install li::before{content:counter(i);flex:none;width:26px;height:26px;border-radius:50%;background:var(--fg);color:var(--bg);display:grid;place-items:center;font-size:12px;font-weight:700;margin-top:1px}
.reqs{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.reqs span{font-size:12.5px;border:1px solid var(--line);border-radius:20px;padding:5px 12px;background:var(--bg)}
@media(max-width:940px){.dl-card{grid-template-columns:1fr;padding:30px 24px;border-radius:30px;gap:30px}}
.honest{margin-top:20px;border:1px dashed color-mix(in srgb,var(--g) 60%,var(--line));border-radius:22px;padding:20px 24px;display:flex;gap:16px;background:color-mix(in srgb,var(--g) 5%,transparent);font-size:14.5px}
.honest svg{flex:none;width:24px;height:24px;color:var(--g)}.honest b{display:block;margin-bottom:2px}

/* faq */
.faq{max-width:820px;margin-top:40px}
details{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;padding:22px 0;font-size:18px;font-weight:550;letter-spacing:-.02em;display:flex;justify-content:space-between;gap:20px;align-items:center}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:26px;font-weight:300;color:var(--g);transition:transform .3s;flex:none}
details[open] summary::after{transform:rotate(45deg)}
details p{color:var(--muted);padding:0 40px 24px 0;font-size:15.5px;max-width:68ch}
details p code{font-family:var(--mono);font-size:13px;background:var(--card);padding:1px 6px;border-radius:6px}

footer{border-top:1px solid var(--line);padding:60px 0 50px;margin-top:60px}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px}
.foot p{color:var(--muted);font-size:14px;max-width:34ch;margin-top:14px}
.foot h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;font-weight:500}
.foot a{display:block;text-decoration:none;color:var(--fg);font-size:14.5px;padding:4px 0;opacity:.85}.foot a:hover{color:var(--g)}
.legal{margin-top:46px;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
@media(max-width:800px){.foot{grid-template-columns:1fr 1fr}}

/* reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}
.sec-grid>*,.two>*,.pk-grid>*,.hero .grid>*,.dl-card>*,.foot>*{min-width:0}
@media(max-width:560px){.diagram,.code{font-size:10.5px}.dl-card{padding:26px 18px}.hero-visual{min-height:520px}.hero .phone{--pw:250px}.f1{left:-2%;top:12%}.f2{right:-2%;bottom:10%}.btn{padding:0 22px}}

.fc code,.pk code,.checks code,details code{font-family:var(--mono);font-size:.88em}
.fc p code,.checks code{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:0 5px}
.screen.shot{padding:0;background:#000}.screen.shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
/* gallery: Android frame, full uncropped real screenshots */
.gal-item .phone{aspect-ratio:auto;border-radius:36px;padding:8px}
.gal-item .phone::before{top:18px;width:11px;height:11px;border-radius:50%;background:#050505;box-shadow:0 0 0 1.5px #1c1c1c}
.gal-item .screen.shot{height:auto;aspect-ratio:1233/2673;border-radius:28px;padding:0;background:#000}
.gal-item .screen.shot img{width:100%;height:100%;object-fit:contain;object-position:center;image-rendering:auto}