/* Rendered monitor frames and an independently playing screen video. */
.editorial .monitor-scroll-hero{height:calc(100svh + clamp(440px, 64svh, 720px));padding:0;position:relative;background:#e9edef}
.monitor-scroll-viewport{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,#06080a 0%,#232b30 34%,#818e96 75%,#e9edef 100%)}
.editorial .monitor-scroll-hero .editorial-hero-heading{position:absolute;inset:112px 3vw auto;z-index:0;pointer-events:none;opacity:1}
.editorial .monitor-scroll-hero h1{font-size:clamp(80px,15.4vw,340px);line-height:.99;letter-spacing:-.025em;margin:0 auto;width:100%;color:#e9edef}
.editorial .monitor-scroll-hero h1>span,.editorial .monitor-scroll-hero h1>em{display:block;white-space:nowrap}
.editorial .monitor-scroll-hero h1>em{font-style:italic;background:linear-gradient(#c2f6fc,#74ddeb);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;padding:0 .03em}
.monitor-scroll-hero .hero-notes{position:fixed;top:65svh;left:3vw;right:3vw;display:flex;justify-content:space-between;gap:30px;margin:0;opacity:var(--notes-opacity,1)}
.monitor-scroll-hero .hero-notes>span,.monitor-scroll-hero .hero-notes>p{font:clamp(18px,1.6vw,26px)/1.3 Arial,sans-serif;color:#d9e7eb;max-width:21ch;text-align:left;letter-spacing:0;margin:0}
.rendered-monitor{position:absolute;inset:0;z-index:1;pointer-events:none}
#monitor-frames,.monitor-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.monitor-screen-overlay{position:absolute;left:0;top:0;width:1000px;height:600px;transform-origin:0 0;visibility:hidden;overflow:hidden;border-radius:7px;background:#000;pointer-events:auto}
.monitor-screen-overlay video{display:block;width:100%;height:100%;object-fit:cover}
#monitor-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;width:100%;height:100%;border:0;background:transparent;cursor:pointer}
#monitor-play svg{width:85px;height:85px;padding:25px;border-radius:50%;fill:white;background:#07111688;backdrop-filter:blur(5px);border:1px solid #ffffff65;transition:background .2s,transform .2s}
#monitor-play:hover svg,#monitor-play:focus-visible svg{background:#063847dd;transform:scale(1.12)}
#monitor-play:focus-visible{outline:5px solid #74ddeb;outline-offset:-6px}
.monitor-tools{position:absolute;bottom:24px;left:3vw;right:3vw;display:flex;align-items:center;justify-content:space-between;z-index:3;pointer-events:none;color:#ecf5f8;font:16px/1.4 Arial,sans-serif}
.monitor-tools span{opacity:var(--notes-opacity,1)}
.monitor-tools .motion-toggle{pointer-events:auto;position:static;display:grid;place-items:center;width:48px;height:48px;border:1px solid #ffffff65;border-radius:50%;background:#0b151bdd;color:white;font:20px Arial}
.monitor-status{position:absolute;bottom:80px;left:3vw;z-index:3;color:white;font-size:18px}.monitor-status:empty{display:none}
.editorial .monitor-static{height:100svh;min-height:700px}.monitor-static .monitor-scroll-viewport{position:relative;height:100%}.monitor-static h1{opacity:.3}
html{scrollbar-gutter:stable}html.film-open{overflow:hidden}
#film-dialog{padding:0;border:0;background:#000;color:white;width:min(94vw,1800px);max-width:94vw;max-height:92svh;overflow:visible;box-shadow:0 20px 90px #0008}
#film-dialog::backdrop{background:#05090df2;backdrop-filter:blur(12px)}
#film-modal-video{display:block;width:100%;max-height:86svh;aspect-ratio:16/9;background:#000}
.film-close{position:absolute;right:0;top:-48px;width:44px;height:44px;font:34px Arial;border:0;background:transparent;color:white;cursor:pointer}.film-status{font-size:18px}.film-status:empty{display:none}
@media(max-width:800px){.editorial .monitor-scroll-hero{height:calc(100svh + 64svh)}.editorial .monitor-scroll-hero .editorial-hero-heading{inset:112px 4vw auto}.editorial .monitor-scroll-hero h1{font-size:15.2vw}.monitor-scroll-hero .hero-notes{top:36svh;left:5vw;right:5vw}.monitor-scroll-hero .hero-notes>span,.monitor-scroll-hero .hero-notes>p{font-size:16px;max-width:15ch}.monitor-scroll-hero .hero-notes>p{text-align:right}.monitor-tools{left:5vw;right:5vw;font-size:16px}.editorial .monitor-static{height:100svh;min-height:650px}#film-dialog{width:96vw;max-width:96vw}}
@media(prefers-reduced-motion:reduce){#monitor-play svg{transition:none}}