/* CAT v0.3.10 — independently controllable character, portals, and 2-stroke impacts.
   Artist-directed beats. No procedural skeletons and no body-part collage. */
.cat-cinematic{position:absolute;inset:0;z-index:17;overflow:hidden;pointer-events:none;isolation:isolate;color:#fff0dc;--cat-entry-x:30%;--cat-attack-x:54%;--cat-attack-bottom:40%}
.cat-cinematic[hidden]{display:none!important}
.cat-light{position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 14% 75%,#ffa5431d,transparent 31%),linear-gradient(90deg,#051020ad,#0b173014 55%,#070e195c)}
.cat-action-sprite{position:absolute;z-index:6;width:clamp(130px,31%,280px);height:39%;left:13%;bottom:8%;object-fit:contain;object-position:bottom center;transform:translateX(-50%);image-rendering:pixelated;filter:drop-shadow(0 6px 2px #040915) drop-shadow(0 0 8px #ffaa4f66)}
.cat-action-shadow{position:absolute;z-index:1;width:14%;height:12px;left:13%;bottom:8%;transform:translateX(-50%);background:#070915a6;border-radius:50%;filter:blur(4px)}
.cat-action-caption{position:absolute;z-index:18;top:11%;left:4%;max-width:89%;display:grid;gap:3px;text-shadow:0 3px 6px #000,0 0 13px #07162c}
.cat-action-caption small{font:800 clamp(8px,1.45vw,12px) monospace;letter-spacing:.12em;color:#ffc78d}.cat-action-caption small span{color:#96efff}
.cat-action-caption strong{font:950 clamp(18px,5vw,39px) system-ui;color:#fff5d8;line-height:1.05;letter-spacing:.045em}
.cat-action-caption em{font:600 clamp(10px,1.75vw,14px) system-ui;color:#e0edff;font-style:normal}.cat-action-caption b{font:800 10px monospace;color:#a9ecff}
.cat-portal{position:absolute;z-index:4;opacity:0;left:29%;bottom:30%;width:11%;height:34%;border-radius:50%;transform:translateX(-50%) rotate(-17deg) scale(.15);background:radial-gradient(ellipse,#081332ea 0 36%,#215d80bd 52%,#72e8f688 63%,transparent 71%);border:2px solid #9af7ff;box-shadow:0 0 10px #a5ffff,0 0 29px #22dcffdd,inset 0 0 19px #69dcffad;filter:drop-shadow(0 0 11px #25bfff)}
.cat-portal i{position:absolute;inset:-10%;border:2px dashed #9ff7ffa9;border-radius:50%;animation:catPortalSpin .8s linear infinite}
.cat-portal-entry{left:var(--cat-entry-x)}.cat-portal-exit{left:var(--cat-attack-x);bottom:var(--cat-attack-bottom);height:29%}
.cat-portal-home{left:13%;bottom:9%;width:15%;height:29%;transform:translateX(-50%) rotate(-22deg) scale(.15)}
.cat-cinematic[data-beat=open] .cat-portal-entry,.cat-cinematic[data-beat=open] .cat-portal-exit,.cat-cinematic[data-beat=portal-first] .cat-portal-entry,.cat-cinematic[data-beat=portal-first] .cat-portal-exit,.cat-cinematic[data-beat=portal-enter] .cat-portal-entry,.cat-cinematic[data-beat=portal-enter] .cat-portal-exit,.cat-cinematic[data-beat=portal-exit] .cat-portal-entry,.cat-cinematic[data-beat=portal-exit] .cat-portal-exit{animation:catPortalOpen .23s ease-out both}
.cat-cinematic[data-beat=portal-enter][data-pass="3"] .cat-portal-home,.cat-cinematic[data-beat=portal-home] .cat-portal-home{animation:catPortalOpen .22s ease-out both}
.cat-cinematic[data-beat=large-swipe-a] .cat-portal-exit,.cat-cinematic[data-beat=large-swipe-b] .cat-portal-exit{opacity:.85;transform:translateX(-50%) rotate(-17deg) scale(.86)}
.cat-cinematic[data-beat=portal-home] .cat-portal-entry,.cat-cinematic[data-beat=portal-home] .cat-portal-exit{animation:catPortalCollapse .22s ease-in both}
.cat-afterimage{position:absolute;z-index:4;left:43%;bottom:32%;width:11%;height:23%;opacity:0;border-radius:50%;border:2px solid #62f4ff;filter:drop-shadow(0 0 12px #31cfff);transform:rotate(-19deg)}
.cat-afterimage-b{left:58%;bottom:42%;width:8%;height:15%;border-style:dashed}
.cat-cinematic[data-beat=portal-first] .cat-afterimage,.cat-cinematic[data-beat=portal-enter] .cat-afterimage,.cat-cinematic[data-beat=portal-exit] .cat-afterimage{animation:catEchoFlare .3s ease-out both}
.cat-cinematic[data-beat=portal-exit] .cat-afterimage-b{animation-delay:.08s}
.cat-swipe-cluster{position:absolute;z-index:12;left:var(--cat-attack-x);top:28%;bottom:auto;height:21%;width:30%;opacity:0;transform:translate(-50%,45%) rotate(-23deg);filter:drop-shadow(0 0 9px #6addff)}
.cat-swipe-cluster i{position:absolute;width:77%;height:5px;left:12%;border-radius:100%;transform:rotate(-32deg);background:linear-gradient(90deg,transparent,#ffffff 17%,#d7fbff 54%,#74e3ff 78%,transparent);box-shadow:0 0 12px #69e6ff,0 0 21px #ffb357}
.cat-swipe-cluster i:nth-child(1){top:16%;left:1%}.cat-swipe-cluster i:nth-child(2){top:44%;left:11%}.cat-swipe-cluster i:nth-child(3){top:73%;left:22%}
.cat-swipe-second{transform:translate(-38%,60%) rotate(12deg)}
.cat-cinematic[data-mode=pounce] .cat-swipe-cluster{width:16%;height:13%;left:56%;top:33%;bottom:auto;filter:drop-shadow(0 0 5px #fee3b4)}
.cat-cinematic[data-mode=pounce] .cat-swipe-cluster i{height:3px;background:linear-gradient(90deg,transparent,#fff7ca 19%,#ffc98b 62%,transparent);box-shadow:0 0 5px #ffb955}
.cat-cinematic[data-beat=small-swipe-a] .cat-swipe-first,.cat-cinematic[data-beat=large-swipe-a] .cat-swipe-first{animation:catScratchBurst .16s ease-out both}
.cat-cinematic[data-beat=small-swipe-b] .cat-swipe-second,.cat-cinematic[data-beat=large-swipe-b] .cat-swipe-second{animation:catScratchBurst .17s ease-out both}
.cat-impact-ring{position:absolute;z-index:9;left:var(--cat-attack-x);top:32%;bottom:auto;transform:translate(-50%,-50%);width:19%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fffbe5,#ffb95b83 33%,#7deaff66 48%,transparent 70%);opacity:0;filter:blur(4px)}
.cat-cinematic[data-beat^=large-swipe] .cat-impact-ring{animation:catRing .22s ease-out both}
.cat-cinematic[data-beat^=small-swipe] .cat-impact-ring{width:7%;animation:catRing .16s ease-out both}
/* Each named beat owns a sprite pose; the scene camera never assembles a cat from parts. */
.cat-cinematic[data-beat=sit] .cat-action-sprite{animation:catAtHome .25s ease-out both}
.cat-cinematic[data-beat=stretch] .cat-action-sprite{animation:catStretch .29s ease-out both}
.cat-cinematic[data-beat=pounce-leap] .cat-action-sprite{animation:catRegularLeap .48s cubic-bezier(.28,.12,.38,.96) both}
.cat-cinematic[data-beat^=small-swipe] .cat-action-sprite{left:54%;bottom:42%;transform:translateX(-50%) scale(.82)}
.cat-cinematic[data-beat=small-swipe-a] .cat-action-sprite{animation:catLittlePaw .16s ease-out both}
.cat-cinematic[data-beat=small-swipe-b] .cat-action-sprite{animation:catLittlePawTwo .17s ease-out both}
.cat-cinematic[data-beat=pounce-return] .cat-action-sprite{animation:catReturnHop .45s cubic-bezier(.38,0,.66,1) both}
.cat-cinematic[data-beat=open] .cat-action-sprite{animation:catStretch .4s ease both}
.cat-cinematic[data-beat=portal-first] .cat-action-sprite{animation:catIntoPortal .26s ease-in both}
.cat-cinematic[data-beat=portal-enter] .cat-action-sprite{animation:catFromHitToPortal .23s ease-in both}
.cat-cinematic[data-beat=portal-exit] .cat-action-sprite{animation:catPortalPass .25s cubic-bezier(.18,.88,.33,1) both}
.cat-cinematic[data-beat^=large-swipe] .cat-action-sprite{left:var(--cat-attack-x);bottom:var(--cat-attack-bottom);transform:translateX(-50%) scale(.91)}
.cat-cinematic[data-beat=large-swipe-a] .cat-action-sprite{animation:catBigPaw .18s ease-out both}
.cat-cinematic[data-beat=large-swipe-b] .cat-action-sprite{animation:catBigPawTwo .19s ease-out both}
.cat-cinematic[data-beat=portal-home] .cat-action-sprite{animation:catPortalReturn .36s ease-out both}
.boss-entity.cat-claw-hit{filter:brightness(2.05) drop-shadow(0 0 12px #ffc790)}
@keyframes catAtHome{0%{left:13%;bottom:8%;opacity:.85;transform:translateX(-50%) scale(.95)}100%{left:13%;bottom:8%;opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes catStretch{from{left:13%;bottom:10%;transform:translateX(-50%) scaleY(1.06)}to{left:13%;bottom:7%;transform:translateX(-50%) scaleY(.91)}}
@keyframes catRegularLeap{0%{left:13%;bottom:8%;transform:translateX(-50%) scale(.86)}30%{left:27%;bottom:29%;transform:translateX(-50%) scale(.9)}75%{left:46%;bottom:45%;transform:translateX(-50%) scale(.94)}100%{left:54%;bottom:42%;transform:translateX(-50%) scale(.88)}}
@keyframes catLittlePaw{from{transform:translateX(-56%) scale(.84) rotate(-6deg)}to{transform:translateX(-47%) scale(.88) rotate(5deg)}}
@keyframes catLittlePawTwo{from{transform:translateX(-45%) scale(.88) rotate(6deg)}to{transform:translateX(-55%) scale(.82) rotate(-4deg)}}
@keyframes catReturnHop{0%{left:54%;bottom:42%;opacity:1;transform:translateX(-50%) scale(.82)}55%{left:29%;bottom:23%;transform:translateX(-50%) scale(.89)}100%{left:13%;bottom:8%;transform:translateX(-50%) scale(1)}}
@keyframes catIntoPortal{0%{left:13%;bottom:8%;opacity:1;transform:translateX(-50%) scale(.94)}45%{left:var(--cat-entry-x);bottom:32%;opacity:1;transform:translateX(-50%) scale(.85)}100%{left:var(--cat-entry-x);bottom:38%;opacity:0;transform:translateX(-50%) scale(.18)}}
@keyframes catFromHitToPortal{0%{left:var(--cat-attack-x);bottom:var(--cat-attack-bottom);opacity:1;transform:translateX(-50%) scale(1)}100%{left:var(--cat-attack-x);bottom:var(--cat-attack-bottom);opacity:0;transform:translateX(-50%) scale(.15)}}
@keyframes catPortalPass{0%{left:var(--cat-entry-x);bottom:30%;opacity:0;transform:translateX(-50%) scale(.22)}25%{opacity:1;transform:translateX(-50%) scale(.82)}100%{left:var(--cat-attack-x);bottom:var(--cat-attack-bottom);opacity:1;transform:translateX(-50%) scale(.96)}}
@keyframes catBigPaw{from{transform:translateX(-58%) scale(.92) rotate(-9deg)}to{transform:translateX(-43%) scale(1.07) rotate(8deg)}}
@keyframes catBigPawTwo{from{transform:translateX(-43%) scale(1.04) rotate(9deg)}to{transform:translateX(-55%) scale(.97) rotate(-6deg)}}
@keyframes catPortalReturn{0%{left:24%;bottom:28%;opacity:0;transform:translateX(-50%) scale(.2)}38%{opacity:1;transform:translateX(-50%) scale(.85)}100%{left:13%;bottom:8%;opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes catPortalOpen{0%{opacity:0;transform:translateX(-50%) rotate(-17deg) scale(.07)}70%{opacity:1;transform:translateX(-50%) rotate(-17deg) scale(1.16)}100%{opacity:.94;transform:translateX(-50%) rotate(-17deg) scale(1)}}
@keyframes catPortalCollapse{from{opacity:.9;transform:translateX(-50%) rotate(-17deg) scale(1)}to{opacity:0;transform:translateX(-50%) rotate(-17deg) scale(.1)}}
@keyframes catPortalSpin{to{transform:rotate(360deg)}}
@keyframes catEchoFlare{0%{opacity:0;scale:.5}35%{opacity:.8}100%{opacity:0;scale:1.7}}
@keyframes catScratchBurst{0%{opacity:.75;scale:.85}25%{opacity:1;scale:1}68%{opacity:1;scale:1.19}100%{opacity:.95;scale:1.3}}
@keyframes catRing{0%{opacity:0;scale:.2}25%{opacity:.8;scale:1}100%{opacity:0;scale:2}}
@media(max-width:480px){.cat-action-sprite{width:43%;height:34%;bottom:10%}.cat-portal{height:28%;bottom:31%}.cat-action-caption{top:9%}.cat-swipe-cluster{width:31%}.cat-cinematic[data-mode=pounce] .cat-swipe-cluster{width:17%}}
/* Reduced-motion mode is a storyboard, not a disappearance: show each overlay
   as a distinct static frame. Global game CSS zeros animation durations; we must
   not rely on animation-fill-mode for visibility in this mode. */
@media(prefers-reduced-motion:reduce){
 .cat-cinematic .cat-action-sprite,.cat-cinematic .cat-portal,
 .cat-cinematic .cat-afterimage,.cat-cinematic .cat-impact-ring,
 .cat-cinematic .cat-swipe-cluster{animation:none!important;transition:none!important}
 .cat-cinematic[data-beat=sit] .cat-action-sprite{left:13%;bottom:8%;opacity:1;transform:translateX(-50%)}
 .cat-cinematic[data-beat=stretch] .cat-action-sprite,.cat-cinematic[data-beat=open] .cat-action-sprite{left:13%;bottom:7%;opacity:1;transform:translateX(-50%) scaleY(.91)}
 .cat-cinematic[data-beat=pounce-leap] .cat-action-sprite{left:54%;bottom:42%;opacity:1;transform:translateX(-50%) scale(.89)}
 .cat-cinematic[data-beat^=small-swipe] .cat-action-sprite{left:54%;bottom:42%;opacity:1;transform:translateX(-50%) scale(.85)}
 .cat-cinematic[data-beat=pounce-return] .cat-action-sprite{left:13%;bottom:8%;opacity:1;transform:translateX(-50%)}
 .cat-cinematic[data-beat=portal-first] .cat-action-sprite,.cat-cinematic[data-beat=portal-enter] .cat-action-sprite{opacity:0}
 .cat-cinematic[data-beat=portal-exit] .cat-action-sprite,
 .cat-cinematic[data-beat^=large-swipe] .cat-action-sprite{left:var(--cat-attack-x);bottom:var(--cat-attack-bottom);opacity:1;transform:translateX(-50%) scale(.91)}
 .cat-cinematic[data-beat=portal-home] .cat-action-sprite{left:13%;bottom:8%;opacity:1;transform:translateX(-50%)}
 .cat-cinematic[data-mode=walls][data-beat=open] .cat-portal-entry,
 .cat-cinematic[data-mode=walls][data-beat=open] .cat-portal-exit,
 .cat-cinematic[data-mode=walls][data-beat=portal-first] .cat-portal-entry,
 .cat-cinematic[data-mode=walls][data-beat=portal-first] .cat-portal-exit,
 .cat-cinematic[data-mode=walls][data-beat=portal-enter] .cat-portal-entry,
 .cat-cinematic[data-mode=walls][data-beat=portal-enter] .cat-portal-exit,
 .cat-cinematic[data-mode=walls][data-beat=portal-exit] .cat-portal-entry,
 .cat-cinematic[data-mode=walls][data-beat=portal-exit] .cat-portal-exit,
 .cat-cinematic[data-mode=walls][data-beat^=large-swipe] .cat-portal-exit,
 .cat-cinematic[data-mode=walls][data-beat=portal-home] .cat-portal-home{opacity:.95!important;transform:translateX(-50%) rotate(-17deg) scale(1)}
 .cat-cinematic[data-mode=walls][data-beat=portal-enter][data-pass="3"] .cat-portal-home{opacity:.95!important;transform:translateX(-50%) rotate(-17deg) scale(1)}
 .cat-cinematic[data-beat=small-swipe-a] .cat-swipe-first,
 .cat-cinematic[data-beat=small-swipe-b] .cat-swipe-second,
 .cat-cinematic[data-beat=large-swipe-a] .cat-swipe-first,
 .cat-cinematic[data-beat=large-swipe-b] .cat-swipe-second{opacity:1!important;scale:1}
 .cat-cinematic[data-beat^=large-swipe] .cat-impact-ring,
 .cat-cinematic[data-beat^=small-swipe] .cat-impact-ring{opacity:.68!important;scale:1}
}


/* v0.3.11 - Wide spatial portal choreography, impacts target the boss independently. */
.cat-portal{width:clamp(35px,10%,115px)}
.cat-portal-entry{left:var(--cat-entry-x)}
.cat-portal-exit{left:var(--cat-attack-x)}
.cat-cinematic[data-mode=walls] .cat-swipe-cluster,.cat-cinematic[data-mode=walls] .cat-impact-ring{left:50%}
.cat-cinematic[data-mode=walls] .cat-swipe-cluster{top:30%}
.cat-cinematic[data-mode=walls] .cat-impact-ring{top:39%}
.cat-cinematic[data-mode=walls] .cat-action-sprite{filter:drop-shadow(0 5px 3px #080a17) drop-shadow(0 0 8px #ffaa4f)}