/* Impact feel overlays driven by src/impact-juice.js. Presentation only. */
.impact-flash, .impact-edge, .impact-big { position: fixed; inset: 0; pointer-events: none; opacity: 0; }
.impact-flash { z-index: 30; mix-blend-mode: screen; background: radial-gradient(circle var(--flash-size, 300px) at var(--fx, 50%) var(--fy, 45%), var(--flash, #fff2c4), transparent 70%); }
.impact-flash.show { animation: impact-flash 260ms ease-out; }
@keyframes impact-flash { 0% { opacity: var(--flash-alpha, .6); } 100% { opacity: 0; } }

.impact-edge { z-index: 31; box-shadow: inset 0 0 0 6px var(--edge, #ffd25a), inset 0 0 90px 10px color-mix(in srgb, var(--edge, #ffd25a) 55%, transparent); }
.impact-edge.show { animation: impact-edge 420ms ease-out; }
@keyframes impact-edge { 0% { opacity: 1; } 100% { opacity: 0; } }

.impact-big { z-index: 38; display: grid; place-items: center; inset: 30% 0 auto; height: 22%; font-size: clamp(54px, 15vw, 128px); font-weight: 1000; line-height: 1; letter-spacing: -3px; color: var(--game-gold, #ffd25a); -webkit-text-stroke: 3px var(--game-line, #0b1626); paint-order: stroke fill; text-shadow: 0 6px 0 var(--game-line, #0b1626), 0 0 30px color-mix(in srgb, var(--game-gold, #ffd25a) 60%, transparent); white-space: nowrap; }
.impact-big[data-kind="mega"] { color: #ff8a3d; font-size: clamp(60px, 17vw, 150px); }
.impact-big[data-kind="goal"] { color: var(--game-mint, #6ee7b7); font-size: clamp(46px, 12vw, 104px); }
.impact-big.show { animation: impact-big 900ms cubic-bezier(.2, .9, .3, 1.3); }
@keyframes impact-big {
  0% { opacity: 0; transform: scale(2.6) rotate(-8deg); }
  14% { opacity: 1; transform: scale(.9) rotate(-4deg); }
  24% { transform: scale(1.08) rotate(-5deg); }
  75% { opacity: 1; transform: scale(1) rotate(-5deg); }
  100% { opacity: 0; transform: scale(1.12) translateY(-24px) rotate(-5deg); }
}

/* HUD reacts to the hit. */
#score.bump { display: inline-block; animation: score-bump 260ms ease-out; }
@keyframes score-bump { 0% { transform: scale(1.45); color: var(--game-gold, #ffd25a); } 100% { transform: scale(1); } }
.arcade-game .fire-button.punch { animation: fire-punch 220ms ease-out; }
@keyframes fire-punch { 0% { transform: scale(.82); } 55% { transform: scale(1.1); } 100% { transform: scale(1); } }
.arcade-game .progress-track > div { transition: transform 260ms cubic-bezier(.2, .9, .3, 1.2); }
.arcade-game .combo-banner[data-kind="chain"] { color: #ff8a3d; }

@media (prefers-reduced-motion: reduce) {
  .impact-flash, #score.bump, .arcade-game .fire-button.punch { animation: none !important; }
  .impact-big.show { animation: impact-edge 600ms linear; transform: rotate(-5deg); }
}
.arcade-game[data-reduced-motion="true"] .impact-flash,
.arcade-game[data-reduced-motion="true"] #score.bump,
.arcade-game[data-reduced-motion="true"] .fire-button.punch { animation: none !important; }
.arcade-game[data-modal="home"] .impact-big, .arcade-game[data-modal="home"] .impact-edge { visibility: hidden; }
/* One headline at a time: the big word replaces the small combo banner. */
.arcade-game:has(.impact-big.show) .combo-banner { visibility: hidden; }

/* Rough hit words at the impact point and a short screen crack on heavy blows. */
.impact-word { position: fixed; z-index: 37; inset: auto; left: var(--wx, 50%); top: var(--wy, 45%); pointer-events: none; opacity: 0; transform: translate(-50%, -50%); font-size: var(--wsize, 48px); font-weight: 1000; line-height: 1; letter-spacing: -2px; white-space: nowrap; color: #fff4d6; -webkit-text-stroke: 4px #1a1208; paint-order: stroke fill; text-shadow: 0 5px 0 #1a1208, 0 0 18px rgba(255, 140, 40, .55); }
.impact-word.show { animation: impact-word 560ms cubic-bezier(.15, 1.4, .4, 1) forwards; }
@keyframes impact-word {
  0% { opacity: 1; transform: translate(-50%, -50%) rotate(var(--wtilt, -8deg)) scale(2.1); }
  14% { opacity: 1; transform: translate(-50%, -62%) rotate(var(--wtilt, -8deg)) scale(.92); }
  26% { transform: translate(-50%, -66%) rotate(var(--wtilt, -8deg)) scale(1.06); }
  75% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -96%) rotate(var(--wtilt, -8deg)) scale(1); }
}
.impact-crack { position: fixed; z-index: 29; inset: 0; pointer-events: none; opacity: 0;
  background: no-repeat var(--cx, 50%) var(--cy, 45%) / var(--csize, 420px) var(--csize, 420px);
  background-position: calc(var(--cx, 50%) - var(--csize, 420px) / 2) calc(var(--cy, 45%) - var(--csize, 420px) / 2);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-100 -100 200 200'%3E%3Cg fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke-width='3.2' d='M0 0 L22 -9 L41 -6 L63 -21 L96 -18 M0 0 L9 24 L4 47 L18 71 L13 98 M0 0 L-25 7 L-44 -4 L-70 9 L-98 3 M0 0 L-8 -27 L-23 -45 L-19 -72 L-34 -97 M0 0 L28 22 L49 30 L60 55 L84 71 M0 0 L-21 -15 L-46 -24 L-60 -51'/%3E%3Cpath stroke-width='1.6' opacity='.8' d='M41 -6 L45 12 L63 21 M18 71 L35 80 M-44 -4 L-41 -26 M-23 -45 L-2 -55 L10 -78 M49 30 L71 25 M-70 9 L-66 30 L-82 44 M22 -9 L18 -31 L33 -52'/%3E%3Cpath stroke-width='1' opacity='.6' d='M-12 -11 L12 -12 L16 10 L-6 15 Z M-30 -24 L28 -30 L37 22 L-14 36 L-34 6 Z'/%3E%3C/g%3E%3C/svg%3E");
  transform-origin: var(--cx, 50%) var(--cy, 45%); rotate: var(--crot, 0deg); filter: drop-shadow(0 0 2px rgba(0, 0, 0, .9)) drop-shadow(0 0 6px rgba(255, 220, 160, .5)); }
.impact-crack.show { animation: impact-crack 620ms ease-out forwards; }
@keyframes impact-crack { 0% { opacity: 0; transform: scale(.55); } 8% { opacity: .75; transform: scale(1.04); } 18% { transform: scale(1); } 60% { opacity: .45; } 100% { opacity: 0; transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .impact-word.show, .impact-crack.show { animation: none !important; opacity: 0; } }
.arcade-game[data-reduced-motion="true"] .impact-word, .arcade-game[data-reduced-motion="true"] .impact-crack { display: none; }
.arcade-game[data-modal="home"] .impact-word, .arcade-game[data-modal="home"] .impact-crack { visibility: hidden; }
