.life-background{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:#f5f0e7}.life-background canvas{width:100%;height:100%;object-fit:cover;opacity:.23}.life-background:after{content:'';position:absolute;inset:0;background:#f5f0e788}body{background:transparent;isolation:isolate}.hero,.section,nav,footer{background-color:#f5f0e7cc}.section.tinted{background-color:#ebe5d9dc}.life-art{max-width:800px;margin:30px auto}.life-art canvas{display:block;width:100%;height:auto;border-radius:16px}.life-controls{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin:12px 0}.life-controls button{border:1px solid #9ca594;background:#fffdf8;color:#53604f;border-radius:24px;padding:10px 20px;cursor:pointer;font:14px Arial,sans-serif}.life-controls button:focus-visible{outline:3px solid #53604f;outline-offset:4px}.life-art figcaption{text-align:center;font-style:italic;margin-top:12px}.life-background-control{position:fixed;bottom:12px;right:12px;z-index:20;border:1px solid #a5ad9a;border-radius:20px;padding:7px 13px;background:#f5f0e7ed;color:#53604f;font:12px Arial,sans-serif;cursor:pointer}@media(max-width:720px){.life-background canvas{object-fit:cover;opacity:.18}.life-background-control{bottom:8px;right:8px;font-size:11px}}
.life-background img{width:100%;height:100%;object-fit:cover;opacity:.18}.life-background:after{background:transparent}.hero,nav{background:transparent!important}.cinema-stage{background-image:url('/assets/kino/kino-bez-postaci.png')!important}.cinema-person{position:absolute;inset:0;background:url('/assets/kino/kino-osoba.webp') 0 0/200% 200%;clip-path:polygon(53% 3%,57% 3%,59% 10%,60% 23%,60% 34%,61% 45%,61% 62%,63% 92%,61% 96%,47% 96%,49% 82%,50% 65%,51% 48%,49% 42%,49% 32%,51% 15%);transform-origin:55% 95%;animation:person-calm 8s ease-in-out infinite;will-change:transform}.tense .cinema-person{background-position:0 100%;animation:person-tense 3.4s ease-in-out infinite;clip-path:polygon(53% 3%,57% 3%,59% 10%,59% 20%,60% 31%,60% 42%,59% 49%,60% 64%,62% 94%,59% 97%,47% 97%,49% 78%,50% 57%,50% 44%,50% 31%,51% 15%)}@keyframes person-calm{0%,100%{transform:rotate(-.5deg) scaleY(1)}50%{transform:rotate(.7deg) scaleY(1.012)}}@keyframes person-tense{0%,100%{transform:rotate(.6deg) scaleY(.996)}20%{transform:rotate(-.8deg) scaleY(1.003)}35%{transform:rotate(-.4deg)}65%{transform:rotate(.8deg) scaleY(.994)}80%{transform:rotate(.1deg)}}.cinema-paused .cinema-person{animation-play-state:paused}@media(prefers-reduced-motion:reduce){.cinema-person{animation:none!important}}
.cinema-person{display:none}.cinema-stage{background-image:url('/assets/kino/kino-ruch-klatki.png')!important;background-size:200% 400%;background-position:0 0;animation:kino-joy 6s steps(1,end) infinite}.cinema-stage.tense{background-position:0 66.666667%;animation-name:kino-worry;animation-duration:8s}.cinema-paused .cinema-stage{animation-play-state:paused}@keyframes kino-joy{0%,25%,100%{background-position:0 0}26%,39%{background-position:100% 0}40%,49%{background-position:0 33.333333%}50%,74%{background-position:100% 33.333333%}75%,99%{background-position:0 0}}@keyframes kino-worry{0%,19%,100%{background-position:0 66.666667%}20%,39%{background-position:100% 66.666667%}40%,59%{background-position:0 100%}60%,74%{background-position:100% 66.666667%}75%,89%{background-position:100% 100%}90%,99%{background-position:0 66.666667%}}@media(prefers-reduced-motion:reduce){.cinema-stage{animation:none!important}}
.life-background img{position:absolute;inset:0;object-fit:fill}.life-background canvas{position:absolute;inset:0;object-fit:fill;opacity:.85}
.life-background img{object-fit:cover}
/* Keep the scenario sketch visible behind every section while scrolling. */
body{background:transparent}
.section,footer{background:transparent!important}
.section.tinted{background:rgba(235,229,217,.22)!important}
.sketch-user-color .life-background>.life-canvas{visibility:hidden}
/* Tło koloruje się wyłącznie w odpowiedzi na dotyk lub kliknięcie. */
.life-background>.life-canvas{display:none!important}

/* Continuous projector light stays visible through every pose, including the jump. */
.cinema-stage::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;clip-path:polygon(18% 35%,100% 2%,100% 88%,18% 37%);background:linear-gradient(90deg,rgba(255,224,164,.5) 18%,rgba(255,221,163,.26) 55%,rgba(255,225,177,.15) 100%);mix-blend-mode:screen;opacity:.85}
.cinema-stage::after{content:"";position:absolute;left:17.3%;top:33%;width:2.2%;height:6%;z-index:2;pointer-events:none;border-radius:50%;background:#fff6d8;box-shadow:0 0 7px 2px #ffdda586}

/* Original figure sits in front of the continuous light, without tinting her body. */
.cinema-stage .cinema-person{display:block;z-index:2;pointer-events:none;background-image:url('/assets/kino/kino-ruch-klatki.png');background-size:200% 400%;background-position:inherit;animation:inherit;transform:none;clip-path:polygon(51% 0,59% 0,60% 15%,62% 28%,61% 45%,60% 60%,62% 97%,48% 97%,49% 70%,50% 50%,49% 35%,50% 18%)}
.cinema-stage.tense .cinema-person{background-position:inherit;animation:inherit;clip-path:polygon(51% 0,59% 0,60% 15%,62% 28%,61% 45%,60% 60%,62% 97%,48% 97%,49% 70%,50% 50%,49% 35%,50% 18%)}
.cinema-stage::after{z-index:3}

.cinema-stage.tense .cinema-person{animation-name:kino-worry,kino-worry-mask;animation-duration:8s,8s;animation-timing-function:steps(1,end),steps(1,end);animation-iteration-count:infinite,infinite}
@keyframes kino-worry-mask{0%,20%,60%,90%,100%{clip-path:polygon(51% 0,59% 0,60% 15%,62% 28%,61% 45%,60% 60%,62% 97%,48% 97%,49% 70%,50% 50%,49% 35%,50% 18%)}40%{clip-path:polygon(57% 45%,62% 44%,63% 53%,62% 63%,61% 75%,59% 94%,48% 97%,49% 81%,51% 68%,53% 59%,54% 52%,55% 49%)}75%{clip-path:polygon(53% 1%,59% 1%,60% 15%,59% 30%,62% 42%,61% 54%,60% 62%,66% 96%,58% 96%,54% 76%,51% 96%,47% 96%,50% 70%,51% 48%,51% 30%)}}
.cinema-paused .cinema-person{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.cinema-stage .cinema-person{animation:none!important}}