.phone-demo,.phone-carousel{--pc-fg:var(--lp-fg,#0b0b0b);--pc-muted:var(--lp-muted,#0b0b0b94);--pc-border:var(--lp-border,#0000001a);--pc-chip:var(--lp-card,#f3f2ef);--pc-accent-bg:#f973161f;--pc-accent-fg:#c2410c}html.dark .phone-demo,html.dark .phone-carousel{--pc-fg:var(--lp-fg,#f5f5f4);--pc-muted:var(--lp-muted,#f5f5f494);--pc-border:var(--lp-border,#ffffff1a);--pc-chip:var(--lp-card,#17171a);--pc-accent-bg:#f973162e;--pc-accent-fg:#fdba74}.phone{--radius:calc(var(--phone-w) * .158);width:var(--phone-w);height:var(--phone-h);border-radius:var(--radius);padding:var(--bezel);box-sizing:border-box;background:linear-gradient(145deg,#2d2d31 0%,#141416 45%,#232326 100%);flex:none;position:relative;box-shadow:inset 0 0 0 1px #ffffff1a,inset 0 0 0 2px #0b0b0c,0 1px #ffffff0a,0 40px 80px -40px #0000008c,0 18px 36px -24px #0006}.phone__button{background:linear-gradient(270deg,#1c1c1e,#3a3a3d);border-radius:2px;width:3px;position:absolute}.phone__button--action{height:3.6%;top:17.5%;left:-2px}.phone__button--up{height:7%;top:24%;left:-2px}.phone__button--down{height:7%;top:33%;left:-2px}.phone__button--power{background:linear-gradient(90deg,#1c1c1e,#3a3a3d);height:11%;top:27%;right:-2px}.phone__screen{border-radius:calc(var(--radius) - var(--bezel));width:100%;height:100%;clip-path:inset(0 round calc(var(--radius) - var(--bezel)));contain:paint;background:#0f1012;position:relative;overflow:hidden}.phone[data-theme=light] .phone__screen{background:#f6f6f7}.phone__app-frame{transform-origin:0 0;opacity:0;color-scheme:normal;border:0;transition:opacity .5s cubic-bezier(.22,1,.36,1);position:absolute;top:0;left:0}.phone__app-frame[data-ready]{opacity:1}.phone .phone__poster{background-position:top;background-size:cover;width:100%;height:100%;position:absolute;inset:0}.phone__island{z-index:2;top:calc(var(--phone-w) * .033);width:calc(var(--phone-w) * .3);height:calc(var(--phone-w) * .088);pointer-events:none;background:#000;border-radius:999px;position:absolute;left:50%;transform:translate(-50%)}.phone-placeholder{border-radius:calc(var(--phone-w,300px) * .158);background:var(--pc-chip)}.phone-caption{text-wrap:pretty;text-align:left;max-width:100%;margin:22px auto 0;font:400 15px/1.45 Inter Variable,Inter,system-ui,sans-serif}.phone-caption__lead{color:var(--pc-fg);font-weight:600}.phone-caption__rest{color:var(--pc-muted)}.phone-carousel{color:var(--pc-fg)}.phone-carousel__chips{flex-wrap:wrap;justify-content:center;gap:8px;max-width:720px;margin:0 auto 36px;padding:0 16px;display:flex}.phone-chip{height:34px;box-shadow:inset 0 0 0 1px var(--pc-border);color:var(--pc-muted);white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:999px;align-items:center;padding:0 14px;font:500 14px/1 Inter Variable,Inter,system-ui,sans-serif;transition:background-color .3s,color .3s,box-shadow .3s,padding .3s;display:inline-flex}.phone-chip:hover{color:var(--pc-fg)}.phone-chip:focus-visible{outline:2px solid var(--pc-accent-fg);outline-offset:2px}.phone-chip[data-active]{background:var(--pc-chip);color:var(--pc-fg);box-shadow:inset 0 0 0 1px var(--pc-border), 0 1px 2px #0000000f;padding-left:6px}.phone-chip__avatar{opacity:0;width:0;transition:width .3s cubic-bezier(.4,0,.2,1),opacity .3s,transform .3s cubic-bezier(.4,0,.2,1);display:inline-flex;overflow:hidden;transform:scale(.4)}.phone-chip[data-active] .phone-chip__avatar{opacity:1;width:30px;transform:none}.phone-carousel__stage{position:relative}.phone-carousel__track{overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:12px calc(50% - var(--slide-w) / 2) 28px;cursor:grab;touch-action:pan-x pan-y;align-items:flex-start;gap:36px;display:flex;overflow:auto hidden}.phone-carousel__track::-webkit-scrollbar{display:none}.phone-carousel__track[data-dragging]{cursor:grabbing;scroll-snap-type:none}.phone-carousel__slide{flex:0 0 var(--slide-w);scroll-snap-align:center;scroll-snap-stop:always;opacity:.42;transform-origin:50% 30%;flex-direction:column;align-items:center;transition:opacity .45s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1);display:flex;transform:scale(.94)}.phone-carousel__slide[data-active]{opacity:1;transform:none}.phone-carousel__slide .phone-caption{width:calc(var(--slide-w) - 8px);opacity:0;transition:opacity .3s}.phone-carousel__slide[data-active] .phone-caption{opacity:1}.phone-stage{--pc-fg:var(--lp-fg,#0b0b0b);--pc-muted:var(--lp-muted,#0b0b0b94);--pc-border:var(--lp-border,#0000001a);--pc-chip:var(--lp-card,#f3f2ef);--pc-accent-fg:#c2410c;max-width:1120px;color:var(--pc-fg);flex-direction:column;align-items:center;gap:28px;margin:0 auto;padding:0 24px;display:flex}html.dark .phone-stage{--pc-fg:var(--lp-fg,#f5f5f4);--pc-muted:var(--lp-muted,#f5f5f494);--pc-border:var(--lp-border,#ffffff1a);--pc-chip:var(--lp-card,#17171a);--pc-accent-fg:#fdba74}.phone-stage__copy{flex-direction:column;align-items:center;gap:20px;max-width:560px;display:flex}.phone-stage .phone-carousel__chips{margin:0;padding:0}.phone-stage__caption{text-align:center;animation:.36s cubic-bezier(.22,1,.36,1) both phone-caption-in}.phone-stage__caption .phone-caption{text-align:inherit;max-width:440px;margin:0;font-size:16px}.phone-stage__hint{color:var(--pc-muted);margin:12px 0 0;font:400 13px/1.4 Inter Variable,Inter,system-ui,sans-serif}.phone-stage[data-wide]{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:72px;display:grid}.phone-stage[data-wide] .phone-stage__copy{align-items:flex-start}.phone-stage[data-wide] .phone-carousel__chips{justify-content:flex-start}.phone-stage[data-wide] .phone-stage__caption{text-align:left}.phone-stage[data-wide] .phone-stage__caption .phone-caption{font-size:18px}@keyframes phone-caption-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.phone[data-interactive] .phone__screen{cursor:auto}.phone-try{background:var(--pc-chip);height:34px;box-shadow:inset 0 0 0 1px var(--pc-border);color:var(--pc-fg);cursor:pointer;border:0;border-radius:999px;margin-top:14px;padding:0 18px;font:500 14px/1 Inter Variable,Inter,system-ui,sans-serif}.phone-try[aria-pressed=true]{background:var(--pc-fg);color:var(--lp-bg,#fff)}.phone-try:focus-visible{outline:2px solid var(--pc-accent-fg);outline-offset:2px}@media (width<=639px){.phone-carousel__chips{margin-bottom:24px}.phone-carousel__track{gap:16px}.phone-caption{font-size:14px}}@media (prefers-reduced-motion:reduce){.phone__app-frame,.phone-carousel__slide,.phone-chip,.phone-chip__avatar,.phone-stage__caption{transition:none;animation:none}}