@import url('https://fonts.googleapis.com/css2?family=Jersey+20&family=VT323&display=swap');
:root {
  --cream:#fff7e8; --cream2:#f6dfbd; --brown:#5d392b; --brown2:#8a5c43;
  --sage:#728365; --pink:#d88891; --red:#c9686f; --gold:#e4b65f; --ink:#4d3026;
}
* { box-sizing:border-box; }
html,body {
  margin:0; width:100%; min-height:100%; background:#201814; color:var(--ink);
  font-family:"VT323", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size:23px;
}
body { min-height:100vh; display:grid; place-items:center; overflow:hidden; }
button { font:inherit; }
h1,h2,h3,h4,h5,h6,.room-tag,.ticket>b,.recipe-detail>b {
  font-family:"Jersey 20", "VT323", ui-monospace, monospace;
  font-weight:400;
}
#game {
  position:relative; width:min(100vw, 1672px); aspect-ratio:1672/941; overflow:hidden;
  background:#1a1411; border:clamp(2px,.25vw,5px) solid #3d291f;
  box-shadow:0 24px 80px rgba(0,0,0,.52); isolation:isolate;
}

/* Cottage Cafe opening menu */
.title-screen{position:absolute;inset:0;z-index:50000;display:grid;place-items:center;overflow:hidden;color:#573a2d;isolation:isolate;transition:opacity .42s ease,transform .42s ease}
.title-screen[hidden]{display:none}.title-screen.leaving{opacity:0;transform:scale(1.015);pointer-events:none}
.title-screen-bg{position:absolute;inset:0;z-index:-3;width:100%;height:100%;object-fit:cover;image-rendering:pixelated}
.title-screen-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(45,27,16,.13),transparent 32%,transparent 68%,rgba(45,27,16,.13)),linear-gradient(180deg,rgba(255,238,191,.02),rgba(41,24,15,.18));pointer-events:none}
.title-menu-card{position:relative;width:clamp(310px,28vw,470px);min-height:clamp(470px,69%,650px);display:grid;place-items:center;padding:clamp(25px,3vw,47px);border:5px solid #654331;border-radius:30px;background:linear-gradient(180deg,rgba(255,250,232,.97),rgba(248,226,191,.97));box-shadow:0 13px 0 rgba(76,45,29,.34),0 22px 42px rgba(39,23,13,.32),inset 0 0 0 4px #e3c797,inset 0 0 0 8px rgba(255,255,255,.65);text-align:center}
.title-menu-card::before,.title-menu-card::after{content:"";position:absolute;left:30px;right:30px;height:2px;background:repeating-linear-gradient(90deg,#ba9368 0 11px,transparent 11px 19px);opacity:.55}.title-menu-card::before{top:22px}.title-menu-card::after{bottom:22px}
.title-menu-main,.title-subpage{width:100%;animation:titlePanelIn .22s ease both}.title-menu-main[hidden],.title-subpage[hidden]{display:none}
.title-kicker,.title-subpage-kicker{margin:0 0 2px;color:#87946d;font-family:"Jersey 20","VT323",monospace;font-size:clamp(21px,1.5vw,28px);letter-spacing:.08em;text-transform:uppercase}
.title-menu-card h1{margin:0;color:#6e4834;font-family:"Jersey 20","VT323",monospace;font-size:clamp(60px,5.4vw,91px);font-weight:400;line-height:.9;text-shadow:0 3px 0 #fff7df,0 6px 0 rgba(112,74,50,.12)}
.title-rule{display:flex;align-items:center;justify-content:center;gap:7px;margin:17px auto 22px;width:82%;height:13px}.title-rule::before,.title-rule::after{content:"";height:3px;flex:1;border-radius:3px;background:#b9956d}.title-rule span{width:12px;height:12px;border:3px solid #819069;border-radius:3px;transform:rotate(45deg);background:#e5eccd}
.title-menu-buttons{display:grid;gap:12px;width:min(100%,310px);margin:auto}
.title-menu-button{position:relative;width:100%;min-height:58px;padding:8px 23px;border:4px solid #654331;border-radius:16px;background:linear-gradient(180deg,#fdf5df,#eed6ad);color:#60402f;font-family:"Jersey 20","VT323",monospace;font-size:clamp(28px,2vw,36px);line-height:1;cursor:pointer;box-shadow:0 5px 0 #80563d,inset 0 0 0 3px rgba(255,255,255,.48);transition:transform .12s ease,filter .12s ease,box-shadow .12s ease}
.title-menu-button::before,.title-menu-button::after{content:"";position:absolute;top:50%;width:8px;height:8px;border-radius:50%;background:#b99469;transform:translateY(-50%)}.title-menu-button::before{left:12px}.title-menu-button::after{right:12px}
.title-menu-button.primary{background:linear-gradient(180deg,#e5edcb,#cbd9ae);border-color:#5e4935;color:#526046}.title-menu-button.quiet{background:linear-gradient(180deg,#fffaf0,#f0dcc0);font-size:27px}
.title-menu-button:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.04);box-shadow:0 7px 0 #80563d,inset 0 0 0 3px rgba(255,255,255,.58)}.title-menu-button:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px 0 #80563d}.title-menu-button:focus-visible,.title-setting-toggle:focus-visible{outline:4px solid #f1bc72;outline-offset:4px}.title-menu-button:disabled{opacity:.48;cursor:not-allowed;filter:saturate(.55)}
.title-save-note{min-height:24px;margin:17px 0 0;color:#876a55;font-size:18px;line-height:1.05}
.title-subpage h2{margin:0 0 12px;color:#674633;font-family:"Jersey 20","VT323",monospace;font-size:clamp(40px,3.1vw,54px);font-weight:400;line-height:1}.title-subpage>p:not(.title-subpage-kicker){max-width:300px;margin:0 auto 22px;color:#80634f;font-size:20px;line-height:1.18}.title-subpage-actions{display:grid;gap:13px;width:min(100%,310px);margin:auto}
.title-settings h2{margin-bottom:18px}.title-setting-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:10px 0;padding:12px 12px 12px 16px;border:3px solid #b28a64;border-radius:15px;background:rgba(255,251,237,.78);box-shadow:inset 0 0 0 2px #f5dfbb;text-align:left}.title-setting-row span{display:grid}.title-setting-row b{font-family:"Jersey 20","VT323",monospace;font-size:25px;font-weight:400;line-height:1}.title-setting-row small{margin-top:3px;color:#8b715e;font-size:15px;line-height:1}.title-setting-toggle{min-width:82px;padding:8px 10px;border:3px solid #654331;border-radius:12px;background:#dbe6bf;color:#536244;font-family:"Jersey 20","VT323",monospace;font-size:23px;line-height:1;cursor:pointer;box-shadow:0 3px 0 #80563d}.title-setting-toggle[aria-pressed="false"]{background:#ead8bc;color:#7a604c}.title-settings-back{width:min(100%,240px);margin:19px auto 0}
.title-leaf{position:absolute;top:-15px;width:70px;height:45px;border:4px solid #5d4934;border-radius:70% 15% 70% 15%;background:linear-gradient(135deg,#93a779,#687d58);box-shadow:inset 0 0 0 3px rgba(225,237,200,.35);z-index:2}.title-leaf-left{left:34px;transform:rotate(-18deg)}.title-leaf-right{right:34px;transform:scaleX(-1) rotate(-18deg)}
.title-footer{position:absolute;bottom:2.2%;left:50%;margin:0;padding:5px 15px;transform:translateX(-50%);border-radius:999px;background:rgba(61,39,27,.74);color:#fff4d7;font-size:18px;line-height:1;letter-spacing:.03em;text-shadow:0 1px #3d271b;white-space:nowrap}
@keyframes titlePanelIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
body.reduce-motion *{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
@media(max-width:700px){.title-menu-card{width:min(84%,360px);min-height:auto;padding:31px 25px 33px;border-width:4px;border-radius:23px}.title-menu-card h1{font-size:57px}.title-kicker{font-size:19px}.title-rule{margin:13px auto 17px}.title-menu-buttons{gap:9px}.title-menu-button{min-height:50px;border-width:3px;border-radius:13px;font-size:28px;box-shadow:0 4px 0 #80563d}.title-save-note{margin-top:13px;font-size:15px}.title-footer{font-size:15px}.title-leaf{width:54px;height:35px}.title-setting-row{padding:9px 9px 9px 12px}.title-setting-row small{display:none}}
.scene { position:absolute; inset:0; opacity:0; pointer-events:none; transition:opacity .18s ease; }
.scene.active { opacity:1; pointer-events:auto; }
.scene-img {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  image-rendering:pixelated; user-select:none; -webkit-user-drag:none;
}

/* EXACT COUNTER LAYER STACK:
   z1 background
   z2 customer PNGs + their tiny status HUD
   z3 transparent counter foreground
   z4 dialogue
*/
.counter-bg { z-index:1; }
.customer-stage { position:absolute; inset:0; z-index:2; pointer-events:none; }
.counter-fg {
  z-index:3;
  pointer-events:none;
  transform:translateY(40px);
}
.dialogue-layer { position:absolute; inset:0; z-index:4; pointer-events:none; }

.customer-slot {
  position:absolute; top:0; bottom:0; width:35%; pointer-events:none;
}
.customer-slot.left { left:18%; }
.customer-slot.right { right:18%; }
.customer-sprite {
  position:absolute; height:68%; width:auto; max-width:112%; bottom:calc(6.5% + 50px); left:50%;
  transform:translateX(-50%); transform-origin:50% 100%; opacity:0;
  image-rendering:pixelated; object-fit:contain; pointer-events:auto; cursor:pointer;
  filter:drop-shadow(0 7px 0 rgba(66,42,30,.16));
  transition:filter .18s ease, opacity .18s ease;
}
.customer-slot.left .customer-sprite {
  --walkX:18vw; --walkX62:11vw; --walkX40:7.2vw; --walkX20:3.6vw; --walkX08:1.45vw;
}
.customer-slot.right .customer-sprite {
  --walkX:-18vw; --walkX62:-11vw; --walkX40:-7.2vw; --walkX20:-3.6vw; --walkX08:-1.45vw;
}

.customer-sprite.entering {
  animation:walkIn .72s steps(6,end) both;
}
.customer-sprite.waiting { opacity:1; }
.customer-sprite.focused {
  filter:drop-shadow(0 9px 0 rgba(66,42,30,.18)) brightness(1.05);
  animation:tinyBob .46s ease-in-out 2;
}
.customer-sprite.leaving { animation:walkOut .58s steps(5,end) both; }

@keyframes walkIn {
  0%   { opacity:0; transform:translateX(calc(-50% + var(--walkX))) translateY(12px) scale(.96); }
  18%  { opacity:1; }
  35%  { transform:translateX(calc(-50% + var(--walkX62))) translateY(0) scale(1); }
  50%  { transform:translateX(calc(-50% + var(--walkX40))) translateY(-5px) scale(1); }
  68%  { transform:translateX(calc(-50% + var(--walkX20))) translateY(0) scale(1); }
  84%  { transform:translateX(calc(-50% + var(--walkX08))) translateY(-4px) scale(1); }
  100% { opacity:1; transform:translateX(-50%) translateY(0) scale(1); }
}
@keyframes walkOut {
  from { opacity:1; transform:translateX(-50%) translateY(0); }
  to { opacity:0; transform:translateX(calc(-50% + var(--walkX))) translateY(14px); }
}
@keyframes tinyBob {
  0%,100% { transform:translateX(-50%) translateY(0); }
  50% { transform:translateX(-50%) translateY(-7px); }
}

.status-card {
  position:absolute; top:17%; left:50%; transform:translateX(-50%);
  width:min(72%,210px); opacity:0; transition:opacity .2s ease;
  background:rgba(255,248,235,.95); border:3px solid #694332; border-radius:10px;
  box-shadow:0 5px 0 rgba(65,40,29,.22), inset 0 0 0 2px #f1d1a7;
  padding:7px 8px 8px; pointer-events:none;
}
.status-card.show { opacity:1; }
.status-top { display:flex; justify-content:space-between; align-items:center; gap:8px; font-weight:900; font-size:clamp(15px,calc(.77vw + 7px),20px); }
.order-count { color:#965961; white-space:nowrap; }
.patience {
  margin-top:6px; height:9px; border:2px solid #604031; background:#ead9be; border-radius:5px; overflow:hidden;
}
.patience-fill { height:100%; width:100%; background:#87a171; transform-origin:left center; transition:width .25s linear, background .25s; }
.status-card.low .patience-fill { background:#dfb257; }
.status-card.critical .patience-fill { background:#ce7478; }
.customer-order-preview {
  margin-top:6px; min-height:34px; display:flex; align-items:center; justify-content:center; gap:5px;
}
.customer-order-thumb {
  position:relative; width:34px; height:34px; display:grid; place-items:center; overflow:hidden;
  background:#fffaf0; border:2px solid #8a5b42; border-radius:6px;
  box-shadow:inset 0 0 0 1px #efd5ad,0 2px 0 rgba(65,40,29,.14);
}
.customer-order-thumb img {
  width:94%; height:94%; object-fit:contain; image-rendering:pixelated; filter:drop-shadow(0 1px 0 rgba(70,42,28,.16));
}
.customer-order-thumb.drink img{max-width:none;max-height:none;object-fit:contain}
.customer-order-thumb.drink-coffee img{width:220%;height:220%;transform:translateY(-19%)}
.customer-order-thumb.drink-matcha img{width:190%;height:190%;transform:translateY(-19%)}
.customer-order-thumb.drink-strawberry img{width:200%;height:200%;transform:translateY(-18%)}
.customer-order-thumb.done { opacity:.38; filter:saturate(.55); }
.customer-order-thumb.done::after {
  content:'✓'; position:absolute; right:1px; bottom:-1px; color:#6f8d60; font-size:21px; font-weight:1000;
  text-shadow:1px 1px 0 #fffaf0;
}
.reaction {
  position:absolute; top:10.5%; left:62%; font-size:clamp(23px,calc(2.2vw + 7px),41px); opacity:0; transform:scale(.5) rotate(-10deg);
  text-shadow:0 2px 0 #fff7e8; pointer-events:none;
}
.reaction.show { animation:reactionPop .8s ease both; }
@keyframes reactionPop {
  0% {opacity:0; transform:scale(.4) rotate(-12deg)}
  30% {opacity:1; transform:scale(1.25) rotate(5deg)}
  70% {opacity:1; transform:scale(1) rotate(-2deg)}
  100% {opacity:0; transform:scale(.8) translateY(-12px)}
}

/* Compact Animal-Crossing-ish / dating-sim-ish dialogue box */
.dialogue {
  pointer-events:auto; position:absolute; left:50%; bottom:4.4%; transform:translate(-50%,18px) scale(.94);
  width:min(53%,760px); min-height:104px; opacity:0;
  background:rgba(255,248,235,.985); border:4px solid #684331; border-radius:13px;
  box-shadow:0 7px 0 rgba(64,40,29,.26), inset 0 0 0 3px #f0cfa6;
  padding:13px 18px 14px; cursor:pointer;
  transition:opacity .18s ease, transform .22s cubic-bezier(.2,.9,.2,1.12);
}
.dialogue.visible { opacity:1; transform:translate(-50%,0) scale(1); }
.dialogue.hiding { opacity:0; transform:translate(-50%,9px) scale(.97); }
.dialogue-head { display:flex; align-items:baseline; gap:9px; margin-bottom:7px; }
.dialogue-name { font-weight:1000; color:#8b5057; font-size:clamp(18px,calc(1vw + 7px),24px); }
.dialogue-personality { color:#8d7563; font-size:clamp(15px,calc(.72vw + 7px),19px); }
.dialogue-text { min-height:2.7em; font-size:clamp(18px,calc(1.18vw + 7px),26px); line-height:1.42; font-weight:700; }
.cursor {
  display:inline-block; width:.55em; height:.55em; margin-left:.36em; border-radius:2px; background:#d78088;
  vertical-align:.05em; animation:blink .62s steps(1,end) infinite;
}
@keyframes blink { 50% { opacity:.16; } }
.continue-mark {
  position:absolute; right:15px; bottom:8px; font-size:clamp(18px,calc(1.1vw + 7px),24px); color:#a86a6e;
  opacity:0; animation:bounceMark .75s ease-in-out infinite;
}
.dialogue.ready .continue-mark { opacity:1; }
@keyframes bounceMark { 50% { transform:translateY(3px); } }

/* Shared game UI */
.room-tag {
  position:absolute; z-index:20; top:2.1%; left:50%; transform:translateX(-50%);
  min-width:clamp(132px,18vw,280px);
  padding:.5rem 1.1rem .46rem;
  background:linear-gradient(180deg,#d8a66f 0 16%,#c48852 16% 54%,#ab6d41 54% 100%);
  color:#3d2417; border:4px solid #6d452a; border-radius:0;
  box-shadow:0 5px 0 #57351f, inset 0 0 0 2px #ebc591, inset 0 -4px 0 rgba(88,51,28,.24);
  text-align:center; font-size:clamp(16px,calc(1vw + 7px),23px); font-weight:1000; letter-spacing:.08em;
  text-transform:uppercase; text-shadow:1px 1px 0 rgba(255,242,222,.5);
  image-rendering:pixelated; pointer-events:none;
}
.room-tag::before, .room-tag::after {
  content:''; position:absolute; top:50%; width:8px; height:8px; transform:translateY(-50%);
  background:#7f5032; border:2px solid #5d3921; box-shadow:inset 0 0 0 1px #be8b5b;
}
.room-tag::before { left:10px; }
.room-tag::after { right:10px; }
.arrow {
  position:absolute; z-index:22; top:50%; transform:translateY(-50%);
  width:clamp(42px,4.6vw,70px); aspect-ratio:1; border:3px solid #704a37; border-radius:12px;
  background:rgba(255,247,231,.91); color:#64412f; box-shadow:0 5px 0 rgba(65,40,29,.28), inset 0 0 0 2px #efd0a3;
  font-size:clamp(31px,calc(3vw + 7px),53px); font-weight:1000; cursor:pointer;
}
.arrow:hover { background:#fffaf1; }
.arrow:active { transform:translateY(-47%); }
.arrow.left { left:1.2%; } .arrow.right { right:1.2%; }

.dots {
  position:absolute; z-index:22; left:50%; bottom:1.2%; transform:translateX(-50%);
  display:flex; gap:7px; padding:5px 9px; background:rgba(50,31,23,.42); border-radius:99px;
}
.dot { width:8px; height:8px; border-radius:2px; background:#ead7be; opacity:.48; }
.dot.active { opacity:1; background:#fff5df; box-shadow:0 0 0 2px #6d4935; }

.scene-hint {
  position:absolute; z-index:12; left:50%; bottom:7%; transform:translateX(-50%);
  background:rgba(255,248,235,.94); border:3px solid #704a37; border-radius:10px; padding:.55rem .85rem;
  box-shadow:0 4px 0 rgba(65,40,29,.24); font-size:clamp(16px,calc(.9vw + 7px),21px); text-align:center;
}
.ticket-stack { position:absolute; z-index:12; right:5%; top:12%; width:min(23%,300px); display:grid; gap:10px; }
.ticket {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:22px 20px;
  border:0;
  border-radius:0;
  background:#704b38;
  filter:drop-shadow(0 6px 0 rgba(65,40,29,.22));
  clip-path:polygon(12px 0,calc(100% - 12px) 0,calc(100% - 12px) 4px,calc(100% - 8px) 4px,calc(100% - 8px) 8px,calc(100% - 4px) 8px,calc(100% - 4px) 12px,100% 12px,100% calc(100% - 12px),calc(100% - 4px) calc(100% - 12px),calc(100% - 4px) calc(100% - 8px),calc(100% - 8px) calc(100% - 8px),calc(100% - 8px) calc(100% - 4px),calc(100% - 12px) calc(100% - 4px),calc(100% - 12px) 100%,12px 100%,12px calc(100% - 4px),8px calc(100% - 4px),8px calc(100% - 8px),4px calc(100% - 8px),4px calc(100% - 12px),0 calc(100% - 12px),0 12px,4px 12px,4px 8px,8px 8px,8px 4px,12px 4px);
  font-size:clamp(15px,calc(.8vw + 7px),20px);
  line-height:1.5;
  transform:none;
}
.ticket::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:5px;
  background:linear-gradient(180deg,#fffdf8,#fff8ed);
  pointer-events:none;
  clip-path:polygon(9px 0,calc(100% - 9px) 0,calc(100% - 9px) 3px,calc(100% - 5px) 3px,calc(100% - 5px) 7px,calc(100% - 2px) 7px,calc(100% - 2px) 10px,100% 10px,100% calc(100% - 10px),calc(100% - 2px) calc(100% - 10px),calc(100% - 2px) calc(100% - 7px),calc(100% - 5px) calc(100% - 7px),calc(100% - 5px) calc(100% - 3px),calc(100% - 9px) calc(100% - 3px),calc(100% - 9px) 100%,9px 100%,9px calc(100% - 3px),5px calc(100% - 3px),5px calc(100% - 7px),2px calc(100% - 7px),2px calc(100% - 10px),0 calc(100% - 10px),0 10px,2px 10px,2px 7px,5px 7px,5px 3px,9px 3px);
}
.ticket::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:12px;
  box-sizing:border-box;
  padding:2px;
  background:#ddc19e;
  pointer-events:none;
  clip-path:polygon(6px 0,calc(100% - 6px) 0,calc(100% - 6px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 6px,100% 6px,100% calc(100% - 6px),calc(100% - 2px) calc(100% - 6px),calc(100% - 2px) calc(100% - 2px),calc(100% - 6px) calc(100% - 2px),calc(100% - 6px) 100%,6px 100%,6px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 6px),0 calc(100% - 6px),0 6px,2px 6px,2px 2px,6px 2px);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;
}
.ticket>*{position:relative;z-index:2}
.ticket:nth-child(2) { transform:none; }
.ticket{
  padding:5px;
  overflow:visible;
}
.ticket::before,.ticket::after{display:none}
.ticket-paper{
  padding:7px;
  background:#fffaf0;
  clip-path:polygon(8px 0,calc(100% - 8px) 0,calc(100% - 8px) 3px,calc(100% - 3px) 3px,calc(100% - 3px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 3px) calc(100% - 8px),calc(100% - 3px) calc(100% - 3px),calc(100% - 8px) calc(100% - 3px),calc(100% - 8px) 100%,8px 100%,8px calc(100% - 3px),3px calc(100% - 3px),3px calc(100% - 8px),0 calc(100% - 8px),0 8px,3px 8px,3px 3px,8px 3px);
}
.ticket-beige-frame{
  padding:2px;
  background:#ddc19e;
  clip-path:polygon(6px 0,calc(100% - 6px) 0,calc(100% - 6px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 6px,100% 6px,100% calc(100% - 6px),calc(100% - 2px) calc(100% - 6px),calc(100% - 2px) calc(100% - 2px),calc(100% - 6px) calc(100% - 2px),calc(100% - 6px) 100%,6px 100%,6px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 6px),0 calc(100% - 6px),0 6px,2px 6px,2px 2px,6px 2px);
}
.ticket-content{
  padding:12px 10px;
  background:linear-gradient(180deg,#fffdf8,#fff8ed);
  clip-path:polygon(5px 0,calc(100% - 5px) 0,calc(100% - 5px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 5px,100% 5px,100% calc(100% - 5px),calc(100% - 2px) calc(100% - 5px),calc(100% - 2px) calc(100% - 2px),calc(100% - 5px) calc(100% - 2px),calc(100% - 5px) 100%,5px 100%,5px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 5px),0 calc(100% - 5px),0 5px,2px 5px,2px 2px,5px 2px);
}
.ticket b { color:#94575e; }

.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

@media (max-width:700px) {
  .dialogue { width:68%; min-height:88px; padding:10px 13px; }
  .customer-slot { width:42%; }
  .customer-slot.left { left:11%; } .customer-slot.right { right:11%; }
  .customer-sprite { height:57%; }
  .status-card { top:15%; width:78%; }
}

/* ===== FOOD GAME PHASES: ingredients -> prep -> oven -> recipe book ===== */
.food-layer{position:absolute;inset:0;z-index:11;pointer-events:none}.ingredient-btn{position:absolute;width:8.8%;aspect-ratio:1;border:0;background:transparent;padding:0;pointer-events:auto;cursor:pointer;filter:drop-shadow(0 4px 0 rgba(75,48,34,.18));transition:transform .12s,filter .12s,opacity .15s}.ingredient-btn img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.ingredient-btn:hover,.ingredient-btn:focus-visible{transform:translateY(-5px) scale(1.06);outline:3px solid #fff3d8;border-radius:12px}.ingredient-btn.needed{filter:drop-shadow(0 0 6px #fff5be) drop-shadow(0 4px 0 rgba(75,48,34,.18))}.ingredient-btn.collected{opacity:.28;pointer-events:none}.ingredient-btn.unneeded{opacity:.72}.ingredient-btn.pop{animation:foodPop .32s steps(4,end)}@keyframes foodPop{50%{transform:translateY(-12px) scale(1.12)}}
#fridge-foods .milk{left:calc(34% - 52px);top:calc(12% - 34px);width:12.144%}#fridge-foods .cream{left:calc(48% - 45px);top:calc(13% - 21px);width:9.68%}#fridge-foods .butter{left:calc(63% - 45px);top:calc(14% - 10px);width:9.68%}#fridge-foods .egg{left:calc(39% - 45px);top:calc(39% - 28px);width:9.68%}#fridge-foods .strawberry{left:calc(59% - 45px);top:calc(39% - 28px);width:9.68%}
#pantry-foods .flour{left:calc(29% + 72px);top:calc(18% + 16px)}#pantry-foods .sugar{left:calc(43% + 50px);top:calc(18% + 16px)}#pantry-foods .coffeePowder{left:calc(57% + 13px);top:calc(18% + 20px)}#pantry-foods .matcha{left:calc(35% - 4px);top:calc(43% - 5px)}#pantry-foods .chocolate{left:calc(53% + 59px);top:43%}#pantry-foods .filter{left:calc(43% + 48px);top:56%}
.food-message{position:absolute;z-index:24;left:50%;bottom:7.2%;transform:translateX(-50%);max-width:56%;padding:.55rem .9rem;border:3px solid #704a37;border-radius:10px;background:rgba(255,248,235,.96);box-shadow:0 4px 0 rgba(65,40,29,.24);font-size:clamp(16px,calc(.86vw + 7px),21px);font-weight:900;text-align:center;pointer-events:none}.food-message.hidden{display:none}
.collect-dock{position:absolute;z-index:23;left:50%;top:8%;transform:translateX(-50%);display:flex;gap:6px;padding:6px 8px;background:rgba(78,50,36,.68);border-radius:10px;pointer-events:none}.collect-slot{width:42px;height:42px;border:2px solid #f5dfbd;border-radius:8px;background:rgba(255,248,235,.88);display:grid;place-items:center;opacity:.45}.collect-slot.have{opacity:1}.collect-slot img{width:90%;height:90%;object-fit:contain;image-rendering:pixelated}.collect-slot span{font-size:16px;color:#5f4133}
.prep-stage{position:absolute;z-index:13;left:50%;top:calc(52% - 60px);transform:translate(-50%,-50%);width:39%;height:54%;display:grid;place-items:center;pointer-events:none}.prep-sprite{max-width:96%;max-height:96%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 8px 0 rgba(76,47,31,.18));pointer-events:auto;cursor:default}.prep-sprite.pulse{animation:prepPulse .6s steps(4,end) infinite alternate}@keyframes prepPulse{to{transform:translateY(-5px)}}.prep-action{position:absolute;z-index:14;left:50%;bottom:18%;transform:translateX(-50%);border:3px solid #6e4936;background:#fff7e8;color:#56372b;border-radius:10px;padding:.55rem .85rem;box-shadow:0 4px 0 rgba(65,40,29,.25);font-weight:1000;cursor:default}.prep-action:disabled{opacity:.5;cursor:default}
/* Unified cooking instruction UI: one source for prep, inventory, and oven guidance */
.prep-progress,.oven-status,.food-message{display:none!important}
.prep-action.unified-instruction{z-index:31;max-width:min(68%,720px);min-width:220px;white-space:normal;text-align:center;line-height:1.35;padding:.62rem 1rem;pointer-events:auto;position:absolute;overflow:hidden}
.prep-action.unified-instruction:disabled{opacity:1;cursor:default}
.prep-action.unified-instruction:not(:disabled){cursor:pointer;background:#fff0d3;box-shadow:0 5px 0 rgba(65,40,29,.28),inset 0 0 0 2px #f3d9ad}.prep-action.unified-instruction:not(:disabled):hover{background:#fff7e8;transform:translateX(-50%) translateY(-1px)}
.prep-action.unified-instruction.action-ready{animation:actionGlow 1.6s ease-in-out infinite}
.prep-action.unified-instruction.action-ready::after{content:'';position:absolute;top:-20%;left:-36%;width:28%;height:150%;background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.18) 20%,rgba(255,255,255,.6) 50%,rgba(255,255,255,.18) 80%,rgba(255,255,255,0) 100%);transform:skewX(-18deg);animation:actionShine 1.8s ease-in-out infinite;pointer-events:none}
@keyframes actionShine{0%{left:-38%;opacity:0}12%{opacity:1}55%{left:108%;opacity:1}100%{left:108%;opacity:0}}
@keyframes actionGlow{0%,100%{box-shadow:0 5px 0 rgba(65,40,29,.28),inset 0 0 0 2px #f3d9ad,0 0 0 rgba(255,236,188,0)}50%{box-shadow:0 5px 0 rgba(65,40,29,.28),inset 0 0 0 2px #f3d9ad,0 0 18px rgba(255,229,167,.55)}}

/* Gentle visual cue when a player taps the food instead of the highlighted recipe action. */
#prep-action.instruction-nudge{
  animation:recipeInstructionBob .72s cubic-bezier(.22,.85,.2,1) both !important;
  overflow:visible;
  isolation:isolate;
}
#prep-action.instruction-nudge::after{opacity:0;animation:none}
@keyframes recipeInstructionBob{
  0%,100%{transform:translateX(-50%) translateY(0) scale(1) rotate(0)}
  23%{transform:translateX(-50%) translateY(-9px) scale(1.055) rotate(-.65deg)}
  51%{transform:translateX(-50%) translateY(2px) scale(.99) rotate(.4deg)}
  74%{transform:translateX(-50%) translateY(-3px) scale(1.018) rotate(0)}
}
#prep-action .instruction-spark{
  position:absolute;z-index:4;display:block;line-height:1;
  color:#fff2a7;font:30px "Jersey 20","VT323",monospace;
  -webkit-text-stroke:1px #cb963b;
  text-shadow:0 1px 0 #8b582c,0 0 7px rgba(255,224,135,.8);
  pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.3);
  animation:recipeSparkPop .65s ease-out forwards;
}
#prep-action .instruction-spark:nth-of-type(1){left:1%;top:-12%;--spark-x:-10px;--spark-y:-15px;animation-delay:.05s}
#prep-action .instruction-spark:nth-of-type(2){left:100%;top:7%;--spark-x:11px;--spark-y:-12px;animation-delay:.12s;font-size:24px}
#prep-action .instruction-spark:nth-of-type(3){left:65%;top:-20%;--spark-x:3px;--spark-y:-21px;animation-delay:.19s;font-size:20px}
@keyframes recipeSparkPop{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.28) rotate(-25deg)}
  26%{opacity:1;transform:translate(-50%,-50%) scale(1.25) rotate(0deg)}
  65%{opacity:1}
  100%{opacity:0;transform:translate(calc(-50% + var(--spark-x)),calc(-50% + var(--spark-y))) scale(.35) rotate(25deg)}
}
@media(prefers-reduced-motion:reduce){
  #prep-action.instruction-nudge{animation:none!important;box-shadow:0 5px 0 rgba(65,40,29,.28),inset 0 0 0 2px #f3d9ad,0 0 0 4px #ffde87}
  #prep-action .instruction-spark{animation:none;opacity:1}
}

/* User glove cursor: permanent everywhere except the oven room. */
body,body *{cursor:url("assets/images/glove-default-90.png") 21 5,auto !important}
body.glove-pressed,body.glove-pressed *{cursor:url("assets/images/glove-clicked-90.png") 23 5,auto !important}

.prep-action.unified-instruction.instruction-hidden{display:none}
.prep-progress{position:absolute;z-index:14;left:4%;bottom:18%;width:26%;background:rgba(255,248,235,.94);border:3px solid #6e4936;border-radius:10px;padding:8px 10px;font-size:clamp(15px,calc(.72vw + 7px),19px);line-height:1.45}.prep-progress b{color:#91565e}
.ticket-item{display:flex;width:100%;align-items:center;gap:9px;margin-top:5px;border:2px solid #cba77f;background:#fffaf0;color:#57372a;border-radius:7px;padding:4px 7px;text-align:left;cursor:pointer}.ticket-item:hover{background:#f8e6cf}.ticket-item.done{text-decoration:line-through;opacity:.55}.ticket-item.busy{outline:2px solid #d88891}.ticket-item:disabled{cursor:default}.ticket small{display:block;color:#8b7463;margin-top:3px}.ticket-item-art{flex:0 0 48px;width:48px;height:48px;display:grid;place-items:center;overflow:hidden}.ticket-item-art img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 2px 0 rgba(74,45,31,.14))}.ticket-item-art.drink img{max-width:none;max-height:none;object-fit:contain}.ticket-item-art.drink-coffee img{width:220%;height:220%;transform:translateY(-19%)}.ticket-item-art.drink-matcha img{width:190%;height:190%;transform:translateY(-19%)}.ticket-item-art.drink-strawberry img{width:200%;height:200%;transform:translateY(-18%)}
.oven-food-stage{position:absolute;z-index:16;left:50%;top:calc(59.5% - 50px);transform:translate(-50%,-50%);width:25%;height:20%;display:grid;place-items:center;pointer-events:none}
.oven-food-stage img{max-width:82%;max-height:82%;object-fit:contain;image-rendering:pixelated;pointer-events:auto;cursor:inherit;filter:drop-shadow(0 5px 0 rgba(40,24,16,.25))}
.oven-status{position:absolute;z-index:17;left:50%;bottom:15%;transform:translateX(-50%);background:rgba(255,248,235,.96);border:3px solid #704a37;border-radius:16px;padding:8px 12px;font-size:19px;color:#53352a;box-shadow:0 6px 0 rgba(91,58,41,.24);text-align:center;max-width:58%;display:none}
.oven-status.show{display:block}
.oven-hotspot{position:absolute;z-index:15;left:50%;top:calc(69.5% - 125px);transform:translate(-50%,-50%);width:30%;height:calc(22% + 250px);background:transparent;border:0;border-radius:24px;pointer-events:auto;cursor:inherit!important}
body.glove-pressed .oven-hotspot,body.glove-pressed .oven-hotspot *{cursor:url("assets/images/1dd4c66895e31454.webp") 27 24, auto!important}
/* Oven page uses the mitt as its default cursor everywhere. */
body.oven-room,body.oven-room *{cursor:url("assets/images/1dd4c66895e31454.webp") 27 24,auto !important}

.oven-hotspot:hover,.oven-hotspot:focus-visible{outline:none}
.scene[data-scene="oven"]:not(.active) .oven-hotspot,.scene[data-scene="oven"]:not(.active) .oven-food-stage img{pointer-events:none !important;cursor:auto !important}
.scene[data-scene="oven"].mitt-busy,.scene[data-scene="oven"].mitt-busy *{cursor:inherit!important}
/* Full-page oven cursor: the oven mitt is the default everywhere in the oven room. */
body.oven-room,body.oven-room *{cursor:url("assets/images/1dd4c66895e31454.webp") 27 24,auto !important}

#oven-mitt-pull{position:absolute;z-index:18;left:50%;top:calc(67% - 100px);width:128px;height:128px;transform:translate(-50%,-50%) translateY(0);image-rendering:pixelated;pointer-events:none;opacity:0}
#oven-mitt-pull.show{animation:mittPull .9s ease-out forwards}
@keyframes mittPull{0%{opacity:0;transform:translate(-50%,-50%) translateY(-8px) scale(1)}10%{opacity:1;transform:translate(-50%,-50%) translateY(-4px) scale(1)}30%{opacity:1;transform:translate(-50%,-50%) translateY(8px) scale(1)}55%{opacity:1;transform:translate(-50%,-50%) translateY(18px) scale(1)}78%{opacity:.88;transform:translate(-50%,-50%) translateY(26px) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) translateY(32px) scale(.96)}}
.finished-dock{position:absolute;z-index:27;left:1.3%;bottom:2.1%;display:flex;gap:7px;align-items:center}
.bake-dock{position:absolute;z-index:28;left:1.3%;bottom:calc(2.1% + 88px);transform:none;display:flex;gap:8px;align-items:center;pointer-events:none}
.tool-inventory{position:absolute;z-index:29;left:50%;bottom:1.35%;transform:translateX(-50%);display:none;align-items:center;max-width:72%;padding:8px 10px 9px;gap:7px;overflow-x:auto;overflow-y:hidden;pointer-events:auto;background:linear-gradient(180deg,#8d5b36 0%,#754426 46%,#63371f 47%,#794a2b 100%);border:4px solid #4d2b1b;border-radius:10px;box-shadow:0 5px 0 rgba(45,25,15,.34),inset 0 0 0 2px #a96f42,inset 0 3px 0 rgba(255,221,168,.16)}
.tool-inventory.show{display:flex}
.tool-inventory::before,.tool-inventory::after{content:"";position:absolute;left:10px;right:10px;height:2px;background:rgba(231,180,111,.18);pointer-events:none}.tool-inventory::before{top:5px}.tool-inventory::after{bottom:5px}
.tool-slot{position:relative;flex:0 0 88px;width:88px;height:88px;padding:2px;touch-action:none;border:2px solid #4b2b1c;border-radius:5px;background:linear-gradient(180deg,#b77c4b,#966039);box-shadow:inset 0 0 0 2px rgba(241,196,133,.18),0 2px 0 rgba(43,25,16,.32);cursor:pointer;transition:transform .12s ease,filter .12s ease,outline-color .12s ease;outline:0 solid transparent}
.tool-slot:hover,.tool-slot:focus-visible{transform:translateY(-3px);filter:brightness(1.07);outline:2px solid #efd7ae;outline-offset:1px}
.tool-slot.selected{outline:4px solid #d9ad72;outline-offset:1px;background:linear-gradient(180deg,#c58b58,#a56b40);box-shadow:inset 0 0 0 2px rgba(255,225,177,.28),0 3px 0 rgba(43,25,16,.35)}
.tool-slot img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;pointer-events:none;filter:drop-shadow(0 2px 0 rgba(55,30,19,.18));transform:scale(1.15);transform-origin:center center}
.tool-slot[aria-pressed="true"]::after{content:"";position:absolute;inset:3px;border:1px solid rgba(255,229,188,.38);pointer-events:none}
.tool-slot.dragging{opacity:.48;transform:translateY(1px) scale(.96)}
body.tool-drag-active .prep-stage::before,.prep-stage.tool-drop-ready::before{content:none!important;display:none!important}
@keyframes toolTargetPulse{to{box-shadow:0 0 0 7px rgba(255,238,203,.18),inset 0 0 28px rgba(217,173,114,.32)}}
.tool-drag-ghost{position:fixed;z-index:9999;width:219px;height:293px;object-fit:contain;image-rendering:pixelated;pointer-events:none;transform:translate(-50%,-50%) scale(1.03);filter:drop-shadow(0 7px 0 rgba(57,33,20,.24));will-change:left,top,transform,opacity}
.tool-drag-ghost.wrong{animation:wrongTool .42s ease-in-out forwards}
@keyframes wrongTool{0%{transform:translate(-50%,-50%) rotate(0)}18%{transform:translate(calc(-50% - 7px),-50%) rotate(-7deg)}36%{transform:translate(calc(-50% + 7px),-50%) rotate(7deg)}55%{transform:translate(calc(-50% - 5px),-50%) rotate(-5deg)}75%{transform:translate(calc(-50% + 4px),-50%) rotate(4deg)}100%{transform:translate(-50%,calc(-50% - 10px)) scale(.84);opacity:0}}
.tool-action-overlay{position:fixed;z-index:10000;width:258px;height:336px;object-fit:contain;image-rendering:pixelated;pointer-events:none;left:0;top:0;transform:translate(-50%,-50%);filter:drop-shadow(0 8px 0 rgba(62,37,22,.2));will-change:transform,opacity}
.tool-action-overlay.anim-whisk{animation:toolWhisk 1.05s ease-in-out forwards}
.tool-action-overlay.anim-woodenSpoon{animation:toolStir 1.05s ease-in-out forwards}
.tool-action-overlay.anim-spatula{animation:toolFold 1.0s ease-in-out forwards}
.tool-action-overlay.anim-rollingPin{animation:toolRoll 1.15s ease-in-out forwards}
.tool-action-overlay.anim-pipingBag{animation:toolPipe 1.15s ease-in-out forwards}
.tool-action-overlay.anim-matchaWhisk{animation:toolMatcha 1.05s steps(8,end) forwards}
.tool-action-overlay.anim-measuringSpoons{animation:toolTip .9s ease-in-out forwards}
.tool-action-overlay.anim-measuringCup{animation:toolPour 1.12s ease-in-out forwards}
.tool-action-overlay.anim-sifter{animation:toolSift 1.02s steps(8,end) forwards}
.tool-action-overlay.anim-icingSpatula{animation:toolIce 1.12s ease-in-out forwards}

/* --- hands-on cooking mini interactions --- */
.tool-minigame{position:fixed;z-index:10004;box-sizing:border-box;border:0;border-radius:24px;background:transparent;box-shadow:none;touch-action:none;user-select:none;overflow:visible;pointer-events:auto}
.tool-minigame.active{animation:miniZoneIn .2s ease-out both}
@keyframes miniZoneIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
.tool-mini-gesture{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);width:min(58%,228px);max-width:228px;height:auto;image-rendering:pixelated;pointer-events:none;filter:drop-shadow(0 5px 0 rgba(74,47,31,.18));opacity:.98}
.tool-minigame.mini-roll .tool-mini-gesture,.tool-minigame.mini-shake .tool-mini-gesture,.tool-minigame.mini-matcha .tool-mini-gesture{width:min(72%,294px);max-width:294px}
.tool-mini-tool{position:absolute;z-index:3;width:min(38%,150px);height:min(52%,190px);object-fit:contain;image-rendering:pixelated;pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%) scale(2.07);transform-origin:center center;filter:drop-shadow(0 6px 0 rgba(57,33,20,.22));will-change:left,top,transform}
.tool-mini-hint{position:absolute;z-index:6;left:50%;bottom:-52px;transform:translateX(-50%);min-width:max-content;max-width:420px;padding:8px 14px;border:3px solid #6e4936;border-radius:999px;background:#fff8ea;color:#56372b;box-shadow:0 5px 0 rgba(65,40,29,.22),inset 0 0 0 2px #fffdf7;font-family:"VT323",monospace;font-size:21px;line-height:1.05;text-align:center;pointer-events:none}
.tool-mini-progress{position:absolute;z-index:6;top:-30px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:5px 9px;border:3px solid #6e4936;border-radius:999px;background:rgba(255,247,232,.98);box-shadow:0 4px 0 rgba(65,40,29,.2);pointer-events:none}
.tool-mini-progress span{display:block;width:10px;height:10px;border-radius:50%;background:#d8c6aa;box-shadow:inset 0 0 0 1px #8c6b50}
.tool-mini-progress span.done{background:#f3c96f;box-shadow:inset 0 0 0 1px #9a6334,0 0 7px rgba(246,201,109,.65)}
.tool-minigame.complete{animation:miniComplete .32s ease-out both}
@keyframes miniComplete{50%{transform:scale(1.025)}100%{transform:scale(1)}}
.pipe-spot{position:absolute;z-index:5;width:32px;height:32px;border:3px solid #8c5b3b;border-radius:50%;background:rgba(255,245,220,.95);box-shadow:0 3px 0 rgba(65,40,29,.22),inset 0 0 0 3px #f2d3a7;transform:translate(-50%,-50%);cursor:pointer;animation:pipeSpotPulse .75s ease-in-out infinite alternate}
.pipe-spot::after{content:'✦';display:grid;place-items:center;width:100%;height:100%;color:#c88951;font-size:18px}
.pipe-spot.done{pointer-events:none;background:#f6dcae;border-color:#b2774e;animation:none;transform:translate(-50%,-50%) scale(.75);opacity:.45}
@keyframes pipeSpotPulse{to{transform:translate(-50%,-50%) scale(1.12)}}
.pour-meter{position:absolute;z-index:7;right:-48px;top:4%;width:38px;height:92%;border:4px solid #6e4936;border-radius:20px;background:linear-gradient(180deg,#fff6e6 0%,#f4e0ba 100%);box-shadow:0 5px 0 rgba(65,40,29,.22),inset 0 0 0 4px #fffbee,inset 0 -14px 20px rgba(222,188,128,.26);overflow:hidden;pointer-events:none}
.pour-meter::before{content:"";position:absolute;left:7px;right:7px;top:8px;bottom:8px;border-radius:13px;background:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,255,255,0));pointer-events:none}
.pour-meter-fill{position:absolute;left:5px;right:5px;bottom:5px;height:0%;border-radius:12px 12px 10px 10px;background:linear-gradient(180deg,#dff2ff 0%,#b4d3ea 48%,#82acd0 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,.62);transition:height .05s linear}
.pour-meter-target{position:absolute;left:4px;right:4px;bottom:62%;height:24%;border:2px solid #70955f;border-radius:999px;background:rgba(175,214,147,.7);box-shadow:inset 0 0 0 2px rgba(255,255,255,.34);box-sizing:border-box}
.pour-meter-label{position:absolute;z-index:8;right:-95px;top:38%;padding:4px 10px;border-radius:999px;background:#fff7e8;border:3px solid #6e4936;color:#5b3a2b;box-shadow:0 4px 0 rgba(65,40,29,.18);font-family:"Jersey 20","VT323",monospace;font-size:18px;pointer-events:none;white-space:nowrap;letter-spacing:.02em}
.tool-minigame.pour-active .tool-mini-tool{transform:translate(-50%,-50%) rotate(-24deg) scale(2.07)}
.tool-minigame.shake-active .tool-mini-tool{filter:drop-shadow(0 6px 0 rgba(57,33,20,.22)) brightness(1.04)}
.tool-minigame.shake-active .tool-mini-gesture,.tool-minigame.mini-roll .tool-mini-gesture{animation:gestureSway .62s ease-in-out infinite alternate}
.tool-minigame.mini-circle .tool-mini-gesture{animation:gestureTurn 1.3s linear infinite}
@keyframes gestureSway{from{transform:translate(-52%,-50%)}to{transform:translate(-48%,-50%)}}
@keyframes gestureTurn{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@media(max-width:700px){.tool-mini-gesture{max-width:184px}.tool-minigame.mini-roll .tool-mini-gesture,.tool-minigame.mini-shake .tool-mini-gesture,.tool-minigame.mini-matcha .tool-mini-gesture{max-width:238px}.tool-mini-hint{bottom:-42px;font-size:17px;max-width:290px}.tool-mini-progress{top:-24px}.pipe-spot{width:28px;height:28px}.pour-meter{right:-36px;width:28px}.pour-meter-label{display:none}}
@keyframes toolWhisk{0%{opacity:0;transform:translate(-50%,-58%) rotate(-8deg) scale(.92)}12%{opacity:1}30%{transform:translate(-43%,-50%) rotate(12deg)}48%{transform:translate(-57%,-44%) rotate(-11deg)}66%{transform:translate(-44%,-54%) rotate(13deg)}84%{opacity:1;transform:translate(-55%,-48%) rotate(-8deg)}100%{opacity:0;transform:translate(-50%,-44%) rotate(0) scale(.96)}}
@keyframes toolStir{0%{opacity:0;transform:translate(-58%,-62%) rotate(-18deg)}12%{opacity:1}30%{transform:translate(-36%,-48%) rotate(12deg)}50%{transform:translate(-52%,-34%) rotate(28deg)}70%{transform:translate(-68%,-49%) rotate(-8deg)}88%{opacity:1;transform:translate(-52%,-60%) rotate(-20deg)}100%{opacity:0;transform:translate(-50%,-54%) rotate(-10deg)}}
@keyframes toolFold{0%{opacity:0;transform:translate(-62%,-64%) rotate(-25deg)}12%{opacity:1}36%{transform:translate(-38%,-45%) rotate(22deg)}58%{transform:translate(-58%,-35%) rotate(8deg)}80%{opacity:1;transform:translate(-35%,-52%) rotate(28deg)}100%{opacity:0;transform:translate(-50%,-47%) rotate(12deg)}}
@keyframes toolRoll{0%{opacity:0;transform:translate(-50%,-78%) rotate(-42deg)}12%{opacity:1}34%{transform:translate(-50%,-58%) rotate(-42deg)}62%{transform:translate(-50%,-32%) rotate(-42deg)}84%{opacity:1;transform:translate(-50%,-54%) rotate(-42deg)}100%{opacity:0;transform:translate(-50%,-42%) rotate(-42deg)}}
@keyframes toolPipe{0%{opacity:0;transform:translate(-50%,-72%) rotate(10deg) scale(.94)}14%{opacity:1}32%{transform:translate(-58%,-46%) rotate(8deg) scale(1)}45%{transform:translate(-58%,-43%) rotate(8deg) scale(.94)}58%{transform:translate(-42%,-47%) rotate(-8deg) scale(1)}72%{transform:translate(-42%,-44%) rotate(-8deg) scale(.94)}88%{opacity:1;transform:translate(-50%,-48%) rotate(0) scale(1)}100%{opacity:0;transform:translate(-50%,-42%) scale(.96)}}
@keyframes toolMatcha{0%{opacity:0;transform:translate(-50%,-58%) rotate(-4deg)}10%{opacity:1}20%{transform:translate(-57%,-48%) rotate(-8deg)}30%{transform:translate(-43%,-48%) rotate(8deg)}40%{transform:translate(-58%,-46%) rotate(-9deg)}50%{transform:translate(-42%,-46%) rotate(9deg)}60%{transform:translate(-57%,-45%) rotate(-8deg)}70%{transform:translate(-43%,-45%) rotate(8deg)}84%{opacity:1;transform:translate(-50%,-48%) rotate(0)}100%{opacity:0;transform:translate(-50%,-44%) rotate(0)}}
@keyframes toolTip{0%{opacity:0;transform:translate(-62%,-66%) rotate(-28deg)}14%{opacity:1}38%{transform:translate(-50%,-48%) rotate(-18deg)}62%{transform:translate(-44%,-44%) rotate(36deg)}82%{opacity:1;transform:translate(-48%,-48%) rotate(18deg)}100%{opacity:0;transform:translate(-50%,-44%) rotate(0)}}
@keyframes toolPour{0%{opacity:0;transform:translate(-72%,-68%) rotate(0deg)}14%{opacity:1}40%{transform:translate(-58%,-50%) rotate(20deg)}68%{transform:translate(-52%,-46%) rotate(52deg)}84%{opacity:1;transform:translate(-54%,-48%) rotate(36deg)}100%{opacity:0;transform:translate(-50%,-44%) rotate(0deg)}}
@keyframes toolSift{0%{opacity:0;transform:translate(-50%,-66%) rotate(-8deg)}10%{opacity:1}20%{transform:translate(-58%,-56%) rotate(-12deg)}30%{transform:translate(-42%,-56%) rotate(12deg)}40%{transform:translate(-58%,-54%) rotate(-12deg)}50%{transform:translate(-42%,-54%) rotate(12deg)}60%{transform:translate(-58%,-52%) rotate(-12deg)}70%{transform:translate(-42%,-52%) rotate(12deg)}84%{opacity:1;transform:translate(-50%,-50%) rotate(0)}100%{opacity:0;transform:translate(-50%,-45%) rotate(0)}}
@keyframes toolIce{0%{opacity:0;transform:translate(-72%,-54%) rotate(14deg)}12%{opacity:1}32%{transform:translate(-28%,-50%) rotate(14deg)}52%{transform:translate(-68%,-44%) rotate(10deg)}72%{transform:translate(-30%,-40%) rotate(14deg)}88%{opacity:1;transform:translate(-52%,-44%) rotate(12deg)}100%{opacity:0;transform:translate(-46%,-40%) rotate(10deg)}}
.tool-fx{position:fixed;z-index:9998;pointer-events:none;width:120px;height:90px;transform:translate(-50%,-25%)}
.tool-fx span{position:absolute;width:6px;height:6px;background:#f3dfb4;box-shadow:6px 5px 0 #fff3d5,-7px 12px 0 #e8c993;animation:toolDust .9s ease-out forwards}
.tool-fx.pour::before{content:"";position:absolute;left:57%;top:4px;width:7px;height:72px;background:linear-gradient(#f7ead0,#fff7e8);border-radius:4px;opacity:.9;animation:pourFade 1.05s ease-in-out forwards}
.tool-fx.pipe span{width:9px;height:9px;border-radius:50%;background:#fff6df;box-shadow:none}
@keyframes toolDust{0%{opacity:0;transform:translateY(-8px) scale(.6)}20%{opacity:1}100%{opacity:0;transform:translateY(55px) scale(.9)}}
@keyframes pourFade{0%,20%{opacity:0;height:8px}36%,72%{opacity:.92;height:72px}100%{opacity:0;height:28px}}
body.tool-drag-active{user-select:none}


.bake-item{width:76px;height:62px;border:3px solid #6d4734;border-radius:10px;background:#fff7e8;box-shadow:0 4px 0 rgba(62,39,28,.25);padding:3px;cursor:pointer;pointer-events:auto;position:relative}
.bake-item.selected{outline:4px solid #e2ae62;transform:translateY(-4px)}
.bake-item img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}
.bake-item-label{position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);white-space:nowrap;font-size:16px;font-weight:900;color:#57372b;background:#fff7e8;border:2px solid #6d4734;border-radius:6px;padding:1px 5px}
.oven-timer{min-width:170px}.oven-timer-row{display:flex;justify-content:space-between;gap:10px;align-items:center}.oven-timer-track{height:9px;margin-top:6px;border:2px solid #704a37;border-radius:7px;background:#ead9bd;overflow:hidden}.oven-timer-fill{height:100%;width:100%;background:#b98763;transition:width .09s linear}
.finished-item{width:58px;height:58px;border:3px solid #6d4734;border-radius:10px;background:#fff7e8;box-shadow:0 4px 0 rgba(62,39,28,.25);padding:3px;cursor:pointer;position:relative}.finished-item.selected{outline:4px solid #e2ae62;transform:translateY(-4px)}.finished-item img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.finished-item .qty{position:absolute;right:-5px;bottom:-5px;background:#8a5c43;color:white;border-radius:9px;padding:1px 5px;font-size:17px}
.icon-button{display:grid;place-items:center;background:transparent;border:0;padding:0;cursor:pointer;image-rendering:pixelated;transition:transform .14s ease,filter .14s ease}.icon-button img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;pointer-events:none;filter:drop-shadow(0 6px 0 rgba(62,37,22,.18))}.icon-button:hover{transform:translateY(-2px);filter:brightness(1.03)}.icon-button:active{transform:translateY(1px)}.icon-button:focus-visible{outline:4px solid #e8c992;outline-offset:3px;border-radius:16px}.recipe-button{position:absolute;z-index:29;left:calc(1.15% + 84px);top:1.4%;width:74px;height:74px}.recipe-book{display:none;position:absolute;z-index:30;left:1.3%;top:88px;width:min(31%,410px);max-height:78%;overflow:auto;background:#fff1cf;border:4px solid #714934;border-radius:12px;box-shadow:7px 8px 0 rgba(63,39,28,.26),inset 0 0 0 3px #e9c68e;padding:12px}.recipe-book.show{display:block}.recipe-book h3{margin:0 0 7px;color:#8d525a}.recipe-tabs{display:flex;flex-wrap:wrap;gap:5px}.recipe-tab{border:2px solid #9a7659;background:#fff9e9;border-radius:7px;padding:4px 6px;cursor:pointer;font-size:17px}.recipe-tab.active{background:#dfe5cb}.recipe-tab.locked{opacity:.58;filter:saturate(.6);cursor:not-allowed;background:#eadfce;color:#806d60}.recipe-tab.locked::after{content:" 🔒"}.recipe-lock-note{margin-top:10px;padding:9px 11px;border:2px solid #a98769;border-radius:9px;background:#f6e8cf;color:#765441;font-family:"Jersey 20","VT323",monospace;font-size:18px}.unlock-toast{position:fixed;z-index:23000;left:50%;top:16%;transform:translate(-50%,-10px);opacity:0;pointer-events:none;padding:10px 16px;border:3px solid #6f4a35;border-radius:13px;background:#fff4d7;color:#694631;box-shadow:0 6px 0 rgba(66,40,26,.22),inset 0 0 0 2px #fffaf0;font-family:"Jersey 20","VT323",monospace;font-size:24px;text-align:center;white-space:nowrap}.unlock-toast.show{animation:unlockToast 2.25s ease-out both}@keyframes unlockToast{0%{opacity:0;transform:translate(-50%,-8px) scale(.94)}12%{opacity:1;transform:translate(-50%,0) scale(1.04)}76%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-10px) scale(.98)}}.recipe-detail{margin-top:10px;border-top:2px dashed #b88e68;padding-top:9px;font-size:clamp(15px,calc(.72vw + 7px),19px);line-height:1.5}.recipe-detail .current{background:#f1d5d7;border-radius:5px;padding:2px 4px}.recipe-detail ul{padding-left:18px;margin:.35rem 0}.recipe-detail ol{padding-left:19px;margin:.35rem 0}
@media(max-width:700px){.ingredient-btn{width:12%}.prep-stage{width:58%}.collect-dock{top:9%}.collect-slot{width:32px;height:32px}.recipe-button{width:62px;height:62px;left:calc(1% + 72px);top:1%}.recipe-book{width:55%;top:74px}.finished-item{width:46px;height:46px}.bake-item{width:62px;height:52px}.food-message{max-width:72%}.oven-food-stage{width:38%;height:20%}.tool-inventory{max-width:86%;gap:5px;padding:6px 8px 7px}.tool-slot{flex-basis:75px;width:75px;height:75px}}


.prep-overlay{position:absolute;inset:0;margin:auto;max-width:96%;max-height:96%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 8px 0 rgba(76,47,31,.18));pointer-events:none;display:none;opacity:0}
.prep-overlay.coffee-filter-drop{display:block;animation:coffeeFilterDrop .42s ease-out both}
@keyframes coffeeFilterDrop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
.prep-overlay.strawberry-jug-drop{display:block;animation:strawberryJugDrop .65s ease-in-out both}
@keyframes strawberryJugDrop{0%{opacity:0;transform:translateY(-10px)}35%{opacity:1;transform:translateY(-4px)}72%{opacity:1;transform:translateY(4px)}100%{opacity:0;transform:translateY(10px)}}
.prep-overlay.matcha-jug-drop{display:block;animation:matchaJugDrop .7s ease-in-out both}
@keyframes matchaJugDrop{0%{opacity:0;transform:translateY(0)}25%{opacity:1;transform:translateY(2px)}72%{opacity:1;transform:translateY(10px)}100%{opacity:0;transform:translateY(10px)}}


/* v34 recipe drop animations + soundtrack control */
.recipe-drop-sprite{position:absolute;z-index:35;pointer-events:none;image-rendering:pixelated;object-fit:contain;opacity:0;will-change:transform,opacity;filter:drop-shadow(0 5px 0 rgba(76,47,31,.16))}
.recipe-drop-sprite.drop-in{animation:recipeDropFade .72s ease-out forwards}
@keyframes recipeDropFade{0%{opacity:0;transform:translate(-50%,-50%) translateY(-10px) scale(.94)}72%{opacity:1;transform:translate(-50%,-50%) translateY(2px) scale(1.02)}100%{opacity:1;transform:translate(-50%,-50%) translateY(0) scale(1)}}
#music-toggle{position:absolute;z-index:22000;left:1.15%;top:1.4%;width:74px;height:74px}
#music-toggle img{filter:drop-shadow(0 6px 0 rgba(62,37,22,.24))}
@media(max-width:700px){#music-toggle{left:1%;top:1%;width:62px;height:62px}}

/* Café coin economy HUD */
.economy-panel{position:absolute;z-index:22010;right:1.35%;top:1.25%;display:flex;align-items:flex-start;gap:6px;pointer-events:none}.system-placeholder{display:none}.coin-hud,.mushroom-hud,.level-hud{position:relative;display:flex;align-items:center;gap:6px;min-height:36px;padding:5px 8px;border:2px solid #704a37;border-radius:10px;background:rgba(255,248,235,.97);box-shadow:0 3px 0 rgba(65,40,29,.22),inset 0 0 0 1px #efd3ab;color:#5b3a2b;image-rendering:pixelated;pointer-events:none;flex-shrink:0}.coin-hud{min-width:60px}.mushroom-hud{min-width:70px}.level-hud{min-width:150px;flex-direction:column;align-items:stretch;justify-content:center;gap:5px;padding-top:5px;padding-bottom:6px}.hud-icon{display:block;flex:0 0 auto;image-rendering:pixelated;filter:drop-shadow(0 1px 0 rgba(62,37,22,.12))}.coin-hud .hud-icon{width:18px;height:18px}.mushroom-hud .hud-icon{width:22px;height:14px}.hud-copy{display:flex;align-items:center;min-width:0;line-height:1}.coin-label,.mushroom-label{display:none}.coin-count,.mushroom-count,.level-badge{font-family:"Jersey 20","VT323",monospace;font-size:18px;line-height:1;font-weight:1000;color:#5b3a2b;text-shadow:none}.level-top{display:flex;justify-content:space-between;align-items:center;width:100%;gap:6px}.level-label{font-family:"Jersey 20","VT323",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#8c7462;text-shadow:none}.xp-readout{font-family:"Jersey 20","VT323",monospace}.xp-readout{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.xp-bar{position:relative;width:100%;height:9px;border-radius:999px;background:#e6dacb;box-shadow:inset 0 0 0 1px rgba(112,62,152,.24);overflow:hidden}.xp-fill{position:absolute;left:0;top:0;bottom:0;width:0%;background:linear-gradient(90deg,#ba8bf6 0%,#dbbffd 100%)}.coin-hud.bump{animation:coinHudBump .48s ease-out}.coin-reward,.level-reward{position:absolute;z-index:22020;right:1.8%;top:52px;opacity:0;pointer-events:none;background:#fff3cf;border:3px solid #71472b;border-radius:9px;padding:6px 10px;box-shadow:0 5px 0 rgba(56,34,21,.25);font-family:"Jersey 20","VT323",monospace;font-size:22px;color:#704226;white-space:nowrap;transform:translateY(4px)}.coin-reward.show,.level-reward.show{animation:coinRewardFloat 1.55s ease-out both}.level-reward{top:86px;background:#f5ebff;border-color:#7748a6;color:#6c3e99}.xp-float{position:fixed;z-index:22030;pointer-events:none;animation:xpFloat .95s ease-out forwards}.xp-float img{display:block;height:20px;width:auto;image-rendering:pixelated;filter:drop-shadow(0 4px 0 rgba(62,37,22,.18))}@keyframes xpFloat{0%{opacity:0;transform:translateY(0)}12%{opacity:1}100%{opacity:0;transform:translateY(-20px)}}@media(max-width:700px){.recipe-button{width:62px;height:62px;left:calc(1% + 72px);top:1%}.recipe-book{width:55%;top:74px}.economy-panel{right:1%;top:1%;gap:4px}.coin-hud,.mushroom-hud,.level-hud{min-height:30px;padding:4px 6px;border-radius:9px}.coin-hud{min-width:50px}.mushroom-hud{min-width:58px}.level-hud{min-width:118px}.coin-hud .hud-icon{width:15px;height:15px}.mushroom-hud .hud-icon{width:18px;height:12px}.coin-count,.mushroom-count,.level-badge{font-size:15px}.level-label{font-size:8px}.xp-bar{height:7px}.coin-reward,.level-reward{right:1.2%;font-size:16px}.coin-reward{top:44px}.level-reward{top:74px}.xp-float img{height:16px}}


/* ===== v23 interior shop ===== */
.shop-button{position:absolute;z-index:22005;left:calc(1.15% + 168px);top:1.4%;width:74px;height:74px}
.shop-overlay{position:absolute;inset:0;z-index:30000;display:none;align-items:center;justify-content:center;padding:4.5% 5%;background:rgba(41,27,21,.56);backdrop-filter:blur(2px);pointer-events:auto}
.shop-overlay.show{display:flex}
.shop-window{position:relative;width:min(91%,1420px);height:min(86%,800px);display:flex;flex-direction:column;overflow:hidden;border:5px solid #694632;border-radius:22px;background:linear-gradient(180deg,#fff9e9 0%,#f6dfbd 100%);box-shadow:0 14px 0 rgba(52,31,23,.34),0 22px 48px rgba(0,0,0,.28),inset 0 0 0 4px #e9bd84;color:#533629}
.shop-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 66px 12px 22px;border-bottom:4px solid #86614a;background:linear-gradient(180deg,#e7edca,#d6e2bd);box-shadow:0 4px 0 rgba(91,57,41,.08)}
.shop-title-wrap h2{margin:0;font-family:"Jersey 20","VT323",monospace;font-size:clamp(30px,2.35vw,48px);font-weight:400;color:#704733;line-height:.95}.shop-title-wrap p{margin:3px 0 0;font-size:clamp(14px,1vw,20px);color:#8b6b56}
.shop-balance{display:flex;align-items:center;gap:7px;min-width:94px;padding:7px 10px;border:3px solid #8b6248;border-radius:12px;background:#fff8e8;box-shadow:0 3px 0 rgba(87,53,35,.18);font-family:"Jersey 20","VT323",monospace;font-size:25px;color:#69412d;white-space:nowrap}.shop-balance img{width:27px;height:27px;object-fit:contain;image-rendering:pixelated}
.shop-close{position:absolute;right:14px;top:12px;width:42px;height:42px;border:3px solid #7b5138;border-radius:10px;background:#f3d4ba;color:#70402f;font-family:"Jersey 20","VT323",monospace;font-size:31px;line-height:1;cursor:pointer;box-shadow:0 3px 0 rgba(68,40,28,.22)}.shop-close:hover{transform:translateY(-1px);filter:brightness(1.03)}.shop-close:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(68,40,28,.22)}
.shop-scroll{flex:1;overflow:auto;padding:16px 18px 18px;scrollbar-color:#a97a58 #f5dfc2}.shop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.shop-card{position:relative;overflow:hidden;border:3px solid #866047;border-radius:15px;background:#fffaf0;box-shadow:0 5px 0 rgba(81,49,35,.18);transition:transform .14s ease,box-shadow .14s ease}.shop-card:hover{transform:translateY(-2px);box-shadow:0 7px 0 rgba(81,49,35,.18)}.shop-card.equipped{border-color:#70845e;box-shadow:0 0 0 3px #d5e3bd,0 5px 0 rgba(81,49,35,.18)}
.shop-preview{position:relative;aspect-ratio:16/9;overflow:hidden;border-bottom:3px solid #866047;background:#dac4a8}.shop-preview img{display:block;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;transition:transform .22s ease}.shop-card:hover .shop-preview img{transform:scale(1.025)}.shop-owned-ribbon{position:absolute;right:8px;top:8px;padding:4px 8px;border:2px solid #557047;border-radius:8px;background:#eff6dd;color:#4f6b42;font-family:"Jersey 20","VT323",monospace;font-size:16px;box-shadow:0 2px 0 rgba(65,83,52,.2)}
.shop-card-body{padding:10px 11px 11px}.shop-card-name{margin:0;font-family:"Jersey 20","VT323",monospace;font-size:clamp(22px,1.45vw,29px);font-weight:400;color:#68442f;line-height:1}.shop-card-desc{min-height:34px;margin:5px 0 9px;font-size:clamp(13px,.78vw,17px);line-height:1.15;color:#8a6d5a}.shop-card-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px}.shop-price{display:flex;align-items:center;gap:5px;font-family:"Jersey 20","VT323",monospace;font-size:22px;color:#74492f}.shop-price img{width:22px;height:22px;object-fit:contain;image-rendering:pixelated}.shop-buy{min-width:94px;border:3px solid #704a37;border-radius:9px;padding:6px 10px;background:#e8b978;color:#563521;font-family:"Jersey 20","VT323",monospace;font-size:20px;line-height:1;cursor:pointer;box-shadow:0 3px 0 rgba(74,43,28,.25)}.shop-buy:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.04)}.shop-buy:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 rgba(74,43,28,.25)}.shop-buy.owned{background:#d8e6c1;border-color:#667d55;color:#4b603f}.shop-buy.equipped{background:#78906a;color:#fff9e9;border-color:#506345}.shop-buy:disabled{opacity:.72;cursor:default}.shop-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 18px 12px;border-top:2px dashed #ba8c69;background:rgba(255,248,232,.74);font-size:15px;color:#846651}.shop-original{border:2px solid #80604a;border-radius:8px;padding:5px 9px;background:#fff9eb;color:#694a37;font-family:"Jersey 20","VT323",monospace;font-size:17px;cursor:pointer}.shop-toast{position:absolute;left:50%;bottom:18px;transform:translate(-50%,14px);opacity:0;pointer-events:none;z-index:4;padding:7px 12px;border:3px solid #704a37;border-radius:10px;background:#fff4d9;color:#68432f;box-shadow:0 4px 0 rgba(68,39,25,.2);font-family:"Jersey 20","VT323",monospace;font-size:20px;white-space:nowrap}.shop-toast.show{animation:shopToast 1.5s ease both}@keyframes shopToast{0%{opacity:0;transform:translate(-50%,14px)}14%,76%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-8px)}}
.shop-section-title{grid-column:1/-1;display:flex;flex-direction:column;gap:2px;margin:4px 0 -2px;padding-top:2px;font-family:"Jersey 20","VT323",monospace;font-size:24px;line-height:1;color:#6b4732}.shop-section-note{font-size:13px;color:#8b6b57;line-height:1.1}.shop-card.cursor-card .shop-preview{background:radial-gradient(circle at center,#fff8ea 0,#f4e2c4 60%,#e2c39b 100%)}.shop-card.cursor-card .shop-preview img{object-fit:contain;padding:10px;image-rendering:pixelated;filter:none}.shop-card.cursor-card:hover .shop-preview img{transform:none}.shop-footer{flex-wrap:wrap}.shop-footer>span{flex:1 1 260px}.shop-footer-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}

@media(max-width:900px){.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shop-window{width:94%;height:88%}.shop-header{padding-left:50px}}
@media(max-width:700px){.shop-button{left:calc(1% + 144px);top:1%;width:62px;height:62px}.shop-overlay{padding:7% 3% 4%}.shop-window{width:96%;height:87%;border-width:3px;border-radius:15px}.shop-header{padding:11px 48px 9px 37px}.shop-title-wrap p{display:none}.shop-title-wrap h2{font-size:28px}.shop-close{right:8px;top:8px;width:34px;height:34px;font-size:25px;border-width:2px}.shop-balance{padding:5px 7px;border-width:2px;font-size:19px}.shop-balance img{width:21px;height:21px}.shop-scroll{padding:10px}.shop-grid{grid-template-columns:1fr;gap:11px}.shop-card-body{padding:8px 9px}.shop-card-desc{min-height:0}.shop-preview{aspect-ratio:16/8}.shop-footer{font-size:12px;padding:6px 10px}.shop-original{font-size:15px}.shop-toast{font-size:16px;bottom:11px}}


/* Full-resolution shop cursors: natural image rendering, no pixelating filter. */
#shop-live-cursor{position:fixed;left:0;top:0;width:192px;height:192px;object-fit:contain;
  image-rendering:auto!important;filter:none!important;opacity:1;z-index:2147483647;
  pointer-events:none!important;user-select:none!important;-webkit-user-drag:none;
  transform:translate(-96px,-96px);display:none;will-change:left,top}
/* Touch input hides the cursor in JS; external mice remain supported. */


/* Avatar customization — cozy life-sim dressing room */
.avatar-button{position:absolute;z-index:22005;left:calc(1.15% + 168px);top:1.4%;width:74px;height:74px;border:0;background:transparent;padding:0;cursor:pointer;transition:transform .14s ease,filter .14s ease}
.avatar-button:hover{transform:translateY(-2px);filter:brightness(1.03)}.avatar-button:active{transform:translateY(1px)}.avatar-button:focus-visible{outline:4px solid #e8c992;outline-offset:3px;border-radius:18px}
.avatar-button-shell{position:relative;display:grid;place-items:center;width:100%;height:100%;border:4px solid #704a37;border-radius:22px;background:linear-gradient(145deg,#fff5d7,#dfe8c6);box-shadow:0 6px 0 rgba(62,37,22,.2),inset 0 0 0 3px #fffaf0;overflow:hidden}
.avatar-button-shell::before,.avatar-button-shell::after{content:"";position:absolute;border-radius:50%;background:#f4cc74;opacity:.9}.avatar-button-shell::before{width:11px;height:11px;left:8px;top:8px}.avatar-button-shell::after{width:8px;height:8px;right:9px;bottom:9px}
.avatar-button-face{position:relative;width:36px;height:36px;border:3px solid #704a37;border-radius:50%;background:#ffd8bd;box-shadow:inset 0 -4px 0 rgba(201,120,91,.12)}
.avatar-button-face::before{content:"";position:absolute;left:8px;top:12px;width:5px;height:7px;border-radius:50%;background:#51372d;box-shadow:15px 0 0 #51372d}
.avatar-button-face::after{content:"";position:absolute;left:11px;top:23px;width:11px;height:5px;border-bottom:3px solid #a05759;border-radius:0 0 10px 10px}
.avatar-button-leaf{position:absolute;right:7px;top:7px;font-family:"Jersey 20","VT323",monospace;font-size:18px;color:#73916a;transform:rotate(-18deg);text-shadow:0 1px #fff}
.shop-button{left:calc(1.15% + 252px)}
.avatar-overlay{display:none;position:fixed;inset:0;z-index:24000;background:rgba(71,53,42,.42);backdrop-filter:blur(2px);padding:3.3% 4%;box-sizing:border-box}.avatar-overlay.show{display:grid;place-items:center;animation:avatarFadeIn .18s ease-out both}@keyframes avatarFadeIn{from{opacity:0}to{opacity:1}}
.avatar-window{position:relative;width:min(1180px,95vw);height:min(790px,91vh);display:grid;grid-template-rows:auto 1fr auto;border:5px solid #73513b;border-radius:28px;background:#fff6df;box-shadow:0 13px 0 rgba(66,42,29,.23),inset 0 0 0 4px #efd4a8;overflow:hidden;font-family:"VT323",monospace;color:#5c4032}
.avatar-window::before{content:"";position:absolute;inset:7px;pointer-events:none;border:2px dashed rgba(132,97,69,.22);border-radius:19px}
.avatar-header{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 66px 12px 22px;background:linear-gradient(180deg,#e7edca,#d6e2bd);border-bottom:4px solid #86614a}.avatar-title h2{margin:0;font-family:"Jersey 20","VT323",monospace;font-size:34px;line-height:1;color:#6b4733}.avatar-title p{margin:3px 0 0;font-size:18px;color:#826653}.avatar-close{position:absolute;right:15px;top:12px;width:42px;height:42px;border:3px solid #73513b;border-radius:50%;background:#fff8e9;color:#704a37;box-shadow:0 3px 0 rgba(66,42,29,.18);font-family:"Jersey 20","VT323",monospace;font-size:30px;line-height:34px;cursor:pointer}.avatar-close:hover{transform:translateY(-1px);filter:brightness(1.03)}
.avatar-body-switch{display:flex;gap:7px;align-items:center}.avatar-body-btn{border:3px solid #806047;border-radius:999px;background:#fff9e9;color:#624534;padding:7px 15px;box-shadow:0 3px 0 rgba(73,48,33,.15);font-family:"Jersey 20","VT323",monospace;font-size:20px;cursor:pointer}.avatar-body-btn.active{background:#f2ca91;box-shadow:0 2px 0 rgba(73,48,33,.18),inset 0 0 0 2px #fff0c9;transform:translateY(1px)}
.avatar-main{position:relative;z-index:1;min-height:0;display:grid;grid-template-columns:minmax(330px,42%) 1fr;gap:17px;padding:17px 19px 14px}.avatar-preview-wrap{min-height:0;display:flex;flex-direction:column;gap:9px}.avatar-preview-label{display:flex;justify-content:space-between;align-items:center;padding:0 7px;font-family:"Jersey 20","VT323",monospace;font-size:20px;color:#76533f}.avatar-preview-frame{position:relative;flex:1;min-height:0;overflow:hidden;border:4px solid #78563e;border-radius:25px;box-shadow:0 7px 0 rgba(70,45,31,.17),inset 0 0 0 3px rgba(255,255,255,.72);background-image:linear-gradient(rgba(255,247,225,.06),rgba(255,247,225,.06)),url("assets/images/d2abd0cba4fecad8.webp");background-size:cover;background-position:center;background-repeat:no-repeat}
.avatar-preview-frame::before{display:none}
.avatar-preview-frame::after{display:none}
.avatar-layer-stage{position:absolute;z-index:2;left:50%;top:50%;width:2000px;height:2000px;transform-origin:center center;pointer-events:none}.avatar-layer-stage img{position:absolute;left:0;top:0;width:2000px;height:2000px;max-width:none;max-height:none;object-fit:none;image-rendering:auto;pointer-events:none}
.avatar-exact-note{padding:7px 10px;border:2px solid #b28a69;border-radius:12px;background:#fff8e9;font-size:16px;line-height:1.1;color:#80634f;text-align:center}
.avatar-picker{min-height:0;display:flex;flex-direction:column;border:3px solid #9b785b;border-radius:22px;background:#fffaf0;box-shadow:inset 0 0 0 2px #f0dbc0;overflow:hidden}.avatar-category-tabs{display:flex;flex:0 0 auto;gap:6px;min-height:48px;padding:10px 10px 8px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;background:#f1e4ca;border-bottom:2px solid #b89472}.avatar-category-tabs::-webkit-scrollbar{display:none}.avatar-category-tab{flex:0 0 auto;border:2px solid #89684f;border-radius:999px;background:#fff8e7;color:#664938;padding:6px 11px;font-family:"Jersey 20","VT323",monospace;font-size:18px;cursor:pointer;white-space:nowrap}.avatar-category-tab.active{background:#cfe1b9;box-shadow:inset 0 0 0 2px #f8fff0}.avatar-options-head{display:flex;flex:0 0 auto;justify-content:space-between;align-items:center;padding:9px 12px 5px;font-family:"Jersey 20","VT323",monospace;font-size:22px;color:#714e3a}.avatar-options-head small{font-family:"VT323",monospace;font-size:15px;color:#8e725d}.avatar-options{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:9px;padding:7px 11px 14px}.avatar-option{position:relative;min-height:111px;border:3px solid #b39272;border-radius:16px;background:#fffdf6;box-shadow:0 4px 0 rgba(84,57,40,.12);cursor:pointer;overflow:hidden;padding:5px 5px 25px;transition:transform .12s ease,filter .12s ease}.avatar-option:hover{transform:translateY(-2px);filter:brightness(1.02)}.avatar-option.selected{border-color:#6f8b5f;background:#edf5dc;box-shadow:0 4px 0 rgba(78,103,65,.18),inset 0 0 0 2px #fff}.avatar-option img{display:block;width:100%;height:78px;object-fit:contain;image-rendering:auto;pointer-events:none}.avatar-option span{position:absolute;left:4px;right:4px;bottom:4px;text-align:center;font-family:"Jersey 20","VT323",monospace;font-size:15px;line-height:1;color:#6a4937}.avatar-none-preview{height:78px;display:grid;place-items:center;color:#aa8870;font-family:"Jersey 20","VT323",monospace;font-size:30px}.avatar-empty-category{grid-column:1/-1;padding:28px 15px;text-align:center;border:2px dashed #c1a487;border-radius:16px;color:#8b6a54;font-size:20px;background:#fff9ec}
.avatar-footer{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 18px 12px;border-top:3px solid #9b7659;background:#efe3c8}.avatar-footer-copy{font-size:16px;color:#856650}.avatar-footer-actions{display:flex;gap:8px}.avatar-footer-btn{border:3px solid #795740;border-radius:999px;background:#fff8e8;color:#654633;padding:7px 15px;box-shadow:0 3px 0 rgba(73,48,33,.16);font-family:"Jersey 20","VT323",monospace;font-size:19px;cursor:pointer}.avatar-footer-btn.primary{background:#d8e6be}.avatar-footer-btn:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(73,48,33,.14)}
@media(max-width:900px){.avatar-window{width:96vw;height:92vh}.avatar-main{grid-template-columns:42% 1fr;gap:10px;padding:11px}.avatar-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.avatar-option{min-height:98px}.avatar-option img,.avatar-none-preview{height:65px}.avatar-title p{display:none}}
@media(max-width:700px){.avatar-button{left:calc(1% + 144px);top:1%;width:62px;height:62px}.shop-button{left:calc(1% + 216px)}.avatar-button-face{width:30px;height:30px}.avatar-button-face::before{left:6px;top:9px;box-shadow:13px 0 0 #51372d}.avatar-button-face::after{left:9px;top:19px;width:10px}.avatar-overlay{padding:3% 2%}.avatar-window{height:94vh;border-width:3px;border-radius:18px}.avatar-header{padding:9px 44px 8px 10px;align-items:flex-start;flex-direction:column;gap:6px}.avatar-title h2{font-size:27px}.avatar-title p{display:none}.avatar-close{right:7px;top:7px;width:34px;height:34px;font-size:25px;line-height:27px;border-width:2px}.avatar-body-btn{padding:4px 10px;font-size:17px;border-width:2px}.avatar-main{grid-template-columns:1fr;grid-template-rows:minmax(220px,42%) 1fr;padding:8px;gap:8px}.avatar-preview-wrap{min-height:220px}.avatar-preview-label,.avatar-exact-note{display:none}.avatar-preview-frame{border-radius:16px;border-width:3px}.avatar-picker{border-radius:15px;border-width:2px}.avatar-category-tabs{padding:6px}.avatar-category-tab{font-size:16px;padding:4px 8px}.avatar-options-head{padding:5px 8px 2px;font-size:19px}.avatar-options{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:5px 6px 8px}.avatar-option{min-height:82px;border-width:2px;border-radius:11px;padding:3px 3px 20px}.avatar-option img,.avatar-none-preview{height:57px}.avatar-option span{font-size:12px}.avatar-footer{padding:7px 8px}.avatar-footer-copy{display:none}.avatar-footer-btn{font-size:16px;padding:5px 10px;border-width:2px}}

/* Pixel café economy HUD */
.coin-hud,.mushroom-hud,.level-hud{
  height:52px;
  min-height:52px;
  box-sizing:border-box;
  border:3px solid #d9bd91;
  border-radius:0;
  background:linear-gradient(180deg,#fffdf5 0%,#fff7e8 100%);
  box-shadow:inset 0 0 0 2px #fff,inset 0 -3px 0 #f0ddbd,0 4px 0 rgba(111,78,55,.18);
  clip-path:polygon(7px 0,calc(100% - 7px) 0,calc(100% - 7px) 3px,calc(100% - 3px) 3px,calc(100% - 3px) 7px,100% 7px,100% calc(100% - 7px),calc(100% - 3px) calc(100% - 7px),calc(100% - 3px) calc(100% - 3px),calc(100% - 7px) calc(100% - 3px),calc(100% - 7px) 100%,7px 100%,7px calc(100% - 3px),3px calc(100% - 3px),3px calc(100% - 7px),0 calc(100% - 7px),0 7px,3px 7px,3px 3px,7px 3px);
}
.level-hud{min-width:210px;gap:5px;padding:4px 11px 5px}
.coin-hud,.mushroom-hud{gap:9px;padding-left:10px;padding-right:11px}
.coin-hud .hud-icon{width:27px;height:27px}
.mushroom-hud .hud-icon{width:31px;height:21px}
.coin-count,.mushroom-count{font-size:25px}
.room-tag{color:#f3d6ad;text-shadow:1px 2px 0 rgba(92,53,29,.42)}
.room-tag::before,.room-tag::after{display:none}
.xp-bar{
  height:11px;
  border:2px solid #bda58f;
  border-radius:999px;
  background:#e8dfd4;
  box-shadow:inset 0 2px 2px rgba(91,59,42,.16),0 1px 0 #fff;
}
.xp-fill{
  border-radius:999px;
  background:repeating-linear-gradient(135deg,rgba(255,255,255,.22) 0 6px,rgba(255,255,255,0) 6px 12px),linear-gradient(90deg,#d7a05a 0%,#f6c268 100%);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.3),inset 0 -2px 0 rgba(170,105,46,.14);
  transition:width .65s cubic-bezier(.22,.75,.25,1);
}
/* The shop uses the same stepped, pixel-cut frame language. */
.shop-window{
  border-color:#d9bd91;
  border-radius:0;
  box-shadow:inset 0 0 0 4px #f2dfbf;
  filter:drop-shadow(0 13px 0 rgba(69,44,31,.28)) drop-shadow(0 20px 28px rgba(0,0,0,.2));
  clip-path:polygon(12px 0,calc(100% - 12px) 0,calc(100% - 12px) 5px,calc(100% - 5px) 5px,calc(100% - 5px) 12px,100% 12px,100% calc(100% - 12px),calc(100% - 5px) calc(100% - 12px),calc(100% - 5px) calc(100% - 5px),calc(100% - 12px) calc(100% - 5px),calc(100% - 12px) 100%,12px 100%,12px calc(100% - 5px),5px calc(100% - 5px),5px calc(100% - 12px),0 calc(100% - 12px),0 12px,5px 12px,5px 5px,12px 5px);
}
.shop-balance{
  box-sizing:border-box;
  border:3px solid #d9bd91;
  border-radius:0;
  background:linear-gradient(180deg,#fffdf5 0%,#fff7e8 100%);
  box-shadow:inset 0 0 0 2px #fff,inset 0 -3px 0 #f0ddbd,0 4px 0 rgba(111,78,55,.18);
  clip-path:polygon(7px 0,calc(100% - 7px) 0,calc(100% - 7px) 3px,calc(100% - 3px) 3px,calc(100% - 3px) 7px,100% 7px,100% calc(100% - 7px),calc(100% - 3px) calc(100% - 7px),calc(100% - 3px) calc(100% - 3px),calc(100% - 7px) calc(100% - 3px),calc(100% - 7px) 100%,7px 100%,7px calc(100% - 3px),3px calc(100% - 3px),3px calc(100% - 7px),0 calc(100% - 7px),0 7px,3px 7px,3px 3px,7px 3px);
}
@media(max-width:700px){.coin-hud,.mushroom-hud,.level-hud{height:42px;min-height:42px;border-width:2px}.coin-hud,.mushroom-hud{gap:6px;padding-left:7px;padding-right:8px}.coin-hud .hud-icon{width:21px;height:21px}.mushroom-hud .hud-icon{width:25px;height:17px}.coin-count,.mushroom-count{font-size:20px}.level-hud{min-width:160px;padding:3px 8px 4px;gap:3px}.xp-bar{height:9px;border-width:1px}.shop-window{border-width:3px}}

/* Illustrated cottage recipe notebook */
.recipe-book{
  width:min(41%,560px);
  max-height:82%;
  box-sizing:border-box;
  overflow:auto;
  padding:16px;
  border:5px solid #8a6248;
  border-radius:0;
  background:repeating-linear-gradient(0deg,rgba(181,144,105,.07) 0 1px,transparent 1px 25px),linear-gradient(135deg,#fff9e8,#f9ebca);
  box-shadow:inset 0 0 0 3px #efd2a3,7px 9px 0 rgba(63,39,28,.25),12px 15px 25px rgba(43,27,18,.18);
  clip-path:polygon(10px 0,calc(100% - 10px) 0,calc(100% - 10px) 4px,calc(100% - 4px) 4px,calc(100% - 4px) 10px,100% 10px,100% calc(100% - 10px),calc(100% - 4px) calc(100% - 10px),calc(100% - 4px) calc(100% - 4px),calc(100% - 10px) calc(100% - 4px),calc(100% - 10px) 100%,10px 100%,10px calc(100% - 4px),4px calc(100% - 4px),4px calc(100% - 10px),0 calc(100% - 10px),0 10px,4px 10px,4px 4px,10px 4px);
  scrollbar-color:#c28f70 #f7e5c5;
}
.recipe-book h3{
  margin:0 0 12px;
  padding:8px 14px 9px;
  border:3px solid #92644d;
  background:linear-gradient(180deg,#e9b8af,#d99b98);
  box-shadow:inset 0 0 0 2px rgba(255,244,225,.55),0 4px 0 rgba(100,61,43,.15);
  color:#fff8e9;
  font-size:29px;
  font-weight:400;
  line-height:1;
  text-align:center;
  text-shadow:2px 2px 0 #9c625c;
}
.recipe-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.recipe-tab{
  min-width:0;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  padding:5px 7px;
  border:2px solid #b68e6c;
  border-radius:8px;
  background:#fffaf0;
  box-shadow:0 3px 0 rgba(104,70,48,.12),inset 0 0 0 1px #fff;
  color:#704b38;
  font-family:"Jersey 20","VT323",monospace;
  font-size:16px;
  line-height:.95;
  text-align:left;
}
.recipe-tab img{flex:0 0 auto;width:38px;height:38px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 2px 0 rgba(87,55,37,.13))}
.recipe-tab span{min-width:0}
.recipe-tab:hover:not(:disabled){transform:translateY(-1px);background:#fffdf7}
.recipe-tab.active{border-color:#7c9169;background:#e6efd2;box-shadow:0 3px 0 rgba(78,98,61,.16),inset 0 0 0 2px #f9ffef}
.recipe-tab.locked{opacity:.58;background:#e8ddce;color:#7d6a5d}
.recipe-tab.locked img{filter:grayscale(1) opacity(.48)}
.recipe-tab.locked::after{content:""}
.recipe-detail{
  margin-top:13px;
  padding:12px;
  border:3px solid #c59a75;
  border-radius:10px;
  background:rgba(255,253,244,.92);
  box-shadow:inset 0 0 0 2px #f7e5c9;
  font-size:17px;
  line-height:1.25;
}
.recipe-hero{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:12px;align-items:stretch;padding-bottom:12px;border-bottom:2px dashed #d7ad88}
.recipe-heading{display:flex;min-width:0;flex-direction:column;align-items:flex-start;justify-content:center;padding:4px 4px 4px 7px}
.recipe-kicker{font-family:"VT323",monospace;font-size:15px;letter-spacing:.09em;text-transform:uppercase;color:#aa7f67}
.recipe-heading>b{margin:2px 0 7px;font-family:"Jersey 20","VT323",monospace;font-size:34px;font-weight:400;line-height:.9;color:#7f4e46}
.recipe-price{display:inline-flex;padding:4px 8px;border:2px solid #c59b69;border-radius:999px;background:#fff1bd;color:#805b38;font-family:"Jersey 20","VT323",monospace;font-size:17px;line-height:1}
.recipe-final{position:relative;min-height:142px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:7px;border:2px dashed #c98f88;border-radius:15px;background:radial-gradient(circle at 50% 42%,#fffdf4 0 35%,#f8e2d7 76%,#efc9c2 100%);overflow:hidden}
.recipe-final::before,.recipe-final::after{content:"✦";position:absolute;color:#e6aa84;font-size:16px}.recipe-final::before{left:10px;top:30px}.recipe-final::after{right:11px;bottom:25px}
.recipe-final-label{position:absolute;left:0;right:0;top:5px;text-align:center;font-family:"Jersey 20","VT323",monospace;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:#a26865}
.recipe-final img{display:block;width:142px;height:122px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 5px 0 rgba(91,55,39,.14))}
.recipe-final small{font-family:"VT323",monospace;font-size:15px;color:#986e61}
.recipe-section{margin-top:12px}
.recipe-section h4{display:flex;align-items:center;gap:7px;margin:0 0 8px;color:#805847;font-family:"Jersey 20","VT323",monospace;font-size:23px;font-weight:400;line-height:1}
.recipe-section h4::before,.recipe-section h4::after{content:"";height:2px;flex:1;background:repeating-linear-gradient(90deg,#d5ad87 0 5px,transparent 5px 9px)}
.recipe-section h4::before{flex:.2}
.recipe-ingredient-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.recipe-ingredient{min-width:0;display:flex;align-items:center;gap:6px;padding:5px 6px;border:2px solid #dbc09c;border-radius:10px;background:#fffaf0;color:#745342;font-size:16px;line-height:1}
.recipe-ingredient-picture{flex:0 0 40px;width:40px;height:40px;display:grid;place-items:center;border-radius:8px;background:#f6e5c9}
.recipe-ingredient img{display:block;width:38px;height:38px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 2px 0 rgba(80,49,34,.12))}
.recipe-method ol{margin:0;padding:0;list-style:none;counter-reset:recipe-step;display:grid;gap:5px}
.recipe-method li{counter-increment:recipe-step;display:grid;grid-template-columns:25px 1fr;gap:7px;align-items:start;padding:5px 7px 5px 5px;border-radius:8px;color:#705345}
.recipe-method li::before{content:counter(recipe-step);width:23px;height:23px;display:grid;place-items:center;border:2px solid #b9896c;border-radius:50%;background:#f6ddc8;color:#855b49;font-family:"Jersey 20","VT323",monospace;font-size:16px;line-height:1}
.recipe-method li.current{padding:5px 7px 5px 5px;border:2px solid #d4a6a2;background:#f7dddd;box-shadow:inset 0 0 0 1px #fff7ed}
.recipe-method li.current::before{border-color:#a96968;background:#d89b99;color:#fff8e9}
.recipe-locked-page{min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;color:#765441}
.recipe-locked-page>b{font-family:"Jersey 20","VT323",monospace;font-size:31px;font-weight:400;color:#80534c}
.recipe-lock-icon{width:60px;height:60px;display:grid;place-items:center;border:3px solid #bc9474;border-radius:50%;background:#f8e4d1;color:#bd7c78;font-size:34px}
.recipe-lock-note{max-width:330px;margin:0;background:#f6e8cf}
@media(max-width:700px){.recipe-book{top:74px;width:76%;max-height:82%;padding:10px;border-width:3px}.recipe-book h3{font-size:24px;margin-bottom:8px}.recipe-tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.recipe-tab{min-height:46px;padding:3px 5px;font-size:14px}.recipe-tab img{width:31px;height:31px}.recipe-detail{margin-top:9px;padding:8px}.recipe-hero{grid-template-columns:minmax(0,1fr) 122px;gap:7px}.recipe-heading>b{font-size:27px}.recipe-final{min-height:118px}.recipe-final img{width:108px;height:94px}.recipe-ingredient-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.recipe-ingredient{font-size:14px}.recipe-ingredient-picture{flex-basis:34px;width:34px;height:34px}.recipe-ingredient img{width:32px;height:32px}}

/* Shared modal shell and heading language */
.recipe-book,.shop-window,.avatar-window{
  border:5px solid #73513b;
  border-radius:24px;
  clip-path:none;
  filter:none;
  box-shadow:0 13px 0 rgba(66,42,29,.23),0 20px 40px rgba(45,29,20,.2),inset 0 0 0 4px #efd4a8;
}
.shop-header,.avatar-header,.recipe-book h3{
  background:linear-gradient(180deg,#e7edca,#d6e2bd);
  border-color:#86614a;
  color:#6b4733;
}
.recipe-book{
  overflow:auto;
  padding:16px;
}
.recipe-book h3{
  margin:-16px -16px 13px;
  padding:15px 20px 13px;
  border:0;
  border-bottom:4px solid #86614a;
  border-radius:18px 18px 0 0;
  box-shadow:0 4px 0 rgba(91,57,41,.08);
  font-size:31px;
  text-align:left;
  text-shadow:none;
}
@media(max-width:700px){.recipe-book,.shop-window,.avatar-window{border-width:3px;border-radius:16px}.recipe-book{padding:10px}.recipe-book h3{margin:-10px -10px 9px;padding:11px 14px 10px;border-radius:12px 12px 0 0;font-size:25px}}

/* Currency shop entry points and purchase shell */
.coin-hud,.mushroom-hud{padding-right:0;overflow:hidden;pointer-events:auto}
.currency-add{
  align-self:stretch;
  flex:0 0 31px;
  width:31px;
  margin:-5px -1px -5px 2px;
  padding:0 0 2px;
  border:0;
  border-left:2px solid #b8ca9e;
  background:linear-gradient(180deg,#e7edca,#cbdcad);
  color:#6a4a38;
  font-family:"Jersey 20","VT323",monospace;
  font-size:28px;
  line-height:1;
  cursor:pointer;
  pointer-events:auto;
  text-shadow:0 1px #fff;
}
.currency-add:hover{background:linear-gradient(180deg,#f0f4da,#d7e5bd)}
.currency-add:active{padding-top:2px;background:#c4d7a7}
.currency-shop-overlay{position:absolute;inset:0;z-index:31000;display:none;align-items:center;justify-content:center;padding:4.5% 6%;background:rgba(46,31,24,.57);backdrop-filter:blur(2px)}
.currency-shop-overlay.show{display:flex}
.currency-shop-window{position:relative;width:min(920px,92%);max-height:86%;display:flex;flex-direction:column;overflow:hidden;border:5px solid #73513b;border-radius:24px;background:#fff8e9;box-shadow:0 13px 0 rgba(66,42,29,.23),0 20px 40px rgba(45,29,20,.22),inset 0 0 0 4px #efd4a8;color:#604331}
.currency-shop-header{position:relative;display:flex;align-items:center;justify-content:space-between;padding:15px 66px 12px 22px;border-bottom:4px solid #86614a;background:linear-gradient(180deg,#e7edca,#d6e2bd)}
.currency-shop-header h2{margin:0;font-family:"Jersey 20","VT323",monospace;font-size:38px;font-weight:400;line-height:1;color:#6b4733}
.currency-shop-header p{margin:3px 0 0;color:#816653;font-size:17px}
.currency-shop-close{position:absolute;right:14px;top:12px;width:42px;height:42px;border:3px solid #7b5138;border-radius:10px;background:#fff8e9;color:#70402f;font-family:"Jersey 20","VT323",monospace;font-size:31px;line-height:1;cursor:pointer;box-shadow:0 3px 0 rgba(68,40,28,.2)}
.currency-shop-scroll{overflow:auto;padding:17px 19px 23px;scrollbar-color:#a97a58 #f5dfc2}
.currency-bundle-section+ .currency-bundle-section{margin-top:20px;padding-top:18px;border-top:2px dashed #c7a17d}
.currency-section-heading{display:flex;align-items:center;gap:11px;margin-bottom:10px}
.currency-section-heading>img{width:48px;height:48px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 3px 0 rgba(75,46,31,.13))}
.currency-section-heading h3{margin:0;font-family:"Jersey 20","VT323",monospace;font-size:28px;font-weight:400;line-height:1;color:#6f4a37}
.currency-section-heading p{margin:3px 0 0;color:#8b705d;font-size:15px}
.currency-bundle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.currency-bundle{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;padding:28px 12px 13px;border:3px solid #a97f60;border-radius:16px;background:linear-gradient(180deg,#fffdf6,#fff3dd);box-shadow:0 5px 0 rgba(80,50,34,.15),inset 0 0 0 2px #f6dfbd;text-align:center}
.currency-bundle.featured{border-color:#7d946a;background:linear-gradient(180deg,#f7fbe9,#edf4da);box-shadow:0 5px 0 rgba(73,91,57,.16),inset 0 0 0 2px #fff}
.bundle-tag{position:absolute;left:9px;top:8px;padding:3px 7px;border-radius:999px;background:#ead4b1;color:#76513b;font-family:"Jersey 20","VT323",monospace;font-size:14px;line-height:1}.featured .bundle-tag{background:#d4e4b9;color:#526647}
.currency-bundle>img{width:82px;height:70px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 4px 0 rgba(77,48,33,.14))}
.currency-bundle strong{margin-top:3px;font-family:"Jersey 20","VT323",monospace;font-size:36px;font-weight:400;line-height:1;color:#654331}
.currency-bundle>span:not(.bundle-tag){margin:3px 0 11px;color:#8a6c58;font-size:15px}
.currency-bundle button{width:100%;border:3px solid #704a37;border-radius:10px;padding:7px 9px;background:#e7b979;color:#563521;font-family:"Jersey 20","VT323",monospace;font-size:21px;line-height:1;cursor:pointer;box-shadow:0 3px 0 rgba(74,43,28,.22)}
.currency-bundle button:hover{transform:translateY(-1px);filter:brightness(1.04)}
.currency-bundle button:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(74,43,28,.2)}
.currency-shop-toast{position:absolute;left:50%;bottom:17px;transform:translate(-50%,12px);opacity:0;pointer-events:none;z-index:3;padding:8px 13px;border:3px solid #704a37;border-radius:10px;background:#fff4d9;color:#68432f;box-shadow:0 4px 0 rgba(68,39,25,.2);font-family:"Jersey 20","VT323",monospace;font-size:20px;white-space:nowrap}
.currency-shop-toast.show{animation:shopToast 1.7s ease both}
@media(max-width:700px){.currency-add{flex-basis:25px;width:25px;margin:-4px -1px -4px 1px;font-size:23px}.currency-shop-overlay{padding:6% 3%}.currency-shop-window{width:96%;max-height:90%;border-width:3px;border-radius:16px}.currency-shop-header{padding:11px 48px 9px 14px}.currency-shop-header h2{font-size:29px}.currency-shop-header p{display:none}.currency-shop-close{right:8px;top:8px;width:34px;height:34px;border-width:2px;font-size:25px}.currency-shop-scroll{padding:11px}.currency-bundle-grid{grid-template-columns:1fr;gap:10px}.currency-bundle{display:grid;grid-template-columns:62px 1fr auto;grid-template-rows:auto auto;padding:22px 9px 9px;text-align:left}.currency-bundle>img{grid-row:1/3;width:58px;height:52px}.currency-bundle strong{font-size:29px}.currency-bundle>span:not(.bundle-tag){margin:0}.currency-bundle button{grid-column:3;grid-row:1/3;width:auto;min-width:76px}.currency-section-heading>img{width:40px;height:40px}}