/* Carry's Special Soup — intentionally close to Gary's existing simple 2D game.
   All new rules are scoped to Carry so Gary stays exactly as approved. */
.recipes-page [hidden]{display:none!important}
.recipes-page .kq-station[data-station]{
  font:inherit;
  font-weight:inherit;
  color:#345847;
  cursor:pointer;
  touch-action:manipulation;
  transition:transform .16s ease,box-shadow .16s ease;
}
.recipes-page .kq-station[data-station]:hover,
.recipes-page .kq-station[data-station]:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 8px 0 #b3d9a7;
  border-color:#5cad66;
}
.recipes-page .kq-station[data-station]:focus-visible{
  outline:3px solid #e7a92d;outline-offset:3px;
}
.recipes-page .kq-station[data-station].active{
  opacity:1;
  border-color:#187448;
  background:#eaf9df;
  box-shadow:0 6px 0 #9fca84;
}
.recipes-page .ck-layout .kq-game-header{
  background:linear-gradient(110deg,#bd611c,#df8d26 50%,#d36f20);
}
.recipes-page .ck-layout .kq-game-header p{color:#fff8de}
.recipes-page .ck-layout .kq-chef-avatar{background:#fff4d6;border-color:#fff1ba}
.recipes-page .ck-layout .kq-chef-avatar img{object-fit:contain}
.recipes-page .ck-layout .kq-stage{
  background:
    radial-gradient(circle at 12% 15%,rgba(247,190,88,.25),transparent 36%),
    linear-gradient(160deg,#fffdf0,#fff2d6);
}
.recipes-page .ck-layout .kq-step-head h3{
  color:#b95c1c;
}
.recipes-page .ck-layout .kq-chapter{
  color:#af4b16;
}
.recipes-page .ck-layout .kq-ingredient.selected{
  border-color:#e7ad39;
  background:#fff1d0;
  box-shadow:0 4px 0 #dbb778;
}
.recipes-page .ck-layout .kq-ingredient:disabled{
  opacity:.72;cursor:default;
}
.recipes-page .ck-layout .kq-preparing{
  border-color:#e49a2f;
  background:#fff3dc;
}
.recipes-page .ck-layout .kq-main-action{
  background:#d87a25;
  color:#fff;
  border-color:#9c4615;
  box-shadow:0 5px 0 #97441a;
}
.recipes-page .ck-layout .kq-main-action:hover:not(:disabled){
  box-shadow:0 7px 0 #97441a;
}
.recipes-page .ck-layout .kq-meter span{
  background:linear-gradient(90deg,#e6a237,#f1c957);
}
.recipes-page .ck-countertop{
  max-width:610px;
  min-height:225px;
  padding:3px 12px;
  overflow:hidden;
  border-color:#dfa973;
}
.recipes-page .ck-pot-svg{
  display:block;width:min(100%,520px);height:auto;max-height:355px;
  margin:0 auto;
  filter:drop-shadow(0 7px 5px rgba(66,45,23,.15));
}
.recipes-page .ck-prep-svg{
  display:block;width:100%;max-width:450px;height:auto;margin:0 auto;
}
.recipes-page .ck-prep-panel{
  background:linear-gradient(160deg,#fff6dc,#f8e1b2);
  border-color:#e5ac5c;
  max-width:610px;
}
.recipes-page .ck-prep-list{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
}
.recipes-page .ck-prep-list .kq-ingredient{
  min-height:92px;padding:8px 5px;
}
.recipes-page .ck-prep-list .kq-ingredient span{font-size:1.7rem}
.recipes-page .ck-prep-list .kq-ingredient b{font-size:.8rem}
.recipes-page .ck-safe-note{
  color:#865729;
  background:#fff1d6;
  border-radius:12px;
  font-size:.8rem;
  line-height:1.45;
  padding:10px 15px;
  max-width:550px;
  margin:17px auto 0;
}
.recipes-page .ck-layout .kq-passport{
  border-color:#f0d08f;
  background:linear-gradient(#fffdf3,#fff5dd);
}
.recipes-page .ck-layout .kq-garden-plot{background:#f9eed3}
.recipes-page #ckStatus{
  min-height:27px;
  background:#f9e5bf;
  color:#784b19;
  padding:7px 13px;
  font-size:.82rem;
  font-weight:850;
  border-top:1px solid #e7c082;
}
.recipes-page .ck-activity h3{color:#b96c22}
.recipes-page .ck-activity{
  border-color:#e9c979;
  box-shadow:0 10px 0 #ddb579;
}
.recipes-page .ck-activity .kq-trail-choice{
  border-color:#edd8a5;
  background:#fffae8;
}
.recipes-page .ck-activity .kq-trail-choice:hover:not(:disabled){
  background:#fff1cf;
  border-color:#d48b28;
}
.recipes-page .ck-activity .kq-main-action{
  background:#dc7b27;border-color:#b75b19;box-shadow:0 5px 0 #a6521f;
}
.recipes-page #ckConfetti{
  position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden;
}
.recipes-page #ckConfetti i{
  display:block;position:absolute;top:-20px;
  left:calc(5% + (var(--i) * 5.5%));
  width:12px;height:18px;opacity:0;background:#ef8b37;
}
.recipes-page #ckConfetti i:nth-child(even){background:#eabf56}
.recipes-page #ckConfetti i:nth-child(3n){background:#82b54c}
.recipes-page #ckConfetti.burst i{
  animation:kqFall 1.8s ease-in forwards;
  animation-delay:calc(var(--i) * 28ms);
}
.recipes-page .ck-stir-spoon{
  transform-origin:266px 172px;transform:rotate(var(--ck-angle));
  animation:ckSpoon .8s ease-out both;
}
.recipes-page .ck-steam{animation:ckSteam 1.7s ease-in-out infinite alternate}
@keyframes ckSpoon{
  from{transform:rotate(calc(var(--ck-angle) - 25deg))}
  to{transform:rotate(var(--ck-angle))}
}
@keyframes ckSteam{
  from{opacity:.35;transform:translateY(5px)}
  to{opacity:.8;transform:translateY(-5px)}
}
@media(max-width:700px){
  .recipes-page .ck-prep-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .recipes-page .ck-countertop{padding:2px;min-height:190px}
  .recipes-page .ck-pot-svg{max-height:295px}
  .recipes-page .ck-prep-panel{padding:13px 10px}
}
@media(max-width:430px){
  .recipes-page .ck-prep-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .recipes-page .ck-prep-list .kq-ingredient{min-height:90px}
}
@media(prefers-reduced-motion:reduce){
  .recipes-page .ck-steam,
  .recipes-page .ck-stir-spoon,
  .recipes-page #ckConfetti.burst i{animation:none!important}
  .recipes-page .kq-station[data-station]{transition:none!important}
}

/* Carry's original illustrated-food visual pass */
.recipes-page .ck-visual-welcome{color:#915327}
.recipes-page .ck-served-countertop{
  padding:0;
  overflow:hidden;
  min-height:0;
  max-width:610px;
  border:5px solid #e5ad6e;
  background:#f2cf9f;
  box-shadow:0 12px 24px rgba(103,64,31,.16);
  position:relative;
}
.recipes-page .ck-served-image{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:620 / 403;
  object-fit:cover;
  border-radius:16px;
  animation:ckFoodArrive .32s ease-out both;
}
.recipes-page .ck-serving-shine{
  position:absolute;
  right:8%;top:8%;
  font-size:2rem;
  color:#fff4b8;
  text-shadow:0 2px 6px #ba6919;
  animation:ckServingShine 1.8s ease-in-out infinite alternate;
  pointer-events:none;
}
.recipes-page .ck-prep-panel .kq-prep-art-button{
  width:100%;
  max-width:610px;
  border:3px solid #e3b474;
  background:#f5d39c;
  border-radius:18px;
  overflow:hidden;
}
.recipes-page .ck-art-board{
  position:relative;
  width:100%;
  overflow:hidden;
  background:#f5d39c;
  transform:translateZ(0);
}
.recipes-page .ck-prep-image{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:2 / 1;
  object-fit:cover;
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
  transition:filter .18s ease,transform .18s ease;
}
.recipes-page .ck-art-progress-1 .ck-prep-image{filter:saturate(1.08) brightness(1.025)}
.recipes-page .ck-art-progress-2 .ck-prep-image{filter:saturate(1.12)}
.recipes-page .ck-art-cutpieces{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.recipes-page .ck-art-chip{
  display:block;
  position:absolute;
  height:9px;width:10px;
  background:#f3a129;
  border:1px solid #cb7527;
  border-radius:3px;
  transform:rotate(calc(var(--ck-chip) * 31deg));
  box-shadow:0 2px 3px rgba(62,42,22,.19);
  animation:ckChopAppear .24s ease-out both;
}
.recipes-page .ck-art-carrot .ck-art-chip{border-radius:50%;width:13px;height:9px;background:#fa9c2c;border-color:#dd6920}
.recipes-page .ck-art-onion .ck-art-chip{background:#d9a3d8;border-color:#a677ac}
.recipes-page .ck-art-garlic .ck-art-chip{width:7px;height:6px;background:#fff0be;border-color:#d3c69c}
.recipes-page .ck-art-ginger .ck-art-chip{width:12px;height:3px;background:#f2dc87;border-color:#be9b5c}
.recipes-page .ck-art-herbs .ck-art-chip{width:9px;height:6px;background:#318d47;border-color:#226b36;clip-path:polygon(0 100%,40% 0,100% 70%)}
@keyframes ckFoodArrive{
  from{opacity:.65;transform:translateY(9px) scale(.97)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes ckChopAppear{
  from{opacity:0;transform:translateY(-14px) scale(.55) rotate(30deg)}
  to{opacity:1;transform:translateY(0) scale(1) rotate(calc(var(--ck-chip) * 31deg))}
}
@keyframes ckServingShine{
  from{opacity:.4;transform:scale(.8) rotate(-8deg)}
  to{opacity:1;transform:scale(1.18) rotate(9deg)}
}
@media(max-width:700px){
  .recipes-page .ck-art-chip{width:8px;height:7px}
  .recipes-page .ck-served-image{max-height:420px}
}
@media(prefers-reduced-motion:reduce){
  .recipes-page .ck-served-image,
  .recipes-page .ck-serving-shine,
  .recipes-page .ck-art-chip{animation:none!important}
  .recipes-page .ck-prep-image{transition:none!important}
}


/* Carry chopping-game polish: each frame is a different actual food state. */
.recipes-page .ck-prep-panel .kq-prep-art-button{
  padding:0;
  overflow:hidden;
  border:4px solid #dfa861;
  background:#eec18a;
  box-shadow:inset 0 2px 0 #ffedc9,0 6px 0 #bd8951,0 13px 21px rgba(114,65,20,.14);
  transition:transform .16s ease,box-shadow .16s ease;
}
.recipes-page .ck-prep-panel .kq-prep-art-button:hover{
  transform:translateY(-2px);
  box-shadow:inset 0 2px 0 #ffedc9,0 8px 0 #bd8951,0 16px 25px rgba(114,65,20,.19);
}
.recipes-page .ck-prep-panel .kq-prep-art-button:active{
  transform:translateY(3px) scale(.995);
  box-shadow:inset 0 2px 0 #ffedc9,0 2px 0 #bd8951,0 6px 12px rgba(114,65,20,.12);
}
.recipes-page .ck-art-board{position:relative;overflow:hidden;background:#f4ce9c}
.recipes-page .ck-art-board .ck-prep-image{
  display:block;width:100%;height:auto;aspect-ratio:960 / 475;
  object-fit:contain;max-width:100%;
  filter:none;
  transform-origin:48% 57%;
  animation:ckRealCut .30s cubic-bezier(.21,.9,.34,1) both;
  user-select:none;-webkit-user-drag:none;pointer-events:none;
}
.recipes-page .ck-art-board .ck-slice-flash{
  position:absolute;inset:20% 22% 22% 21%;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse,#fffde4b0 0%,#ffdf6f41 31%,transparent 63%);
  opacity:0;
}
.recipes-page .ck-art-progress-1 .ck-slice-flash,
.recipes-page .ck-art-progress-2 .ck-slice-flash,
.recipes-page .ck-art-progress-3 .ck-slice-flash{
  animation:ckCutSpark .30s ease-out both;
}
.recipes-page .ck-finish-feedback{
  margin:10px auto 0;
  color:#196b3c;background:#e7f8df;border:2px solid #b9dba6;
  border-radius:12px;font-size:.9rem;font-weight:900;
  padding:10px;max-width:420px;
  animation:ckFinishIn .22s ease-out both;
}
.recipes-page .ck-prep-panel .kq-meter span{transition:width .32s ease}
@keyframes ckRealCut{
  0%{transform:translateY(-5px) scale(1.022);filter:brightness(1.09)}
  52%{transform:translateY(2px) scale(.995);filter:brightness(1.03)}
  100%{transform:translateY(0) scale(1);filter:none}
}
@keyframes ckCutSpark{
  0%{opacity:.8;transform:scale(.65)}
  100%{opacity:0;transform:scale(1.45)}
}
@keyframes ckFinishIn{
  0%{opacity:0;transform:translateY(6px)}
  100%{opacity:1;transform:translateY(0)}
}
@media(prefers-reduced-motion:reduce){
  .recipes-page .ck-prep-panel .kq-prep-art-button{transition:none!important}
  .recipes-page .ck-art-board .ck-prep-image,
  .recipes-page .ck-art-board .ck-slice-flash,
  .recipes-page .ck-finish-feedback{animation:none!important}
}

/* Carry object-based stable vegetable canvas (not baked-in prep photographs).
   The board stays put; each independent food piece responds to knife/grater cuts. */
.recipes-page .ck-prep-panel .ck-live-board{
  background:#f5d8aa;
  overflow:hidden;
  border-radius:16px;
  box-shadow:inset 0 1px 0 rgba(255,248,221,.55);
  transform:translateZ(0);
}
.recipes-page .ck-live-board .ck-live-svg{
  width:100%;
  height:auto;
  display:block;
  aspect-ratio:960/475;
  overflow:hidden;
  touch-action:manipulation;
  user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
  filter:none;
}
.recipes-page .ck-live-board .ck-whole-ingredient{
  animation:ckIngredientMove .28s cubic-bezier(.2,.8,.3,1) both;
  transform-box:fill-box;
}
.recipes-page .ck-live-board .ck-new-piece,
.recipes-page .ck-live-board .ck-cut-piece{
  animation:ckIngredientFall .33s cubic-bezier(.17,.78,.28,1) both;
  animation-delay:var(--ck-delay,0ms);
  transform-box:fill-box;
}
.recipes-page .ck-live-board .ck-live-tool{
  transform-origin:690px 174px;
  transform-box:view-box;
  filter:drop-shadow(3px 6px 3px rgba(107,66,32,.16));
}
.recipes-page .ck-live-board.ck-just-cut .ck-live-knife{
  animation:ckKnifeCut .33s cubic-bezier(.2,.8,.22,1) both;
}
.recipes-page .ck-live-board.ck-just-cut .ck-live-grater{
  animation:ckGraterScrape .33s cubic-bezier(.2,.8,.22,1) both;
}
.recipes-page .ck-live-board .ck-cut-sparks{
  opacity:0;
  transform-box:fill-box;
  transform-origin:52% 35%;
  pointer-events:none;
}
.recipes-page .ck-live-board.ck-just-cut .ck-cut-sparks{
  animation:ckCutFlash .31s ease-out both;
}
.recipes-page .ck-live-board:focus-within{
  outline:3px solid #e9af39;
  outline-offset:1px;
}
@keyframes ckIngredientMove{
  0%{opacity:.86;filter:brightness(1.12)}
  100%{opacity:1;filter:none}
}
@keyframes ckIngredientFall{
  0%{opacity:.25;translate:0 -18px;scale:.72}
  65%{opacity:1;translate:0 3px;scale:1.06}
  100%{opacity:1;translate:0 0;scale:1}
}
@keyframes ckKnifeCut{
  0%{transform:translate(9px,-22px) rotate(-7deg)}
  48%{transform:translate(-26px,14px) rotate(8deg)}
  100%{transform:translate(0,0) rotate(0deg)}
}
@keyframes ckGraterScrape{
  0%{transform:translate(14px,-13px) rotate(7deg)}
  50%{transform:translate(-23px,11px) rotate(-6deg)}
  100%{transform:translate(0,0) rotate(0deg)}
}
@keyframes ckCutFlash{
  0%{opacity:0;scale:.8}
  30%{opacity:.96;scale:1.08}
  100%{opacity:0;scale:1.32}
}
@media(prefers-reduced-motion:reduce){
  .recipes-page .ck-live-board .ck-whole-ingredient,
  .recipes-page .ck-live-board .ck-new-piece,
  .recipes-page .ck-live-board .ck-cut-piece,
  .recipes-page .ck-live-board.ck-just-cut .ck-live-tool,
  .recipes-page .ck-live-board.ck-just-cut .ck-cut-sparks{
    animation:none!important;
    transition:none!important;
  }
}


/* Carry soup: live object-based spoon and ingredients.
   The wooden spoon rests in the soup; food takes an elliptical stirring path. */
.recipes-page .ck-simmer-countertop{
  overflow:hidden;
  max-width:620px;
  min-height:0;
  background:linear-gradient(145deg,#f5dfb9,#e2ad73);
  border:6px solid #dda66b;
  border-radius:27px;
  box-shadow:0 12px 23px rgba(100,66,30,.17),inset 0 2px 0 #fce9c4;
  touch-action:manipulation;
}
.recipes-page .ck-simmer-pot{
  display:block;
  width:100%;
  height:auto;
  max-height:none;
  overflow:hidden;
  user-select:none;
  -webkit-user-select:none;
  touch-action:manipulation;
}
.recipes-page .ck-simmer-pot .ck-soup-ingredients{
  transform-origin:265px 168px;
  transform-box:view-box;
  transition:transform 950ms cubic-bezier(.22,.68,.24,1);
  will-change:transform;
}
.recipes-page .ck-simmer-pot .ck-simmer-spoon{
  transform-origin:265px 174px;
  transform-box:view-box;
  filter:drop-shadow(2px 3px 2px rgba(110,64,17,.22));
}
.recipes-page .ck-simmer-pot.ck-stir-pulse .ck-simmer-spoon{
  animation:ckSpoonInSoup 950ms cubic-bezier(.2,.63,.28,1) both;
}
.recipes-page .ck-simmer-pot.ck-stir-pulse .ck-soup-ripples{
  animation:ckSoupSurfaceStir 950ms ease-out both;
  transform-origin:265px 169px;
  transform-box:view-box;
}
.recipes-page .ck-simmer-pot .ck-stir-bubble{
  animation:ckSoupBubbleFloat 1.9s ease-in-out infinite alternate;
  animation-delay:var(--ck-bubble-delay,0ms);
}
.recipes-page .ck-simmer-pot .ck-stir-steam{
  animation:ckSteamDrift 2.3s ease-in-out infinite alternate;
}
@keyframes ckSpoonInSoup{
  0%{transform:translate(-8px,-2px) rotate(-16deg)}
  25%{transform:translate(10px,4px) rotate(12deg)}
  52%{transform:translate(15px,-6px) rotate(20deg)}
  78%{transform:translate(-7px,-9px) rotate(-11deg)}
  100%{transform:translate(0,0) rotate(0deg)}
}
@keyframes ckSoupSurfaceStir{
  0%{transform:rotate(-12deg) scale(.97);opacity:.22}
  42%{transform:rotate(12deg) scale(1.025);opacity:.9}
  100%{transform:rotate(0deg) scale(1);opacity:.48}
}
@keyframes ckSoupBubbleFloat{
  0%{opacity:.27;transform:translateY(3px)}
  100%{opacity:.84;transform:translateY(-3px)}
}
@keyframes ckSteamDrift{
  0%{opacity:.25;transform:translateY(5px)}
  100%{opacity:.75;transform:translateY(-5px)}
}
@media(prefers-reduced-motion:reduce){
  .recipes-page .ck-simmer-pot .ck-soup-ingredients{transition:none!important}
  .recipes-page .ck-simmer-pot.ck-stir-pulse .ck-simmer-spoon,
  .recipes-page .ck-simmer-pot.ck-stir-pulse .ck-soup-ripples,
  .recipes-page .ck-simmer-pot .ck-stir-bubble,
  .recipes-page .ck-simmer-pot .ck-stir-steam{animation:none!important}
}


/* Synced spoon orbit inside carrot soup.
   The spoon head stays near the broth center while its handle travels around
   the soup. Ingredient objects complete the same revolution per stir. */
.recipes-page .ck-simmer-pot .ck-stir-orbit{
  transform-box:view-box;
  transform-origin:265px 168px;
  transition:transform 950ms cubic-bezier(.22,.68,.24,1);
  will-change:transform;
}
.recipes-page .ck-simmer-pot .ck-spoon-offset{
  /* Offset lives in a separate SVG group so the dipping animation does not
     override its translation (including on WebKit/Safari). */
  transform-box:view-box;
}
@media(prefers-reduced-motion:reduce){
  .recipes-page .ck-simmer-pot .ck-stir-orbit{transition:none!important}
}