@layer scenes {
[data-8b-live] #doors .dr-grid { view-timeline: --doors-grid block; view-timeline-inset: 0; }
[data-8b-live] #doors .dr-door, [data-8b-live] #doors .dr-door__frame, [data-8b-live] #doors .dr-door__frame img { animation-timeline: --doors-grid; animation-range: cover 18vh cover 78vh; }
[data-8b-live] #doors .dr-door { animation-name: doors-door; animation-timing-function: linear(0, 0.00003, 0.00026, 0.00086, 0.00205, 0.004, 0.00691, 0.01098, 0.01638, 0.02333, 0.032, 0.04259, 0.0553, 0.0703, 0.08781, 0.108, 0.13107, 0.15722, 0.18662, 0.21949, 0.256, 0.29635, 0.34074, 0.38934, 0.44237, 0.5, 0.55763, 0.61066, 0.65926, 0.70365, 0.744, 0.78051, 0.81338, 0.84278, 0.86893, 0.892, 0.91219, 0.9297, 0.9447, 0.95741, 0.968, 0.97667, 0.98362, 0.98902, 0.99309, 0.996, 0.99795, 0.99914, 0.99974, 0.99997, 1); animation-fill-mode: both; }
[data-8b-live] #doors .dr-door__frame { animation-name: doors-frame; animation-timing-function: linear(0, 0.00003, 0.00026, 0.00086, 0.00205, 0.004, 0.00691, 0.01098, 0.01638, 0.02333, 0.032, 0.04259, 0.0553, 0.0703, 0.08781, 0.108, 0.13107, 0.15722, 0.18662, 0.21949, 0.256, 0.29635, 0.34074, 0.38934, 0.44237, 0.5, 0.55763, 0.61066, 0.65926, 0.70365, 0.744, 0.78051, 0.81338, 0.84278, 0.86893, 0.892, 0.91219, 0.9297, 0.9447, 0.95741, 0.968, 0.97667, 0.98362, 0.98902, 0.99309, 0.996, 0.99795, 0.99914, 0.99974, 0.99997, 1); animation-fill-mode: backwards; }
[data-8b-live] #doors .dr-door__frame img { animation-name: doors-image; animation-timing-function: cubic-bezier(0.3333, 0.6667, 0.6667, 1); animation-fill-mode: both; }
@keyframes doors-door { 0% { translate: calc(var(--doors-shift, 0px) * 0.92) 0px; } 100% { translate: 0px 0px; } }
@keyframes doors-frame { 0% { clip-path: inset(0% 30% 0% 30% round 999px 999px 0px 0px); } 100% { clip-path: inset(0% 0% 0% 0% round 0px 0px 0px 0px); } }
@keyframes doors-image { 0% { translate: calc(-14% * var(--doors-side, 0)) 0px; scale: 1.18; } 100% { translate: 0px 0px; scale: 1; } }
}