.cinematic-scene{isolation:isolate;background:#08090a;border-radius:14px;width:100%;height:100%;position:relative;overflow:hidden}.cinematic-scene__frame-thin{box-shadow:inset 0 0 0 1px #ffffff0f,inset 0 0 0 2px #0009,0 24px 80px #0000008c}.cinematic-scene__frame-dots{box-shadow:inset 0 0 0 1px #ffffff0a,0 24px 80px #0000008c}.cinematic-scene__frame-dots:before{content:"";z-index:3;pointer-events:none;background-image:radial-gradient(circle,#ffffff1a 3px,#0000 3.5px);background-repeat:repeat-x;background-size:14px 10px;width:40px;height:10px;position:absolute;top:10px;left:12px}.cinematic-scene__content{z-index:1;width:100%;height:100%;position:relative}.cinematic-scene__light{pointer-events:none;z-index:2;mix-blend-mode:screen;opacity:var(--scene-intensity,1);position:absolute;inset:0}.cinematic-scene__vignette{pointer-events:none;z-index:3;background:radial-gradient(ellipse at center, transparent 45%, rgba(0, 0, 0, calc(.55 * var(--scene-vignette,.75))) 100%);position:absolute;inset:0}.cinematic-scene__grain{pointer-events:none;z-index:4;opacity:.04;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' /%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' /%3E%3C/svg%3E");position:absolute;inset:0}.cinematic-scene[data-scene=spotlight] .cinematic-scene__light{background:radial-gradient(circle at var(--scene-fx,50%) var(--scene-fy,40%), #ffffff1a 0%, #ffffff0d calc(var(--scene-fr,55%) * .55), transparent var(--scene-fr,55%))}.cinematic-scene[data-scene=overhead] .cinematic-scene__light{background:linear-gradient(#ffffff17 0%,#0000 55%),radial-gradient(75% 35% at 50% 0,#94a3f01f 0%,#0000 80%)}.cinematic-scene[data-scene=rim]{box-shadow:inset 0 0 120px 40px #5e6ad226,0 24px 80px #0000008c}.cinematic-scene[data-scene=rim] .cinematic-scene__light{background:radial-gradient(circle,#5e6ad224 0%,#0000 60%)}.cinematic-scene[data-scene=underglow] .cinematic-scene__light{background:radial-gradient(ellipse 60% 50% at var(--scene-fx,50%) var(--scene-fy,100%), #5e6ad238 0%, #5e6ad214 45%, transparent 75%)}.cinematic-scene[data-scene=duotone] .cinematic-scene__light{background:radial-gradient(55% 40% at 15% 15%,#5e6ad229 0%,#0000 70%),radial-gradient(55% 45% at 85% 90%,#e0a65a1a 0%,#0000 70%)}.cinematic-scene[data-scene=flat] .cinematic-scene__light{background:0 0}.cinematic-scene__bleed{width:100%;height:100%;-webkit-mask-image:var(--bleed-mask,none);-webkit-mask-image:var(--bleed-mask,none);mask-image:var(--bleed-mask,none);-webkit-mask-composite:source-in;-webkit-mask-composite:source-in;mask-composite:intersect}@keyframes cinematic-drift{0%,to{transform:translate(0,0)}25%{transform:translate(8px,-6px)}50%{transform:translateY(4px)}75%{transform:translate(-6px,-2px)}}.cinematic-scene--ambient .cinematic-scene__light{animation:22s ease-in-out infinite cinematic-drift}@media (prefers-reduced-motion:reduce){.cinematic-scene--ambient .cinematic-scene__light{animation:none}}
