.ub-section{z-index:0;height:500svh;position:relative}.ub-scene{--p:0;--dir:1;--ub-gold:#b89a5e;--ub-sand:color-mix(in oklab, var(--color-line) 72%, var(--ub-gold) 28%);--ub-note:#ffffffe0;--top:calc(4rem + env(safe-area-inset-top,0px));--edge:1.25rem;--uw:calc(100vw * .0053);--g:124;--mw:58;--text0:22rem;--textS:17rem;--free:calc(100svh - var(--top) - var(--text0));--u:min(var(--uw), calc(var(--free) / var(--g)));--shift:calc((var(--text0) - var(--textS)) / 2);--mx:calc(var(--u) * 106);--my:32;--kx:calc(var(--u) * 146);--ky:56;--fx:calc(var(--u) * 108);--fy:-34;--wx:calc((var(--u) * 21 + var(--fx)) / 2);--mh:calc(var(--mw) * .3143);--s1:clamp(0, var(--p), 1);--s2:clamp(0, calc(var(--p) - 1), 1);--s3:clamp(0, calc(var(--p) - 2), 1);--s4:clamp(0, calc(var(--p) - 3), 1);background:radial-gradient(ellipse 65% 60% at 50% 46%, #ffffff1f, transparent 75%), var(--color-ink);height:100svh;margin-block-end:-100svh;position:sticky;top:0;overflow:hidden}[dir=rtl] .ub-scene{--dir:-1}@media (min-width:768px){.ub-scene{--cw:calc(min(100vw, 75rem) - 4rem);--uw:calc(var(--cw) * .0036);--edge:calc((100% - min(100%, 75rem)) / 2 + 2rem);--g:92;--mw:70;--text0:calc(12rem + 24svh);--textS:calc(7rem + 12svh);--zl:calc((var(--cw) + var(--u) * 12) / 2);--mx:var(--zl);--my:24;--kx:calc(var(--zl) + var(--u) * 77);--ky:23;--fx:calc(var(--zl) + var(--u) * 15);--fy:-34}}@media (min-width:768px) and (max-height:680px){.ub-scene{--text0:calc(11rem + 8svh)}}.ub-stage{z-index:0;position:absolute;inset:0}.ub-anchor{inset-inline-start:var(--edge);top:calc(var(--top) + (var(--free) - var(--g) * var(--u)) / 2 + var(--u) * 42);width:calc(var(--u) * 100);height:0;transform:translateY(calc(var(--shift) * var(--s1)));will-change:transform;position:absolute}.ub-item{position:absolute}.ub-item>svg{width:100%;height:100%;display:block;overflow:visible}.ub-shadow{pointer-events:none;background:radial-gradient(closest-side,#0000008c,#0000);position:absolute}.ub-shadow-box{inset-inline-start:calc(var(--u) * -8);top:calc(var(--u) * 43);width:calc(var(--u) * 116);height:calc(var(--u) * 12)}.ub-shadow-mat{inset-inline-start:calc(var(--mx) - var(--u) * 4);top:calc(var(--u) * (var(--my) + var(--mh) - 3));width:calc(var(--u) * (var(--mw) + 8));height:calc(var(--u) * 8);opacity:clamp(0, calc((var(--s2) - .85) * 12), 1)}.ub-shadow-musk{inset-inline-start:calc(var(--kx) - var(--u) * 3);top:calc(var(--u) * (var(--ky) + 20));width:calc(var(--u) * 17);height:calc(var(--u) * 6);opacity:clamp(0, calc((var(--s2) - .85) * 12), 1)}.ub-shadow-friday{inset-inline-start:calc(var(--fx) - var(--u) * 4);top:calc(var(--u) * (var(--fy) + 31));width:calc(var(--u) * 66);height:calc(var(--u) * 10);opacity:clamp(0, calc((var(--s4) - .88) * 12), 1)}.ub-box-back{inset-inline-start:0;top:calc(var(--u) * -10);width:calc(var(--u) * 100);height:calc(var(--u) * 10)}.ub-box-front{inset-inline-start:0;width:calc(var(--u) * 100);height:calc(var(--u) * 48);top:0}.ub-lid{inset-inline-start:calc(var(--u) * -1.5);top:calc(var(--u) * -14);width:calc(var(--u) * 103);height:calc(var(--u) * 14);transform:translateY(calc(var(--u) * -62 * var(--s1)));opacity:clamp(0, calc((1 - var(--s1)) * 2.2), 1);will-change:transform, opacity}.ub-box-photo{inset-inline-start:calc(var(--u) * -1.5);top:calc(var(--u) * -22);width:calc(var(--u) * 103);height:calc(var(--u) * 70)}.ub-closed-photo{opacity:clamp(0, calc(1 - var(--s1) * 40), 1)}.ub-open-photo{opacity:clamp(0, calc(var(--s1) * 40), 1)}.ub-wall{fill:var(--brand)}.ub-sheen{fill:url(#ub-sheen)}.ub-edge-line{fill:#ffffff2e}.ub-shade{fill:#00000047}.ub-in-back{fill:color-mix(in oklab, var(--brand) 84%, black)}.ub-in-left{fill:color-mix(in oklab, var(--brand) 72%, black)}.ub-in-right{fill:color-mix(in oklab, var(--brand) 64%, black)}.ub-in-fade{fill:url(#ub-in-fade)}.ub-lid-top{fill:color-mix(in oklab, var(--brand) 78%, white)}.ub-lid-fill{fill:color-mix(in oklab, var(--brand) 90%, white)}.ub-gold{fill:none;stroke:var(--ub-gold);stroke-width:.35px}.ub-gold-soft{fill:none;stroke:var(--ub-gold);stroke-width:.2px;opacity:.55}.ub-mat{inset-inline-start:calc(var(--u) * (50 - var(--mw) / 2));top:calc(var(--u) * 14);width:calc(var(--u) * var(--mw));aspect-ratio:70/22;--up:clamp(0, calc(var(--s2) / .3), 1);--over:clamp(0, calc((var(--s2) - .25) / .5), 1);--down:clamp(0, calc((var(--s2) - .7) / .3), 1);transform:translate(calc((var(--mx) - var(--u) * (50 - var(--mw) / 2)) * var(--dir) * var(--over)), calc(var(--u) * (-40 * var(--up) + (var(--my) - 14 + 40) * var(--down))));opacity:clamp(0, calc(var(--s2) * 30), 1);will-change:transform, opacity}.ub-musk{inset-inline-start:calc(var(--u) * 84);top:calc(var(--u) * 10);width:calc(var(--u) * 11);height:calc(var(--u) * 23);--up:clamp(0, calc(var(--s2) / .3), 1);--over:clamp(0, calc((var(--s2) - .25) / .5), 1);--down:clamp(0, calc((var(--s2) - .7) / .3), 1);transform:translate(calc((var(--kx) - var(--u) * 84) * var(--dir) * var(--over)), calc(var(--u) * (-40 * var(--up) + (var(--ky) - 10 + 40) * var(--down))));opacity:clamp(0, calc(var(--s2) * 30), 1);will-change:transform, opacity}.ub-photo .ub-mat,.ub-photo .ub-musk{opacity:clamp(0, calc(var(--s2) * 4), 1)}.ub-photo .ub-stack{opacity:clamp(0, calc(var(--s3) * 4), 1)}.ub-photo .ub-lid{opacity:min(clamp(0, calc(var(--s1) * 40), 1), clamp(0, calc((1 - var(--s1)) * 2.2), 1))}.ub-cyl-light{fill:url(#ub-cyl)}.ub-sand{fill:var(--ub-sand)}.ub-sand-dark{fill:color-mix(in oklab, var(--ub-sand) 78%, black)}.ub-sand-line{fill:none;stroke:color-mix(in oklab, var(--ub-sand) 55%, black);stroke-width:.35px;stroke-linecap:round}.ub-strap{fill:var(--color-ink)}.ub-stack{inset-inline-start:calc(var(--u) * 21);top:calc(var(--u) * 4);width:calc(var(--u) * 58);height:calc(var(--u) * 38);transform:translateY(calc(var(--u) * -44 * var(--s3)));opacity:clamp(0, calc(var(--s3) * 30), 1);will-change:transform, opacity}.ub-layer{stroke:#00000038;stroke-width:.2px}.ub-layer-light{fill:#ffffff38}.ub-stack-top{opacity:clamp(0, calc((2.99 - var(--p)) * 100), 1)}.ub-friday{inset-inline-start:calc(var(--u) * 21);top:calc(var(--u) * -70.3);width:calc(var(--u) * 58);height:calc(var(--u) * 44.6);--lift:clamp(0, calc(var(--s4) / .2), 1);--toCenter:clamp(0, calc(var(--s4) / .5), 1);--sink:clamp(0, calc((var(--s4) - .2) / .3), 1);--toZone:clamp(0, calc((var(--s4) - .5) / .4), 1);--turn:clamp(-1, calc((var(--s4) - .92) * 12.5), 1);transform:translate(calc(((var(--wx) - var(--u) * 21) * var(--toCenter) + (var(--fx) - var(--wx)) * var(--toZone)) * var(--dir)), calc(var(--u) * (-8 * var(--lift) + 34 * var(--sink) + (var(--fy) + 70.3 - 26) * var(--toZone)))) scaleX(max(var(--turn), calc(var(--turn) * -1)));opacity:clamp(0, calc((var(--p) - 2.99) * 100), 1);will-change:transform, opacity}.ub-f-layer{position:absolute;inset:0}.ub-f-layer>svg{width:100%;height:100%;display:block;overflow:visible}.ub-f-fold{inset:auto 0;top:calc(var(--u) * 30.3);height:calc(var(--u) * 5.4);opacity:clamp(0, calc((.3 - var(--s4)) * 25), 1)}.ub-f-front{transform-origin:50% 80%;transform:scaleY(calc(.12 + .88 * clamp(0, calc((var(--s4) - .3) / .3), 1)));opacity:min(clamp(0, calc((var(--s4) - .28) * 25), 1), clamp(0, calc((.92 - var(--s4)) * 400), 1))}.ub-f-back{opacity:clamp(0, calc((var(--s4) - .92) * 400), 1)}.ub-shirt-line{fill:none;stroke:#ffffff61;stroke-width:1.2px;stroke-linejoin:round}.ub-neck{fill:none;stroke:#0000004d;stroke-width:1.2px}.ub-seam{fill:none;stroke:#00000038;stroke-width:.9px}.ub-extension{fill:none;stroke:var(--ub-note);stroke-width:1.6px;stroke-dasharray:5 4}.ub-f-label{inset-inline:0;text-align:center;color:var(--ub-note);white-space:nowrap;margin-block-start:.15rem;font-size:.8125rem;line-height:1.2;position:absolute;top:100%}.ub-intro{z-index:10;pointer-events:none;opacity:clamp(0, calc(1 - var(--p) / .6), 1);transform:translateY(calc(var(--p) * -14px))}.ub-intro-actions{pointer-events:auto}.ub-scene[data-phase=steps] .ub-intro-actions{visibility:hidden}.ub-caps{z-index:10;pointer-events:none}.ub-cap{--d:max(calc(var(--p) - var(--i)), calc(var(--i) - var(--p)));opacity:clamp(0, calc(1.5 - var(--d) * 3), 1);transform:translateY(calc((var(--i) - var(--p)) * 16px));grid-area:1/1}.ub-bar{pointer-events:auto;opacity:clamp(0, calc((var(--p) - .4) * 2.5), 1)}.ub-scene[data-phase=intro] .ub-bar{visibility:hidden}@media (max-height:560px),(min-width:768px) and (max-height:680px){.ub-low-hide{display:none}}@media (prefers-reduced-motion:reduce){.ub-section{height:auto}.ub-scene{flex-direction:column;gap:2.5rem;height:auto;margin-block-end:0;padding-block-end:3rem;display:flex;position:relative;overflow:visible;--p:4!important}.ub-stage{height:calc(var(--top) + var(--u) * (var(--g) + 10));flex:none;position:relative;inset:auto}.ub-anchor{top:calc(var(--top) + var(--u) * 46);transform:none}.ub-intro,.ub-caps{opacity:1;padding:0;position:relative;inset:auto;transform:none}.ub-intro-actions{visibility:visible!important}.ub-caps-grid{gap:2rem;display:grid}.ub-cap{opacity:1;grid-area:auto;transform:none}.ub-bar{display:none}}