/* Frank's V3 cinematics and buff-bound, text-free material layers. */
.fk-cinema-frame { isolation: isolate; }
.fk-cinema-frame[hidden] { display: none !important; }
.fk-living-frame { position: absolute; inset: 8px; width: calc(100% - 16px); height: calc(100% - 16px); overflow: visible; }
.fk-living-vessel { fill: none; stroke: var(--fk-slime); stroke-width: 2; opacity: 0; transition: opacity .7s; }
.fk-has-slime .fk-living-vessel { opacity: calc(.12 + var(--fk-level) * .55); filter: drop-shadow(0 0 7px var(--fk-slime)); }
.fk-full .fk-living-vessel { stroke-width: 3; animation: fkCinemaPressure 2.8s ease-in-out infinite; }
.fk-living-seams { fill: none; stroke: var(--fk-light); stroke-width: 2; opacity: 0; transition: opacity .5s; filter: drop-shadow(0 0 4px var(--fk-slime)); }
.fk-stitched .fk-living-seams { opacity: .7; }
.fk-living-shield { fill: color-mix(in srgb, var(--fk-slime) 5%, transparent); stroke: var(--fk-light); stroke-width: 3; opacity: 0; transition: opacity .7s; filter: drop-shadow(0 0 9px var(--fk-slime)); }
.fk-shielded .fk-living-shield { opacity: .85; animation: fkCinemaShield 3.6s ease-in-out infinite; }
.fk-living-seals { fill: var(--fk-deep); stroke: var(--fk-light); stroke-width: 2; opacity: 0; }
.fk-immune .fk-living-seals { opacity: .85; filter: drop-shadow(0 0 5px var(--fk-slime)); }
.fk-living-tendrils { fill: none; stroke: var(--fk-slime); stroke-width: 7; stroke-linecap: round; opacity: 0; }
.fk-full .fk-living-tendrils { opacity: .9; filter: drop-shadow(0 0 5px var(--fk-slime)); }
.fk-living-tendrils path { transform-origin: 50% 100%; animation: fkCinemaTendril 3.2s ease-in-out infinite alternate; }
.fk-living-tendrils path + path { animation-delay: -1.6s; }
[data-fk-theme="jeg"] .fk-living-tendrils { stroke-linejoin: bevel; stroke-width: 4; stroke-dasharray: 12 5; }
[data-fk-theme="remakademia"] .fk-living-tendrils { stroke: var(--fk-light); stroke-width: 1.5; }
.fk-living-motif { opacity: 0; transition: opacity .8s; }
.fk-has-slime .fk-living-motif { opacity: calc(var(--fk-level) * .7); }
.fk-full .fk-living-motif { opacity: 1; }
.fk-living-motif > g { transform-origin: center; animation: fkCinemaMotif 4s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.6s); filter: drop-shadow(0 0 5px var(--fk-slime)); }
.fk-living-bubbles { fill: none; stroke: var(--fk-light); stroke-width: 1.5; opacity: 0; }
.fk-has-slime .fk-living-bubbles, .fk-regenerating .fk-living-bubbles { opacity: .75; }
.fk-living-bubbles circle { animation: fkCinemaBubble 4s ease-in-out infinite; animation-delay: calc(var(--i) * -.5s); }
.fk-regenerating { background: radial-gradient(ellipse at 50% 80%, color-mix(in srgb, var(--fk-slime) 14%, transparent), transparent 64%); }
.fk-afflicted { position: absolute; inset: 0; z-index: 28; pointer-events: none; overflow: visible; }
.fk-afflicted svg { width: 100%; height: 100%; overflow: visible; }
.fk-infection-veins { fill: none; stroke: var(--fk-slime); stroke-width: 3; opacity: .7; filter: drop-shadow(0 0 4px var(--fk-slime)); animation: fkCinemaInfection 3s ease-in-out infinite; }
.fk-poison-drop { filter: drop-shadow(0 0 5px var(--fk-slime)); opacity: .85; }
.fk-afflicted.fk-status-tick { animation: fkCinemaStatusTick 1.25s ease-out; }
.v3-vfx-disabled .fk-cinema-frame, .v3-vfx-disabled .fk-afflicted { display: none !important; }
@keyframes fkCinemaPressure { 0%,100% { opacity: .6; stroke-width: 2; } 50% { opacity: 1; stroke-width: 4; } }
@keyframes fkCinemaShield { 0%,100% { stroke-opacity: .55; } 50% { stroke-opacity: 1; } }
@keyframes fkCinemaTendril { from { transform: skewX(-5deg) scaleY(.95); } to { transform: skewX(5deg) scaleY(1.03); } }
@keyframes fkCinemaMotif { from { transform: translateY(5px) rotate(-9deg) scale(.83); } to { transform: translateY(-9px) rotate(8deg) scale(1.07); } }
@keyframes fkCinemaBubble { 0% { transform: translateY(0); opacity: 0; } 20% { opacity: .8; } 85% { opacity: .5; } 100% { transform: translateY(-215px); opacity: 0; } }
@keyframes fkCinemaInfection { 0%,100% { stroke-opacity: .5; } 50% { stroke-opacity: .85; } }
@keyframes fkCinemaStatusTick { 0%,100% { filter: brightness(1); } 25% { filter: brightness(2.2) drop-shadow(0 0 8px var(--fk-slime)); } }
@media (prefers-reduced-motion: reduce) {
    .fk-cinema-frame *, .fk-afflicted * { animation: none !important; transition: none !important; }
    .fk-living-bubbles circle { opacity: .35; }
}
@media (max-width: 700px) {
    .fk-living-motif:nth-child(2n), .fk-living-bubbles circle:nth-child(2n) { display: none; }
}
