.tap-stage{aspect-ratio:10/9;width:100%;position:relative;container-type:inline-size}.tap-card{z-index:1;width:52%;animation:2.6s cubic-bezier(.2,.7,.2,1) .3s both tap-card;position:absolute;top:16%;left:3%;transform:rotate(-14deg)}@keyframes tap-card{0%{opacity:0;top:62%;left:-18%;transform:rotate(-24deg)}12%{opacity:1}42%{top:3%;left:15%;transform:rotate(-9deg)}62%{top:3%;left:15%;transform:rotate(-9deg)}to{opacity:1;top:16%;left:3%;transform:rotate(-14deg)}}.tap-phone{aspect-ratio:9/17.5;z-index:2;background:linear-gradient(160deg,#23315c,#0d1636 40%,#0a1230);border-radius:6.5cqw;width:45%;padding:1.6cqw;position:absolute;top:3%;right:5%;box-shadow:0 3cqw 7cqw -2cqw #000000b3,inset 0 0 0 1px #ffffff1a}.tap-screen{background:#020b2f;border-radius:5cqw;height:100%;position:relative;overflow:hidden;container-type:inline-size}.tap-notch{z-index:3;background:#000;border-radius:99px;width:28cqw;height:7cqw;position:absolute;top:3cqw;left:50%;translate:-50%}.tap-idle,.tap-profile{flex-direction:column;display:flex;position:absolute;inset:0}.tap-idle{color:#9eb4ca;justify-content:center;align-items:center;gap:3cqw;animation:.4s 1.55s both tap-fade-out}.tap-idle__time{color:#f0f6fc;letter-spacing:-.03em;font-size:17cqw;font-weight:600;line-height:1}.tap-idle__hint{font-size:5.6cqw}.tap-profile{gap:4cqw;padding:16cqw 7cqw 7cqw;animation:.5s 1.7s both tap-fade-in}@keyframes tap-fade-out{to{opacity:0;visibility:hidden}}@keyframes tap-fade-in{0%{opacity:0;transform:translateY(4cqw)}to{opacity:1;transform:none}}.tap-profile__avatar{color:#020b2f;background:#00d3f9;border-radius:99px;place-items:center;width:22cqw;height:22cqw;font-size:8cqw;font-weight:700;display:grid}.tap-profile__name{color:#f0f6fc;font-size:9cqw;font-weight:700;line-height:1.1}.tap-profile__role{color:#9eb4ca;margin-top:-2cqw;font-size:5.4cqw}.tap-profile__row{color:#f0f6fc;background:#0b1941;border:1px solid #22335f;border-radius:3cqw;align-items:center;gap:3cqw;padding:3.4cqw 4cqw;font-size:5.4cqw;display:flex}.tap-profile__row svg{color:#00d3f9;width:6cqw;height:6cqw}.tap-profile__save{color:#020b2f;text-align:center;background:#00d3f9;border-radius:3cqw;margin-top:auto;padding:4cqw;font-size:5.8cqw;font-weight:700}.tap-ripple{z-index:3;pointer-events:none;width:16cqw;height:16cqw;margin:-8cqw 0 0 -8cqw;position:absolute;top:13%;left:57%}.tap-ripple span{opacity:0;border:.6cqw solid #00d3f9;border-radius:99px;animation:1.1s ease-out both tap-ripple;position:absolute;inset:0}.tap-ripple span:first-child{animation-delay:1.3s}.tap-ripple span:nth-child(2){border-color:#3c75ff;animation-delay:1.48s}.tap-ripple span:nth-child(3){border-color:#914dff;animation-delay:1.66s}@keyframes tap-ripple{0%{opacity:.95;transform:scale(.2)}to{opacity:0;transform:scale(2.6)}}.tap-float{animation:6s ease-in-out 3s infinite tap-float}@keyframes tap-float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-2.2cqw)rotate(1.2deg)}}.tap-glow{z-index:0;pointer-events:none;opacity:0;background:radial-gradient(circle,#00d3f952,#3c75ff24 40%,#0000 68%);border-radius:999px;width:46cqw;height:46cqw;margin:-23cqw 0 0 -23cqw;animation:1.4s ease-out 1.35s forwards tap-glow-in,5s ease-in-out 2.8s infinite tap-glow-breathe;position:absolute;top:13%;left:57%}@keyframes tap-glow-in{to{opacity:1}}@keyframes tap-glow-breathe{0%,to{opacity:1;scale:1}50%{opacity:.65;scale:1.08}}.tap-profile>*{animation:.5s cubic-bezier(.2,.7,.2,1) both tap-row}.tap-profile>:first-child{animation-delay:1.75s}.tap-profile>:nth-child(2){animation-delay:1.85s}.tap-profile>:nth-child(3){animation-delay:1.92s}.tap-profile>:nth-child(4){animation-delay:2.02s}.tap-profile>:nth-child(5){animation-delay:2.1s}.tap-profile>:nth-child(6){animation-delay:2.18s}.tap-profile>:nth-child(7){animation-delay:2.32s}@keyframes tap-row{0%{opacity:0;transform:translateY(3cqw)}to{opacity:1;transform:none}}.tap-profile__save{animation:.5s cubic-bezier(.2,.7,.2,1) 2.32s both tap-row,2.8s ease-in-out 3.2s infinite save-pulse!important}@keyframes save-pulse{0%,to{box-shadow:0 0 #00d3f900}50%{box-shadow:0 0 0 1.6cqw #00d3f92e}}@supports (animation-timeline:scroll()){.tap-phone{animation:linear both tap-parallax-phone;animation-timeline:scroll(root);animation-range:0 700px}.tap-card-wrap{animation:linear both tap-parallax-card;animation-timeline:scroll(root);animation-range:0 700px}@keyframes tap-parallax-phone{to{translate:0 -6%}}@keyframes tap-parallax-card{to{translate:0 9%}}}@media (prefers-reduced-motion:reduce){.tap-float,.tap-glow,.tap-profile>*,.tap-phone,.tap-card-wrap{animation:none!important}.tap-glow{opacity:1}}
