/* Five-second decorative chase: silent and click-through. */
.warden-chase { position: fixed; width: 360px; height: 150px; z-index: 40; pointer-events: none; user-select: none; contain: layout; transform: scale(var(--chase-scale, 1)); transform-origin: top left; }
.warden-chase[hidden] { display: none !important; }
.warden-chase svg { width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 3px 2px #0009); }
.chase-runner { position: absolute; width: 45px; height: 72px; left: 0; bottom: 15px; opacity: 0; }
.chase-warden { position: absolute; width: 72px; height: 93px; left: 0; bottom: 15px; opacity: 0; }
.chase-warden__body { width: 100%; height: 100%; }
.runner-leg { transform-origin: 21px 43px; }
.runner-arm { transform-origin: 26px 25px; }
.warden-leg { transform-origin: 28px 52px; }
.warden-arm { transform-origin: 30px 28px; }
.warden-soul { filter: drop-shadow(0 0 3px #3ff2d0); }
.chase-portal { position: absolute; left: 274px; bottom: 12px; width: 57px; height: 108px; transform-origin: 50% 100%; opacity: 0; }
.chase-portal__frame { position: absolute; inset: 0; border: 9px solid #211731; border-top-color: #3a2852; border-bottom-color: #110f21; box-shadow: inset 0 0 0 3px #5c3481, 0 0 14px #b150fc80; background: repeating-linear-gradient(0deg, #572c9d 0 8px, #823bc1 8px 14px, #9c59df 14px 18px); }
.chase-portal__frame::before { content: ''; position: absolute; inset: -9px; border: 3px dashed #584068; }
.chase-portal__frame i { position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 8px, #d188ff55 8px 14px, transparent 14px 20px); }
.chase-impact { position: absolute; left: 282px; bottom: 55px; }
.chase-impact span { position: absolute; width: 6px; height: 6px; background: #79ebdd; box-shadow: 0 0 6px #52ddcc80; opacity: 0; --dx: -28px; --dy: -35px; }
.chase-impact span:nth-child(2) { --dx: 26px; --dy: -44px; background: #b572fa; }
.chase-impact span:nth-child(3) { --dx: -53px; --dy: -5px; }
.chase-impact span:nth-child(4) { --dx: 43px; --dy: 16px; background: #8755d5; }
.chase-impact span:nth-child(5) { --dx: -23px; --dy: 34px; }
.chase-impact span:nth-child(6) { --dx: 9px; --dy: 39px; background: #b572fa; }
.chase-impact span:nth-child(7) { --dx: -66px; --dy: 22px; }
.chase-impact span:nth-child(8) { --dx: 38px; --dy: -17px; }
.is-playing .chase-runner { animation: chase-run 5s linear both; }
.is-playing .chase-warden { animation: chase-follow 5s linear both; }
.is-playing .chase-warden__body { animation: chase-bonk 5s linear both; }
.is-playing .chase-portal { animation: chase-gateway 5s linear both; }
.is-playing .chase-portal__frame i { animation: portal-shimmer .5s steps(3) infinite alternate; }
.is-playing .runner-leg--front, .is-playing .runner-arm--back { animation: chase-stride .24s ease-in-out infinite alternate; }
.is-playing .runner-leg--back, .is-playing .runner-arm--front { animation: chase-stride .24s ease-in-out infinite alternate-reverse; }
.is-playing .warden-leg--front, .is-playing .warden-arm--back { animation: warden-stride .3s ease-in-out 12 alternate; }
.is-playing .warden-leg--back, .is-playing .warden-arm--front { animation: warden-stride .3s ease-in-out 12 alternate-reverse; }
.is-playing .chase-impact span { animation: chase-particles 5s ease-out both; }
@keyframes chase-run {
  0% { opacity: 0; transform: translate(0,0); }
  5% { opacity: 1; }
  15% { transform: translate(44px,-3px); }
  30% { transform: translate(114px,0); }
  46% { transform: translate(190px,-3px); }
  51% { transform: translate(213px,0); }
  57% { opacity: 1; transform: translate(246px,-23px) scale(.95); }
  62%, 100% { opacity: 0; transform: translate(281px,-18px) scale(.25); }
}
@keyframes chase-follow {
  0%, 9% { opacity: 0; transform: translate(-25px,0); }
  15% { opacity: 1; transform: translate(0,0); }
  35% { transform: translate(86px,-2px); }
  55% { transform: translate(171px,0); }
  73% { opacity: 1; transform: translate(238px,0); }
  78% { opacity: 1; transform: translate(219px,-9px); }
  85% { opacity: 1; transform: translate(211px,0); }
  96%, 100% { opacity: 0; transform: translate(211px,7px); }
}
@keyframes chase-bonk { 0%, 72% { transform: rotate(0); } 74% { transform: rotate(13deg) scaleX(.85); } 79% { transform: rotate(-17deg); } 87%, 100% { transform: rotate(-8deg); } }
@keyframes chase-gateway { 0%, 29% { opacity: 0; transform: scale(.05, .3); } 40%, 61% { opacity: 1; transform: scale(1); } 67%, 100% { opacity: 0; transform: scale(.03, .9); } }
@keyframes chase-stride { from { transform: rotate(-29deg); } to { transform: rotate(29deg); } }
@keyframes warden-stride { from { transform: rotate(-18deg); } to { transform: rotate(18deg); } }
@keyframes portal-shimmer { to { opacity: .4; transform: translateY(5px); } }
@keyframes chase-particles { 0%, 73% { opacity: 0; transform: translate(0,0) scale(1); } 75% { opacity: 1; transform: translate(0,0) scale(1); } 98%, 100% { opacity: 0; transform: translate(var(--dx),var(--dy)) scale(.15); } }
@media (prefers-reduced-motion: reduce) { .warden-chase { display: none !important; } }