:root{--teal-gradient-dark: #00A8AA;--teal-gradient-mid: #45C8C6;--teal-gradient-light: #CDEBE2;--teal-gradient: linear-gradient(225deg, var(--teal-gradient-dark) 0%, var(--teal-gradient-mid) 45%, var(--teal-gradient-light) 100%);--teal-brand: #00BCB0;--teal-badge: #00B1A8;--teal-title-shadow: #3EBAAF;--white: #FFFFFF;--ink: #000000;--shadow-gray: #CCCCCC;--pink-bubble: #FF8793;--pink-badge: #F18D95;--liquid-lychee: #CD9146;--liquid-blue: #5DBFDC;--liquid-strawberry: #E97C98;--liquid-water: #9ED2E6;--liquid-water-alpha: .6;--liquid-water-pickup: 0;--liquid-water-blend: .15;--liquid-milk-pickup: .7;--liquid-milk: #EDE9E2;--liquid-coffee: #33120E;--liquid-coffee-thin: #C58A45;--stir-bowl-coffee: #6A4310;--stir-bowl-cream: #E0B775;--liquid-cream: #F4EFE7;--font-display: "Better Times Alt", serif;--font-heavy: "Gotham-Black", sans-serif;--font-button: "Gotham-Medium", sans-serif;--font-body: "Nescafe Sans-Regular", sans-serif;--font-body-bold: "Nescafe Sans-Bold", sans-serif}@font-face{font-family:Nescafe Sans-Regular;src:url(../assets/fonts/Nescafe-Sans-Regular.woff2) format("woff2");font-display:swap}@font-face{font-family:Nescafe Sans-Bold;src:url(../assets/fonts/Nescafe-Sans-Bold.woff2) format("woff2");font-weight:700;font-display:swap}@font-face{font-family:Better Times Alt;src:url(../assets/fonts/Better-Times-Alt.woff2) format("woff2");font-display:swap}@font-face{font-family:Gotham-Black;src:url(../assets/fonts/Gotham-Black.woff2) format("woff2");font-display:swap}@font-face{font-family:Gotham-Medium;src:url(../assets/fonts/Gotham-Medium.woff2) format("woff2");font-display:swap}*,*:before,*:after{box-sizing:border-box}:root{color-scheme:light}html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none}:root{--stage-h: min(var(--vh-px, 100vh), calc(100vw * 16 / 9));--stage-w: calc(var(--stage-h) * 9 / 16)}@supports (height: 100dvh){:root{--stage-h: min(100dvh, calc(100vw * 16 / 9))}}body{display:flex;align-items:center;justify-content:center;background:url(../assets/img/bg-gradient.webp) calc(50% - 2 * var(--stage-w)) 50% / auto var(--stage-h) no-repeat,url(../assets/img/bg-gradient.webp) calc(50% + 2 * var(--stage-w)) 50% / auto var(--stage-h) no-repeat,url(../assets/img/bg-gradient.webp) center / cover no-repeat,var(--teal-gradient);font-family:var(--font-body);color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;transform:scaleX(-1);background:url(../assets/img/bg-gradient.webp) calc(50% - var(--stage-w)) 50% / auto var(--stage-h) no-repeat,url(../assets/img/bg-gradient.webp) calc(50% + var(--stage-w)) 50% / auto var(--stage-h) no-repeat}#stage{position:relative;height:var(--stage-h);aspect-ratio:9 / 16;margin:0 auto;overflow:hidden;container-type:size;container-name:stage;--u: calc(100cqw / 1080);background:var(--teal-gradient);background-image:url(../assets/img/bg-gradient.webp),var(--teal-gradient);background-size:cover;background-position:center}#stage,#stage *{touch-action:none}#stage-content{position:absolute;top:0;right:0;bottom:0;left:0}img{-webkit-user-drag:none;pointer-events:none}button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer}.hidden{display:none!important}.mute-btn{position:absolute;z-index:50;top:calc(var(--u) * 24);left:calc(var(--u) * 24);padding:calc(var(--u) * 12) calc(var(--u) * 24);border-radius:999px;background:#ffffff59;color:var(--ink);font:calc(var(--u) * 24) / 1 var(--font-body-bold);opacity:.7}.mute-btn:before{content:"";position:absolute;top:calc(var(--u) * -24);right:calc(var(--u) * -24);bottom:calc(var(--u) * -48);left:calc(var(--u) * -48)}.preload-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:60;display:grid;place-content:center;gap:calc(var(--u) * 40);padding:calc(var(--u) * 80);text-align:center;background:#0000008c;color:var(--white);font:calc(var(--u) * 44) / 1.3 var(--font-body-bold)}.preload-overlay button{justify-self:center;padding:calc(var(--u) * 24) calc(var(--u) * 64);border:calc(var(--u) * 4) solid var(--white);border-radius:999px;background:var(--teal-brand);color:var(--white);font:calc(var(--u) * 40) / 1 var(--font-button)}.build-stamp{position:absolute;z-index:5;left:calc(var(--u) * 24);bottom:calc(var(--u) * 24);color:var(--white);opacity:.45;font:calc(var(--u) * 20) / 1 var(--font-body-bold);pointer-events:none}html.lite .mix-vessel.is-lifted>img,html.lite .cipta-topping.is-dragging,html.lite .stir__frother{filter:none!important}html.lite .stir__layer--layered{filter:blur(calc(var(--u) * 3))!important}.logo{position:absolute;left:0;top:0;width:100%;height:calc(var(--u) * 720);color:var(--white);pointer-events:none}.logo__line,.logo__tag{position:absolute;white-space:nowrap;transform:rotate(-7.51deg)}.logo__line{font:calc(var(--u) * 254) / calc(var(--u) * 225) var(--font-display);text-shadow:calc(var(--u) * 15.7) calc(var(--u) * 6.8) 0 var(--teal-title-shadow);transform-origin:0 calc(var(--u) * 190)}.logo__line--1{left:calc(var(--u) * 371);top:calc(var(--u) * 145.2)}.logo__line--2{left:calc(var(--u) * 195.5);top:calc(var(--u) * 369.8)}.logo__tag{left:calc(var(--u) * 252);top:calc(var(--u) * 622.9);font:calc(var(--u) * 53) / calc(var(--u) * 64) var(--font-body-bold);text-shadow:calc(var(--u) * -.7) calc(var(--u) * 5) 0 var(--teal-title-shadow);transform-origin:0 calc(var(--u) * 49.7)}.bubble{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--ink);background:var(--pink-bubble);border:calc(var(--u) * 11) solid var(--white);border-radius:calc(var(--u) * 40);pointer-events:none}.bubble__title{display:block;font:calc(var(--u) * 184) / calc(var(--u) * 152) var(--font-display);transform:translate(calc(var(--u) * 10)) rotate(-7.51deg);transform-origin:50% calc(var(--u) * 132)}.bubble__body{white-space:pre-line;display:block;font:calc(var(--u) * 51) / calc(var(--u) * 63) var(--font-body-bold)}.bubble__icon{position:absolute;right:calc(var(--u) * 18);top:calc(var(--u) * 14);width:calc(var(--u) * 84);height:calc(var(--u) * 84);color:var(--ink);fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.bubble--ice{left:calc(var(--u) * 318);top:calc(var(--u) * 171.5);width:calc(var(--u) * 708);height:calc(var(--u) * 296)}.bubble--ice .bubble__body,.bubble--putar .bubble__body{font:calc(var(--u) * 66) / calc(var(--u) * 83) var(--font-body-bold)}.bubble--step{left:calc(var(--u) * 324);top:calc(var(--u) * 152);width:calc(var(--u) * 708);min-height:calc(var(--u) * 357);justify-content:flex-start;padding-top:calc(var(--u) * 20)}.bubble--step .bubble__body{margin-top:calc(var(--u) * 19)}.bubble--step.bubble--tall{top:calc(var(--u) * 138);min-height:calc(var(--u) * 440);padding-top:calc(var(--u) * 34)}.bubble--cipta{left:calc(var(--u) * 492);top:calc(var(--u) * 152);width:calc(var(--u) * 540);min-height:calc(var(--u) * 357);justify-content:flex-start;padding-top:calc(var(--u) * 20)}.bubble--cipta .bubble__body{margin-top:calc(var(--u) * 20)}.bubble--putar{left:calc(var(--u) * 102.5);top:calc(var(--u) * 229);width:calc(var(--u) * 393);height:calc(var(--u) * 217.5);border-width:calc(var(--u) * 7);border-radius:calc(var(--u) * 24)}.cta-frame{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.cta-frame>*{pointer-events:auto}.cta-frame__svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible;pointer-events:none}.cta-frame__back{fill:none;stroke:var(--shadow-gray);stroke-width:6.4;stroke-linejoin:round}.cta-frame__front{fill:none;stroke:var(--white);stroke-width:4.3;stroke-linejoin:round}.pill-btn,.slide{position:absolute;left:calc(var(--u) * 284);top:calc(var(--u) * 920);width:calc(var(--u) * 600);height:calc(var(--u) * 119);display:flex;align-items:center;justify-content:center;padding-left:calc(var(--u) * 27);border:calc(var(--u) * 6.6) solid var(--white);border-radius:calc(var(--u) * 999);background:var(--teal-brand);color:var(--white);font:calc(var(--u) * 51) / 1 var(--font-button, var(--font-medium));cursor:pointer;-webkit-tap-highlight-color:transparent}.pill-btn:before,.slide:before{content:"";position:absolute;inset:calc(var(--u) * -14)}.pill-btn:active{transform:scale(.97)}.pill-btn:disabled{opacity:.55;cursor:default;transform:none}.pill-btn__curl{position:absolute;left:calc(var(--u) * -84);top:calc(var(--u) * -24);width:calc(var(--u) * 167);height:calc(var(--u) * 153);overflow:visible;pointer-events:none}.pill-btn__curl-back{fill:var(--teal-brand)}.pill-btn__curl-front{fill:var(--white)}.slide{cursor:grab;touch-action:none;outline:none}.slide.is-disabled{opacity:.55}.slide.is-done{cursor:default}.slide__label{position:relative;z-index:1;background:linear-gradient(100deg,var(--white) 40%,var(--teal-gradient-light) 50%,var(--white) 60%);background-size:300% 100%;background-position-x:100%;-webkit-background-clip:text;background-clip:text;color:transparent;pointer-events:none}.slide__flash{position:absolute;inset:calc(var(--u) * -6.6);border-radius:inherit;background:var(--teal-gradient-light);opacity:0;pointer-events:none}.slide__knob{position:absolute;z-index:2;left:calc(var(--u) * -84);top:calc(var(--u) * -24);width:calc(var(--u) * 167);height:calc(var(--u) * 153);cursor:grab}.slide__knob>.pill-btn__curl{left:0;top:0;width:100%;height:100%}.badge{position:absolute;left:calc(var(--u) * 295);top:calc(var(--u) * 1113);width:calc(var(--u) * 316);height:calc(var(--u) * 132);color:var(--ink);font-family:var(--font-body-bold);background:var(--pink-badge);border:calc(var(--u) * 5) solid var(--white);border-radius:calc(var(--u) * 18);white-space:nowrap;pointer-events:none}.badge__num{position:absolute;left:calc(var(--u) * 11);top:calc(var(--u) * 11.5);font-size:calc(var(--u) * 98.6);line-height:1}.badge__labels{position:absolute;left:calc(var(--u) * 195);top:calc(var(--u) * 22.5);font-size:calc(var(--u) * 27.4);line-height:calc(var(--u) * 26.8);text-align:left}.arch{position:absolute;left:calc(var(--u) * 67);top:calc(var(--u) * 65);width:calc(var(--u) * 947);bottom:calc(var(--u) * 63);border-radius:calc(var(--u) * 474);overflow:hidden;pointer-events:none}.arch>img{display:block;width:100%;height:100%;object-fit:cover}.drink-card{position:absolute;width:calc(var(--u) * 376);height:calc(var(--u) * 376);border-radius:calc(var(--u) * 38);background:var(--white);box-shadow:calc(var(--u) * 7.4) calc(var(--u) * 7.4) 0 var(--teal-title-shadow);cursor:pointer;-webkit-tap-highlight-color:transparent}.drink-card--1{left:calc(var(--u) * 124);top:calc(var(--u) * 889)}.drink-card--2{left:calc(var(--u) * 593);top:calc(var(--u) * 889)}.drink-card--3{left:calc(var(--u) * 352);top:calc(var(--u) * 1352)}.drink-card__label{position:absolute;top:calc(var(--u) * 20);left:0;right:0;text-align:center;white-space:nowrap;color:var(--ink);font:calc(var(--u) * 29.7) / calc(var(--u) * 33) var(--font-body-bold)}.drink-card__cup,.drink-card__coaster,.drink-card__deco{position:absolute}.logo__tag{left:0;right:0;text-align:center;top:calc(var(--u) * 567);transform:none}.liquid{position:absolute;--liq-fill-line: .92;--liq-feather: calc(var(--u) * 120);--liq-blend: 50%;--liq-mix: .6;--liq-alpha: .98;--liq-alpha-syrup: .7;--liq-ice-cover: .9;--liq-min-band: .14;--liq-pickup: 30%;--liq-meniscus: calc(var(--u) * 5);--liq-edge: url(../assets/img/liquid-edge.webp);--liq-edge-w: calc(var(--u) * 1024);--liq-wob: 0}.liquid>*{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.liquid__glass,.liquid__gloss{display:block}.liquid__gloss{mix-blend-mode:screen;opacity:.35}.liquid__band{--c: var(--c0);--lvl: calc(var(--f0v) + var(--bandv) * var(--fill));--span: calc((var(--liq-floor) - var(--liq-top)) * var(--liq-fill-line));--y: calc(var(--liq-floor) - var(--span) * var(--lvl));--y0: calc(var(--liq-floor) - var(--span) * var(--f0v));--rx: calc((var(--liq-w-floor) + (var(--liq-w-top) - var(--liq-w-floor)) * var(--lvl) * var(--liq-fill-line)) / 2);--ry: calc(var(--rx) * var(--liq-ry));--ellipse: radial-gradient(var(--rx) var(--ry) at 50% var(--y), black calc(100% - 2px) , transparent 100%);--ramp: calc(var(--liq-feather) * var(--fe) * min(1, var(--fill) * 4));--ya: calc(var(--y0) - var(--ramp) / 2);--yb: calc(var(--y0) + var(--ramp) / 2);--box: linear-gradient(to bottom, transparent var(--y), black var(--y), black var(--ya), transparent var(--yb));--wob: calc(var(--liq-wob) * var(--u));--alpha: calc((var(--liq-alpha) + (var(--liq-alpha-syrup) - var(--liq-alpha)) * var(--sat)) * var(--ta));-webkit-mask-image:var(--liq-mask),var(--box),var(--ellipse);mask-image:var(--liq-mask),var(--box),var(--ellipse);-webkit-mask-composite:source-in,source-over;mask-composite:intersect,add;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;opacity:min(var(--alpha),var(--fill) * 1000)}.liquid__band[data-key=base]{--c: color-mix(in srgb, var(--cb) var(--pickup, var(--liq-pickup)), var(--c0))}.liquid__band--blend[data-key=base]{background:color-mix(in srgb,var(--c) var(--zone-mix, var(--liq-blend)),var(--cb))}.liquid__band--body{--liq-mask: var(--liq-gaps);background:var(--c)}.liquid__band--tint{--alpha: calc(.6 * var(--ta));mix-blend-mode:multiply;background:var(--c)}.liquid__band--tint.liquid__band--milky{--alpha: var(--liq-ice-cover);mix-blend-mode:normal}.liquid__band--over{--edge-h: calc(var(--ramp) * 1.3);-webkit-mask-image:var(--liq-mask),var(--box),var(--ellipse),var(--liq-edge);mask-image:var(--liq-mask),var(--box),var(--ellipse),var(--liq-edge);-webkit-mask-composite:source-in,source-over,source-over;mask-composite:intersect,add,add;-webkit-mask-size:100% 100%,100% 100%,100% 100%,var(--liq-edge-w) var(--edge-h);mask-size:100% 100%,100% 100%,100% 100%,var(--liq-edge-w) var(--edge-h);-webkit-mask-repeat:no-repeat,no-repeat,no-repeat,repeat-x;mask-repeat:no-repeat,no-repeat,no-repeat,repeat-x;-webkit-mask-position:0 0,0 0,0 0,var(--wob) var(--ya);mask-position:0 0,0 0,0 0,var(--wob) var(--ya)}.liquid__band--blend{--zone: calc(var(--span) * var(--band-below-v) * var(--liq-mix) * var(--fill));--yz: calc(var(--y0) + var(--zone));background:color-mix(in srgb,var(--c) var(--liq-blend),var(--cb));-webkit-mask-image:var(--liq-gaps),linear-gradient(to bottom,transparent calc(var(--ya) - var(--ramp) / 2),black var(--ya),black var(--y0),transparent var(--yz)),var(--liq-edge);mask-image:var(--liq-gaps),linear-gradient(to bottom,transparent calc(var(--ya) - var(--ramp) / 2),black var(--ya),black var(--y0),transparent var(--yz)),var(--liq-edge);-webkit-mask-composite:source-in,source-over;mask-composite:intersect,add;-webkit-mask-size:100% 100%,100% 100%,var(--liq-edge-w) calc(var(--zone) * 1.4);mask-size:100% 100%,100% 100%,var(--liq-edge-w) calc(var(--zone) * 1.4);-webkit-mask-repeat:no-repeat,no-repeat,repeat-x;mask-repeat:no-repeat,no-repeat,repeat-x;-webkit-mask-position:0 0,0 0,calc(var(--wob) * -.6 + var(--liq-edge-w) / 2) var(--y0);mask-position:0 0,0 0,calc(var(--wob) * -.6 + var(--liq-edge-w) / 2) var(--y0)}.liquid__band--surface{--alpha: .7;-webkit-mask-image:var(--liq-mask),var(--ellipse);mask-image:var(--liq-mask),var(--ellipse);-webkit-mask-composite:source-in;mask-composite:intersect;opacity:min(var(--alpha),var(--fill) * 1000,1 - var(--fill-next) * 8);background:radial-gradient(var(--rx) var(--ry) at 50% calc(var(--y) - var(--liq-meniscus)),transparent calc(100% - 1px),color-mix(in srgb,color-mix(in srgb,var(--c) 45%,black) calc((1 - var(--ta)) * 100%),transparent) 100%),radial-gradient(var(--rx) var(--ry) at 50% var(--y),color-mix(in srgb,var(--c) 78%,white) 0 76%,color-mix(in srgb,var(--c) 40%,white) 94%,rgba(255,255,255,.9) 100%)}.liquid__band[data-key=coffee]{--liq-blend: 85%;--liq-alpha: .92}.liquid__band--tint[data-key=coffee]{--alpha: .82}.liquid__band--blend[data-key=coffee]{background:color-mix(in srgb,var(--liquid-coffee-thin) var(--liq-blend),var(--cb))}.liquid__band--blend[data-key=cream]{background:color-mix(in srgb,var(--c) var(--liq-blend),var(--liquid-coffee-thin))}html.lite .liquid__gloss,html.lite .liquid__band--blend{display:none}html.lite .liquid__band--over{-webkit-mask-image:var(--liq-mask),var(--box),var(--ellipse);mask-image:var(--liq-mask),var(--box),var(--ellipse);-webkit-mask-composite:source-in,source-over;mask-composite:intersect,add;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:0 0;mask-position:0 0}.start{position:absolute;top:0;right:0;bottom:0;left:0}.start-headline{position:absolute;left:0;right:0;top:calc(var(--u) * 827);margin:0;text-align:center;color:var(--ink);font:calc(var(--u) * 43) / calc(var(--u) * 43) var(--font-body-bold)}.start-hero-bottle,.start-hero-glass,.start-bottles{position:absolute;display:block}.start-hero-bottle{left:calc(var(--u) * -65);top:calc(var(--u) * 1117);width:calc(var(--u) * 737);transform-origin:calc(var(--u) * 497) calc(var(--u) * 278)}.start-hero-glass{left:calc(var(--u) * -65);top:calc(var(--u) * 1395);width:calc(var(--u) * 737)}.start-bottles{left:calc(var(--u) * 558);top:calc(var(--u) * 1237);width:calc(var(--u) * 392)}.menu__sub{position:absolute;left:0;width:100%;top:calc(var(--u) * 748);margin:0;text-align:center;color:var(--white);white-space:nowrap;font:calc(var(--u) * 45.4) / calc(var(--u) * 45.4) var(--font-body-bold);pointer-events:none}.drink-card.is-picked{outline:calc(var(--u) * 6) solid var(--teal-brand)}.ice{position:absolute;top:0;right:0;bottom:0;left:0}.ice-tray{position:absolute;left:calc(var(--u) * 100);top:calc(var(--u) * 617);width:calc(var(--u) * 866)}.ice-glass{position:absolute;left:calc(var(--u) * 178);top:calc(var(--u) * 1216);width:calc(var(--u) * 715);--liq-top: calc(var(--u) * 96);--liq-floor: calc(var(--u) * 708);--liq-w-top: calc(var(--u) * 674);--liq-w-floor: calc(var(--u) * 585)}.ice-glass--gloss{mix-blend-mode:screen;opacity:.35}.ice-cubes{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.95;-webkit-mask-image:url(../assets/img/ice-liquid-mask.webp),linear-gradient(#000,#000);mask-image:url(../assets/img/ice-liquid-mask.webp),linear-gradient(#000,#000);-webkit-mask-size:calc(var(--u) * 715) calc(var(--u) * 708),100% calc(var(--u) * (1216 + 96));mask-size:calc(var(--u) * 715) calc(var(--u) * 708),100% calc(var(--u) * (1216 + 96));-webkit-mask-position:calc(var(--u) * 178) calc(var(--u) * 1216),0 0;mask-position:calc(var(--u) * 178) calc(var(--u) * 1216),0 0;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.ice-cube{position:absolute;left:calc(var(--u) * var(--cx));top:calc(var(--u) * var(--cy));width:calc(var(--u) * 200);transform:translate(-50%,-50%) scale(var(--s, 1)) scaleX(var(--fx, 1));opacity:var(--b, 1);z-index:var(--z, 0);pointer-events:none}.ice-cube>img{display:block;width:100%}.ice-pips{position:absolute;left:0;right:0;top:calc(var(--u) * 1118);display:flex;justify-content:center;gap:calc(var(--u) * 18);pointer-events:none}.ice-pip{width:calc(var(--u) * 38);height:calc(var(--u) * 38);border:calc(var(--u) * 5) solid var(--white);border-radius:calc(var(--u) * 10);background:#00000059;box-shadow:0 0 0 calc(var(--u) * 3) #00000073,0 calc(var(--u) * 2) calc(var(--u) * 6) #00000080;transition:background .2s}.ice-pip.is-on{background:var(--white)}.pour{position:absolute;top:0;right:0;bottom:0;left:0;cursor:pointer}.pour>*{pointer-events:none}.pour__liquid{height:calc(var(--u) * 622);--liq-top: calc(var(--u) * 90);--liq-floor: calc(var(--u) * 622);--liq-w-top: calc(var(--u) * 654);--liq-w-floor: calc(var(--u) * 577);--liq-ry: .078}.pour__vessel{position:absolute;transform-origin:50% 50%}.pour__vessel>img{display:block;width:100%}.pour__stream{position:absolute;width:calc(var(--u) * 16);left:calc(var(--u) * (var(--mx) - 8));top:calc(var(--u) * var(--my));transform-origin:50% 0}.pour__vessel--base .pour__stream{height:calc(var(--u) * 380)}.pour__vessel--syrup .pour__stream{height:calc(var(--u) * 420)}.pour__stream-fill{width:100%;height:100%;transform:scaleY(0);transform-origin:50% 0;opacity:0;clip-path:polygon(30% 0,70% 0,100% 8%,100% 100%,0 100%,0 8%);background:linear-gradient(180deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%) 0 100% / 100% 300% no-repeat,linear-gradient(90deg,#00000038,#ffffff80 32%,#ffffff14 55%,#00000040),color-mix(in srgb,var(--pour-c) 90%,transparent);-webkit-mask-image:linear-gradient(to bottom,black 65%,transparent);mask-image:linear-gradient(to bottom,black 65%,transparent);animation:pour-glide .55s linear infinite}@keyframes pour-glide{0%{background-position:0 100%}to{background-position:0 0}}.pour__drop{position:absolute;left:calc(var(--u) * (var(--mx) - 8));top:calc(var(--u) * var(--my));width:calc(var(--u) * 16);height:calc(var(--u) * 24);border-radius:50%/40% 40% 60% 60%;background:var(--pour-c);opacity:0}.mix{position:absolute;top:0;right:0;bottom:0;left:0}.mix-glass{left:calc(var(--u) * 203);top:calc(var(--u) * 1230);width:calc(var(--u) * 739);height:calc(var(--u) * 1271);--liq-top: calc(var(--u) * 95);--liq-floor: calc(var(--u) * 1049);--liq-w-top: calc(var(--u) * 697);--liq-w-floor: calc(var(--u) * 544);--liq-ry: .078}.mix-stream{position:absolute;left:0;top:0;width:calc(var(--u) * 14);height:calc(var(--u) * 240);transform-origin:50% 0;opacity:0;pointer-events:none;clip-path:polygon(0 0,100% 0,72% 100%,28% 100%);background:linear-gradient(180deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%) 0 100% / 100% 300% no-repeat,linear-gradient(90deg,#00000038,#ffffff80 32%,#ffffff14 55%,#00000040),color-mix(in srgb,var(--tint) 90%,transparent);-webkit-mask-image:linear-gradient(to bottom,black 65%,transparent);mask-image:linear-gradient(to bottom,black 65%,transparent);animation:mix-glide .55s linear infinite}@keyframes mix-glide{0%{background-position:0 100%}to{background-position:0 0}}.mix-vessel{position:absolute;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}.mix-vessel>img{display:block;width:100%;height:100%;-webkit-user-drag:none;transition:filter .15s}.mix-vessel.is-lifted{cursor:grabbing}.mix-vessel.is-lifted>img{filter:drop-shadow(0 calc(var(--u) * 24) calc(var(--u) * 22) rgba(0,0,0,.35))}.mix-chevron{position:absolute;pointer-events:none;opacity:0;overflow:visible}.mix-chevron path{fill:none;stroke:#ffffffd9;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}.mix-target-bowl{position:absolute;left:calc(var(--u) * 150);top:calc(var(--u) * 1395);width:calc(var(--u) * 781);height:calc(var(--u) * 487);--fill-coffee: 0;--fill-cream: 0;--pool-max: .6;--pool-drop: 30}.mix-target-bowl>img{display:block;width:100%;height:100%;-webkit-user-drag:none}.mix-bowl-fill{position:absolute;left:1.1%;top:.4%;width:97.8%;height:33.8%;border-radius:50%;transform:translateY(calc((var(--pool-drop) + (1 - var(--f)) * var(--pool-sink)) * var(--u))) scale(calc(.25 + (var(--pool-max) - .25) * var(--f)));--pool-sink: 40;opacity:clamp(0,calc(var(--f) * 8),1);box-shadow:inset 0 calc(var(--u) * 10) calc(var(--u) * 24) #00000059;pointer-events:none}.mix-bowl-fill--coffee{--f: var(--fill-coffee);background:var(--bowl-coffee)}.mix-bowl-fill--cream{--f: var(--fill-cream);--pool-max: .5;--pool-sink: 0;background:radial-gradient(ellipse at 45% 35%,#fff 0%,var(--bowl-cream) 55%,color-mix(in srgb,var(--bowl-cream) 80%,var(--bowl-coffee)) 100%)}.mix--bowl .mix-stream--coffee{height:calc(var(--u) * 170)}.mix--bowl .mix-stream--cream{height:calc(var(--u) * 520)}.stir{position:absolute;top:0;right:0;bottom:0;left:0;cursor:grab;--stir-pickup: 30%;--stir-milk: color-mix(in srgb, var(--stir-syrup) var(--stir-pickup), var(--stir-base));--stir-mixed: color-mix(in srgb, var(--stir-syrup) 70%, var(--stir-base))}.stir--cream{--stir-mixed: color-mix(in srgb, color-mix(in srgb, var(--liquid-coffee-thin) 70%, color-mix(in srgb, var(--stir-base), var(--stir-cream))) 90%, var(--stir-syrup))}.stir__shade{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000073}.stir__ring{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;fill:none;pointer-events:none}.stir__ring-track{stroke:#ffffff59;stroke-width:10}.stir__ring-fill{stroke:var(--teal-brand);stroke-width:10;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1}.stir__glass{position:absolute;left:calc(var(--u) * 125);top:calc(var(--u) * 729);width:calc(var(--u) * 810);height:calc(var(--u) * 810);will-change:transform}.stir__img{position:absolute;left:0;top:calc(var(--u) * -241);width:calc(var(--u) * 811)}.stir__liquid{position:absolute;inset:calc(var(--u) * 50);border-radius:50%;overflow:hidden}.stir__liquid:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;box-shadow:inset 0 0 calc(var(--u) * 40) calc(var(--u) * 6) #0000008c;pointer-events:none}.stir__layer{position:absolute;inset:calc(var(--u) * -30);border-radius:50%;mix-blend-mode:screen}.stir__layer--layered{background:conic-gradient(from 20deg,transparent 0% 6%,var(--stir-syrup) 12% 20%,transparent 26% 38%,var(--stir-milk) 44% 52%,transparent 58% 68%,var(--stir-syrup) 73% 80%,transparent 86% 100%);filter:blur(calc(var(--u) * 16));opacity:.85}.stir--cream .stir__layer--layered{background:radial-gradient(circle at 50% 50%,var(--stir-cream) 0% 18%,transparent 38%),conic-gradient(from 20deg,transparent 0% 6%,var(--stir-syrup) 12% 20%,transparent 26% 38%,var(--stir-milk) 44% 52%,transparent 58% 68%,var(--stir-syrup) 73% 80%,transparent 86% 100%)}.stir__layer--mixed{background:color-mix(in srgb,var(--stir-mixed) 70%,transparent);opacity:0}.stir--cream .stir__layer--mixed{background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--stir-mixed) 90%,transparent) 0,color-mix(in srgb,var(--stir-mixed) 90%,transparent) 60%,color-mix(in srgb,var(--stir-milk) 92%,transparent) 74%,color-mix(in srgb,var(--stir-milk) 92%,transparent))}.stir--bowl .stir__img{position:absolute;left:0;top:0;width:100%;height:100%}.stir--bowl .stir__liquid{top:6.5%;right:3.8%;bottom:3.3%;left:3.1%}.stir--bowl .stir__liquid:after{box-shadow:inset 0 0 calc(var(--u) * 30) calc(var(--u) * 4) #0006}.stir--bowl .stir__layer--layered{mix-blend-mode:normal;opacity:1;filter:blur(calc(var(--u) * 8));background:radial-gradient(ellipse 46% 40% at 47% 44%,var(--stir-bowl-cream) 0% 55%,transparent 100%),var(--stir-bowl-coffee)}.stir--bowl .stir__layer--mixed{background:none}.stir__frother{position:absolute;transform-origin:60% 100%;pointer-events:none;will-change:transform;filter:drop-shadow(0 calc(var(--u) * 16) calc(var(--u) * 18) rgba(0,0,0,.35));-webkit-user-drag:none}.pour2-glass{position:absolute;--gx: 197;--gy: 1286;left:calc(var(--u) * var(--gx));top:calc(var(--u) * var(--gy));width:calc(var(--u) * 696);height:calc(var(--u) * 1163);--fill-foam: 0;--rim: 147}.pour2-glass>img{display:block;-webkit-user-drag:none}.pour2-milk{width:100%;height:100%}.pour2-foam{position:absolute;left:calc(var(--u) * (var(--cup-x) - var(--gx)));top:calc(var(--u) * (var(--cup-y) - var(--gy)));width:calc(var(--u) * var(--cup-w));pointer-events:none}.pour2-foam--in{clip-path:inset(calc(var(--u) * var(--rim)) 0 0 0);opacity:clamp(0,calc((var(--fill-foam) - .4) / .6),1)}.pour2-foam--top{--edge: calc(var(--u) * var(--rim) * (1 - var(--fill-foam)));-webkit-mask-image:linear-gradient(to bottom,transparent calc(var(--edge) - var(--u) * 40),black var(--edge),black calc(var(--u) * var(--rim)),transparent calc(var(--u) * var(--rim)));mask-image:linear-gradient(to bottom,transparent calc(var(--edge) - var(--u) * 40),black var(--edge),black calc(var(--u) * var(--rim)),transparent calc(var(--u) * var(--rim)));opacity:clamp(0,calc(var(--fill-foam) * 6),1)}.pour2 .mix-stream{display:none}.cipta{position:absolute;top:0;right:0;bottom:0;left:0}.cipta .arch{z-index:0}.cipta .bubble{z-index:4}.cipta-cup,.cipta-final,.cipta-placed,.cipta-topping{position:absolute;left:calc(var(--u) * var(--x));top:calc(var(--u) * var(--y));width:calc(var(--u) * var(--w))}.cipta-cup{z-index:1;height:auto}.cipta .cipta-handoff{z-index:1;pointer-events:none;transform-origin:0 0}.cipta-final,.cipta-placed{z-index:2;height:auto;pointer-events:none;opacity:0;visibility:hidden}.cipta-topping{z-index:3;cursor:grab;touch-action:none}.cipta-topping:before{content:"";position:absolute;inset:calc(var(--u) * -40)}.cipta-topping>img{display:block;width:100%}.cipta-topping.is-dragging{z-index:5;cursor:grabbing;filter:drop-shadow(0 calc(var(--u) * 20) calc(var(--u) * 18) rgba(0,0,0,.35))}.cipta-topping.is-placed{z-index:2;pointer-events:none}.cipta .cipta-siap{display:none;z-index:4;top:calc(var(--u) * 1690)}.cipta .cipta-siap.is-on{display:flex}.result{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.result__title{position:absolute;left:0;width:100%;top:calc(var(--u) * 283);margin:0;text-align:center;white-space:nowrap;color:var(--white);font:calc(var(--u) * 171.8) / calc(var(--u) * 175.2) var(--font-display);text-shadow:calc(var(--u) * 11.2) calc(var(--u) * 3.2) 0 var(--teal-title-shadow);transform-origin:50% 50%;pointer-events:none}.result__title>span{display:block}.result__bottle,.result__cup{position:absolute;display:block}.result__cup{transform-origin:50% 90%}.result .slide{top:calc(var(--u) * 1770)}.result__confetti{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.result__particle{position:absolute;left:calc(var(--u) * 540);top:calc(var(--u) * 800);width:calc(var(--u) * 26);height:calc(var(--u) * 40);margin-left:calc(var(--u) * -13);margin-top:calc(var(--u) * -20);border-radius:calc(var(--u) * 6);background:var(--c);opacity:0}