/* Keep every case opening on one shared timeline. The class is added only after the first image is decoded. */
.case-entry{--case-reveal-duration:2.8s!important;animation:caseRevealFade var(--case-reveal-duration) ease forwards paused!important}
.case-entry.is-playing{animation-play-state:running!important}
.case-entry--01:before,.case-entry--02:before,.case-entry--03:before,.case-entry--04:before,.case-entry--05:before,.case-entry--06:before{animation:caseRevealOrbit var(--case-reveal-duration) cubic-bezier(.18,.8,.2,1) forwards paused!important}
.case-entry--01:after,.case-entry--02:after,.case-entry--03:after,.case-entry--04:after,.case-entry--05:after,.case-entry--06:after{animation:caseRevealSweep var(--case-reveal-duration) ease forwards paused!important}
.case-entry--01 .case-entry-fragment,.case-entry--02 .case-entry-fragment,.case-entry--03 .case-entry-fragment,.case-entry--04 .case-entry-fragment,.case-entry--05 .case-entry-fragment,.case-entry--06 .case-entry-fragment{animation:caseRevealFrame var(--case-reveal-duration) cubic-bezier(.16,.82,.22,1) forwards paused!important}
.case-entry--01 .case-entry-fragment img,.case-entry--02 .case-entry-fragment img,.case-entry--03 .case-entry-fragment img,.case-entry--04 .case-entry-fragment img,.case-entry--05 .case-entry-fragment img,.case-entry--06 .case-entry-fragment img{animation:none!important;opacity:1!important;transform:none!important;object-fit:contain!important}
.case-entry.is-playing:before,.case-entry.is-playing:after,.case-entry.is-playing .case-entry-fragment{animation-play-state:running!important}
.case-entry i{animation-duration:var(--case-reveal-duration)!important}
@keyframes caseRevealFade{0%,82%{opacity:1}100%{opacity:0;visibility:hidden}}
@keyframes caseRevealOrbit{0%{opacity:0;transform:scale(.1)}28%{opacity:.86;transform:scale(.82)}82%{opacity:.28;transform:scale(1.08)}100%{opacity:0;transform:scale(1.2)}}
@keyframes caseRevealSweep{0%{opacity:0;transform:translateX(-75%)}25%{opacity:1}82%{opacity:.16;transform:translateX(55%)}100%{opacity:0;transform:translateX(75%)}}
@keyframes caseRevealFrame{0%{opacity:0;transform:scale(.12) rotate(-14deg)}24%{opacity:1;transform:scale(1.02) rotate(2deg)}82%{opacity:1;transform:scale(1) rotate(0)}100%{opacity:0;transform:scale(1.04) rotate(3deg);filter:blur(5px)}}
@media(max-width:760px){.case-dialog{position:fixed!important;inset:0!important;width:100vw!important;max-width:none!important;height:100vh!important;height:100dvh!important;max-height:none!important;margin:0!important;padding:0!important;border-radius:0!important}.case-dialog .dialog-close{position:fixed!important;top:max(12px,env(safe-area-inset-top))!important;right:max(12px,env(safe-area-inset-right))!important;width:42px!important;height:42px!important}.project-story{min-height:100%!important}.story-head{padding-top:88px!important}}
