/* Tactile, restrained depth. */
.button{border:1px solid transparent;transition:transform .2s,box-shadow .2s,background .2s}
.yellow{border-color:#ffe98a;box-shadow:0 5px 0 #a87518,inset 0 2px 0 #ffffff59,0 10px 18px #250f452b}
.yellow:hover{transform:translateY(-3px);box-shadow:0 8px 0 #a87518,inset 0 2px 0 #ffffff65,0 14px 24px #250f452e}
.purple-button{border-color:#765299;box-shadow:0 5px 0 #28113f,inset 0 2px 0 #ffffff18,0 8px 13px #29134524}
.purple-button:hover{box-shadow:0 8px 0 #28113f,inset 0 2px 0 #ffffff20,0 12px 18px #2913452e}
.button:active{transform:translateY(3px);box-shadow:0 2px 0 #28113f,inset 0 1px 0 #ffffff22}
.hero h1{text-shadow:0 3px 0 #2b174a,0 10px 24px #2913452a}
.hero h1>span,.last-call h2>span{text-shadow:0 3px 0 #9c6c28,0 9px 18px #29134533}
.menu-section h2 span,.store-copy h2 span{text-shadow:0 3px 0 #d9c8e8}
.builder h2 span,.story-copy h2 span{text-shadow:0 3px 0 #8c6027}
.product-plus{box-shadow:0 4px 0 #9a7ab4;transition:transform .25s,box-shadow .25s}
.product-image:hover .product-plus{transform:translateY(-3px);box-shadow:0 7px 0 #9a7ab4}
.combo-body button{box-shadow:0 4px 0 #28113f}
.product-image{box-shadow:inset 0 1px 0 #ffffff70,0 7px 0 #49227a0a}
.builder-panel{box-shadow:0 10px 0 #29124359,0 24px 45px #29124336}

/* Soft section boundaries; no decorative movement over the content. */
.hero{padding-bottom:23px}.hero::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:36px;background:url('assets/wave-yellow.svg') center bottom/100% 100% no-repeat;pointer-events:none}
.brand-story{position:relative}.brand-story::before{content:'';position:absolute;left:0;right:0;top:-1px;height:53px;z-index:3;background:url('assets/wave-cream.svg') center/100% 100% no-repeat;pointer-events:none}
.combos-section{position:relative;padding-top:135px}.combos-section::before{content:'';position:absolute;top:-1px;left:0;right:0;height:81px;background:url('assets/drip-purple.svg') center/100% 100% no-repeat;pointer-events:none}
.store-section{position:relative;padding-top:120px}.store-section::before{content:'';position:absolute;top:-1px;left:0;right:0;height:48px;background:url('assets/wave-lilac.svg') center/100% 100% no-repeat;pointer-events:none}

/* The entire cup and its food layers scale together, preserving alignment. */
.builder-art{height:690px;overflow:visible;isolation:isolate}
.builder-lettering{font-size:105px;top:130px;opacity:.85}
.live-cup{--cup-scale:1;position:absolute;width:min(100%,485px);aspect-ratio:1;left:50%;bottom:135px;transform:translateX(-50%) rotate(-3deg) scale(var(--cup-scale));transform-origin:center 96%;transition:transform .65s cubic-bezier(.22,.8,.25,1.25);z-index:2;filter:drop-shadow(0 16px 12px #21113655)}
.cup-base{width:100%;height:100%;object-fit:contain;max-width:none;position:absolute;inset:0}
.cup-ingredients{position:absolute;inset:0;pointer-events:none}
.ingredient{position:absolute;left:50%;top:25%;width:39%;height:23%;background-image:url('assets/toppings-atlas.png');background-size:400% 200%;background-repeat:no-repeat;opacity:0;transform:translate(-50%,-65%) scale(.65);transition:opacity .2s,transform .5s cubic-bezier(.18,.85,.35,1.25);filter:drop-shadow(0 2px 1px #25103115);transform-origin:center bottom}
.ingredient.active{opacity:1;transform:translate(-50%,-50%) scale(1)}
.ingredient-powder{background-position:0% 0%;left:43%;top:25%;width:45%;height:24%;z-index:3}
.ingredient-condensed{background-position:33.333333% 0%;left:51%;top:28%;width:63%;height:26%;z-index:9}
.ingredient-peanut{background-position:66.666667% 0%;left:38%;top:27%;width:39%;height:22%;z-index:6}
.ingredient-malt{background-position:100% 0%;left:61%;top:27%;width:36%;height:22%;z-index:6}
.ingredient-strawberry{background-position:0% 100%;left:36%;top:23%;width:35%;height:27%;z-index:5}
.ingredient-milk{background-position:33.333333% 100%;left:50%;top:23%;width:35%;height:27%;z-index:4}
.ingredient-chocolate{background-position:66.666667% 100%;left:65%;top:24%;width:34%;height:25%;z-index:5}
.ingredient-candy{background-position:100% 100%;left:53%;top:28%;width:50%;height:25%;z-index:10}
.cup-platform{position:absolute;left:50%;bottom:115px;width:76%;height:28px;border-radius:50%;background:#28104466;filter:blur(13px);transform:translateX(-50%);z-index:0;transition:width .5s}
.builder-sticker{bottom:155px;right:5px;width:113px;height:113px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;box-shadow:0 4px 0 #a87518,0 0 0 8px #49227a,0 0 0 9px #ad88d4;z-index:3}
.builder-sticker strong{font-family:var(--display);font-size:30px;line-height:1;letter-spacing:-1px}
.builder-sticker small{font-family:var(--body);font-size:8px;font-weight:750;letter-spacing:0;line-height:1.3}
.live-recipe{position:absolute;bottom:0;left:0;right:0;text-align:center;z-index:3;min-height:95px}
.live-recipe-label{font-size:8px;font-weight:750;letter-spacing:1px;color:#c6a7df}
.live-recipe p{font-size:11px;color:#f7eafb;margin-top:11px;line-height:1.6}
#live-chips{display:flex;gap:5px;justify-content:center;flex-wrap:wrap;margin-top:12px;padding:0 15px}
#live-chips span{font-size:8px;padding:5px 9px;color:#fff0c7;background:#ffffff10;border:1px solid #ad89c973;border-radius:30px;animation:chip-in .3s ease}
.toppings label>span{display:flex;flex-direction:column;gap:4px;line-height:1.3}
.topping-price{font-size:8px;font-weight:600;color:#a18aa8}
.toppings label.chosen .topping-price{color:#6c3e8e}
.quantity-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:22px;margin-top:18px;border-top:1px solid #d7c9e2}
.quantity-row>span{font-size:11px;line-height:1.5;font-weight:650;max-width:180px}
.quantity-control{display:flex;align-items:center;gap:4px;border:1px solid #d7c9e2;border-radius:25px;padding:3px}
.quantity-control button{width:31px;height:31px;border:0;border-radius:50%;background:#e9def2;color:#49227a;font-size:17px;font-weight:600;transition:background .2s}
.quantity-control button:hover:not(:disabled){background:#ceb3e0}
.quantity-control button:disabled{opacity:.35;cursor:default}
.quantity-control output{display:block;width:28px;text-align:center;font-size:13px;font-weight:750}
.builder-costs{margin-top:20px;display:grid;gap:9px}
.builder-costs>div{display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#9374a2}
.builder-costs small{font-size:9px;color:#b29bbe;margin-left:3px}
.builder-costs strong{font-size:10px;font-weight:650;color:#76528b}
.builder-summary{margin-top:18px;padding-top:19px}
.builder-summary .base-price strong{font-size:27px}
.price-pop{animation:price-pop .35s ease}
.builder-panel{padding-bottom:28px}
.builder-note{margin-top:15px;color:#9678a3}

/* Review first, then let the customer open their prepared WhatsApp message. */
dialog{max-width:500px;max-height:min(92vh,870px);overflow:auto;scrollbar-width:thin;scrollbar-color:#bba1ce #fffbee}
.dialog-product{margin-bottom:20px}
.dialog-cup-preview{width:100px;height:118px;flex-shrink:0;position:relative;overflow:visible}
.dialog-live-cup{width:140px;bottom:0;left:50%;filter:drop-shadow(0 4px 2px #25113622);transform:translateX(-50%) rotate(-3deg) scale(.92);transition:none}
.dialog-cup-preview .dialog-live-cup{width:140px;max-width:none;bottom:0;left:50%;transform:translateX(-50%) rotate(-3deg) scale(.92)}
.dialog-live-cup .cup-base{width:100%;height:100%;max-width:none;object-fit:contain}
.dialog-live-cup .ingredient{display:block;margin:0;line-height:0}
.dialog-cup-preview>img{width:100%;height:100%;object-fit:contain}
.fulfillment{margin:0 0 20px;padding:0;display:flex;gap:9px;border:0}
.fulfillment legend{font-size:11px;font-weight:750;margin-bottom:11px}
.fulfillment label{cursor:pointer;display:flex;align-items:center;gap:7px;font-size:11px;border:1px solid #d7c9e2;padding:10px 14px;border-radius:4px}
.fulfillment label:has(input:checked){background:#eadef1;border-color:#a681c3}
.fulfillment input{accent-color:#49227a;width:12px;height:12px;margin:0}
.order-notes-label{font-size:11px;font-weight:750;display:flex;justify-content:space-between;margin-bottom:10px}
.order-notes-label>span{font-size:9px;font-weight:400;color:#a58cad}
#order-notes{width:100%;padding:12px;border:1px solid #d7c9e2;background:#fffdf5;color:#49227a;font-size:11px;border-radius:4px;resize:vertical;min-height:64px;max-height:130px;line-height:1.6;font-family:var(--body)}
#order-notes::placeholder{color:#b097bc}
.message-preview{margin-top:20px;max-height:225px;overflow:auto;scrollbar-width:thin;scrollbar-color:#a485bb #eadef0}
#message-content{white-space:pre-wrap;line-height:1.7;font-size:10px;user-select:text;overflow-wrap:anywhere}
.whatsapp-button{width:100%;background:#16834e;color:#fffbee;border-color:#43a36a;box-shadow:0 5px 0 #095b32,inset 0 2px 0 #ffffff29;font-size:12px}
.whatsapp-button:hover{background:#1b955c;box-shadow:0 8px 0 #095b32,inset 0 2px 0 #ffffff29}
.dialog-secondary{display:flex;justify-content:space-between;gap:20px;margin-top:21px}
.dialog-secondary button{padding:6px 0;font-size:10px;border:0;background:none;color:#9c79aa;text-decoration:underline;text-underline-offset:4px}
.dialog-secondary button:hover{color:#49227a}
@keyframes chip-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes price-pop{0%{opacity:.6;transform:translateY(3px)}100%{opacity:1;transform:none}}
@media(max-width:1180px){.builder-art{height:660px}.live-cup{width:430px;max-width:105%;bottom:140px}.builder-lettering{font-size:94px}.builder-sticker{width:101px;height:101px;right:-5px;bottom:155px}.builder-sticker strong{font-size:27px}.builder-summary .base-price strong{font-size:24px}.quantity-row>span{font-size:10px}}
@media(max-width:900px){.builder-art{height:690px}.live-cup{width:400px;max-width:115%;bottom:160px}.builder-sticker{width:89px;height:89px;bottom:160px}.builder-sticker strong{font-size:25px}.builder-sticker small{font-size:7px}.builder-lettering{font-size:75px;top:175px}.live-recipe{min-height:115px}.live-recipe p{font-size:10px;max-width:250px;margin:10px auto 0}.quantity-row>span{font-size:9px;max-width:140px}.quantity-control button{width:27px;height:27px;font-size:16px}.quantity-control output{width:23px;font-size:11px}.combos-section{padding-top:112px}.store-section{padding-top:100px}.brand-story::before{height:40px}.combos-section::before{height:60px}}
@media(max-width:650px){.hero::after{height:25px}.hero{padding-bottom:17px}.button{box-shadow:0 4px 0 #28113f,inset 0 2px 0 #ffffff25}.yellow{box-shadow:0 4px 0 #a87518,inset 0 2px 0 #ffffff59}.hero h1{text-shadow:0 2px 0 #2b174a,0 7px 15px #29134522}.hero h1>span,.last-call h2>span{text-shadow:0 2px 0 #9c6c28}.brand-story::before{height:31px}.builder-art{height:445px;margin-top:4px;margin-bottom:8px}.live-cup{width:355px;max-width:104%;bottom:100px}.builder-lettering{font-size:76px;top:52px;left:2px}.builder-sticker{width:82px;height:82px;right:0;bottom:115px}.builder-sticker strong{font-size:24px}.builder-sticker small{font-size:6px}.live-recipe{bottom:-1px;min-height:75px}.live-recipe-label{font-size:7px;letter-spacing:.7px}.live-recipe p{font-size:10px;margin-top:8px;max-width:300px}#live-chips{padding:0;gap:4px;margin-top:9px}#live-chips span{font-size:7px;padding:4px 7px}.cup-platform{bottom:81px;width:73%;height:22px}.builder-panel{padding:27px 21px}.quantity-row>span{font-size:10px;max-width:160px}.quantity-control button{width:30px;height:30px}.quantity-control output{font-size:12px;width:26px}.topping-price{font-size:8px}.builder-summary .base-price strong{font-size:25px}.builder-costs>div,.builder-costs strong{font-size:10px}.combos-section{padding-top:98px}.combos-section::before{height:50px}.store-section{padding-top:85px}.store-section::before{height:34px}dialog{padding:30px 24px;max-height:92vh}.dialog-product{gap:12px}.dialog-cup-preview{width:86px;height:108px}.dialog-live-cup{width:128px}.fulfillment label{font-size:10px;padding:10px 12px}.message-preview{max-height:195px}.whatsapp-button{font-size:11px;box-shadow:0 4px 0 #095b32}.dialog-secondary{margin-top:19px}.dialog-secondary button{font-size:10px}.builder-note{font-size:8px;line-height:1.7}}
@media(max-width:650px){.builder-art{overflow:clip}.live-cup{width:335px;max-width:100%}.dialog-cup-preview .dialog-live-cup{width:128px;max-width:none;bottom:0}}
@media(prefers-reduced-motion:reduce){.live-cup,.ingredient,.button{transition:none}.price-pop,#live-chips span{animation:none}.button:hover,.button:active{transform:none}}
