.demo-root{isolation:isolate;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased}.demo-dots{opacity:.14;background-image:radial-gradient(currentColor .5px,#0000 .5px);background-size:16px 16px}.demo-grid{opacity:.06;background-image:linear-gradient(90deg,currentColor 1px,#0000 1px),linear-gradient(currentColor 1px,#0000 1px);background-size:56px 56px}.demo-fade-b{-webkit-mask-image:linear-gradient(#000 55%,#0000 100%);mask-image:linear-gradient(#000 55%,#0000 100%)}.demo-fade-x{-webkit-mask-image:linear-gradient(90deg,#0000 0%,#000 8% 92%,#0000 100%);mask-image:linear-gradient(90deg,#0000 0%,#000 8% 92%,#0000 100%)}.demo-marquee{width:max-content;animation:32s linear infinite demo-marquee;display:flex}@keyframes demo-marquee{0%{transform:translate(0,0)}to{transform:translate(-50%)}}.demo-bar{transform-origin:bottom;animation:.7s cubic-bezier(.22,1,.36,1) both demo-bar}@keyframes demo-bar{0%{transform:scaleY(.05)}to{transform:scaleY(1)}}.demo-rise{animation:.62s cubic-bezier(.22,1,.36,1) both demo-rise}@keyframes demo-rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translate(0,0)}}@media (prefers-reduced-motion:reduce){.demo-marquee,.demo-bar,.demo-rise{animation:none}}.demo-phone{filter:drop-shadow(0 18px 28px #00000057);width:100%}.demo-phone-body{aspect-ratio:9/19.4;background:linear-gradient(152deg,#74767c 0%,#4a4c52 14%,#2f3136 38%,#1d1e23 72%,#131417 100%);border-radius:1.7rem;padding:6px 5px 7px;position:relative;box-shadow:inset 0 1.5px #ffffff6b,inset 0 -1px #00000094,inset 1px 0 #ffffff1f,inset -1px 0 #0000006b}.demo-phone-notch{z-index:3;background:#050506;border-radius:999px;width:36%;height:8px;position:absolute;top:10px;left:50%;transform:translate(-50%);box-shadow:0 0 0 2.5px #050506}.demo-phone-screen{background:#07080a;border-radius:1.32rem;height:100%;overflow:hidden}.demo-phone-glare{pointer-events:none;mix-blend-mode:soft-light;background:linear-gradient(118deg,#ffffff29 0%,#0000 26% 68%,#ffffff0d 100%);border-radius:1.32rem;position:absolute;inset:6px 5px 7px}.demo-bar-shell{z-index:60;color:#f2f2f3;padding-top:var(--safe-top);background:#050506;border-bottom:1px solid #ffffff1a;position:sticky;top:0}.demo-bar-scroll{scrollbar-width:none}.demo-bar-scroll::-webkit-scrollbar{display:none}