/* Molly's Café After Dark — Kitchen area styles. Every selector is prefixed .kitchen- */

/* =================================================================== scene: ambient life */
.kitchen-scene .kitchen-tube { animation: kitchen-tube 7s infinite; }
.kitchen-scene .kitchen-tubeglow, .kitchen-scene .kitchen-light { animation: kitchen-tube-glow 7s infinite; }
@keyframes kitchen-tube { 0%, 100% { opacity: 1; } 2% { opacity: .35; } 3% { opacity: 1; } 4% { opacity: .5; } 5% { opacity: 1; } 61% { opacity: 1; } 62% { opacity: .6; } 63% { opacity: 1; } }
@keyframes kitchen-tube-glow { 0%, 100% { opacity: 1; } 2% { opacity: .55; } 3% { opacity: 1; } 4% { opacity: .7; } 5% { opacity: 1; } 61% { opacity: 1; } 62% { opacity: .8; } 63% { opacity: 1; } }

.kitchen-sec { transform-box: fill-box; transform-origin: 50% 100%; animation: kitchen-spin 60s steps(60) infinite; }
@keyframes kitchen-spin { to { transform: rotate(360deg); } }
.kitchen-tail { transform-box: fill-box; transform-origin: 50% 0; animation: kitchen-tail 1s ease-in-out infinite alternate; }
@keyframes kitchen-tail { from { transform: rotate(-16deg); } to { transform: rotate(16deg); } }

.kitchen-star { animation: kitchen-twinkle 3s ease-in-out infinite; }
@keyframes kitchen-twinkle { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
.kitchen-lit { animation: kitchen-litwin 9s steps(1) infinite; }
@keyframes kitchen-litwin { 0%, 60% { opacity: 1; } 61%, 80% { opacity: 0; } }

.kitchen-swing { transform-box: fill-box; transform-origin: 50% 0; animation: kitchen-sway 3.2s ease-in-out infinite alternate; }
@keyframes kitchen-sway { from { transform: rotate(-3deg); } to { transform: rotate(3deg); } }

.kitchen-drop { transform-box: fill-box; transform-origin: 50% 50%; animation: kitchen-drip 2.6s ease-in infinite; }
@keyframes kitchen-drip {
  0% { transform: translateY(0) scale(.2); opacity: 0; }
  15% { transform: translateY(0) scale(1); opacity: 1; }
  62% { transform: translateY(1px) scale(1, 1.2); opacity: 1; }
  88% { transform: translateY(28px) scale(.9, 1.3); opacity: 1; }
  100% { transform: translateY(30px) scale(1.6, .3); opacity: 0; }
}

.kitchen-neon { animation: kitchen-neon 5s infinite; }
@keyframes kitchen-neon { 0%, 30%, 34%, 70%, 100% { opacity: 1; } 31%, 33% { opacity: .45; } 71% { opacity: .7; } }

.kitchen-ilight { transition: fill .3s; }
.kitchen-s-drink .kitchen-ilight { fill: #ffb347; animation: kitchen-blink 1s steps(2) infinite; }
.kitchen-s-bar .kitchen-ilight { fill: #7dff9a; animation: none; }
@keyframes kitchen-blink { 50% { opacity: .15; } }

.kitchen-glint { animation: kitchen-twinkle 1.6s ease-in-out infinite; }

/* hotspot "bump" when an item is used on it */
.kitchen-bump { transform-box: fill-box; transform-origin: 50% 100%; animation: kitchen-bump .5s cubic-bezier(.3,1.6,.5,1); }
@keyframes kitchen-bump { 30% { transform: scale(1.08, .92); } 60% { transform: scale(.96, 1.05); } }

/* =================================================================== scene: fridge */
.kitchen-fdoor { transform-box: fill-box; transform-origin: 0% 50%; transition: transform .95s cubic-bezier(.55,0,.3,1.15); }
.kitchen-fdoor-out { transition: opacity .2s .4s; }
.kitchen-fdoor-in { opacity: 0; transition: opacity .2s .4s; }
.kitchen-s-fridge .kitchen-fdoor { transform: scaleX(-.3); }
.kitchen-s-fridge .kitchen-fdoor-out { opacity: 0; }
.kitchen-s-fridge .kitchen-fdoor-in { opacity: 1; }
.kitchen-fspill { transition: opacity .8s .5s; }
.kitchen-s-fridge .kitchen-fspill { opacity: .22; }
.kitchen-s-noleek .kitchen-fi-leek, .kitchen-s-nocherries .kitchen-fi-cherries { display: none; }

/* =================================================================== scene + close-up: pot, flames, steam */
.kitchen-pot-spag, .kitchen-pot-leek { opacity: 0; transform-box: fill-box; transform-origin: 50% 100%; transform: translateY(-40%) scale(.9); transition: opacity .25s, transform .6s cubic-bezier(.3,1.6,.5,1); }
.kitchen-s-spag .kitchen-pot-spag, .kitchen-s-leek .kitchen-pot-leek { opacity: 1; transform: none; }

.kitchen-flames, .kitchen-water, .kitchen-bubbles, .kitchen-steam { opacity: 0; transition: opacity .8s; }
.kitchen-steam, .kitchen-flames { pointer-events: none; }
.kitchen-s-cooking .kitchen-flames, .kitchen-s-cooked .kitchen-flames,
.kitchen-s-cooking .kitchen-water, .kitchen-s-cooked .kitchen-water,
.kitchen-s-cooking .kitchen-bubbles, .kitchen-s-cooked .kitchen-bubbles { opacity: 1; }
.kitchen-s-cooking .kitchen-steam, .kitchen-s-cooked .kitchen-steam { opacity: 1; }
.kitchen-flames path { transform-box: fill-box; transform-origin: 50% 100%; animation: kitchen-flick .16s ease-in-out infinite alternate; }
@keyframes kitchen-flick { from { transform: scaleY(.75) scaleX(1.1); } to { transform: scaleY(1.2) scaleX(.9); } }
.kitchen-bubbles circle { transform-box: fill-box; transform-origin: 50% 100%; animation: kitchen-bubble 1.1s ease-in infinite; }
.kitchen-bubbles circle:nth-child(2) { animation-delay: -.4s; }
.kitchen-bubbles circle:nth-child(3) { animation-delay: -.8s; }
.kitchen-bubbles circle:nth-child(4) { animation-delay: -.2s; }
@keyframes kitchen-bubble { 0% { transform: scale(0); opacity: 1; } 70% { transform: scale(1) translateY(-2px); opacity: 1; } 100% { transform: scale(1.3) translateY(-4px); opacity: 0; } }
.kitchen-steam path { opacity: 0; transform-box: fill-box; transform-origin: 50% 100%; animation: kitchen-steam 3.4s ease-out infinite; }
.kitchen-steam path:nth-child(2) { animation-delay: -1.15s; }
.kitchen-steam path:nth-child(3) { animation-delay: -2.3s; }
@keyframes kitchen-steam { 0% { transform: translateY(12px) scale(.7); opacity: 0; } 25% { opacity: .55; } 100% { transform: translateY(-46px) scale(1.25, 1.1); opacity: 0; } }

.kitchen-knob { transform-box: fill-box; transform-origin: 50% 50%; transition: transform .5s cubic-bezier(.3,1.6,.5,1); }
.kitchen-s-cooking .kitchen-knob, .kitchen-s-cooked .kitchen-knob { transform: rotate(130deg); }

/* =================================================================== scene + close-up: fogged window */
.kitchen-fog { opacity: 0; transition: opacity 3s ease-in; }
.kitchen-s-fog .kitchen-fog, .kitchen-s-cooked .kitchen-fog { opacity: 1; }
.kitchen-digit { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .9s ease-in-out; }
.kitchen-d7 { transition-delay: .95s; }
.kitchen-s-write .kitchen-digit, .kitchen-s-cooked .kitchen-digit { stroke-dashoffset: 0; }
.kitchen-s-cooked .kitchen-digit { transition: none; }
.kitchen-blanks { opacity: 0; transition: opacity 1s; }
.kitchen-s-blanks .kitchen-blanks, .kitchen-s-cooked .kitchen-blanks { opacity: 1; }

/* =================================================================== scene: bar */
.kitchen-card-full { display: none; }
.kitchen-s-recipe .kitchen-card-full { display: inline; }
.kitchen-s-recipe .kitchen-card-half { display: none; }
.kitchen-glass-full { opacity: 0; transition: opacity .8s; }
.kitchen-s-drink .kitchen-glass-full { opacity: 1; }

.kitchen-drawer-box { opacity: 0; transition: opacity .15s .1s; }
.kitchen-s-bar .kitchen-drawer-box { opacity: 1; }
.kitchen-drawer-front { transform-box: fill-box; transform-origin: 50% 0; transition: transform .7s cubic-bezier(.3,1.7,.5,1); }
.kitchen-s-bar .kitchen-drawer-front { transform: translateY(14px) scale(1.07); }
.kitchen-s-nofuse .kitchen-fuse { display: none; }

/* =================================================================== close-ups: shared */
.kitchen-z { color: var(--ink); }
.kitchen-z .hs { cursor: pointer; }
.kitchen-z .hs:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
body.using .kitchen-z .hs { cursor: crosshair; }
.kitchen-taken { animation: kitchen-take .45s ease forwards; pointer-events: none; }
@keyframes kitchen-take { to { transform: translateY(-24px) scale(.3); opacity: 0; } }

/* ---------- fridge */
.kitchen-fz { position: relative; max-width: 340px; min-height: 480px; margin: 0 auto; perspective: 1300px; }
.kitchen-fz-inside {
  position: absolute; inset: 0; border-radius: 28px; padding: 26px 22px 20px; display: grid; grid-template-rows: 1fr 1fr 1.1fr;
  background: linear-gradient(#ffffff, #d4eaf4); box-shadow: inset 0 0 0 10px #a3cab2, inset 0 0 0 13px #7fa28d, inset 0 0 50px rgba(120,170,200,.55); overflow: hidden;
}
.kitchen-fz-lamp { position: absolute; top: 12px; left: 50%; width: 120px; height: 60px; margin-left: -60px; border-radius: 50%; background: radial-gradient(#fffbe0, transparent 70%); animation: kitchen-hum 3s ease-in-out infinite; pointer-events: none; }
@keyframes kitchen-hum { 50% { opacity: .7; } }
.kitchen-fz-shelf { position: relative; display: flex; align-items: flex-end; justify-content: space-around; gap: 10px; padding: 0 6px 3px; border-bottom: 6px solid rgba(150,200,222,.9); }
.kitchen-fz-crisper { border-bottom: 0; background: rgba(200,230,242,.55); border-radius: 0 0 16px 16px; }
.kitchen-fi { cursor: pointer; transition: transform .2s; line-height: 0; filter: drop-shadow(0 4px 4px rgba(0,0,0,.18)); }
.kitchen-fi:hover { transform: translateY(-5px) rotate(-2deg); }
.kitchen-fi--leek svg { width: 170px; height: auto; }
.kitchen-fz-door {
  position: relative; z-index: 2; min-height: 480px; border-radius: 28px; padding: 18px 34px 18px 16px;
  background: linear-gradient(90deg, #a3cab2, #d2e9da 35%, #8fb89f); box-shadow: inset 0 0 0 3px #6f8f7c, 0 12px 26px rgba(0,0,0,.25);
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  transform-origin: 0% 50%; transition: transform 1.15s cubic-bezier(.55,0,.25,1), opacity .35s .85s;
}
.kitchen-fz-door::after { content: ""; position: absolute; right: 10px; top: 34%; width: 13px; height: 120px; border-radius: 7px; background: linear-gradient(90deg, #8d969b, #f4f7f8, #8d969b); box-shadow: 0 3px 6px rgba(0,0,0,.2); }
.kitchen-fz-door.swing { transform: rotateY(-112deg); opacity: 0; pointer-events: none; }
.kitchen-fz-badge { font-family: "Fraunces", serif; font-weight: 800; font-size: .7rem; letter-spacing: .25em; color: #5f686d; background: linear-gradient(90deg, #8d969b, #f4f7f8, #8d969b); padding: 3px 14px; border-radius: 99px; }
.kitchen-fz-note {
  position: relative; background: #fff5b8; padding: 12px 14px 10px; width: 210px; transform: rotate(-2.5deg);
  font-family: "Caveat", cursive; font-size: 1.45rem; line-height: 1.15; box-shadow: 0 6px 12px rgba(58,42,35,.18);
}
.kitchen-fz-note small { display: block; font-size: 1.05rem; color: var(--muted); }
.kitchen-fz-note b { display: block; text-align: right; font-weight: 700; }
.kitchen-fz-note::before { content: ""; position: absolute; top: -7px; left: 50%; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #ff8a8f, var(--cherry) 60%, var(--cherry-d)); box-shadow: 0 2px 3px rgba(0,0,0,.3); }
.kitchen-fz-slots { display: flex; gap: 8px; padding: 9px; border-radius: 14px; background: rgba(255,255,255,.35); box-shadow: inset 0 2px 6px rgba(0,0,0,.15); }
.kitchen-slot {
  width: 50px; height: 58px; border-radius: 10px; border: 2px dashed rgba(58,42,35,.3); background: var(--c, transparent); cursor: pointer;
  font-family: "Fraunces", serif; font-weight: 800; font-size: 1.9rem; color: #fff; text-shadow: 0 2px 0 rgba(0,0,0,.25); padding: 0;
}
.kitchen-slot.filled { border: 0; box-shadow: 0 4px 0 rgba(0,0,0,.25), inset 0 -4px 0 rgba(0,0,0,.15), inset 0 3px 0 rgba(255,255,255,.25); }
.kitchen-snap { animation: kitchen-snap .35s cubic-bezier(.3,1.8,.5,1); }
@keyframes kitchen-snap { from { transform: translateY(-14px) scale(1.2) rotate(-8deg); } }
.kitchen-jiggle { animation: kitchen-jiggle .5s ease-in-out 3; box-shadow: 0 0 0 3px var(--gold), 0 0 18px rgba(255,216,77,.8) !important; }
@keyframes kitchen-jiggle { 25% { transform: rotate(-9deg) translateY(-3px); } 75% { transform: rotate(9deg) translateY(-3px); } }
.kitchen-fz-loose { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px 10px; max-width: 280px; }
.kitchen-mag {
  width: 40px; height: 46px; border: 0; border-radius: 9px; padding: 0; cursor: pointer; background: var(--c); color: #fff;
  font-family: "Fraunces", serif; font-weight: 800; font-size: 1.45rem; line-height: 1; text-shadow: 0 2px 0 rgba(0,0,0,.25);
  transform: rotate(var(--r)); box-shadow: 0 3px 0 rgba(0,0,0,.25), inset 0 -3px 0 rgba(0,0,0,.15), inset 0 2px 0 rgba(255,255,255,.25);
  transition: transform .15s, opacity .18s;
}
.kitchen-mag:hover { transform: rotate(0) scale(1.1); }
.kitchen-mag.used { opacity: 0; transform: scale(.3); pointer-events: none; }
.kitchen-fz-clear { border: 0; border-radius: 99px; padding: 6px 16px; font-weight: 800; font-size: .85rem; cursor: pointer; background: rgba(255,255,255,.55); color: var(--ink); box-shadow: inset 0 0 0 2px rgba(58,42,35,.15); }

/* ---------- pantry */
.kitchen-pz-cab { max-width: 380px; margin: 0 auto; padding: 14px 12px 6px; border-radius: 12px; background: linear-gradient(#2a1a13, #3b2519); box-shadow: inset 0 0 0 8px #7a4b2e, inset 0 0 0 10px #4a2a1b, inset 0 20px 40px rgba(0,0,0,.4); }
.kitchen-pz-shelf { display: flex; justify-content: space-around; align-items: flex-end; min-height: 150px; padding: 0 4px; border-bottom: 9px solid #7a4b2e; margin-bottom: 8px; }
.kitchen-jar { position: relative; width: 84px; height: 132px; cursor: pointer; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; }
.kitchen-jar-body {
  position: relative; width: 72px; height: 84px; border-radius: 10px 10px 8px 8px; display: grid; place-items: center; z-index: 1;
  background: linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,.45) 30%, rgba(255,255,255,.12)), var(--c);
  box-shadow: inset 0 -6px 0 rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.35);
}
.kitchen-jar--jar .kitchen-jar-body { background: linear-gradient(90deg, rgba(255,255,255,.12), rgba(255,255,255,.5) 25%, rgba(255,255,255,.08) 40%), color-mix(in srgb, var(--c) 55%, #cfe3ea); border-radius: 16px 16px 12px 12px; }
.kitchen-jar-label { background: var(--paper); color: var(--ink); font-family: "Fraunces", serif; font-weight: 800; font-size: .62rem; letter-spacing: .08em; padding: 4px 6px; border-radius: 3px; box-shadow: 0 1px 2px rgba(0,0,0,.2); transform: rotate(-3deg); }
.kitchen-jar-lid {
  position: absolute; bottom: 82px; width: 78px; height: 14px; border-radius: 6px 6px 3px 3px; z-index: 3;
  background: linear-gradient(90deg, #8d969b, #eef2f3 40%, #8d969b); box-shadow: 0 2px 3px rgba(0,0,0,.3);
  transition: transform .5s cubic-bezier(.3,1.5,.5,1), opacity .4s .25s;
}
.kitchen-jar--jar .kitchen-jar-lid { background: linear-gradient(90deg, #7c1c24, #c63d45 40%, #7c1c24); }
.kitchen-jar-content { position: absolute; bottom: 70px; width: 64px; line-height: 0; z-index: 2; transform: translateY(24px) scale(.7); opacity: 0; transition: transform .45s .1s cubic-bezier(.3,1.6,.5,1), opacity .2s .1s; }
.kitchen-jar-content svg { width: 100%; height: auto; overflow: visible; }
.kitchen-jar.open .kitchen-jar-lid { transform: translate(26px, -34px) rotate(38deg); opacity: .0; }
.kitchen-jar.open .kitchen-jar-content { transform: none; opacity: 1; }
.kitchen-jar-content.kitchen-taken { animation: none; transform: translateY(24px) scale(.7) !important; opacity: 0 !important; }
.kitchen-jar:hover .kitchen-jar-body { filter: brightness(1.08); }
.kitchen-jar:not(.open):hover .kitchen-jar-lid { transform: translateY(-3px) rotate(-3deg); }
.kitchen-puff { opacity: 0; transform-box: fill-box; transform-origin: center; }
.kitchen-poof .kitchen-puff { animation: kitchen-puff 1s ease-out .1s; }
@keyframes kitchen-puff { 0% { opacity: .9; transform: scale(.5); } 100% { opacity: 0; transform: scale(3.5) translateY(-6px); } }
.kitchen-pz-read { display: flex; justify-content: center; margin-top: 12px; }
.kitchen-pz-note { font-size: 1.5rem; max-width: 260px; text-align: center; animation: kitchen-notein .4s cubic-bezier(.3,1.6,.5,1); }
.kitchen-pz-note span { display: block; text-align: right; font-size: 1.2rem; }
@keyframes kitchen-notein { from { transform: translateY(20px) rotate(-8deg) scale(.7); opacity: 0; } }

/* ---------- stove */
.kitchen-sz { max-width: 420px; margin: 0 auto; }
.kitchen-sz-svg { display: block; width: 100%; height: auto; border-radius: 14px; box-shadow: 0 6px 16px rgba(0,0,0,.2); }
.kitchen-sz-svg .kitchen-steam path { animation-duration: 2.8s; }
.kitchen-sz-pot { transition: filter .2s; }
.kitchen-sz-pot:hover { filter: drop-shadow(0 0 6px #ffd84d); }
.kitchen-sz-panel {
  display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: -4px; padding: 12px 16px; border-radius: 0 0 14px 14px;
  background: linear-gradient(90deg, #8a1f28, #c63d45 40%, #7c1c24); box-shadow: inset 0 10px 0 #f1e6d2;
}
.kitchen-sz-lbl { font-family: "Fraunces", serif; font-weight: 800; font-size: .7rem; letter-spacing: .15em; color: #fbf3e4; padding-top: 10px; }
.kitchen-sz-knob {
  position: relative; width: 64px; height: 64px; margin-top: 10px; border: 0; border-radius: 50%; cursor: pointer;
  background: radial-gradient(circle at 40% 35%, #5a4d4d, #2b2222 65%); box-shadow: 0 5px 0 #140e0e, 0 0 0 5px #d8cbb3, 0 0 0 7px #8d8474;
  transition: transform .55s cubic-bezier(.3,1.6,.5,1);
}
.kitchen-sz-knob i { position: absolute; left: 50%; top: 6px; width: 6px; height: 22px; margin-left: -3px; border-radius: 3px; background: #f1e6d2; }
.kitchen-sz-knob.wiggle { animation: kitchen-knobwig .35s; }
@keyframes kitchen-knobwig { 40% { transform: rotate(35deg); } }
.kitchen-sz-knob.on { transform: rotate(130deg); animation: none; box-shadow: 0 5px 0 #140e0e, 0 0 0 5px #d8cbb3, 0 0 0 7px #8d8474, 0 0 18px 4px rgba(255,160,70,.6); }
.kitchen-sz-cap { text-align: center; margin: 12px 0 0; min-height: 1.6em; }

/* ---------- window */
.kitchen-wz { text-align: center; }
.kitchen-wz-svg { display: block; width: min(300px, 100%); height: auto; margin: 0 auto; border-radius: 10px; box-shadow: 0 8px 22px rgba(0,0,0,.3); }
.kitchen-wz-cap { margin: 12px 0 0; font-size: 1.5rem; letter-spacing: .1em; }

/* ---------- recipe book */
.kitchen-bz { padding: 6px 0 4px; }
.kitchen-book { position: relative; width: min(310px, 100%); height: 440px; margin: 0 auto; perspective: 1400px; }
.kitchen-book-page, .kitchen-flip, .kitchen-book-cover { position: absolute; inset: 0; border-radius: 4px 14px 14px 4px; }
.kitchen-book-page {
  background: repeating-linear-gradient(transparent 0 27px, #eadcc4 27px 28px), var(--paper);
  box-shadow: inset 12px 0 18px -10px rgba(58,42,35,.35), 4px 4px 0 #efe3cc, 8px 8px 0 #e3d4b8, 0 12px 24px rgba(0,0,0,.25);
  overflow: hidden;
}
.kitchen-book-inner { position: relative; padding: 20px 22px 16px 28px; text-align: center; height: 100%; display: flex; flex-direction: column; align-items: center; opacity: 0; transition: opacity .5s 1.2s; }
.kitchen-bz.opening .kitchen-book-inner, .kitchen-bz.is-open .kitchen-book-inner { opacity: 1; }
.kitchen-bz.is-open .kitchen-book-inner { transition: none; }
.kitchen-book-inner h4 { margin: 0; font-size: 2rem; color: var(--cherry-d); line-height: 1.1; }
.kitchen-book-ours { margin: 0 0 6px; font-size: 1.4rem; }
.kitchen-book-inner p { margin: 4px 0; }
.kitchen-book-stain { position: absolute; right: 18px; top: 92px; width: 58px; height: 52px; border-radius: 50%; border: 5px solid rgba(184,50,58,.18); transform: rotate(20deg) scaleX(1.2); pointer-events: none; }
.kitchen-book-disc-slot { flex: 1; display: grid; place-items: center; width: 100%; }
.kitchen-disc {
  width: 150px; height: 150px; border-radius: 50%; border: 0; cursor: pointer; display: grid; place-items: center; transform: rotate(-8deg);
  background: radial-gradient(circle, #fbf3e4 0 5%, rgba(184,50,58,.55) 6% 30%, rgba(200,40,60,.72) 31%),
              repeating-radial-gradient(circle, rgba(255,255,255,.12) 0 2px, transparent 2px 5px);
  box-shadow: 0 8px 18px rgba(138,31,40,.35), inset 0 0 0 2px rgba(255,255,255,.3);
}
.kitchen-bz.opening .kitchen-disc { animation: kitchen-discin .6s 1.6s cubic-bezier(.3,1.6,.5,1) both, kitchen-discglow 2.4s 2.2s ease-in-out infinite; }
.kitchen-bz.is-open:not(.opening) .kitchen-disc { animation: kitchen-discglow 2.4s ease-in-out infinite; }
.kitchen-disc span { font-family: "Fraunces", serif; font-size: .62rem; line-height: 1.2; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.4); margin-top: 64px; }
.kitchen-disc:hover { transform: rotate(4deg) scale(1.05); }
@keyframes kitchen-discin { from { transform: translateY(40px) rotate(-40deg) scale(.6); opacity: 0; } }
@keyframes kitchen-discglow { 50% { box-shadow: 0 8px 18px rgba(138,31,40,.35), 0 0 0 6px rgba(255,216,77,.35), inset 0 0 0 2px rgba(255,255,255,.3); } }
.kitchen-book-margin { transform: rotate(-2deg); color: var(--muted); }
.kitchen-flip { background: linear-gradient(90deg, #efe3cc, var(--paper) 20%); transform-origin: 0% 50%; backface-visibility: hidden; box-shadow: inset 12px 0 18px -10px rgba(58,42,35,.3); }
.kitchen-book-cover {
  z-index: 5; transform-origin: 0% 50%; backface-visibility: hidden; transition: transform 1.1s cubic-bezier(.55,0,.3,1);
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 16px; padding: 24px 16px 18px 24px;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.12), transparent 60%),
    repeating-linear-gradient(35deg, rgba(0,0,0,.035) 0 3px, transparent 3px 7px),
    linear-gradient(90deg, #2f5230 0 16px, #3f6b3a 16px);
  box-shadow: inset -3px 0 0 rgba(0,0,0,.2), inset 0 0 0 3px rgba(0,0,0,.12), 0 12px 24px rgba(0,0,0,.3);
}
.kitchen-book-corner { position: absolute; right: 0; bottom: 0; width: 40px; height: 40px; background: linear-gradient(135deg, transparent 50%, #c9b98a 50%); border-radius: 0 0 14px 0; opacity: .8; }
.kitchen-book-label {
  background: #efe0c4; border-radius: 6px; padding: 10px 16px 8px; text-align: center; box-shadow: inset 0 0 0 2px #c9a227, 0 3px 6px rgba(0,0,0,.25);
  font-family: "Caveat", cursive; font-size: 1.55rem; line-height: 1.15; color: var(--ink); transform: rotate(-1deg);
}
.kitchen-book-blanks { letter-spacing: .04em; }
.kitchen-book-label small { display: block; font-size: 1.15rem; color: var(--cherry-d); }
.kitchen-book-clasp { padding: 12px 10px; border-radius: 14px; background: linear-gradient(135deg, #a8841d, #f0d27a 45%, #b8921f); box-shadow: 0 4px 0 #6d5512, inset 0 0 0 2px rgba(255,255,255,.35); }
.kitchen-book-clasp .wheel button { background: rgba(58,42,35,.18); }
.kitchen-bz.opening .kitchen-book-cover { transform: rotateY(-175deg); }
.kitchen-bz.opening .kitchen-flip { animation: kitchen-flip .55s ease-in forwards; }
.kitchen-bz.opening .kitchen-flip:nth-of-type(2) { animation-delay: .55s; }
.kitchen-bz.opening .kitchen-flip:nth-of-type(3) { animation-delay: .8s; }
.kitchen-bz.opening .kitchen-flip:nth-of-type(4) { animation-delay: 1.05s; }
@keyframes kitchen-flip { to { transform: rotateY(-178deg); } }
.kitchen-bz.is-open .kitchen-book-cover, .kitchen-bz.is-open .kitchen-flip { display: none; }

/* ---------- drinks bar */
.kitchen-xz { border-radius: 16px; padding: 14px 12px 12px; background: radial-gradient(ellipse at 70% 0%, rgba(255,90,122,.25), transparent 60%), linear-gradient(#2e1f2a, #3f2a35); color: var(--cream); }
.kitchen-xz-top { display: flex; gap: 12px; align-items: flex-end; padding-bottom: 14px; border-bottom: 10px solid #6a3f25; box-shadow: 0 6px 0 #3e2117; border-radius: 0 0 4px 4px; }
.kitchen-card { flex: 1.35; min-width: 0; color: var(--ink); cursor: pointer; transform: rotate(-1.5deg); filter: drop-shadow(0 6px 8px rgba(0,0,0,.35)); }
.kitchen-card-top, .kitchen-card-bot { background: var(--paper); padding: 10px 12px 10px; }
.kitchen-card-top { border-radius: 4px 4px 0 0; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4px), 94% 100%, 86% calc(100% - 6px), 77% 100%, 68% calc(100% - 5px), 58% 100%, 49% calc(100% - 6px), 40% 100%, 31% calc(100% - 4px), 22% 100%, 13% calc(100% - 6px), 5% 100%, 0 calc(100% - 3px)); padding-bottom: 14px; }
.kitchen-card h4 { margin: 0; font-family: "Fraunces", serif; font-size: 1.05rem; line-height: 1.1; }
.kitchen-card-sub { font-family: "Caveat", cursive; font-size: 1.25rem; color: var(--cherry); margin-bottom: 2px; }
.kitchen-card ol { margin: 4px 0 0; padding-left: 22px; font-size: 1.12rem; line-height: 1.15; }
.kitchen-card li { margin: 2px 0; transition: color .2s; }
.kitchen-card li.done { color: var(--leaf); text-decoration: line-through; text-decoration-thickness: 2px; }
.kitchen-card-bot { display: none; border-radius: 0 0 4px 4px; margin-top: -3px; clip-path: polygon(0 3px, 5% 0, 13% 6px, 22% 0, 31% 4px, 40% 0, 49% 6px, 58% 0, 68% 5px, 77% 0, 86% 6px, 94% 0, 100% 4px, 100% 100%, 0 100%); padding-top: 12px; }
.kitchen-card.whole .kitchen-card-bot { display: block; }
.kitchen-card.whole .kitchen-card-missing { display: none; }
.kitchen-card-missing { margin-top: 6px; color: var(--cream); opacity: .6; text-align: center; border: 2px dashed rgba(251,243,228,.35); border-radius: 6px; padding: 8px 4px; }
.kitchen-joining .kitchen-card-bot { animation: kitchen-join .8s cubic-bezier(.3,1.5,.5,1); }
.kitchen-joining .kitchen-card-top { animation: kitchen-joinglow 1.4s .6s; }
@keyframes kitchen-join { 0% { transform: translate(40px, 90px) rotate(18deg); opacity: 0; } 60% { opacity: 1; } }
@keyframes kitchen-joinglow { 30% { filter: drop-shadow(0 0 10px #ffd84d); } }
body.using .kitchen-card { outline: 2px dashed rgba(255,216,77,.6); outline-offset: 4px; }

.kitchen-xz-glasswrap { position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; padding-top: 50px; }
.kitchen-xz-glass {
  position: relative; width: 86px; height: 128px; border: 4px solid rgba(255,255,255,.7); border-top: 0; border-radius: 4px 4px 22px 22px;
  background: linear-gradient(90deg, rgba(255,255,255,.2), rgba(255,255,255,.05) 40%, rgba(255,255,255,.12)); overflow: hidden;
  transform-origin: 50% 100%;
}
.kitchen-xz-glass::after { content: ""; position: absolute; left: 8px; top: 8px; bottom: 12px; width: 6px; border-radius: 3px; background: rgba(255,255,255,.35); z-index: 3; }
.kitchen-xz-layers { position: absolute; inset: 0; display: flex; flex-direction: column-reverse; }
.kitchen-layer { height: 25%; display: grid; place-items: center; background: var(--c); transform-origin: 50% 100%; animation: kitchen-pourin .45s ease both; }
.kitchen-layer span { font-size: 1.05rem; filter: drop-shadow(0 1px 1px rgba(0,0,0,.4)); }
.kitchen-layer--cola { background: linear-gradient(var(--c), #4b2616); }
.kitchen-layer--ice { background: repeating-linear-gradient(45deg, rgba(255,255,255,.6) 0 8px, var(--c) 8px 16px); }
@keyframes kitchen-pourin { from { transform: scaleY(0); } }
.kitchen-xz-straw { position: absolute; z-index: 0; width: 8px; height: 150px; right: 18px; top: -46px; border-radius: 4px; transform: rotate(14deg); background: repeating-linear-gradient(0deg, var(--cherry) 0 10px, #fff 10px 20px); opacity: 0; transition: opacity .4s; }
.kitchen-xz-cherry { position: absolute; z-index: 4; width: 22px; height: 22px; left: 14px; top: 0; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #ff8a8f, var(--cherry) 55%, var(--cherry-d)); opacity: 0; transform: translateY(-60px); transition: transform .6s cubic-bezier(.3,1.6,.5,1) .3s, opacity .2s .3s; }
.kitchen-xz-glass.done { overflow: visible; }
.kitchen-xz-glass.done .kitchen-xz-straw { opacity: 1; }
.kitchen-xz-glass.done .kitchen-xz-cherry { opacity: 1; transform: none; }
.kitchen-xz-glass.done .kitchen-xz-layers { border-radius: 0 0 18px 18px; overflow: hidden; }
.kitchen-xz-glass.done::before { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: 0 0 18px 18px; background: radial-gradient(circle at 30% 80%, rgba(255,255,255,.7) 0 2px, transparent 3px), radial-gradient(circle at 60% 60%, rgba(255,255,255,.6) 0 2px, transparent 3px), radial-gradient(circle at 45% 40%, rgba(255,255,255,.6) 0 1.5px, transparent 2.5px); background-size: 100% 100%; animation: kitchen-fizz 1.6s linear infinite; pointer-events: none; }
@keyframes kitchen-fizz { from { background-position: 0 0, 0 0, 0 0; } to { background-position: 0 -60px, 0 -80px, 0 -50px; } }
.kitchen-xz-coaster { width: 110px; height: 10px; border-radius: 50%; background: rgba(0,0,0,.35); margin-top: -4px; }
.kitchen-xz-stream { position: absolute; top: 0; left: 50%; width: 10px; height: 0; margin-left: -5px; border-radius: 5px; background: var(--c, #fff); opacity: 0; z-index: 2; }
.kitchen-xz-stream.on { animation: kitchen-stream .5s ease-in-out; }
@keyframes kitchen-stream { 0% { height: 0; opacity: 1; } 50% { height: 170px; opacity: 1; } 100% { height: 170px; opacity: 0; transform: translateY(40px); } }
.kitchen-dump { animation: kitchen-dump .65s ease-in-out; }
@keyframes kitchen-dump { 40% { transform: rotate(-70deg) translateX(-10px); } 60% { transform: rotate(-80deg) translateX(-10px); opacity: .5; } 100% { transform: none; } }

.kitchen-xz-mix { margin-top: 16px; }
/* 10 ingredients: 5 per row on wide close-ups, 4 per row (last row centred) on phones */
.kitchen-xz-shelf { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.kitchen-xz-shelf .kitchen-ing { flex: 0 0 calc((100% - 32px) / 5); min-width: 0; text-align: center; }
.kitchen-ing {
  display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 9px 4px 7px; border: 0; border-radius: 12px; cursor: pointer;
  background: linear-gradient(rgba(255,255,255,.12), rgba(255,255,255,.04)); color: var(--cream); font-weight: 800; font-size: .78rem;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.12), 0 3px 0 rgba(0,0,0,.3); transition: transform .12s, background .2s;
}
.kitchen-ing:hover { background: linear-gradient(rgba(255,255,255,.2), rgba(255,255,255,.08)); }
.kitchen-ing:active { transform: translateY(2px); }
.kitchen-ing-emo { font-size: 1.7rem; line-height: 1.1; }
.kitchen-tilt .kitchen-ing-emo { animation: kitchen-tilt .45s ease-in-out; display: inline-block; }
@keyframes kitchen-tilt { 45% { transform: rotate(-40deg) translate(-4px, -6px); } }
.kitchen-xz-done { text-align: center; margin: 14px 0 2px; color: var(--cream); opacity: .85; }

/* ---------- intercom */
.kitchen-xz-ic:empty { display: none; }
.kitchen-xz-ic { margin-top: 14px; }
.kitchen-icz { border-radius: 16px; padding: 16px 12px; background: linear-gradient(#2e1f2a, #3f2a35); color: var(--cream); }
.kitchen-ic { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.kitchen-ic-new { animation: kitchen-icin .5s cubic-bezier(.3,1.6,.5,1); }
@keyframes kitchen-icin { from { transform: translateY(20px) scale(.85); opacity: 0; } }
.kitchen-ic-box { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: linear-gradient(#ddd4c2, #bfb5a1); box-shadow: inset 0 0 0 2px #6d6559, 0 6px 14px rgba(0,0,0,.35); }
.kitchen-ic-new .kitchen-ic-box { animation: kitchen-crackle .09s linear 10 .25s; }
@keyframes kitchen-crackle { 25% { transform: translate(1px, -1px); } 50% { transform: translate(-1px, 1px); } 75% { transform: translate(1px, 1px); } }
.kitchen-ic-grille { width: 110px; height: 60px; border-radius: 8px; background: repeating-linear-gradient(transparent 0 6px, #5f574c 6px 10px); box-shadow: inset 0 0 0 3px #a79d8b; }
.kitchen-ic-side { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.kitchen-ic-led { width: 12px; height: 12px; border-radius: 50%; background: #ffb347; box-shadow: 0 0 10px #ffb347; animation: kitchen-blink 1s steps(2) infinite; }
.kitchen-ic.ok .kitchen-ic-led { background: #7dff9a; box-shadow: 0 0 10px #7dff9a; animation: none; }
.kitchen-ic-tag { font-weight: 800; font-size: .6rem; letter-spacing: .08em; color: #5f574c; }
.kitchen-ic-say { margin: 0; font-family: ui-monospace, Menlo, monospace; font-size: .95rem; color: #ffd1d9; text-shadow: 0 0 8px rgba(255,90,122,.6); }
.kitchen-ic-form { display: flex; gap: 8px; width: 100%; max-width: 360px; }
.kitchen-ic-in { flex: 1; min-width: 0; border: 0; border-radius: 999px; padding: 11px 16px; font: inherit; font-weight: 800; letter-spacing: .06em; background: var(--paper); color: var(--ink); box-shadow: inset 0 2px 5px rgba(0,0,0,.2); }
.kitchen-ic-in:disabled { background: #e2efd8; color: var(--leaf); }
.kitchen-ic-form .btn { padding: 10px 16px; flex: none; }

/* ---------- the "spicy." moment (rendered inside Game.overlay) */
.kitchen-spicy b { display: block; font-family: "Fraunces", serif; font-weight: 800; font-size: clamp(4rem, 22vw, 11rem); line-height: 1; color: #e0582b; text-shadow: 0 8px 0 var(--cherry-d), 0 0 40px rgba(224,88,43,.5); animation: kitchen-rumble .12s linear infinite, kitchen-grow .8s cubic-bezier(.3,1.6,.5,1) both; }
.kitchen-spicy small { display: block; margin-top: 10px; color: var(--cream); font-size: 1rem; font-style: italic; opacity: .8; }
@keyframes kitchen-rumble { 25% { transform: translate(3px, 1px) rotate(-1.5deg); } 50% { transform: translate(-3px, -1px); } 75% { transform: translate(1px, -2px) rotate(1.5deg); } }
@keyframes kitchen-grow { from { scale: .2; } to { scale: 1; } }

@media (max-width: 600px) {
  .kitchen-fz-door { padding-right: 30px; }
  .kitchen-slot { width: 46px; height: 54px; font-size: 1.7rem; }
  .kitchen-mag { width: 38px; height: 44px; font-size: 1.35rem; }
  .kitchen-jar { width: 76px; }
  .kitchen-jar-body { width: 64px; }
  .kitchen-jar-lid { width: 70px; }
  .kitchen-card ol { font-size: 1.02rem; padding-left: 18px; }
  .kitchen-xz-glass { width: 72px; height: 116px; }
  .kitchen-xz-shelf .kitchen-ing { flex-basis: calc((100% - 24px) / 4); padding: 8px 2px 6px; font-size: .72rem; }
  .kitchen-book { height: 430px; }
}
.kitchen-writing { opacity: 0; transition: opacity .3s; }
.kitchen-s-fog .kitchen-writing, .kitchen-s-cooked .kitchen-writing { opacity: 1; }
/* joined recipe card: hide the tears, show a strip of tape over the seam */
.kitchen-card.whole .kitchen-card-top { clip-path: none; padding-bottom: 8px; }
.kitchen-card.whole .kitchen-card-bot { position: relative; clip-path: none; margin-top: 0; padding-top: 10px; border-top: 2px dashed #e6d6b8; }
.kitchen-card.whole .kitchen-card-bot::before { content: ""; position: absolute; left: 50%; top: -11px; width: 64px; height: 20px; margin-left: -32px; background: rgba(243,227,160,.85); transform: rotate(-3deg); box-shadow: 0 1px 2px rgba(0,0,0,.1); }