.wv-slot{container-type:size}.wv{--wv-ink:var(--hose-color-text-primary);--wv-accent:var(--hose-color-text-accent);--wv-soft:var(--hose-color-illustration-accent-soft);--wv-line:var(--hose-color-illustration-line);--wv-surface:var(--hose-color-surface-raised);--wv-ease:cubic-bezier(.16, 1, .3, 1);place-items:center;width:100%;height:100%;display:grid;position:relative}.wv-stack{aspect-ratio:1/1.05;width:min(72cqw,360px,72.381cqh);position:relative}.wv-slab{left:0;right:0;top:calc(var(--k) * 15%);border-radius:var(--hose-radius-inset);background:var(--wv-surface);height:30%;box-shadow:var(--hose-elevation-raised);z-index:calc(10 - var(--k));transition:transform .64s var(--wv-ease), opacity var(--hose-motion-effects-slow);transition-delay:calc((4 - var(--k)) * 70ms);grid-template-columns:1.4fr 1fr .7fr;gap:6%;padding:6%;display:grid;position:absolute}.wv-slab span{border-radius:var(--hose-radius-miniature);background:var(--wv-soft)}.wv-slab span:first-child{background:var(--wv-accent)}.wv-slab:nth-child(odd) span:first-child{background:var(--wv-ink)}[data-motion=ready] .wv-choreo:not([data-play]) .wv-slab{transform:translateY(calc(-60% - var(--k) * 12%)) rotate(calc((var(--k) - 2) * 3deg));opacity:0}.wv-platforms{aspect-ratio:1.25;width:min(86cqw,440px,100cqh);position:relative}.wv-source{aspect-ratio:1;border-radius:var(--hose-radius-miniature);background:var(--wv-accent);width:14%;position:absolute;top:0;left:50%;translate:-50%}.wv-frame{background:var(--wv-surface);border:2px solid var(--wv-ink);transition:transform .64s var(--wv-ease), opacity var(--hose-motion-effects-slow);transition-delay:calc(var(--k) * 90ms);flex-direction:column;gap:7%;padding:6%;display:flex;position:absolute;bottom:0}.wv-frame-web{border-radius:var(--hose-radius-control);width:46%;height:52%;left:0}.wv-frame-ios{border-radius:var(--hose-radius-inset);width:22%;height:66%;left:52%}.wv-frame-android{border-radius:var(--hose-radius-control);width:22%;height:66%;left:78%}.wv-part{border-radius:var(--hose-radius-miniature);background:var(--wv-soft);height:14%}.wv-part-a{background:var(--wv-accent);width:70%}.wv-part-c{background:var(--wv-ink);height:18%;margin-top:auto}[data-motion=ready] .wv-choreo:not([data-play]) .wv-frame{transform:translate(calc((1 - var(--k)) * 60%), -40%) scale(.4);opacity:0}.wv-tree{width:min(82cqw,420px,84cqh)}.wv-tree line{stroke:var(--wv-ink);stroke-width:.9px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset var(--hose-motion-effects-slow);transition-delay:calc(var(--d) * .11s)}.wv-tree circle{fill:var(--wv-accent);transition:opacity var(--hose-motion-effects-slow);transition-delay:.7s}[data-motion=ready] .wv-choreo:not([data-play]) .wv-tree line{stroke-dashoffset:1px}[data-motion=ready] .wv-choreo:not([data-play]) .wv-tree circle{opacity:0}@media (prefers-reduced-motion:reduce){.wv *,.wv :before{transition:none!important}}.wv-archive{aspect-ratio:1.15;width:min(84cqw,520px,87.4cqh);position:relative}@container (aspect-ratio<.9){.wv-archive{aspect-ratio:.82;width:min(86cqw,460px,65.6cqh)}.wv-archive-card{height:82%;left:4%}.wv-archive-ui{width:78%;bottom:0}}.wv-archive img{box-shadow:var(--hose-elevation-raised);transition:transform var(--hose-motion-spatial-slow), opacity var(--hose-motion-effects-slow);display:block;position:absolute}.wv-archive-card{border-radius:var(--hose-radius-miniature);width:auto;height:100%;top:0;left:2%;transform:rotate(-3deg)}.wv-archive-ui{border-radius:var(--hose-radius-inset);background:var(--wv-surface);width:62%;height:auto;transition-delay:.16s;bottom:4%;right:0}[data-motion=ready] .wv-choreo:not([data-play]) .wv-archive-card{opacity:0;transform:rotate(-8deg)translateY(16px)}[data-motion=ready] .wv-choreo:not([data-play]) .wv-archive-ui{opacity:0;transform:translateY(40px)}.fad{--fad-app:#fcfaf8;--fad-marker:#ffd63d9e;--U:min(100cqw / 36, 100cqh / 52);width:calc(36 * var(--U));height:calc(52 * var(--U));position:relative}.fad-photo{--x:2;--y:1.5;--w:12.5;--r:-5deg}.fad-profile{--x:13;--y:5;--w:22}.fad-card{--x:1.5;--y:20.5;--w:17;--r:-2.5deg}.fad-recipe{--x:15;--y:25.5;--w:20.5}@container (aspect-ratio>=1){.fad{--U:min(100cqw / 60, 100cqh / 30);width:calc(60 * var(--U));height:calc(30 * var(--U))}.fad-photo{--x:2.5;--y:1.5;--w:9.5}.fad-profile{--x:1.5;--y:17.6;--w:20.5}.fad-card{--x:23;--y:1.6;--w:15.5}.fad-recipe{--x:37.5;--y:2.8;--w:21}}.fad>*{left:calc(var(--x) * var(--U));top:calc(var(--y) * var(--U));width:calc(var(--w) * var(--U));transform:rotate(var(--r,0deg));transition:opacity var(--hose-motion-effects-slow), transform .8s var(--wv-ease);transition-delay:var(--d,0s);margin:0;position:absolute}.fad img{width:100%;height:auto;display:block}.fad-photo{padding:calc(.55 * var(--U)) calc(.55 * var(--U)) calc(1.6 * var(--U));border-radius:var(--hose-radius-mark);background:var(--hose-color-surface-raised);box-shadow:var(--hose-elevation-raised)}.fad-card{--d:.12s;border-radius:var(--hose-radius-mark);box-shadow:var(--hose-elevation-raised)}.fad-mark{border-radius:calc(.4 * var(--U));background:var(--fad-marker);mix-blend-mode:multiply;transform-origin:0;height:4.6%;transition:transform .42s var(--wv-ease), opacity var(--hose-motion-effects-fast);transition-delay:calc(1.5s + var(--i) * .48s);position:absolute;transform:rotate(-1deg)}.fad-app{gap:calc(.8 * var(--U));padding:calc(1.3 * var(--U));border:1px solid var(--hose-color-border-subtle);border-radius:calc(1 * var(--U));background:var(--fad-app);box-shadow:var(--hose-elevation-raised);display:grid}.fad-profile{--d:.6s}.fad-recipe{--d:.78s}.fad-rows{display:block;position:relative}.fad-row{border-radius:calc(.3 * var(--U));background:var(--fad-marker);mix-blend-mode:multiply;height:12%;transition:opacity var(--hose-motion-effects-slow);transition-delay:calc(1.7s + var(--i) * .48s);position:absolute;left:-2%;right:30%;translate:0 -50%}[data-motion=ready] .wv-choreo:not([data-play]) .fad-photo,[data-motion=ready] .wv-choreo:not([data-play]) .fad-card{opacity:0;transform:translateY(calc(-3 * var(--U))) rotate(calc(var(--r) * 2.4))}[data-motion=ready] .wv-choreo:not([data-play]) .fad-app{opacity:0;transform:translateX(calc(4 * var(--U)))}[data-motion=ready] .wv-choreo:not([data-play]) .fad-mark{opacity:0;transform:rotate(-1deg)scaleX(0)}[data-motion=ready] .wv-choreo:not([data-play]) .fad-row{opacity:0}