/* Swipelis hero demo v2, see demo.js */
.demo-mount{position:relative;aspect-ratio:402/874;overflow:hidden;border-radius:13.68%/6.29%;background:#0f0f24;-webkit-mask-image:-webkit-radial-gradient(#fff,#000);-webkit-tap-highlight-color:transparent}
.demo-fallback,.d-screen,.d-track,.d-slide video,.d-shade,.d-content,.d-sheetw,.d-scrim,.d-end{inset:0}
.demo-fallback,.d-screen,.d-track,.d-slide video,.d-shade,.d-content,.d-sheetw,.d-scrim,.d-end,.d-sr,.d-canvas,.d-slide,.d-opt::after,.d-act::after,.d-vol::after,.d-face,.d-hud,.d-bottom,.d-next,.d-finger,.d-tap::after,.d-sheet{position:absolute}
.demo-fallback{display:block;width:100%;height:100%;object-fit:cover}
.demo-mount:has(.d-screen.is-live) .demo-fallback{visibility:hidden;transition:visibility 0s .3s}
.d-screen{--k:.7;--u:1.43px;--e:cubic-bezier(.2,.9,.3,1);--f:system-ui,-apple-system,sans-serif;opacity:0;transition:opacity .3s;color:#fff;text-align:left;font:500 16px/1.2 var(--f);-webkit-user-select:none;user-select:none;-webkit-font-smoothing:antialiased}
.d-screen.is-live{opacity:1}
.d-screen.is-answered{touch-action:none}
.d-screen [hidden]{display:none!important}
:where(.d-screen) button{font:inherit;color:inherit;margin:0;padding:0;border:0;background:none;cursor:pointer}
:where(.d-screen) p{margin:0}
.d-screen svg{display:block;flex:none;width:var(--s,20px);height:var(--s,20px)}
.d-screen :focus-visible{outline:calc(3*var(--u)) solid #fff;outline-offset:calc(3*var(--u))}
.d-sr{width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.d-canvas{width:402px;height:874px;transform-origin:0 0;transform:scale(var(--k));overflow:hidden;background:#050514}
.d-glass{--g:blur(24px) saturate(1.6);background:#ffffff2b;-webkit-backdrop-filter:var(--g);backdrop-filter:var(--g)}
.d-front,.d-back,.d-marks,.d-retry,.d-title,.d-act,.d-row,.d-brand,.d-right,.d-streak,.d-pill,.d-words li,.d-cta,.d-bottom{display:flex;align-items:center}
.d-letter,.d-ri,.d-prof{display:grid;place-items:center}
.d-retry,.d-act,.d-streak,.d-acc-t,.d-acc-f,.d-pill,.d-again,.d-close{border-radius:99px}
.d-track{transition:transform .5s var(--e),filter .4s}
.d-slide{width:402px;height:874px;overflow:hidden;background:linear-gradient(#0f0f24,#050514)}
.d-slide video{width:100%;height:100%;object-fit:cover;pointer-events:none}
.d-shade{background:#0007}
.d-content{display:flex;flex-direction:column;padding:140px 0 100px}
.d-q{margin:16px 0 20px;padding:0 28px;font:700 30px/36px var(--f);text-align:center}
.d-options{margin-top:auto;display:grid;gap:10px;padding:16px 36px;perspective:700px}
.d-shake{animation:d-shake .45s linear}
@keyframes d-shake{20%,60%{transform:translateX(-9px)}40%,80%{transform:translateX(8px)}}
.d-opt{--row:#fff3;position:relative;display:block;width:100%;height:56px;border-radius:14px;text-align:left;transform-style:preserve-3d;transition:transform .34s ease-in-out}
.d-opt::after,.d-act::after,.d-vol::after{content:"";inset:-5px 0}
.d-opt.flipped{transform:rotateX(180deg)}
.is-correct{--row:#34c759a8}
.is-correct .d-front>*{opacity:.85}
.is-wrong{--row:#ff3b309e}
.d-opt.is-dim{--row:#fff1;cursor:default}
.d-pulse{animation:d-pulse .82s cubic-bezier(.3,1.4,.5,1)}
@keyframes d-pulse{22%,66%{transform:scale(1.14)}36%{transform:scale(1.14) translateX(-5px)}52%{transform:scale(1.14) translateX(4px)}}
.d-face{inset:0;border-radius:14px;background:var(--row);backface-visibility:hidden;transition:background .25s}
.d-front{gap:13px;padding:0 16px}
.d-back{transform:rotateX(180deg);padding:0 16px;font:500 13px/16px var(--f);color:#fffb}
.d-back b,.d-msg b{color:#fff;font-weight:700}
.d-letter{flex:0 0 30px;height:30px;border-radius:50%;background:#fff3;font:700 15px var(--f)}
.d-text{flex:1;font-size:17px;line-height:22px;transition:opacity .25s}
.is-dim .d-text,.is-dim .d-letter{opacity:.3}
.d-marks{gap:13px}
.d-marks svg{--s:15px}
.d-marks .d-qm{--s:16px;color:#fffb}
.d-zone{height:90px;margin:0 20px;display:grid;place-items:center;transition:height .38s var(--e)}
.answered .d-zone{height:175px}
.d-hint{display:grid;justify-items:center;gap:3px;margin-top:-7px;font-size:11px;line-height:13px;color:#fff5}
.d-hint svg{--s:13px;color:#fff7;animation:d-bob 1.1s ease-in-out 4 alternate}
@keyframes d-bob{to{transform:translateY(-5px)}}
.answered .d-hint,.answered .d-retry{display:none}
.d-retry{gap:11px;margin-top:-14px;padding:8px 20px 8px 9px;box-shadow:inset 0 0 0 2px #ff3b30d9,0 0 14px #ff3b3073}
.d-ri{width:32px;height:32px;border-radius:50%;background:#F0373A}
.d-ri svg{--s:19px}
.d-retry b{display:block;font:700 15.5px/19px var(--f)}
.d-retry i{display:block;font:500 12px/16px var(--f);color:#fffc}
.d-fb{display:none;width:100%;gap:10px}
.answered .d-fb{display:grid;animation:d-rise .3s var(--e)}
@keyframes d-rise{from{opacity:0;transform:translateY(28px)}}
.d-panel{padding:12px;border-radius:14px;background:#0a0a14c7}
.d-good{background:#08180dd1;box-shadow:inset 0 0 0 1px #34c75999}
.d-bad{display:flex;gap:10px;box-shadow:inset 0 0 0 1px #ff950073}
.d-bad>svg{color:#FF9500}
.d-title{gap:8px;font:900 22px/26px var(--f);color:#34C759}
.d-title svg{--s:22px}
.d-bad .d-title{font:700 15px/20px var(--f);color:#FF9500}
.d-msg{margin-top:6px;font-size:15px;line-height:20px;color:#fff}
.d-bad .d-msg{margin-top:4px;padding-right:52px;font-size:12px;line-height:16px}
.d-acts{display:flex;gap:10px}
.d-act{position:relative;gap:6px;padding:9px 18px;background:#0a0a1466;box-shadow:inset 0 0 0 1px #fff3;font:600 13px/16px var(--f)}
.d-act::after{inset:min(0px,calc(17px - 22*var(--u))) 0}
.d-act svg{--s:16px}
.d-hud{inset:0 0 auto;padding:56px 20px 0;background:linear-gradient(#050514d9 30px,#05051400 56px) 0 0/100% 56px no-repeat;pointer-events:none;transition:opacity .3s}
.d-row{justify-content:space-between}
.d-brand{gap:9px}
.d-brand img{width:33px;height:33px;border-radius:7.6px}
.d-wm{width:62.5px;height:20px;background:#fffc;-webkit-mask:url(/assets/wordmark.svg) 0 50%/contain no-repeat}
.d-tier{font:600 10px/12px var(--f);color:#33C759}
.d-right{gap:8px}
.d-streak{gap:5px;padding:8px 14px;font-size:15px;line-height:16px}
.d-streak svg{--s:17px;color:#FF9500}
.d-streak b,.d-acc-l b{font-weight:700}
.d-prof{width:36px;height:36px;border-radius:50%;box-shadow:inset 0 0 0 1px #fff2}
.d-prof svg{--s:19px}
.d-acc{margin-top:10px}
.d-acc-t{height:5px;background:#fff2;overflow:hidden}
.d-acc-f{height:100%;transition:width .5s var(--e),background .3s}
.d-acc-l{display:flex;justify-content:space-between;margin-top:4px;font-size:10px;line-height:12px;color:#fff6}
.d-bottom{inset:auto 8px 36px;justify-content:space-evenly;transition:opacity .3s}
.d-pill{position:relative;justify-content:center;height:40px;padding:0 20px;box-shadow:inset 0 0 0 1px #fff2}
.d-vol{width:55px;padding:0}
.d-vol::after{inset:min(0px,calc(20px - 22*var(--u)))}
.d-vol svg,.d-prog svg{width:23px;height:17px}
.d-set{height:54px;gap:8px}
.d-flag{display:grid;justify-items:center;gap:2px;font:600 8px/10px var(--f);color:#fff9}
.d-flag svg{width:18px;height:12px;border-radius:2px}
.d-dot{color:#fff5;font-size:17px}
.d-set b{font-size:13px;font-weight:600}
.d-set>svg{--s:12px;color:#fff8}
.d-prog{width:61px;padding:0}
.is-answered .d-set{visibility:hidden}
.d-next{position:absolute;left:50%;top:50%;width:196px;height:max(56px,calc(46*var(--u)));transform:translate(-50%,-50%);gap:8px;background:#0a0a1480;box-shadow:inset 0 0 0 1.5px #fff8,0 4px 18px #0004;font:700 18px var(--f)}
.d-next svg{--s:15px}
.at-end .d-hud,.at-end .d-bottom{opacity:0;visibility:hidden}
.d-finger{width:58px;height:58px;border-radius:50%;background:#fff8;box-shadow:0 0 0 3px #fff,0 6px 20px #0007;opacity:0;pointer-events:none;transition:transform .9s var(--e),opacity .12s}
.d-finger.on{opacity:1;transition-duration:.9s,.3s}
.d-tap::after{content:"";inset:0;border-radius:50%;box-shadow:0 0 0 3px #fff;animation:d-ring .5s ease-out forwards}
@keyframes d-ring{to{transform:scale(1.9);opacity:0}}
.d-scrim{background:#0007;opacity:0;transition:opacity .3s}
.d-sheet{inset:auto 0 0;padding:40px 28px;border-radius:38px 38px 0 0;background:#F7F6FB;color:#1A1A2E;text-align:center;transform:translateY(100%);transition:transform .38s var(--e)}
.on>.d-scrim{opacity:1}
.on>.d-sheet{transform:none}
.d-sheet :focus-visible{outline-color:#2A241C}
.d-big{font:900 62px/70px var(--f)}
.d-sub{font-size:20px;color:#5F5C72}
.d-smsg{margin:24px 0 20px;font:700 21px/27px var(--f)}
.d-end{display:flex;align-items:center;padding:0 20px;background:#0505144d;opacity:0;transition:opacity .4s}
.d-end.on{opacity:1}
.at-end .d-track{filter:blur(16px) brightness(.6)}
.d-card{width:100%;padding:28px 22px 18px;border-radius:34px;text-align:center;box-shadow:inset 0 0 0 1px #fff4}
.d-card>img{display:block;width:68px;height:68px;margin:0 auto 14px;border-radius:16px}
.d-end-h{font:800 34px/40px var(--f)}
.d-words{list-style:none;margin:18px 0;padding:0;display:grid;gap:8px;text-align:left}
.d-words li{gap:10px;padding:11px 14px;border-radius:14px;background:#fff2;font-size:19px;line-height:23px}
.d-words span{color:#fff}
.d-ok svg{color:#34C759}
.d-no svg{color:#FF9500}
.d-lead{margin:0 0 18px;font-size:19px;line-height:25px;color:#fffe}
.d-qr .d-lead{font:700 22px/28px var(--f);color:#fff}
.d-sheet .d-lead{color:inherit}
.d-lead,.d-smsg{text-wrap:balance}
.d-cta{justify-content:center;min-height:max(64px,calc(48*var(--u)));border-radius:20px;background:#C2410C;box-shadow:0 6px 0 #8F2F08;color:#fff;font:800 24px var(--f);text-decoration:none}
.d-soon{font:700 20px/26px var(--f)}
.d-price{margin-top:14px;font:500 20px/26px var(--f);text-wrap:balance}
.d-price b{font-weight:700}
.d-again,.d-close{min-height:max(48px,calc(44*var(--u)));margin-top:12px;padding:0 28px;font:700 19px var(--f)}
.d-again{color:#fffe}
@media (prefers-reduced-motion:reduce){
.d-screen *{animation:none!important;transition-duration:.01ms!important}
.d-track.fade{animation:d-fade .15s ease-out!important}
}
@keyframes d-fade{from{opacity:.2}}