.demo{aspect-ratio:5/4;width:100%;max-width:560px;box-shadow:var(--shadow);isolation:isolate;font-family:var(--font);background:radial-gradient(420px 300px at 85% 10%,#ffd6e4 0%,#0000 70%),radial-gradient(380px 280px at 0 100%,#ffe8c4 0%,#0000 70%),linear-gradient(160deg,#fff7f9,#fdf3ea);border-radius:28px;margin-inline:auto;position:relative;overflow:hidden}.demo *{box-sizing:border-box}.demo img{object-fit:cover;width:100%;height:100%;display:block}.d-phone{aspect-ratio:9/17;width:33%;box-shadow:var(--shadow-lg);z-index:3;background:#140c1c;border-radius:26px;padding:6px;position:absolute;top:8%;left:6%}.d-phone.right{left:auto;right:8%}.d-phone.center{left:33.5%}.d-screen{background:var(--paper);border-radius:21px;flex-direction:column;height:100%;display:flex;position:relative;overflow:hidden}.d-bar{background:linear-gradient(160deg, var(--pink), var(--owl));color:#fff;text-align:center;font-family:var(--font-heading);padding:16px 10px 8px;font-size:clamp(.62rem,1.4vw,.8rem);font-weight:700;line-height:1.2}.d-bar small{font-family:var(--font);opacity:.85;font-size:.8em;font-weight:500;display:block}.d-body{flex-direction:column;flex:1;gap:6px;padding:7px;display:flex;overflow:hidden}.d-grid{grid-template-columns:repeat(2,1fr);gap:5px;display:grid}.d-grid>*{aspect-ratio:1;background:var(--pink-50);border-radius:7px;overflow:hidden}.d-btn{background:var(--pink);color:#fff;text-align:center;border-radius:999px;margin:6px;padding:7px;font-size:clamp(.5rem,1.1vw,.68rem);font-weight:650}.d-tv{aspect-ratio:16/10;width:52%;box-shadow:var(--shadow-lg);z-index:2;background:#1a1024;border-radius:14px;padding:7px;position:absolute;top:16%;right:4%}.d-tv.wide{width:auto;top:10%;left:6%;right:6%}.d-tv-screen{background:linear-gradient(160deg,#2a1b3a,#43234c);border-radius:9px;grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(3,1fr);gap:4px;height:100%;padding:4px;display:grid;position:relative;overflow:hidden}.d-tv-screen>*{background:#ffffff0f;border-radius:6px;overflow:hidden}.d-tv-label{z-index:2;color:#fff;background:#0000008c;border-radius:999px;align-items:center;gap:5px;padding:3px 9px;font-size:.7rem;font-weight:650;display:inline-flex;position:absolute;top:12px;left:12px}.d-tv-label i{background:#ff4d6d;border-radius:50%;width:7px;height:7px}.d-chip{z-index:6;color:var(--night);white-space:nowrap;background:#fff;border-radius:999px;align-items:center;gap:7px;padding:8px 13px;font-size:clamp(.68rem,1.3vw,.85rem);font-weight:650;display:inline-flex;position:absolute;box-shadow:0 10px 30px -12px #2a1b3a73}.d-chip .icon{width:16px;height:16px;color:var(--owl)}.d-chip.ok .icon{color:#13945a}.d-chip.no .icon{color:#c62828}.d-badge{color:#fff;border-radius:50%;place-items:center;width:20px;height:20px;font-size:12px;font-weight:800;display:grid;position:absolute;top:4px;right:4px;box-shadow:0 2px 6px #0000004d}.d-badge.ok{background:#13945a}.d-badge.no{background:#c62828}.mod-row{box-shadow:var(--shadow);background:#fff;border-radius:9px;grid-template-columns:40% 1fr;align-items:center;gap:6px;padding:5px;display:grid;position:relative}.mod-row .thumb{aspect-ratio:1;border-radius:6px;position:relative;overflow:hidden}.mod-row .lines span{background:var(--line);border-radius:3px;height:5px;margin:4px 0;display:block}.mod-row .lines span:first-child{background:#e6d8e0;width:70%}.mod-row .acts{gap:4px;margin-top:5px;display:flex}.mod-row .acts b{background:#e6f6ee;border-radius:999px;flex:1;height:13px}.mod-row .acts b+b{background:#fde8e8}.mod-row.is-hidden .thumb{filter:grayscale();opacity:.55}.motion-ready .mod-row{animation:9s infinite mod-row;animation-delay:var(--d)}.motion-ready .mod-row .d-badge{animation:9s infinite mod-badge;animation-delay:var(--d)}.motion-ready .mod-row.is-hidden .thumb{animation:9s infinite mod-grey;animation-delay:var(--d)}@keyframes mod-row{0%,4%{opacity:0;transform:translateY(-14px)}10%,60%{opacity:1;transform:none}70%,to{opacity:.35;transform:none}}@keyframes mod-badge{0%,18%{transform:scale(0)}23%{transform:scale(1.3)}27%,to{transform:scale(1)}}@keyframes mod-grey{0%,22%{filter:none;opacity:1}30%,to{filter:grayscale();opacity:.55}}.motion-ready .mod-tile{animation:9s infinite mod-tile;animation-delay:var(--d)}@keyframes mod-tile{0%,26%{opacity:0;transform:scale(.5)}34%,to{opacity:1;transform:none}}.motion-ready .fill>*{animation:8s infinite fill-in;animation-delay:calc(var(--i) * .45s)}@keyframes fill-in{0%,2%{opacity:0;transform:translateY(-30px)scale(.6)rotate(-6deg)}8%,88%{opacity:1;transform:none}96%,to{opacity:0}}.motion-ready .count-up:after{content:"128";animation:8s step-end infinite count}.count-up:after{content:"128"}@keyframes count{0%{content:"12"}15%{content:"36"}30%{content:"64"}45%{content:"97"}60%{content:"128"}}.d-card{width:34%;box-shadow:var(--shadow-lg);text-align:center;z-index:2;background:#fff;border-radius:16px;padding:12px 12px 10px;position:absolute;top:22%;left:9%;transform:rotate(-4deg)}.d-card .qr{position:relative;overflow:hidden}.d-card svg{width:100%;height:auto}.d-card b{font-family:var(--font-heading);color:var(--night);margin-top:8px;font-size:clamp(.62rem,1.3vw,.85rem);display:block}.d-card small{color:var(--muted);font-size:clamp(.5rem,1vw,.7rem);display:block}.scan{background:linear-gradient(90deg, transparent, var(--pink), transparent);height:3px;box-shadow:0 0 12px var(--pink);opacity:0;position:absolute;top:0;left:0;right:0}.motion-ready .scan{opacity:1;animation:2.2s ease-in-out infinite scan}.swap{position:absolute;inset:0}.motion-ready .swap.a{animation:6s infinite swap-a}.motion-ready .swap.b{animation:6s infinite swap-b}.swap.a{opacity:0}@keyframes swap-a{0%,40%{opacity:1}48%,95%{opacity:0}to{opacity:1}}@keyframes swap-b{0%,40%{opacity:0}48%,95%{opacity:1}to{opacity:0}}.d-camera{background:radial-gradient(circle at 50% 40%,#4a3a3a,#120d10 75%);place-items:center;height:100%;display:grid}.d-camera .frame{aspect-ratio:1;background:#fff;border:3px solid #fff;border-radius:14px;width:64%;padding:10%;position:relative;overflow:hidden;transform:rotate(-4deg)scale(.92)}.d-camera .frame svg{width:100%;height:auto}.motion-ready .cycle>*{animation:6s infinite cycle;animation-delay:calc(var(--i) * 1s)}@keyframes cycle{0%,6%{opacity:.2;transform:scale(.85)rotateY(70deg)}14%,to{opacity:1;transform:none}}.d-video{aspect-ratio:9/12;border-radius:9px;position:relative;overflow:hidden}.d-video .play{width:34px;height:34px;color:var(--owl);background:#ffffffd9;border-radius:50%;place-items:center;margin:auto;display:grid;position:absolute;inset:0}.d-video .play .icon{width:16px;height:16px}.d-video .bar{background:#fff6;border-radius:2px;height:4px;position:absolute;bottom:8px;left:8px;right:8px;overflow:hidden}.d-video .bar i{background:#fff;width:60%;height:100%;display:block}.motion-ready .d-video .bar i{animation:5s linear infinite progress}@keyframes progress{0%{width:0}to{width:100%}}.motion-ready .zoom-slow img{animation:10s ease-in-out infinite alternate kenburns}@keyframes kenburns{to{transform:scale(1.15)translate(-3%,-2%)}}.motion-ready .chip-pop{animation:6s infinite chip-pop;animation-delay:var(--d,0s)}@keyframes chip-pop{0%,6%{opacity:0;transform:translateY(10px)scale(.8)}12%,85%{opacity:1;transform:none}95%,to{opacity:0}}.motion-ready .bob{animation:5s ease-in-out infinite float;animation-delay:var(--d,0s)}.msg{max-width:88%;box-shadow:var(--shadow);color:var(--ink);background:#fff;border-radius:12px 12px 12px 4px;padding:7px 9px;font-size:clamp(.55rem,1.15vw,.72rem);line-height:1.3}.msg.pink{background:linear-gradient(135deg, var(--pink), var(--owl));color:#fff;border-radius:12px 12px 4px;align-self:flex-end}.msg small{opacity:.7;margin-top:2px;font-size:.85em;display:block}.wave{align-items:center;gap:2px;height:22px;display:flex}.wave i{height:var(--h);background:currentColor;border-radius:2px;flex:1}.motion-ready .wave i{animation:1.2s ease-in-out infinite wave;animation-delay:calc(var(--i) * -.09s)}@keyframes wave{50%{transform:scaleY(.35)}}.motion-ready .msgs>*{animation:9s infinite msg-in;animation-delay:calc(var(--i) * 1.4s)}@keyframes msg-in{0%,3%{opacity:0;transform:translateY(12px)scale(.92)}8%,90%{opacity:1;transform:none}97%,to{opacity:0}}.motion-ready .theme{animation:9s infinite theme}@keyframes theme{0%,28%{--c1:#e0487a;--c2:#ca2065}33%,61%{--c1:#2f9e8f;--c2:#1c6f73}66%,94%{--c1:#f4a940;--c2:#c97a18}}@property --c1{syntax:"<color>";inherits:true;initial-value:#e0487a}@property --c2{syntax:"<color>";inherits:true;initial-value:#ca2065}.theme .welcome{color:#fff;background:linear-gradient(to top, color-mix(in oklab, var(--c2) 85%, black) 0%, transparent 70%);flex-direction:column;justify-content:flex-end;padding:14px;display:flex;position:absolute;inset:0}.theme .welcome b{font-family:Commissioner Variable,serif;font-size:clamp(.9rem,2vw,1.25rem);line-height:1.1}.theme .welcome .d-btn{background:var(--c1);margin:10px 0 0}.swatches{gap:8px;display:flex}.swatches i{width:22px;height:22px;box-shadow:0 0 0 3px #fff, var(--shadow);border-radius:50%}.ch{box-shadow:var(--shadow);color:var(--ink);background:#fff;border-radius:10px;align-items:center;gap:7px;padding:6px 7px;font-size:clamp(.52rem,1.1vw,.7rem);font-weight:600;display:flex}.ch .box{border:2px solid var(--pink-100);color:#fff;background:#13945a;border-color:#13945a;border-radius:5px;flex-shrink:0;place-items:center;width:15px;height:15px;font-size:10px;display:grid}.ch .pic{border-radius:6px;flex-shrink:0;width:26px;height:26px;margin-left:auto;overflow:hidden}.motion-ready .ch .box{animation:9s infinite tick;animation-delay:calc(var(--i) * 1.6s)}.motion-ready .ch .pic{animation:9s infinite pic-in;animation-delay:calc(var(--i) * 1.6s)}@keyframes tick{0%,10%{border-color:var(--pink-100);color:#0000;background:#fff}14%,92%{color:#fff;background:#13945a;border-color:#13945a}}@keyframes pic-in{0%,10%{opacity:0;transform:scale(.4)}15%,92%{opacity:1;transform:none}to{opacity:0}}.like-card{width:30%;box-shadow:var(--shadow-lg);z-index:3;background:#fff;border-radius:14px;padding:6px 6px 8px;position:absolute}.like-card .ph{aspect-ratio:1;border-radius:9px;overflow:hidden}.like-card .meta{color:var(--night);align-items:center;gap:5px;margin-top:6px;font-size:.78rem;font-weight:700;display:flex}.like-card .meta .icon{width:16px;height:16px;color:var(--owl);fill:var(--owl)}.motion-ready .like-card .meta .icon{animation:2s infinite heart;animation-delay:var(--d,0s)}@keyframes heart{0%,60%{transform:none}70%{transform:scale(1.5)}80%{transform:scale(.9)}90%{transform:none}}.heart-fly{z-index:4;color:var(--owl);opacity:0;position:absolute}.heart-fly .icon{fill:currentColor;width:22px;height:22px}.motion-ready .heart-fly{animation:3s infinite heart-fly;animation-delay:var(--d)}@keyframes heart-fly{0%{opacity:0;transform:translateY(0)scale(.5)}15%{opacity:1}to{opacity:0;transform:translateY(-90px) translateX(var(--x,10px)) scale(1.2)}}.framed{aspect-ratio:4/5;z-index:3;width:44%;position:absolute;top:50%;left:50%;translate:-50% -50%}.framed .ph{border-radius:4px;position:absolute;inset:9% 9% 21%;overflow:hidden}.framed .fr{box-shadow:var(--shadow-lg);border-radius:10px;justify-content:center;align-items:flex-end;padding-bottom:5%;font-family:Commissioner Variable,serif;font-size:clamp(.7rem,1.6vw,1rem);font-weight:700;display:flex;position:absolute;inset:0}.framed .fr.f1{color:var(--night);background:#fff}.framed .fr.f2{color:#6b4610;opacity:0;background:linear-gradient(160deg,#f8e6c8,#e9c98e)}.framed .fr.f3{background:linear-gradient(160deg, var(--pink), var(--owl));color:#fff;opacity:0}.motion-ready .framed .fr.f1{animation:9s infinite fr1}.motion-ready .framed .fr.f2{animation:9s infinite fr2}.motion-ready .framed .fr.f3{animation:9s infinite fr3}@keyframes fr1{0%,30%{opacity:1}34%,96%{opacity:0}to{opacity:1}}@keyframes fr2{0%,30%{opacity:0}34%,63%{opacity:1}67%,to{opacity:0}}@keyframes fr3{0%,63%{opacity:0}67%,96%{opacity:1}to{opacity:0}}.zip{aspect-ratio:1/1.1;z-index:3;width:26%;box-shadow:var(--shadow-lg);text-align:center;color:var(--night);background:#fff;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:10px;font-size:clamp(.6rem,1.2vw,.8rem);font-weight:700;display:flex;position:absolute;top:30%;right:12%}.zip .icon{width:38%;height:auto;color:var(--glow)}.zip .pbar{background:var(--line);border-radius:3px;width:100%;height:6px;overflow:hidden}.zip .pbar i{background:linear-gradient(90deg, var(--owl), var(--glow));width:100%;height:100%;display:block}.motion-ready .zip .pbar i{animation:6s linear infinite progress}.into-zip{z-index:4;aspect-ratio:1;border-radius:7px;width:12%;position:absolute;overflow:hidden;box-shadow:0 8px 20px -6px #0006}.motion-ready .into-zip{animation:3s ease-in infinite into-zip;animation-delay:var(--d)}@keyframes into-zip{0%{opacity:0;transform:none}15%{opacity:1}80%{opacity:1;transform:translate(var(--tx), var(--ty)) scale(.4) rotate(12deg)}to{opacity:0;transform:translate(var(--tx), var(--ty)) scale(.2)}}.pin-off{z-index:4;width:46px;height:46px;box-shadow:var(--shadow-lg);color:#c62828;background:#fff;border-radius:50%;place-items:center;display:grid;position:absolute;top:20%;right:12%}.pin-off .icon{width:24px;height:24px}.motion-ready .pin-off{animation:5s infinite pin-off}@keyframes pin-off{0%,20%{opacity:1;transform:scale(1)}30%{transform:scale(1.25)}45%,to{transform:scale(1)}}.lock{z-index:4;background:var(--night);color:#fff;box-shadow:var(--shadow-lg);border-radius:14px;align-items:center;gap:8px;padding:10px 16px;font-size:clamp(.7rem,1.3vw,.85rem);font-weight:650;display:flex;position:absolute;bottom:14%;left:50%;translate:-50%}.lock .dots{letter-spacing:3px}.motion-ready .lock .dots:after{content:"";animation:4s step-end infinite dots}@keyframes dots{0%{content:""}15%{content:"•"}30%{content:"••"}45%{content:"•••"}60%{content:"••••"}}.lang-stack{height:2.6em;position:relative}.lang-stack span{opacity:0;place-items:center;display:grid;position:absolute;inset:0}.lang-stack span:first-child{opacity:1}.motion-ready .lang-stack span{animation:9s infinite lang;animation-delay:calc(var(--i) * 3s);opacity:0}@keyframes lang{0%,3%{opacity:0;transform:translateY(8px)}8%,30%{opacity:1;transform:none}35%,to{opacity:0;transform:translateY(-8px)}}.lang-pills{justify-content:center;gap:4px;display:flex}.lang-pills b{background:var(--pink-50);color:var(--owl);border-radius:999px;padding:3px 7px;font-size:.6rem}.versus{padding-block:10px;position:relative;overflow:hidden;mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000)}.versus-row{gap:10px;width:max-content;margin-bottom:10px;display:flex}.versus-row>*{aspect-ratio:1;border-radius:14px;flex-shrink:0;width:clamp(80px,11vw,140px);overflow:hidden}.motion-ready .versus-row{animation:50s linear infinite marquee}.motion-ready .versus-row.rev{animation-direction:reverse}.versus .grey{-webkit-backdrop-filter:grayscale()contrast(.9)brightness(1.05);z-index:2;background:#ffffff40;position:absolute;inset:0 0 0 50%}.versus .line{background:var(--night);z-index:3;width:3px;margin-left:-1.5px;position:absolute;top:0;bottom:0;left:50%}.versus .d-chip{top:50%;translate:0 -50%}.versus .d-chip.l{left:8%}.versus .d-chip.r{right:8%}@media (width<=640px){.versus .d-chip{padding:6px 10px;font-size:.7rem}.versus .d-chip.l{left:3%}.versus .d-chip.r{right:3%}}