.exhaust::before, .exhaust::after { content: ""; position: absolute; top: 0px; width: 29%; height: 86%; clip-path: polygon(18% 0px, 82% 0px, 100% 48%, 50% 100%, 0px 48%); background: linear-gradient(rgb(255, 253, 224) 0px, rgb(255, 253, 224) 11%, rgb(255, 233, 85) 14%, rgb(255, 233, 85) 34%, rgb(255, 138, 50) 39%, rgb(255, 138, 50) 61%, rgb(237, 67, 80) 66%, transparent 72%); filter: drop-shadow(rgb(255, 180, 73) 0px 0px 7px); }

.exhaust::before { left: 15%; transform: rotate(7deg); }

.exhaust::after { right: 15%; transform: rotate(-7deg); }

.bug.rocket-charge .exhaust { opacity: 0.5; animation: 0.18s ease 0s infinite alternate none running chargeExhaust; }

.bug.rocket-charge .visual { animation: 0.11s ease 0s infinite alternate none running chargeShake; }

.bug.rocket-dash .exhaust { opacity: 1; transform: translateX(-50%) scaleY(1.65); filter: drop-shadow(rgb(255, 180, 76) 0px 0px 10px); }

.loot-slice { position: absolute; z-index: 7; left: 50%; top: 4%; width: 38px; height: 31px; transform: translate(-50%, -50%) rotate(-8deg); opacity: 0; filter: drop-shadow(rgba(70, 30, 25, 0.25) 0px 4px 3px); pointer-events: none; }

.loot-slice::before { content: ""; position: absolute; inset: 0px; clip-path: polygon(50% 100%, 4% 10%, 96% 10%); background: rgb(255, 214, 93); border-radius: 5px; }

.loot-slice::after { content: ""; position: absolute; left: 7%; right: 7%; top: 3px; height: 7px; border-radius: 8px; background: rgb(223, 136, 70); border: 2px solid rgb(102, 56, 44); }

.bug.has-loot .loot-slice { opacity: 1; animation: 0.23s ease 0s infinite alternate none running lootBob; }
.bug.stealing .loot-slice { transform: translate(-50%, -50%) rotate(-8deg) scale(1.18); }
.helper.delivering .tray { transform: translate(-50%, -50%) scale(1.12); }

.helper { width: 134px; height: 126px; z-index: 38; }

.helper .visual { width: 86px; height: 86px; top: 57%; }

.helper .shadow { top: 82%; width: 58px; height: 14px; }

.helper .courier-hat { position: absolute; left: 50%; top: 18%; width: 62px; height: 34px; transform: translate(-50%, -50%); z-index: 8; background: rgb(255, 253, 244); border: 3px solid rgb(66, 50, 59); border-radius: 50% 50% 42% 42%; box-shadow: rgb(169, 232, 225) 0px -7px inset; }

.helper .courier-hat::after { content: ""; position: absolute; left: 8px; right: 8px; bottom: -6px; height: 9px; border-radius: 99px; background: rgb(255, 253, 244); border: 3px solid rgb(66, 50, 59); }

.helper .tray { position: absolute; left: 50%; top: 0px; width: 86px; height: 35px; transform: translate(-50%, -50%); z-index: 9; }

.helper .tray::before { content: ""; position: absolute; left: 7px; right: 7px; bottom: 2px; height: 7px; background: rgb(86, 99, 106); border: 3px solid rgb(34, 34, 34); border-radius: 99px; }

.helper .tray .loot-slice { opacity: 1; left: 50%; top: 38%; width: 46px; height: 37px; }

.helper .halo { position: absolute; inset: 8px; border: 4px dashed rgba(73, 181, 161, 0.72); border-radius: 50%; animation: 3.5s linear 0s infinite normal none running haloSpin; z-index: 0; }

.helper.hit .visual { animation: helperOuch .25s var(--ease); }

.helper.entering .tray { animation: 0.25s ease 0s infinite alternate none running trayBob; }

.stomp-mark, .takeoff-mark, .scorch-mark { position: absolute; transform: translate(-50%,-50%) rotate(var(--rot,0deg)); pointer-events: none; z-index: 9; opacity: 0.92; }

.stomp-mark { width: 86px; height: 54px; border-radius: 48% 52% 44% 56%; background: radial-gradient(ellipse,var(--mark) 0 42%,var(--mark2) 43% 60%,transparent 62%); filter: drop-shadow(rgba(45, 25, 22, 0.17) 0px 4px 3px); }

.stomp-mark::after { content: ""; position: absolute; inset: 17% 18%; border: 3px dashed rgba(31, 22, 22, 0.44); border-radius: 50%; }

.stomp-mark b, .takeoff-mark b, .scorch-mark b { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-8deg); font-size: 13px; font-weight: 1000; letter-spacing: 0.03em; color: rgb(32, 22, 25); text-shadow: rgb(255, 248, 201) 1px 1px; white-space: nowrap; }

.takeoff-mark { width: 72px; height: 44px; border-radius: 50%; border: 4px dashed rgb(36, 205, 183); background: radial-gradient(rgba(36, 205, 183, 0.18), transparent 66%); }

.scorch-mark { width: 78px; height: 42px; border-radius: 50%; background: radial-gradient(rgba(40, 27, 26, 0.68) 0px, rgba(40, 27, 26, 0.68) 28%, rgba(240, 95, 75, 0.34) 30%, rgba(240, 95, 75, 0.34) 49%, transparent 58%); filter: blur(0.1px); }

.mark-new { animation: markPop .28s var(--ease); }

.tap-cue { position: absolute; width: 118px; height: 118px; border: 3px solid rgba(24, 19, 23, 0.24); border-radius: 50%; transform: translate(-50%, -50%); z-index: 24; pointer-events: none; opacity: 0; }

.tap-cue.show { opacity: 1; animation: 1s ease 0s infinite normal none running cue; }

.shoe { position: absolute; width: 92px; height: 148px; z-index: 80; transform: translate(-50%, -50%) rotate(-14deg); pointer-events: none; opacity: 0; }

.shoe svg path:first-child { fill: rgb(255, 115, 94); stroke: rgb(33, 24, 26); stroke-width: 5; }

.shoe .strap { fill: none; stroke: rgb(255, 240, 201); stroke-width: 8; stroke-linecap: round; stroke-linejoin: round; }

.shoe .sole { fill: none; stroke: rgb(196, 66, 54); stroke-width: 5; stroke-linecap: round; }

.shoe.go { animation: shoeHit .32s var(--ease); }

.impact-lines { position: absolute; width: 130px; height: 130px; transform: translate(-50%, -50%); z-index: 79; pointer-events: none; opacity: 0; }

.impact-lines i { position: absolute; left: 50%; top: 50%; width: 54px; height: 5px; border-radius: 9px; background: rgb(29, 23, 25); transform-origin: 0px 50%; }

.impact-lines i:nth-child(1) { transform: rotate(0deg) translateX(38px); }

.impact-lines i:nth-child(2) { transform: rotate(45deg) translateX(38px); }

.impact-lines i:nth-child(3) { transform: rotate(90deg) translateX(38px); }

.impact-lines i:nth-child(4) { transform: rotate(135deg) translateX(38px); }

.impact-lines i:nth-child(5) { transform: rotate(180deg) translateX(38px); }

.impact-lines i:nth-child(6) { transform: rotate(225deg) translateX(38px); }

.impact-lines i:nth-child(7) { transform: rotate(270deg) translateX(38px); }

.impact-lines i:nth-child(8) { transform: rotate(315deg) translateX(38px); }

.impact-lines.go { animation: lineHit .28s var(--ease); }

.toast { position: absolute; left: 50%; top: calc(var(--safe-top) + 96px); transform: translateX(-50%) translateY(-8px) scale(0.92); z-index: 90; max-width: min(84vw, 340px); padding: 8px 11px; border-radius: 10px; background: rgb(23, 19, 23); color: rgb(255, 255, 255); font-size: 12px; font-weight: 1000; letter-spacing: 0.04em; text-align: center; opacity: 0; pointer-events: none; }

.toast.show { animation: toast .98s var(--ease); }

.end { position: absolute; inset: 0px; z-index: 120; display: grid; place-items: center; padding: 24px; background: rgba(27, 19, 21, 0.28); backdrop-filter: blur(7px); opacity: 0; pointer-events: none; transition: opacity 0.2s; }

.end.show { opacity: 1; pointer-events: auto; }

.end-card { width: min(88vw, 360px); padding: 25px 19px 18px; border: 3px solid rgb(32, 24, 27); border-radius: 24px; background: rgb(255, 248, 232); box-shadow: rgba(30, 18, 17, 0.3) 0px 20px 70px; text-align: center; }

.end h1 { font-size: 42px; margin: 0px; line-height: 0.95; letter-spacing: -0.04em; }

.end p { font-size: 12px; font-weight: 800; margin: 9px 0px 17px; opacity: 0.7; }

.again, .next-card button { border: 3px solid rgb(29, 23, 25); border-radius: 999px; font-weight: 1000; cursor: pointer; }

.again { padding: 10px 20px; background: var(--acid); box-shadow: rgb(29, 23, 25) 0px 5px 0px; }

.next-card { position: relative; margin-top: 19px; padding: 16px 12px 13px; border-radius: 18px; background: rgb(26, 22, 34); color: rgb(255, 255, 255); overflow: hidden; }

.next-card .moon { position: absolute; right: 11px; top: 3px; font-size: 50px; color: rgb(255, 215, 94); opacity: 0.28; }

.next-card b { position: relative; display: block; font-size: 14px; letter-spacing: 0.03em; }

.next-card small { position: relative; display: block; margin: 5px auto 10px; max-width: 250px; font-size: 10px; line-height: 1.35; opacity: 0.72; }

.next-card button { position: relative; padding: 9px 14px; background: rgb(255, 241, 208); color: rgb(29, 23, 25); border-width: 2px; font-size: 10px; }

.next-card button.chosen { background: var(--teal); }

@keyframes wingFrameA {
  0%, 49.999% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

@keyframes wingFrameB {
  0%, 49.999% { opacity: 0; }
  50%, 100% { opacity: 1; }
}

@keyframes trailpulse { 
  100% { transform: translate(-52%, -50%) scaleX(1.12); }
}

@keyframes panicbody { 
  100% { transform: translate(-50%, -50%) rotate(5deg); }
}

@keyframes chargeShake { 
  100% { transform: translate(-49%, -50%) rotate(2deg); }
}

@keyframes chargeExhaust { 
  100% { opacity: 1; transform: translateX(-50%) scaleY(1.35); }
}

@keyframes lootBob { 
  100% { transform: translate(-50%, -60%) rotate(5deg) scale(1.08); }
}

@keyframes haloSpin { 
  100% { transform: rotate(360deg); }
}

@keyframes trayBob { 
  100% { transform: translate(-50%, -58%) rotate(3deg); }
}

@keyframes helperOuch { 
  50% { transform: translate(-50%, -50%) rotate(14deg) scale(0.88); }
}

@keyframes markPop { 
  0% { transform: translate(-50%, -50%) scale(0.2); }
  70% { transform: translate(-50%, -50%) scale(1.15); }
}

@keyframes cue { 
  50% { transform: translate(-50%, -50%) scale(0.75); opacity: 0.25; }
}

@keyframes shoeHit { 
  0% { opacity: 0; transform: translate(-50%, -120%) rotate(-18deg) scale(0.85); }
  32% { opacity: 1; }
  68% { opacity: 1; transform: translate(-50%, -50%) rotate(-8deg) scale(1.08); }
  100% { opacity: 0; transform: translate(-50%, -46%) rotate(-5deg); }
}

@keyframes lineHit { 
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.2); }
  48% { opacity: 0.9; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.2); }
}

@keyframes toast { 
  0%, 100% { opacity: 0; }
  12%, 76% { opacity: 1; transform: translateX(-50%) translateY(0px) scale(1); }
}

@keyframes foodpulse { 
  50% { transform: rotate(-2deg) scale(1.08); }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
  .bug .visual, .bug .shadow, .bug .wing-flipbook, .bug .elevation { transition: none !important; }
  .bug.airborne .wing-frame-a, .bug.escaping .wing-frame-a { animation: none !important; opacity: 1; }
  .bug.airborne .wing-frame-b, .bug.escaping .wing-frame-b { animation: none !important; opacity: 0; }
}

@media (max-height: 580px) {
  .food { width: var(--target-small-width); height: var(--target-small-height); top: var(--target-small-top); right: var(--target-small-right); }
  .mission { top: calc(var(--safe-top) + 46px); }
  .toast { top: calc(var(--safe-top) + 82px); }
  .stage::after { min-height: 112px; height: 22vh; }
}

/* v18: bounded Night Raid readability + lighting; day baseline remains selector-isolated. */
.stage.night-raid{background:radial-gradient(42% 31% at 82% 18%,rgba(255,205,118,.22) 0%,rgba(255,190,100,.08) 42%,transparent 73%),radial-gradient(54% 39% at 13% 34%,rgba(103,190,235,.18) 0%,rgba(85,147,211,.07) 46%,transparent 76%),radial-gradient(90% 58% at 50% -8%,rgba(150,169,214,.34),transparent 58%),linear-gradient(158deg,#27283b 0%,#171827 54%,#11131f 100%);color:#fff8e8}
.stage.night-raid::before{opacity:.42}
.stage.night-raid .topbar,.stage.night-raid .mission{filter:drop-shadow(0 2px 3px rgba(0,0,0,.48))}
.stage.night-raid .mission{color:#211a1c}
.stage.night-raid .spawn-hole{filter:drop-shadow(0 -7px 16px rgba(101,190,235,.22))}
.stage.night-raid .food{filter:drop-shadow(0 0 13px rgba(255,205,118,.18))}
.stage.night-raid .bug .visual-body{filter:drop-shadow(0 0 5px rgba(139,205,232,.22)) drop-shadow(0 8px 7px rgba(8,7,14,.46))}
.stage.night-raid .bug.airborne .visual-body,.stage.night-raid .bug.escaping .visual-body{filter:drop-shadow(0 0 6px rgba(139,205,232,.24)) drop-shadow(0 22px 14px rgba(7,6,13,.46))}
.stage.night-raid .leg{stroke:#d4aa82;filter:drop-shadow(0 0 1px #16101a) drop-shadow(0 0 2px rgba(255,220,169,.34))}
.stage.night-raid .ant{stroke:#e0bb92;filter:drop-shadow(0 0 1px #16101a) drop-shadow(0 0 2px rgba(255,220,169,.38))}
.stage.night-raid .end-card{color:#20181b}
.stage.night-raid .next-card{color:#fff}