@font-face{font-family:Pricedown;src:url(/fonts/pricedown.ttf)format("truetype");font-display:block}@font-face{font-family:Barlow Condensed;font-weight:600;src:url(/fonts/barlow-condensed-600.woff2)format("woff2")}@font-face{font-family:Barlow Condensed;font-weight:700;src:url(/fonts/barlow-condensed-700.woff2)format("woff2")}@font-face{font-family:Montserrat;font-weight:500;src:url(/fonts/montserrat-500.woff2)format("woff2")}@font-face{font-family:Montserrat;font-weight:700;src:url(/fonts/montserrat-700.woff2)format("woff2")}:root{--night:#120f1e;--ink:#1a1022;--veil:#ffffff0f;--rule:#ffffff1f;--text:#fff;--muted:#ffffffa3;--pink:#f08fb8;--mint:#5fd6bf;--cream:#ffe8c4;--logo:linear-gradient(180deg, #fff 18%, var(--cream) 52%, var(--pink) 92%);--cond:"Barlow Condensed", "Arial Narrow", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{background:var(--night);color:var(--text);color-scheme:dark}body{-webkit-font-smoothing:antialiased;font:500 16px/1.6 Montserrat,system-ui,sans-serif;overflow-x:hidden}a{color:var(--pink);text-underline-offset:3px}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}:focus-visible{outline:2px solid var(--mint);outline-offset:3px}svg{fill:currentColor;flex:none;width:16px;height:16px}body:not(.versus) .only-versus,body.versus .only-solo{display:none!important}.backdrop{z-index:-1;height:760px;position:absolute;inset:0 0 auto;overflow:hidden}.backdrop:before{content:"";background:url(/img/neon.jpg) 50% 30%/cover;animation:24s ease-out both drift;position:absolute;inset:0}.backdrop:after{content:"";background:linear-gradient(180deg, #120f1e59, #120f1eb3 50%, var(--night));position:absolute;inset:0}@keyframes drift{0%{transform:scale(1.12)}to{transform:scale(1)}}.layout{max-width:760px;margin:0 auto;padding:0 16px}@media (width>=960px){.layout{padding:0 40px}}.intro{padding:120px 0 36px}.eyebrow{font:700 18px/1 var(--cond);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);animation:.8s cubic-bezier(.16,1,.3,1) .1s both rise}h1{margin:0 0 14px;padding:10px 0 8px;overflow:hidden}h1 span{background:var(--logo);color:#0000;filter:drop-shadow(0 6px #1e0a328c);-webkit-background-clip:text;background-clip:text;font:400 clamp(64px,19vw,168px)/.86 Pricedown,sans-serif;animation:1.1s cubic-bezier(.16,1,.3,1) .15s both reveal;display:block}.sub{color:#ffffffe0;max-width:30ch;font-size:19px;line-height:1.5;animation:.8s cubic-bezier(.16,1,.3,1) .45s both rise}@keyframes reveal{0%{transform:translateY(105%)}to{transform:none}}@keyframes rise{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}.mode{gap:28px;margin-top:52px;animation:.8s cubic-bezier(.16,1,.3,1) .6s both rise;display:flex}.mode button{color:#ffffff38;padding-bottom:12px;font:400 clamp(38px,8vw,54px)/1 Pricedown,sans-serif;transition:color .25s;position:relative}.mode button:hover{color:#ffffff73}.mode button[aria-selected=true]{background:var(--logo);color:#0000;-webkit-background-clip:text;background-clip:text}.mode button:after{content:"";background:var(--pink);transform-origin:0;width:100%;height:3px;transition:transform .35s cubic-bezier(.16,1,.3,1);position:absolute;bottom:0;left:0;transform:scaleX(0)}.mode button[aria-selected=true]:after{transform:scaleX(1)}.mode-note{color:var(--muted);margin-top:14px;font-size:15px;animation:.8s cubic-bezier(.16,1,.3,1) .7s both rise}.step{border-top:1px solid var(--rule);padding:40px 0 44px}.step h2{font:700 34px/1.05 var(--cond);align-items:baseline;gap:16px;margin-bottom:26px;display:flex}.step h2 em{letter-spacing:.08em;color:var(--pink);font-size:20px;font-style:normal}@media (hover:none) and (pointer:coarse){.way.pc{display:none}.way+.way{border:0!important;margin-top:0!important;padding-top:0!important}}.way+.way{border-top:1px dashed var(--rule);margin-top:30px;padding-top:30px}.way h3{font:700 21px/1.2 var(--cond);letter-spacing:.02em;color:var(--cream);margin-bottom:12px}.way ol{color:#ffffffdb;gap:12px;padding-left:22px;display:grid}.way ol li::marker{color:var(--muted);font:700 16px var(--cond)}.way p{color:#ffffffdb;margin-bottom:14px}kbd{vertical-align:.12em;border:1px solid var(--rule);background:var(--veil);border-bottom-width:2px;border-radius:4px;margin:0 1px;padding:3px 6px 4px;font:700 12px/1 Montserrat,sans-serif;display:inline-block}.grab-row{margin:12px 0 4px;display:block}.grab{background:var(--logo);color:var(--ink);font:700 17px/1 var(--cond);letter-spacing:.04em;text-transform:uppercase;cursor:grab;vertical-align:middle;border-radius:6px;align-items:center;gap:8px;margin:0;padding:9px 16px 9px 10px;text-decoration:none;display:inline-flex;box-shadow:0 6px 18px #f08fb840}.grab:active{cursor:grabbing}body.versus .demo-btn{background:linear-gradient(180deg, #fff 18%, #d8fff6 52%, var(--mint) 92%)}body.versus .demo-fav{color:#d8fff6;background:#5fd6bf29}.grab.vs{background:linear-gradient(180deg, #fff 18%, #d8fff6 52%, var(--mint) 92%);box-shadow:0 6px 18px #5fd6bf40}.sc{color:#111;letter-spacing:.04em;text-transform:uppercase;vertical-align:.12em;background:#f5c533;border-radius:3px;margin:0 2px;padding:3px 9px 2px;font:700 13px/1.3 Montserrat,sans-serif;display:inline-block}.sc.line{color:#fff;background:0 0;box-shadow:inset 0 0 0 1px #ffffff80}.grab.nudge{animation:.6s cubic-bezier(.36,.07,.19,.97) nudge}@keyframes nudge{20%,60%{transform:translate(-5px)}40%,80%{transform:translate(5px)}}.demo{max-width:440px;height:150px;box-shadow:inset 0 0 0 1px var(--rule);background:#0000004d;border-radius:10px;margin-bottom:20px;position:relative;overflow:hidden}.demo.flash{animation:.9s ease-out flash}@keyframes flash{0%{box-shadow:inset 0 0 0 2px var(--pink)}to{box-shadow:inset 0 0 0 1px var(--rule)}}.demo-top{background:#ffffff0f;align-items:center;gap:6px;height:32px;padding:0 12px;display:flex}.demo-top i{background:#ffffff38;border-radius:50%;width:9px;height:9px}.demo-top span{background:#ffffff17;border-radius:8px;flex:1;height:16px;margin-left:10px}.demo-favs{border-bottom:1px solid var(--rule);align-items:center;height:30px;padding:0 12px;display:flex;position:relative}.demo-fav{font:700 12px/1 var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--cream);opacity:0;background:#f08fb829;border-radius:4px;padding:5px 9px;animation:4s infinite fav}.demo-page{height:88px;position:relative}.demo-btn,.demo-cursor{animation:4s cubic-bezier(.65,0,.35,1) infinite fly;position:absolute;top:34px;left:50%}.demo-btn{transform-origin:0 0;background:var(--logo);color:var(--ink);font:700 13px/1 var(--cond);letter-spacing:.04em;text-transform:uppercase;border-radius:5px;padding:7px 12px;box-shadow:0 6px 16px #0006}.demo-cursor{fill:#fff;stroke:#120f1e;stroke-width:1px;width:18px;height:18px;margin:14px 0 0 40px;animation-name:cursor}@keyframes fly{0%,12%{opacity:1;top:34px;left:50%;transform:scale(1)}55%{opacity:1;top:-25px;left:12px;transform:scale(.9)}62%,to{opacity:0;top:-25px;left:12px;transform:scale(.9)}}@keyframes cursor{0%,12%{opacity:1;top:34px;left:50%}55%,75%{opacity:1;top:-25px;left:12px}90%,to{opacity:0;top:-25px;left:12px}}@keyframes fav{0%,56%{opacity:0}62%,92%{opacity:1}to{opacity:0}}.grab svg{opacity:.6}textarea{resize:vertical;border:1px solid var(--rule);width:100%;min-height:130px;color:var(--text);background:#00000040;border-radius:8px;padding:14px 16px;font:500 14px/1.55 Montserrat,sans-serif;transition:border-color .2s}textarea:focus{border-color:var(--mint);outline:none}textarea::placeholder{color:#ffffff59}.row{gap:6px;margin-top:10px;display:flex}.status{border-left:2px solid var(--rule);color:var(--muted);margin-top:22px;padding-left:16px;font-size:15px;transition:border-color .3s}.status:empty{display:none}.status b{color:var(--text)}.status.ok{border-color:var(--mint)}.status.bad{border-color:var(--pink)}.players{gap:22px;display:grid}body.versus .players{grid-template-columns:1fr 1fr}.player{align-items:flex-end;gap:18px;display:flex}body.versus .player{flex-direction:column;align-items:stretch}.photo{aspect-ratio:15/16;cursor:pointer;width:116px;font:700 16px/1 var(--cond);letter-spacing:.04em;text-transform:uppercase;color:#ffffffbf;background:repeating-linear-gradient(#ffffff12 0 12px,#ffffff21 12px 14px);border-radius:8px;flex:none;place-items:center;transition:transform .2s;display:grid;position:relative;overflow:hidden}.photo:hover{transform:translateY(-2px)}body.versus .photo{width:100%;max-width:150px}.photo input{opacity:0;cursor:pointer;position:absolute;inset:0}.photo img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.photo:has(img:not([hidden])) span{display:none}.field{font:700 15px/1.2 var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);flex:1;gap:8px;display:grid}.field input{border:0;border-bottom:2px solid var(--rule);width:100%;color:var(--text);font:700 26px/1 var(--cond);letter-spacing:.02em;background:0 0;padding:13px 0 11px;transition:border-color .2s}.field input:focus{border-color:var(--pink);outline:none}.field input::placeholder{color:#ffffff47;font-weight:600}.hint{color:var(--muted);margin-top:14px;font-size:14px}.hint.center{text-align:center}.btn{font:700 18px/1 var(--cond);letter-spacing:.06em;text-transform:uppercase;border-radius:6px;justify-content:center;align-items:center;gap:8px;transition:transform .15s,background-color .2s,color .2s,opacity .2s;display:inline-flex;position:relative;overflow:hidden}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.main{background:var(--logo);height:56px;color:var(--ink);background-position:0 0;background-size:100% 180%;padding:0 24px;transition:background-position .4s,transform .15s,opacity .2s}.btn.main:hover:not(:disabled){background-position:0 100%}.btn.wide{width:100%;height:64px;font-size:22px}.btn.line{height:56px;color:var(--text);box-shadow:inset 0 0 0 1.5px #ffffff80}.btn.line:hover:not(:disabled){box-shadow:inset 0 0 0 1.5px #fff}.btn.line .label{z-index:1;position:relative}.btn.line .fill{transform-origin:0;background:linear-gradient(90deg,#5fd6bf66,#f08fb866);position:absolute;inset:0;transform:scaleX(0)}.btn.quiet{color:#fffc;padding:9px 12px;font-size:16px}.btn.quiet:hover:not(:disabled){background:var(--veil);color:#fff}.btn.small{padding:8px 10px;font-size:15px}.result{padding:8px 0 56px;scroll-margin-top:24px}.result:not([hidden]){animation:.9s cubic-bezier(.16,1,.3,1) both rise}.phone{background:#0c0a14;border-radius:22px;width:min(100%,380px,56.25vh - 112.5px);margin:0 auto;position:relative;overflow:hidden;box-shadow:0 0 0 1px #ffffff1a,0 40px 90px #05020fb3,0 0 120px #f08fb81f}@media (width<=700px){.phone{width:min(100%,360px)}}.phone canvas{aspect-ratio:9/16;cursor:pointer;width:100%;height:auto;display:block}.controls{align-items:center;gap:2px;width:min(100%,380px);margin:14px auto 0;display:flex}.icon{color:#fffc;border-radius:6px;place-items:center;width:40px;height:40px;display:grid}.icon:hover{background:var(--veil);color:#fff}.icon svg{width:18px;height:18px}#play .i-play{display:none}#play.paused .i-play{display:block}#play.paused .i-pause{display:none}.counter{font:700 15px/1 var(--cond);letter-spacing:.08em;color:var(--muted);margin-left:8px}.controls .btn{margin-left:auto}.actions{gap:8px;width:min(100%,380px);margin:12px auto 0;display:grid}footer{border-top:1px solid var(--rule);max-width:760px;color:var(--muted);gap:6px;margin:0 auto;padding:28px 16px 56px;font-size:13px;display:grid}footer .credit{color:#ffffffd1;max-width:60ch;font-size:15px}footer .credit a{font-weight:700}@media (width>=960px){footer{padding:28px 40px 56px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
