.ui-icon{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;line-height:0;flex:0 0 auto;vertical-align:middle}.ui-icon svg{display:block;width:100%;height:100%;overflow:visible}.add-button,.remove-btn,.drawer-close,.circle-nav,.view-button{display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:0!important;text-align:center;line-height:0!important}.menu-toggle{align-items:center;justify-content:center;padding:0!important;text-align:center;line-height:0!important}.add-button .ui-icon,.remove-btn .ui-icon,.drawer-close .ui-icon{width:28px;height:28px}.back-to-top{padding:0!important;align-items:center;justify-content:center}.icon-arrow{align-items:center;justify-content:center;line-height:0}.icon-arrow svg{display:block}.world-arrow{display:grid;place-items:center;line-height:1}.bag-indicator,.step .number,.heat-steps li:before{display:grid;place-items:center;line-height:1}.search-box>.ui-icon{width:23px;height:23px}.btn .ui-icon{width:24px;height:24px}.heat-tooltip,.heat-badge{display:none!important}.pack-steam{top:4px;left:22%;right:22%;height:135px;opacity:1;gap:6px}.pack-steam i{width:8px;height:90px;flex-shrink:0;background:linear-gradient(transparent 2%,#fffdf3 42%,#fffdf3c9 70%,transparent);filter:drop-shadow(0 0 5px #fff8);animation:strong-steam 1.8s ease-out infinite}.pack-steam i:nth-child(2n){animation-delay:-.7s;height:110px}.pack-steam i:nth-child(3n){animation-delay:-1.3s}.pack-steam i:nth-child(4n){animation-delay:-.3s;width:11px}@keyframes strong-steam{0%{opacity:0;transform:translateY(33px) scaleX(.7) rotate(-7deg)}25%{opacity:.95}70%{opacity:.7}100%{opacity:0;transform:translateY(-65px) scaleX(1.5) rotate(9deg)}}
.prep-section{margin:65px 0 30px;padding:35px;background:#e3efc8;border:2px solid #193d2d;border-radius:28px}.prep-heading{max-width:950px;margin:0 auto 26px}.prep-heading h2{font-size:clamp(2rem,4.2vw,4.8rem);margin:15px 0}.prep-water-note{font-weight:800;font-size:1rem;line-height:1.5}.prep-stage{position:relative;isolation:isolate;overflow:hidden;height:560px;max-width:1060px;margin:auto;background:radial-gradient(ellipse at 50% 73%,#ad87d1,#7652a0 63%);border:3px solid #20362a;border-radius:25px}.prep-stage:before{content:'';position:absolute;inset:-40%;background:repeating-conic-gradient(from 12deg at 50% 67%,transparent 0deg 10deg,#f9eaff16 10deg 12deg,transparent 12deg 22deg);pointer-events:none}.prep-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none}.prep-product{position:absolute;left:50%;bottom:70px;transform:translateX(-50%);height:285px;width:55%;object-fit:contain;filter:drop-shadow(0 15px 10px #1d18375c);z-index:3}.prep-water-label{position:absolute;right:18px;top:18px;padding:10px 17px;border:2px solid #173d2b;border-radius:30px;background:#bceafa;color:#173d2b;font-weight:950;font-size:.85rem;max-width:55%;text-align:center;line-height:1.3;z-index:7}.prep-water-label.hot{background:#ffcf83}.prep-clock{position:absolute;top:24px;left:24px;z-index:8;color:#fff7e8;display:grid;grid-template-columns:43px auto;gap:8px;align-items:center}.prep-clock svg{width:43px;height:43px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round}.prep-clock strong{font:900 2.1rem/1 monospace;letter-spacing:-.08em;font-variant-numeric:tabular-nums}.prep-clock small{grid-column:1/-1;font-size:.65rem;font-weight:800;max-width:170px}.prep-jug{position:absolute;top:100px;right:7%;width:190px;transform-origin:65% 65%;z-index:6;transition:transform .6s}.prep-jug svg{width:100%;display:block}.jug-bubbles{position:absolute;top:2px;left:47%;color:#fff9dc;font-size:32px;font-weight:900;letter-spacing:5px;opacity:0}.prep-stage[data-phase=boil] .jug-bubbles{opacity:1;animation:jug-boil .5s infinite alternate}.prep-stage[data-phase=pour] .prep-jug{transform:rotate(-29deg)}.prep-stage[data-phase=heat] .prep-jug,.prep-stage[data-phase=ready] .prep-jug{transform:translate(230px,-100px) rotate(15deg);opacity:0;transition:transform .7s,opacity .5s}.prep-target{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);width:35%;height:32px;border:3px solid #f5f9de;border-top-style:dashed;border-radius:8px 8px 20px 20px;background:#35334c;z-index:4}.prep-section[data-prep-mode=hot] .prep-target{display:none}.prep-target-caption{position:absolute;top:5px;left:0;right:0;text-align:center;color:#bff4fb;font-size:.6rem;letter-spacing:.1em;font-weight:900}.manga-callout{position:absolute;bottom:10px;right:20px;z-index:8;padding:15px 20px;background:#fff397;color:#1e3025;font:900 clamp(1.4rem,3vw,2.5rem)/1 var(--display);text-shadow:2px 2px #fff;border:3px solid #172d23;transform:rotate(-7deg);box-shadow:6px 6px 0 #172d23;clip-path:polygon(7% 0,91% 4%,100% 21%,96% 74%,100% 92%,17% 100%,0 87%,5% 64%,0 15%)}.prep-stage[data-phase=idle] .manga-callout{visibility:hidden}.prep-stage[data-phase=heat] .prep-product{animation:product-simmer .24s infinite alternate,hot-glow 1s infinite alternate}.prep-stage[data-phase=heat] .manga-callout{animation:manga-pop .8s infinite alternate}.prep-ready{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%) scale(.3) rotate(-9deg);z-index:10;background:#d8ff77;border:4px solid #183728;border-radius:25px;padding:24px 35px;color:#183728;text-align:center;font:900 clamp(1.6rem,4vw,3.6rem)/1.03 var(--display);width:max-content;max-width:85%;opacity:0;pointer-events:none;box-shadow:8px 9px 0 #183728}.prep-ready b{display:block;margin-top:12px;font-size:.46em;letter-spacing:.08em}.prep-stage[data-phase=ready] .prep-ready{animation:ready-pop .5s cubic-bezier(.2,1.9,.5,1) forwards}.prep-stage[data-phase=ready] .manga-callout{opacity:0}.prep-controls{max-width:1060px;margin:20px auto 0;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.prep-sound{border:2px solid #193d2d;border-radius:25px;background:transparent;font-weight:850;padding:11px 17px}.prep-sound[aria-pressed=true]{background:#d3f672}.prep-status{font-size:.8rem;font-weight:850}.prep-note{max-width:1060px;margin:16px auto 0;font-size:.78rem;color:#425b42}.prep-stage[data-phase=heat] .prep-clock svg{animation:timer-pulse .65s infinite alternate}@keyframes jug-boil{from{transform:translateY(2px)}to{transform:translateY(-10px)}}@keyframes product-simmer{from{translate:-2px 0;rotate:-.4deg}to{translate:2px -2px;rotate:.4deg}}@keyframes hot-glow{from{filter:drop-shadow(0 15px 10px #1d18375c)}to{filter:drop-shadow(0 0 25px #ffd979bf)}}@keyframes manga-pop{to{scale:1.05;rotate:3deg}}@keyframes ready-pop{to{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-5deg)}}@keyframes timer-pulse{to{scale:1.08}}
@media(max-width:700px){.prep-section{padding:18px;margin-top:35px}.prep-stage{height:470px}.prep-product{height:215px;bottom:74px;width:74%}.prep-jug{width:132px;top:126px;right:3%}.prep-clock{top:20px;left:15px;gap:5px}.prep-clock strong{font-size:1.8rem}.prep-clock svg{width:33px;height:33px}.prep-clock{grid-template-columns:33px auto}.prep-clock small{max-width:125px;font-size:.58rem}.prep-water-label{top:22px;right:8px;font-size:.63rem;padding:8px 10px;max-width:47%}.manga-callout{bottom:4px;right:8px;font-size:1.5rem}.prep-target{width:52%;bottom:34px}.prep-controls .btn{font-size:.72rem}.prep-ready{padding:20px}.pack-steam{left:18%;right:18%;gap:3px}.pack-steam i{width:5px}.prep-heading h2{font-size:2.25rem}}
@media(prefers-reduced-motion:reduce){.pack-steam i{animation:none!important;opacity:.5;transform:none}.prep-stage *{animation:none!important;transition:none!important}.prep-stage[data-phase=ready] .prep-ready{opacity:1;transform:translate(-50%,-50%) rotate(-5deg)}}
.detail-image.has-prep{display:block;height:auto!important;min-height:0;overflow:visible;background:transparent;border-radius:0}.detail-image.has-prep:after{display:none}.detail-image.has-prep .prep-section{margin:0;padding:20px}.has-prep .prep-heading h2{font-size:clamp(1.7rem,2.6vw,2.6rem)}.has-prep .prep-stage{height:490px}.detail-image.has-prep .prep-product{position:absolute;width:67%;height:245px;bottom:72px;left:50%;transform:translateX(-50%);animation:none;z-index:3}.detail-image.has-prep [data-phase=heat] .prep-product{animation:product-simmer .24s infinite alternate,hot-glow 1s infinite alternate}.has-prep .prep-jug{width:150px;top:125px;right:4%}.has-prep .prep-water-label{font-size:.68rem;max-width:47%;padding:9px}.has-prep .prep-water-note{font-size:.86rem}.has-prep .manga-callout{font-size:1.8rem}.has-prep .prep-ready{font-size:2.3rem}.has-prep .prep-controls .btn{font-size:.7rem;padding:13px 18px}.has-prep .prep-note{font-size:.75rem}.has-prep .prep-clock{left:16px;top:22px}.has-prep .prep-clock strong{font-size:1.8rem}.has-prep .prep-clock svg{width:35px;height:35px}.has-prep .prep-clock{grid-template-columns:35px auto}.has-prep .prep-clock small{max-width:150px;font-size:.58rem}@media(max-width:700px){.detail-image.has-prep .prep-section{padding:15px}.detail-image.has-prep .prep-product{height:210px;width:75%}.has-prep .prep-jug{width:126px;right:2%;top:133px}.has-prep .prep-stage{height:450px}.has-prep .prep-clock small{max-width:125px}.has-prep .prep-ready{font-size:1.75rem}}

/* Floating pitcher above the packaging, positioned to match the marked reference. */
.prep-jug,.has-prep .prep-jug{top:27px;right:16%;width:140px}
@media(max-width:700px){.prep-jug,.has-prep .prep-jug{top:28px;right:14%;width:105px}.has-prep .prep-water-label{top:108px;right:9px;font-size:.63rem;max-width:48%}}