.flip-demo{flex-direction:column;align-items:center;gap:2rem;display:flex}.flip-demo__stage{perspective:1400px;padding:2rem 0 3rem;position:relative}.flip-demo__phone{width:240px;height:500px;transform-style:preserve-3d;cursor:pointer;-webkit-tap-highlight-color:#0000;position:relative}.flip-demo__phone:focus-visible{outline-offset:6px;border-radius:44px;outline:2px solid #9b72cf}.flip-demo__face{backface-visibility:hidden;border:1px solid #ffffff14;border-radius:44px;position:absolute;inset:0}.flip-demo__face--front{background:#161618;padding:14px;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.flip-demo__face--back{background:linear-gradient(200deg,#232326,#121214);flex-direction:column;align-items:center;display:flex;transform:rotateX(180deg);box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.flip-demo__notch{z-index:2;background:#0c0c0d;border-radius:9999px;width:92px;height:24px;position:absolute;top:16px;left:50%;transform:translate(-50%)}.flip-demo__screen{background:radial-gradient(circle at 50% 30%,#9b72cf47,#0000 60%),#111;border-radius:32px;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;height:100%;display:flex}.flip-demo__screen--unlocked{background:radial-gradient(circle at 50% 40%,#34d39940,#0000 65%),#111}.flip-demo__label{color:#fff;font-size:.95rem;font-weight:600}.flip-demo__ring{width:160px;height:160px;position:relative}.flip-demo__ring svg{width:100%;height:100%;transform:rotate(-90deg)}.flip-demo__ring-track{fill:none;stroke:#ffffff14;stroke-width:8px}.flip-demo__ring-progress{fill:none;stroke:#9b72cf;stroke-width:8px;stroke-linecap:round;transition:stroke-dashoffset .15s linear}.flip-demo__ring-center{color:#b79ae6;flex-direction:column;justify-content:center;align-items:center;gap:.2rem;font-size:1.3rem;display:flex;position:absolute;inset:0}.flip-demo__count{color:#fff;font-variant-numeric:tabular-nums;font-size:2.4rem;font-weight:700}.flip-demo__hint{color:#737373;font-size:.85rem}.flip-demo__unlock-icon{color:#34d399;font-size:3rem}.flip-demo__unlock-title{color:#fff;font-size:1.5rem;font-weight:700}.flip-demo__unlock-sub{color:#a3a3a3;font-size:.9rem}.flip-demo__camera{background:#0d0d0e;border:1px solid #ffffff1a;border-radius:28px;width:90px;height:90px;margin-top:24px;margin-right:100px;display:block}.flip-demo__apple{background:#ffffff0f;border-radius:9999px;width:44px;height:44px;margin-top:140px;display:block}.flip-demo__shadow{background:radial-gradient(#000000b3,#0000 70%);border-radius:50%;width:220px;height:26px;position:absolute;bottom:0;left:50%;translate:-50%}.flip-demo__controls{flex-direction:column;align-items:center;gap:.5rem;min-height:5rem;display:flex}.flip-demo__btn{cursor:pointer;white-space:nowrap;color:#fff;background-color:#ffffff1a;border:1px solid #fff3;border-radius:9999px;justify-content:center;align-items:center;gap:.5rem;padding:.5rem 2rem;font-family:Inter,system-ui,-apple-system,SF Pro,sans-serif;font-weight:500;transition:all .2s;display:inline-flex}.flip-demo__btn:hover{background-color:#ffffff26;border-color:#ffffff4d}.flip-demo__btn{font-size:.95rem}.flip-demo__btn--primary{cursor:pointer;white-space:nowrap;color:#0a0a0a;background-color:#fff;border:none;border-radius:9999px;justify-content:center;align-items:center;gap:.5rem;padding:.5rem 2rem;font-family:Inter,system-ui,-apple-system,SF Pro,sans-serif;font-weight:500;transition:all .2s;display:inline-flex}.flip-demo__btn--primary:hover{background-color:#e5e5e5}.flip-demo__note{color:#525252;font-size:.78rem}