.video-frame{background-color:var(--bg);width:100%;line-height:0;position:relative;overflow:hidden}.video-frame video{width:100%;height:auto;display:block}.video-grid{pointer-events:none;z-index:3;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(4,1fr);display:grid;position:absolute;inset:0}.video-block{background-color:var(--fg);will-change:opacity;opacity:1}.video-frame:before{content:"";z-index:4;pointer-events:none;opacity:0;background-color:var(--accent);mix-blend-mode:hard-light;position:absolute;inset:0}.video-frame.is-revealed:before{animation:.3s ease-in-out forwards videoStrobe}@keyframes videoStrobe{0%,20%,40%,60%,80%,to{opacity:0}10%,30%,50%,70%,90%{opacity:.5}}.film-grain:after{content:"";z-index:2;pointer-events:none;opacity:.14;mix-blend-mode:overlay;will-change:transform;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>");background-size:160px 160px;animation:.62s step-end infinite grainDrift;position:absolute;inset:-50%}@keyframes grainDrift{0%{transform:translate(0)}12%{transform:translate(-3%,-5%)}25%{transform:translate(4%,-2%)}37%{transform:translate(-2%,6%)}50%{transform:translate(5%,3%)}62%{transform:translate(-6%,-1%)}75%{transform:translate(2%,5%)}87%{transform:translate(-4%,2%)}to{transform:translate(0)}}:root[data-theme=inverted] .film-grain:after{mix-blend-mode:soft-light;opacity:.2}.video-frame__rule{background-color:var(--accent);z-index:5;transform-origin:0;height:3px;position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.video-frame.is-revealed .video-frame__rule{transition:transform .6s cubic-bezier(.7,0,.2,1) .2s;transform:scaleX(1)}.video-frame__marks span{z-index:5;pointer-events:none;opacity:0;width:14px;height:14px;position:absolute}.video-frame.is-revealed .video-frame__marks span{opacity:1;transition:opacity .3s .5s}.video-frame__marks span:first-child{border-top:1px solid var(--accent);border-left:1px solid var(--accent);top:8px;left:8px}.video-frame__marks span:nth-child(2){border-top:1px solid var(--accent);border-right:1px solid var(--accent);top:8px;right:8px}.video-frame__marks span:nth-child(3){border-bottom:1px solid var(--accent);border-left:1px solid var(--accent);bottom:12px;left:8px}.video-frame__marks span:nth-child(4){border-bottom:1px solid var(--accent);border-right:1px solid var(--accent);bottom:12px;right:8px}.video-frame__label{z-index:5;line-height:1;position:absolute;top:2.5rem;left:2.5rem}.video-frame__meta{z-index:5;font-family:var(--type-3);text-transform:uppercase;letter-spacing:.04em;color:var(--accent);font-size:.7rem;line-height:1;position:absolute;bottom:2.5rem;right:2.5rem}@media (prefers-reduced-motion:reduce){.film-grain:after,.video-frame.is-revealed:before{animation:none}.video-block{opacity:0}.video-frame__rule{transform:scaleX(1)}.video-frame__marks span{opacity:1}}@media (width<=1000px){.film-grain:after{opacity:.1;animation:none}.video-frame__label,.video-frame__meta{font-size:.6rem}.video-frame__label{top:1rem;left:1rem}.video-frame__meta{bottom:1rem;right:1rem}.video-frame__marks{display:none}}