/* Screen-only motion for the Konicom deck. Content never depends on it. */

.fx-seam {
  position: fixed;
  inset: 0;
  z-index: 88;
  overflow: hidden;
  pointer-events: none;
}
.fx-seam i {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: linear-gradient(180deg, rgba(255,195,106,0), #FFD08A 18%, #FFF7E8 50%, #E4CFFF 82%, rgba(228,207,255,0));
  box-shadow: 0 0 22px rgba(255,179,87,.85), 0 0 60px rgba(139,79,195,.45);
  will-change: transform;
}
.fx-seam b {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 18vw;
  background: linear-gradient(90deg, rgba(255,179,87,0), rgba(255,179,87,.18) 55%, rgba(255,255,255,.06));
  filter: blur(6px);
  will-change: transform;
}

body.is-cutting .controls,
body.is-cutting .mobile-bar { pointer-events: none; }

body.is-exploding { overflow: hidden; }
body.index-open { overflow: hidden; }

.deck.boom-shake { animation: konicom-boom-shake 480ms cubic-bezier(.36,.07,.19,.97) both; }
@keyframes konicom-boom-shake {
  0% { transform: translate3d(0,0,0) rotate(0); }
  12% { transform: translate3d(-7px,4px,0) rotate(-.22deg); }
  24% { transform: translate3d(8px,-5px,0) rotate(.25deg); }
  38% { transform: translate3d(-5px,2px,0) rotate(-.16deg); }
  52% { transform: translate3d(4px,-2px,0) rotate(.1deg); }
  70% { transform: translate3d(-2px,1px,0) rotate(-.05deg); }
  100% { transform: translate3d(0,0,0) rotate(0); }
}

@media screen and (max-width: 1023px) {
  .deck.boom-shake { animation-duration: 400ms; }
  @keyframes konicom-boom-shake {
    0% { transform: translate3d(0,0,0); }
    16% { transform: translate3d(-4px,3px,0); }
    33% { transform: translate3d(4px,-3px,0); }
    52% { transform: translate3d(-2px,2px,0); }
    100% { transform: translate3d(0,0,0); }
  }
}

@media (prefers-reduced-motion: reduce) {
  .fx-seam { display: none; }
  .deck.boom-shake { animation: none; }
}

/* No-WebGL cover: the medallion tightens, then is replaced by the burst. */
.cover.is-charging .fallback-platter { animation: konicom-charge 340ms cubic-bezier(.5, 0, .9, .4) both; }
@keyframes konicom-charge {
  0% { transform: scale(1); filter: none; }
  60% { transform: scale(1.04) translate(1px, -1px); }
  100% { transform: scale(1.09) translate(-2px, 1px); filter: brightness(1.5) saturate(1.25); }
}
.cover.is-boomed .fallback-platter { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  .cover.is-charging .fallback-platter { animation: none; }
}
