/* =========================
   🔪 KNIFE + CAKE SPLIT
========================= */

.knife{
  position:absolute;
  right:-260px;
  top: 260px;
  width: 240px;
  height: 60px;
  z-index:30;
  pointer-events:none;
}

.knife .blade{
  position:absolute;
  left:0;
  top:18px;
  width:160px;
  height:18px;
  background: linear-gradient(180deg,#f5f7ff,#cfd6ef);
  border-radius:10px;
  box-shadow: inset 0 4px 0 rgba(255,255,255,.8);
}

.knife .blade::after{
  content:"";
  position:absolute;
  right:-18px;
  width:28px;
  height:18px;
  background: linear-gradient(180deg,#f5f7ff,#cfd6ef);
  clip-path: polygon(0 0,100% 50%,0 100%);
}

.knife .handle{
  position:absolute;
  left:160px;
  top:10px;
  width:60px;
  height:30px;
  border-radius:14px;
  background: linear-gradient(180deg,#2b2b2b,#111);
}

.knife.cut{
  animation:
    knifeIn 1.2s cubic-bezier(.2,.9,.2,1) forwards,
    knifeDown .6s 1.25s ease forwards,
    knifeOut .9s 2.1s ease forwards;
}

@keyframes knifeIn{
  from{ transform: translateX(0) rotate(-12deg); }
  to{ transform: translateX(-320px) rotate(-12deg); }
}

@keyframes knifeDown{
  from{ transform: translateX(-320px) translateY(0) rotate(-12deg); }
  to{ transform: translateX(-320px) translateY(70px) rotate(-18deg); }
}

@keyframes knifeOut{
  to{ transform: translateX(-600px) translateY(-40px) rotate(-24deg); opacity:0; }
}

/* cake split */

.cake-split{
  position:absolute;
  bottom:30px;
  width:110px;
  height:160px;
  overflow:hidden;
}

.cake-left{
  left:0;
  transform-origin: right center;
}

.cake-right{
  right:0;
  transform-origin: left center;
}

.cake-left.shake{
  animation: leftRecoil .5s ease;
}

@keyframes leftRecoil{
  0%{ transform: translateX(0); }
  40%{ transform: translateX(-8px); }
  100%{ transform: translateX(0); }
}

.cake-right.fly{
  animation: rightFly 1.4s cubic-bezier(.2,.9,.2,1) forwards;
}

@keyframes rightFly{
  to{
    transform: translateX(260px) rotate(6deg);
    opacity:0;
  }
}