/* The kitchen stays spatially consistent from ingredients through serving. */
.moon-kitchen{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) 90px;gap:14px;max-width:900px;margin:auto}
.kitchen-customer{display:flex;align-items:center;gap:12px;min-height:130px}
.moon-customer{width:100px;height:125px;flex-shrink:0;align-self:center}
.moon-customer.surprised{animation:boing .7s ease-out}
.order-card{flex:1;min-width:0;padding:12px;background:var(--cream);color:var(--ink);border-radius:28px;box-shadow:0 7px 0 #7c719d;position:relative;display:flex;flex-direction:column;gap:9px}
.order-card::before{content:'';position:absolute;left:-10px;top:55%;width:21px;height:21px;background:var(--cream);border-radius:50%}
.order-row{display:flex;align-items:center;gap:9px}
.order-row+.order-row{border-top:2px dashed #d8c6aa;padding-top:9px}
.order-quantity{width:44px;flex-shrink:0;position:relative;padding-bottom:23px}
.order-quantity>svg{width:40px;height:40px}.order-quantity b{position:absolute;bottom:0;left:0;width:40px;text-align:center;font-size:23px;line-height:1;font-weight:900}
.order-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;flex:1;max-width:260px}
.order-slots .wanted-food{width:100%;height:auto;aspect-ratio:1;position:relative;min-width:0;max-width:46px;opacity:1;border:2px dashed #c0aa86;border-radius:50%;background:#ebdfc6}
.order-slots .wanted-food>svg{opacity:.65}.order-slots .wanted-food.matched{background:#c4e6bd;border-style:solid;border-color:#80b08a}
.order-slots .wanted-food.matched>svg{opacity:1}.order-slots .wanted-food i{position:absolute;right:-4px;bottom:-4px;width:16px;height:16px;border-radius:50%;background:#fff9dd}
.first-meal .order-slots{grid-template-columns:repeat(3,minmax(0,1fr))}.first-meal .wanted-food{max-width:58px}
.kitchen-counter{position:relative;min-height:0;background:#77608e;border:4px solid #b9a0bb;border-bottom:12px solid #554268;border-radius:35px;box-shadow:0 8px 0 #171630;overflow:visible}
.worktop{position:absolute;inset:0 0 76px;width:100%;height:auto;min-height:64px;isolation:isolate;border-radius:30px;touch-action:none}
.counter-vessel{position:absolute;inset:10% 9% 4%;border:8px solid #d8c2ee;border-radius:43%;background:#fff3d6;box-shadow:0 7px 0 #4c3f66;overflow:visible}
.counter-vessel::before,.counter-vessel::after{content:'';position:absolute;top:40%;height:22%;width:9%;border:7px solid #d8c2ee;border-radius:12px;z-index:-1}.counter-vessel::before{left:-13%}.counter-vessel::after{right:-13%}
.food-bed{position:absolute;inset:13% 12%;display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));grid-template-rows:repeat(var(--rows),minmax(0,1fr));align-items:center;justify-items:center;gap:5px;z-index:2}
.food-piece{display:block;position:relative;width:100%;height:100%;max-width:82px;max-height:82px;min-height:0;animation:food-arrive .32s ease-out}
.food-piece>svg,.food-piece .half>svg{width:100%;height:100%}.food-piece .half{position:absolute;inset:0;display:block;transition:translate .3s}
.food-piece .half.left{clip-path:inset(0 50% 0 0);translate:-4px -2px;rotate:-10deg}.food-piece .half.right{clip-path:inset(0 0 0 50%);translate:4px 2px;rotate:10deg}
.empty-target{position:absolute;inset:27% 33%;opacity:.2}.meal-liquid{position:absolute;inset:8%;border-radius:50%;background:#f5c992;opacity:0}
.counter-controls{height:70px;position:absolute;bottom:0;left:10px;right:10px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.counter-undo,.cook-start{width:66px;height:64px;padding:12px;border-radius:20px;flex-shrink:0}
.cook-start{background:#ffc582;border-color:#e09661}.cook-start.ready{box-shadow:0 0 0 5px #b8e4bc,0 6px 0 #595776;animation:ready-tool 1.8s ease-in-out infinite}
.dish-count{font-size:29px;font-weight:800;color:var(--cream);opacity:.85}
.kitchen-footer{display:flex;align-items:center;justify-content:center;min-height:0}
.pantry-row{display:flex;justify-content:center;gap:10px;width:100%;height:100%}.ingredient-bin{flex:1;max-width:135px;min-width:64px;height:100%;min-height:64px;padding:8px;border-radius:24px}
.demo-food{position:absolute;inset:-7px 4px 7px -4px;z-index:-1}.ingredient-bin .demo-hand{filter:drop-shadow(0 3px 1px #231e4644)}
.kitchen-utensil{position:absolute;right:10%;top:0;width:42%;height:65%;z-index:4;transform-origin:50% 70%;pointer-events:none}
.worktop .demo-hand{top:calc(45% - 22px);left:calc(50% - 22px);width:48px;height:48px}
.worktop.chop .demo-hand{animation:chop-hand 3s ease-in-out infinite}.worktop.stir .demo-hand{animation:stir-hand 3s ease-in-out infinite}.worktop.pour .demo-hand{animation:pour-hand 3s ease-in-out infinite}.worktop.flip .demo-hand{animation:flip-hand 3s ease-in-out infinite}
.counter-vessel.chop{border-radius:18px;border-color:#bd8e63;background:repeating-linear-gradient(0deg,#e0b98e 0,#e0b98e 28px,#d0a37a 30px,#e0b98e 32px)}
.counter-vessel.chop::before,.counter-vessel.chop::after{display:none}
.worktop.chop .kitchen-utensil{height:55%;top:-3%;right:9%}.worktop.chop.doing .kitchen-utensil{animation:knife-chop .65s ease-out}
.worktop.stir .meal-liquid{opacity:.45}.worktop.stir [data-progress="1"] .meal-liquid{opacity:.65}.worktop.stir [data-progress="2"] .meal-liquid{opacity:.85}.worktop.stir [data-progress="3"] .meal-liquid{opacity:1}
.worktop.stir.doing .food-bed{animation:stir-food .7s ease-in-out}.worktop.stir.doing .kitchen-utensil{animation:spoon-stir .7s ease-in-out}
.worktop.flip .counter-vessel{background:#525877;border-color:#929dbb}.worktop.flip .counter-vessel::after{width:24%;right:-27%;height:14%;background:#e0b98e;border-color:#322c51;rotate:-16deg}
.worktop.flip .food-bed{background:#ffd36f;border:5px solid #d29d60;border-radius:50%;padding:4px}.worktop.flip [data-progress="1"] .food-bed{background:#efbd71}.worktop.flip [data-progress="2"] .food-bed,.worktop.flip [data-progress="3"] .food-bed{background:#d99751}
.worktop.flip .kitchen-utensil{display:none}.worktop.flip.doing .food-bed{animation:pancake-flip .7s ease-in-out}
.worktop.pour .kitchen-utensil{display:none}
.counter-vessel.serve{border:12px solid #e5c69c;border-radius:50%;background:#fff4d7}.counter-vessel.serve::before,.counter-vessel.serve::after{display:none}.serving.dragging{transform:translate(var(--gesture-x,0),var(--gesture-y,0));z-index:12}.serving.dragging .demo-hand{display:none}
.recipe-cue{display:flex;justify-content:center;gap:20px;height:66px}.recipe-cue>span{width:64px;height:64px;padding:9px;opacity:.28;border-radius:20px}.recipe-cue>span.current{opacity:1;background:#ffad6633;border:3px solid var(--orange)}.recipe-cue>span.done{opacity:.8;background:#b8e4bc22}
.feed-cue{height:65px;display:flex;gap:20px;align-items:center;opacity:.7}.feed-cue>svg{width:56px;height:56px}.feed-cue>svg:last-child{width:70px;height:70px}
dialog button{touch-action:pan-y}
@keyframes food-arrive{from{transform:translateY(-20px) scale(.8);opacity:.3}to{transform:translateY(0) scale(1);opacity:1}}
@keyframes knife-chop{30%,70%{translate:0 22px;rotate:-12deg}50%{translate:0 -10px}}
@keyframes spoon-stir{25%{translate:15px 8px;rotate:20deg}60%{translate:-15px 8px;rotate:-20deg}}
@keyframes pancake-flip{50%{transform:translateY(-35px) rotateX(180deg)}to{transform:rotateX(360deg)}}
@keyframes jug-pour{50%{rotate:25deg}}
@keyframes ready-tool{50%{box-shadow:0 0 0 8px #b8e4bc88,0 6px 0 #595776}}
@media(min-width:700px) and (min-height:700px){.moon-kitchen{grid-template-rows:auto minmax(0,1fr) 116px;gap:23px}.kitchen-customer{min-height:185px;gap:24px}.moon-customer{width:180px;height:180px}.order-card{padding:18px 24px}.order-quantity{width:63px;padding-bottom:28px}.order-quantity>svg{width:56px;height:56px}.order-quantity b{width:56px;font-size:28px}.order-slots{max-width:380px;gap:7px}.order-slots .wanted-food{max-width:60px}.first-meal .wanted-food{max-width:75px}.worktop{bottom:90px}.counter-controls{height:82px;left:20px;right:20px}.counter-undo,.cook-start{width:80px;height:76px}.food-piece{max-width:110px;max-height:110px}.kitchen-utensil{right:15%;width:35%}.first-meal .food-bed{inset:20% 16%}.dish-count{font-size:40px}}
@media(max-height:740px) and (orientation:portrait){.moon-kitchen{grid-template-rows:auto minmax(0,1fr) 78px;gap:12px}.kitchen-customer{min-height:110px;gap:8px}.moon-customer{width:78px;height:98px}.order-card{padding:9px;border-radius:22px}.order-quantity{width:35px;padding-bottom:22px}.order-quantity>svg{width:34px;height:34px}.order-quantity b{width:34px;font-size:21px}.order-row{gap:5px}.order-slots{gap:2px}.order-slots .wanted-food{max-width:39px}.first-meal .wanted-food{max-width:52px}.counter-vessel{inset:8% 10% 5%;border-width:6px}.ingredient-bin{padding:5px}.recipe-cue{height:64px}.counter-controls{height:68px}.worktop{bottom:72px}.food-bed{gap:3px}.food-piece{max-width:68px;max-height:68px}}
@media(orientation:landscape) and (max-height:650px){.moon-kitchen{grid-template-columns:minmax(180px,.85fr) minmax(0,1.4fr);grid-template-rows:minmax(0,1fr) 72px;gap:12px 22px;max-width:100%}.kitchen-customer{grid-row:1/3;flex-direction:column;justify-content:center;gap:5px;min-height:0}.moon-customer{width:98px;height:92px;flex-shrink:1;min-height:60px}.order-card{flex:0 1 auto;width:100%;padding:8px;border-radius:21px;gap:5px}.order-card::before{top:-10px;left:45%}.order-row{gap:5px}.order-row+.order-row{padding-top:5px}.order-quantity{width:32px;padding-bottom:18px}.order-quantity>svg{width:31px;height:31px}.order-quantity b{width:31px;font-size:19px}.order-slots{gap:2px}.order-slots .wanted-food{max-width:31px}.first-meal .wanted-food{max-width:50px}.kitchen-counter{grid-column:2;grid-row:1;border-radius:25px;border-bottom-width:8px}.kitchen-footer{grid-column:2;grid-row:2}.worktop{inset:0 68px 0 0;width:auto;min-height:64px}.counter-controls{inset:6px 5px 6px auto;width:64px;height:auto;flex-direction:column;gap:3px}.counter-undo,.cook-start{width:64px;height:64px;padding:12px}.dish-count{font-size:20px;line-height:1;position:absolute;right:73px;bottom:0}.counter-vessel{inset:10% 9%;border-width:5px}.food-bed{gap:2px;inset:11% 12%}.food-piece{max-width:60px;max-height:60px}.ingredient-bin{height:68px;padding:4px;border-radius:20px}.kitchen-utensil{width:39%;height:75%;top:-5%;right:13%}.recipe-cue{height:64px;gap:20px}.recipe-cue>span{width:64px;height:64px}.feed-cue{height:64px}.worktop .demo-hand{height:42px;width:42px}.counter-vessel.serve{border-width:8px}}
@media(prefers-reduced-motion:reduce){.food-piece,.worktop .demo-hand,.ingredient-bin .demo-hand,.cook-start.ready{animation:none!important}.food-piece .half{transition:none}.worktop.doing .food-bed,.worktop.doing .kitchen-utensil{animation:none!important}}
/* Pour food between two real containers; pieces never float below the cookware. */
.pour-setup{position:absolute;inset:8% 7% 6%;isolation:isolate}.pour-jug{position:absolute;left:0;top:0;width:43%;height:65%;border:6px solid #d8c2ee;background:#fff3d6;border-radius:15px 15px 25px 25px;rotate:16deg}
.pour-jug::before{content:'';position:absolute;right:-18px;top:8px;width:26px;height:20px;background:#d8c2ee;clip-path:polygon(0 0,100% 20%,0 100%)}.pour-jug::after{content:'';position:absolute;left:-24px;top:20%;width:23px;height:35%;border:6px solid #d8c2ee;border-radius:12px 0 0 12px}
.pour-destination{position:absolute;right:0;bottom:0;width:53%;height:62%;background:#fff3d6;border:7px solid #e5c69c;border-radius:40% 40% 45% 45%}
.pour-setup .food-bed{inset:10%;gap:2px}.pour-setup .food-piece{max-width:56px;max-height:56px}.pour-setup .food-piece.transferred{animation:food-arrive .4s ease-out}
.pour-stream{position:absolute;left:43%;top:17%;width:48%;height:10%;transform-origin:0 50%;rotate:48deg;border-radius:50%;background:#eeab83;opacity:0;z-index:1}
.pour-setup[data-progress="1"] .pour-stream,.pour-setup[data-progress="2"] .pour-stream,.pour-setup[data-progress="3"] .pour-stream{opacity:1}
.pour-setup[data-progress="1"] .pour-destination{background:#f8dca7}.pour-setup[data-progress="2"] .pour-destination{background:#f0c395}.pour-setup[data-progress="3"] .pour-destination{background:#eeab83}
.worktop.pour.doing .pour-jug{animation:jug-pour .7s ease-in-out}
.counter-vessel.serve.meal-soup .meal-liquid,.counter-vessel.serve.meal-shake .meal-liquid,.counter-vessel.serve.meal-noodles .meal-liquid{opacity:1;background:#eeab83}
.counter-vessel.serve.meal-pancake .meal-liquid{opacity:1;background:#db9d58;border:7px solid #b87946}
.counter-vessel.serve.meal-shake{border-radius:20px 20px 40% 40%;left:22%;right:22%;border-width:7px}.counter-vessel.serve.meal-skewer .food-bed::before{content:'';position:absolute;left:0;right:0;top:50%;height:9px;background:#c5996c;z-index:-1;border-radius:8px}
.meal-steam{position:absolute;left:25%;right:25%;top:-25px;display:flex;justify-content:space-between;height:30px;opacity:.7}.meal-steam i{width:16px;border-left:4px solid #fff4d7;border-radius:50%;rotate:15deg}
.worktop.flip .counter-vessel{right:20%}.worktop.flip .counter-vessel::after{width:22%;right:-25%}
.worktop.cooking.dragging .kitchen-utensil{transform:translate(var(--gesture-x,0),var(--gesture-y,0))}.worktop.stir.dragging .food-bed{transform:translate(var(--gesture-x,0),var(--gesture-y,0))}.worktop.flip.dragging .food-bed{transform:translateY(var(--gesture-y,0))}.worktop.pour.dragging .pour-jug{transform:translate(var(--gesture-x,0),var(--gesture-y,0))}
