
/* 창백의 향유고래 시네마틱 2차 개선 · 순수 CSS 구동 */
.pallid-cine-v2{position:relative;isolation:isolate;overflow:hidden;width:100%;height:clamp(210px,36vw,356px);background:#070c14;border:1px solid #56646b;border-radius:13px;box-shadow:inset 0 0 65px #020509,0 8px 30px #0008;margin:0 0 15px}
.pallid-cine-v2 *{box-sizing:border-box}
.pallid-cine-v2 svg{display:block;width:100%;height:100%;filter:saturate(.9) contrast(1.06)}
.pallid-cine-v2 .cine-top,.pallid-cine-v2 .cine-bottom{position:absolute;z-index:50;left:17px;color:#eaf5f5;text-shadow:0 2px 8px #000,0 0 8px #000}
.pallid-cine-v2 .cine-top{top:13px;font-size:10px;letter-spacing:.21em;color:#c8d8de}
.pallid-cine-v2 .cine-bottom{bottom:11px;right:14px;font-size:12px;letter-spacing:.03em;line-height:1.5;color:#f0eeee}
.pallid-cine-v2 .cine-corner{position:absolute;z-index:40;inset:0;pointer-events:none;background:linear-gradient(90deg,#080b16af,transparent 25%,transparent 75%,#090e19b3),linear-gradient(0deg,#03080dd9,transparent 23%,transparent 74%,#050a12ad)}
.pallid-cine-v2 .cine-grain{position:absolute;inset:0;z-index:39;pointer-events:none;opacity:.22;background:repeating-linear-gradient(0deg,transparent 0 2px,#e2f3ed0b 3px 4px)}
.pallid-cine-v2 .cine-vignette{position:absolute;z-index:38;inset:0;box-shadow:inset 0 0 68px 14px #040a13;pointer-events:none}
.pallid-cine-v2 .cine-water{animation:cine-water-move 3.8s ease-in-out infinite alternate;transform-origin:50% 72%}
.pallid-cine-v2 .cine-whale-body{animation:cine-whale-rise 5.3s ease-in-out infinite;transform-origin:80% 74%}
.pallid-cine-v2 .cine-whale-scars{animation:cine-scars 5.3s ease-in-out infinite}
.pallid-cine-v2 .cine-eye{animation:cine-eye 5.3s ease-in-out infinite}
.pallid-cine-v2 .cine-ship{animation:cine-ship-bob 3.3s ease-in-out infinite;transform-origin:28% 73%}
.pallid-cine-v2 .cine-spear{animation:cine-harpoon-throw 4.9s cubic-bezier(.18,.75,.18,1) infinite;transform-origin:32% 54%}
.pallid-cine-v2 .cine-trail{stroke-dasharray:240 900;stroke-dashoffset:900;animation:cine-trail 4.9s ease-out infinite}
.pallid-cine-v2 .cine-impact{transform-origin:68% 53%;animation:cine-impact 4.9s ease-out infinite}
.pallid-cine-v2 .cine-splinters{transform-origin:68% 53%;animation:cine-splinters 4.9s ease-out infinite}
.pallid-cine-v2 .cine-mouth-upper{transform-origin:50% 26%;animation:cine-jaw-top 5.6s ease-in-out infinite}
.pallid-cine-v2 .cine-mouth-lower{transform-origin:50% 72%;animation:cine-jaw-bottom 5.6s ease-in-out infinite}
.pallid-cine-v2 .cine-gullet{animation:cine-gullet 5.6s ease-in-out infinite;transform-origin:55% 50%}
.pallid-cine-v2 .cine-swallowed-ship{animation:cine-swallow-ship 5.6s cubic-bezier(.24,.01,.6,1) infinite;transform-origin:28% 66%}
.pallid-cine-v2 .cine-rim-dark{animation:cine-swallow-dark 5.6s ease-in-out infinite}
.pallid-cine-v2 .cine-tissue{animation:cine-tissue 4.2s ease-in-out infinite alternate;transform-origin:50% 50%}
.pallid-cine-v2 .cine-acid-pool{animation:cine-acid-surge 5s ease-in-out infinite}
.pallid-cine-v2 .cine-acid-wave{animation:cine-acid-wave 5s ease-in-out infinite alternate}
.pallid-cine-v2 .cine-acid-ship{animation:cine-acid-pass 5s ease-in-out infinite;transform-origin:35% 55%}
.pallid-cine-v2 .cine-bubble{animation:cine-bubble-up 2.2s ease-out infinite;transform-origin:center}
.pallid-cine-v2 .cine-bubble.b2{animation-delay:-.7s}
.pallid-cine-v2 .cine-bubble.b3{animation-delay:-1.3s}
.pallid-cine-v2 .cine-bubble.b4{animation-delay:-1.7s}
.pallid-cine-v2 .cine-steam{animation:cine-steam 3s ease-in-out infinite alternate}
.pallid-cine-v2 .cine-vein{animation:cine-vein-pulse 1.8s ease-in-out infinite}
.pallid-cine-v2 .cine-vein.v2{animation-delay:-.48s}
.pallid-cine-v2 .cine-vein.v3{animation-delay:-1.1s}
.pallid-cine-v2 .cine-bigheart{animation:cine-heart-beat 1.45s cubic-bezier(.35,0,.65,1) infinite;transform-origin:61% 48%}
.pallid-cine-v2 .cine-innerheart{animation:cine-inner-beat 1.45s ease-in-out infinite;transform-origin:61% 51%}
.pallid-cine-v2 .cine-scan{animation:cine-scan-sweep 5.2s ease-in-out infinite;transform-origin:50% 50%}
.pallid-cine-v2 .cine-reticle{animation:cine-reticle-ping 2.6s ease-in-out infinite;transform-origin:64% 47%}
.pallid-cine-v2 .cine-shadow-figure{animation:cine-figure 5.5s ease-in-out infinite}
.pallid-cine-v2 .cine-heart-fight{animation:cine-heart-strain 5.8s ease-in-out infinite;transform-origin:56% 48%}
.pallid-cine-v2 .cine-harpoon-final{animation:cine-final-shot 5.8s cubic-bezier(.12,.7,.18,1) infinite}
.pallid-cine-v2 .cine-crack{stroke-dasharray:420;stroke-dashoffset:420;animation:cine-crack-line 5.8s ease-out infinite}
.pallid-cine-v2 .cine-break-ring{transform-origin:61% 50%;animation:cine-break-ring 5.8s ease-out infinite}
.pallid-cine-v2 .cine-whiteout{animation:cine-whiteout 5.8s ease-out infinite}
.pallid-cine-v2 .cine-pulse-line{stroke-dasharray:13 7;animation:cine-pulse-dash 1s linear infinite}
.pallid-cine-v2 .cine-final .cine-heart-fight{animation-duration:5.8s}
.pallid-cine-v2.cine-victory .cine-heart-fight{animation:cine-heart-fall 3.7s ease-in forwards}
.pallid-cine-v2.cine-victory .cine-harpoon-final{animation:cine-final-shot-once 3.7s ease-in forwards}
.pallid-cine-v2.cine-victory .cine-break-ring{animation:cine-break-ring-once 3.7s ease-out forwards}
.pallid-cine-v2.cine-victory .cine-crack{animation:cine-crack-once 3.7s ease-out forwards}
.pallid-cine-v2.cine-victory .cine-whiteout{animation:cine-whiteout-once 3.7s ease-out forwards}
@keyframes cine-water-move{0%{transform:translateY(5px) skewX(-1deg)}100%{transform:translateY(-8px) skewX(1deg)}}
@keyframes cine-whale-rise{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-11px) rotate(-.7deg)}}
@keyframes cine-scars{0%,100%{opacity:.5}60%{opacity:1}}
@keyframes cine-eye{0%,100%{opacity:1}42%{opacity:.8}44%{opacity:1}}
@keyframes cine-ship-bob{0%,100%{transform:translateY(3px) rotate(1deg)}50%{transform:translateY(-4px) rotate(-2deg)}}
@keyframes cine-harpoon-throw{0%,18%{transform:translate(-300px,100px) rotate(-11deg);opacity:0}21%{opacity:1}41%,53%{transform:translate(260px,-28px) rotate(-11deg);opacity:1}65%,100%{transform:translate(260px,-28px) rotate(-11deg);opacity:0}}
@keyframes cine-trail{0%,19%{stroke-dashoffset:900;opacity:0}25%,43%{stroke-dashoffset:80;opacity:1}65%,100%{stroke-dashoffset:-380;opacity:0}}
@keyframes cine-impact{0%,36%{transform:scale(.1);opacity:0}43%{opacity:1;transform:scale(1.2)}57%,100%{transform:scale(3.4);opacity:0}}
@keyframes cine-splinters{0%,37%{transform:scale(.1);opacity:0}44%{opacity:1;transform:scale(1)}60%,100%{opacity:0;transform:scale(2)}}
@keyframes cine-jaw-top{0%,11%{transform:translateY(-85px)}38%,67%{transform:translateY(-190px)}89%,100%{transform:translateY(4px)}}
@keyframes cine-jaw-bottom{0%,11%{transform:translateY(85px)}38%,67%{transform:translateY(170px)}89%,100%{transform:translateY(-4px)}}
@keyframes cine-gullet{0%,100%{transform:scale(.92);filter:brightness(.65)}48%{transform:scale(1.17);filter:brightness(1.28)}}
@keyframes cine-swallow-ship{0%,20%{transform:translate(-220px,10px) scale(1.2);opacity:1}58%{transform:translate(110px,0) scale(.9);opacity:1}88%,100%{transform:translate(320px,-30px) scale(.03);opacity:0}}
@keyframes cine-swallow-dark{0%,65%{opacity:0}89%,100%{opacity:1}}
@keyframes cine-tissue{0%{transform:scale(1.01)}100%{transform:scale(.97)}}
@keyframes cine-acid-surge{0%,12%{transform:translateY(70px)}34%,57%{transform:translateY(-90px)}79%,100%{transform:translateY(67px)}}
@keyframes cine-acid-wave{0%{transform:translateX(-14px)}100%{transform:translateX(20px)}}
@keyframes cine-acid-pass{0%{transform:translate(-320px,50px) rotate(-4deg);opacity:0}15%{opacity:1}42%{transform:translate(0,-33px) rotate(8deg)}65%{transform:translate(140px,-45px) rotate(-8deg)}90%,100%{transform:translate(410px,-40px);opacity:0}}
@keyframes cine-bubble-up{0%{transform:translateY(40px) scale(.35);opacity:0}20%{opacity:1}100%{transform:translateY(-140px) scale(1.7);opacity:0}}
@keyframes cine-steam{0%{opacity:.2;transform:translateY(15px)}100%{opacity:.8;transform:translateY(-12px)}}
@keyframes cine-vein-pulse{0%,100%{opacity:.45;filter:brightness(.7)}40%{opacity:1;filter:brightness(1.6)}}
@keyframes cine-heart-beat{0%,100%{transform:scale(.95)}17%{transform:scale(1.1)}30%{transform:scale(.99)}46%{transform:scale(1.05)}}
@keyframes cine-inner-beat{0%,100%{transform:scale(.86);filter:brightness(.75)}38%{transform:scale(1.12);filter:brightness(1.5)}}
@keyframes cine-scan-sweep{0%{transform:translateX(-500px) rotate(-4deg);opacity:0}10%{opacity:1}58%{opacity:.7}80%,100%{transform:translateX(800px) rotate(-4deg);opacity:0}}
@keyframes cine-reticle-ping{0%,100%{opacity:.3;transform:scale(1)}45%{opacity:1;transform:scale(1.1)}}
@keyframes cine-figure{0%,100%{opacity:.2}50%{opacity:.65}}
@keyframes cine-heart-strain{0%,100%{transform:scale(.9) rotate(-2deg);filter:brightness(.85)}15%{transform:scale(1.1) rotate(1deg);filter:brightness(1.3)}29%{transform:scale(.96)}45%{transform:scale(1.13)}}
@keyframes cine-final-shot{0%,23%{transform:translate(-460px,105px) rotate(-8deg);opacity:0}30%{opacity:1}52%,60%{transform:translate(132px,-45px) rotate(-8deg);opacity:1}70%,100%{transform:translate(132px,-45px) rotate(-8deg);opacity:0}}
@keyframes cine-crack-line{0%,45%{stroke-dashoffset:420;opacity:0}55%{stroke-dashoffset:0;opacity:1}80%,100%{opacity:0}}
@keyframes cine-break-ring{0%,45%{transform:scale(.1);opacity:0}52%{opacity:1}75%,100%{transform:scale(2.7);opacity:0}}
@keyframes cine-whiteout{0%,48%,100%{opacity:0}55%{opacity:.85}64%{opacity:0}}
@keyframes cine-pulse-dash{to{stroke-dashoffset:-40}}
@keyframes cine-heart-fall{0%,45%{transform:scale(.95);opacity:1}68%{transform:scale(1.18);opacity:1}100%{transform:scale(.3);opacity:.08}}
@keyframes cine-final-shot-once{0%,22%{transform:translate(-460px,105px) rotate(-8deg);opacity:0}30%{opacity:1}75%,100%{transform:translate(132px,-45px) rotate(-8deg);opacity:0}}
@keyframes cine-crack-once{0%,42%{stroke-dashoffset:420;opacity:0}60%{stroke-dashoffset:0;opacity:1}100%{opacity:.25}}
@keyframes cine-break-ring-once{0%,47%{transform:scale(.1);opacity:0}58%{opacity:1}100%{transform:scale(3);opacity:0}}
@keyframes cine-whiteout-once{0%,50%,75%,100%{opacity:0}61%{opacity:1}}
@media(max-width:580px){.pallid-cine-v2{height:clamp(190px,54vw,240px)}.pallid-cine-v2 .cine-bottom{font-size:10px}.pallid-cine-v2 .cine-top{letter-spacing:.09em;font-size:9px}}
@media(prefers-reduced-motion:reduce){.pallid-cine-v2 svg *{animation:none!important;transition:none!important}.pallid-cine-v2 .cine-whiteout{display:none}.pallid-cine-v2 .cine-spear{transform:translate(195px,-20px) rotate(-11deg);opacity:1}.pallid-cine-v2 .cine-harpoon-final{transform:translate(130px,-45px);opacity:1}}
