@layer components{:is(.film,.paper-story){--dash-y:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2' height='14'%3E%3Crect width='2' height='8' rx='1'/%3E%3C/svg%3E")}.film{isolation:isolate;position:relative;overflow-x:clip}.film:before{content:""}.film:before,.film .film-frame:before{z-index:-1;pointer-events:none;background-color:var(--ink);opacity:.03;position:absolute;inset:0;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath fill-opacity='.45' d='M0 12L12 0L24 12H22.6L12 1.4L1.4 12Z'/%3E%3Cpath d='M0 12H1.4L12 22.6L22.6 12H24L12 24Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath fill-opacity='.45' d='M0 12L12 0L24 12H22.6L12 1.4L1.4 12Z'/%3E%3Cpath d='M0 12H1.4L12 22.6L22.6 12H24L12 24Z'/%3E%3C/svg%3E");-webkit-mask-size:24px 24px;mask-size:24px 24px}.film .film-frame{padding:1.5rem 1rem 0}.film .film-stage{isolation:isolate;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:.75rem;max-width:40rem;margin-inline:auto;padding-top:15vw;display:grid;position:relative;container-type:inline-size}.film .film-backdrop{z-index:0;position:absolute;inset:0}.film .film-word{inset-inline:0;z-index:1;letter-spacing:-.03em;justify-content:center;font-size:30vw;line-height:1;display:flex;position:absolute;top:0}.film .film-letter,.film .film-letter-in{white-space:pre;display:inline-block}.film .film-actor{z-index:var(--z);position:relative}.film .film-floor{display:none}.film .film-title :is(.film-letter,.film-letter-in){white-space:normal;display:inline}.film .film-cue{flex-direction:column;align-items:center;gap:.5rem;display:flex}.film .film-cue .perforation{background:0 0;width:2px;height:2.5rem;position:relative;overflow:clip;-webkit-mask:none;mask:none}.film .film-cue .perforation:before{content:"";inset-inline:0;background-color:var(--feather);-webkit-mask-image:var(--dash-y);mask-image:var(--dash-y);position:absolute;top:-14px;bottom:0;-webkit-mask-size:2px 14px;mask-size:2px 14px;-webkit-mask-repeat:repeat-y;mask-repeat:repeat-y}.film .film-theatre{max-width:80rem;margin-inline:auto;padding:2rem 1rem 4rem;position:relative}.film .film-chapters{gap:1rem;display:grid}.film .film-chapter{scroll-margin-top:6rem}.film .chapter-layer,.film .film-progress{display:none}.film .chapter-card{border:1px solid var(--rule);background-color:var(--paper);border-radius:6px;flex-direction:column;gap:.75rem;height:100%;padding:1rem;display:flex}.film .chapter-picture{aspect-ratio:4/3}.film .film-name{font-size:1.75rem;line-height:1.25}.film .film-specs{gap:.25rem;display:grid}.film .film-cta{margin-top:auto}.film .film-more{position:relative}.film .film-more:after{content:"";inset-inline:0;background-color:var(--feather);height:2px;-webkit-mask-image:var(--dash-x);mask-image:var(--dash-x);clip-path:inset(0 100% 0 0);position:absolute;bottom:.5rem;-webkit-mask-size:14px 2px;mask-size:14px 2px}.film .film-more:is(:hover,:focus-visible):after{clip-path:inset(0)}.film .film-closing{margin-top:3rem}@media (min-width:40rem){.film .film-frame,.film .film-theatre{padding-inline:1.5rem}}@media (min-width:48rem){.film .film-chapters{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}}@media (min-width:64rem){.film .film-frame{padding:0}.film .film-stage{aspect-ratio:16/9;max-width:none;padding:0;display:block}.film .film-word{font-size:26cqw;top:1cqw}.film .film-actor{left:calc(var(--lx) - var(--lw) / 2);width:var(--lw);position:absolute;bottom:9cqw}.film .actor-unpack{transform:translate(var(--stack-x), var(--stack-y)) scale(var(--stack-s));transform-origin:50% 100%}}@media (min-width:64rem) and (min-height:37.5rem){.film{display:grid}.film .film-frame,.film .film-opening,.film .film-intro{grid-area:1/1}.film .film-title{grid-area:2/1}.film .film-theatre{grid-area:3/1}.film .film-frame{justify-content:center;align-items:center;height:calc(100vh - 5rem);display:flex}.film .film-stage{width:min(100%,177.778vh - 8.88889rem)}.film .film-opening{z-index:1;pointer-events:none;align-self:end;display:contents;position:relative}.film .film-intro{align-self:end}.film .film-intro>*{pointer-events:auto}}@media (hover:hover) and (pointer:fine){.film .hero-depth{transform:translate3d(calc(var(--tx,0) * var(--depth) * 10px), calc(var(--ty,0) * var(--depth) * 10px), 0)}.film .film-word{translate:calc(var(--tx,0) * 2px) calc(var(--ty,0) * 2px)}@media (min-width:64rem){.film .hero-depth{transform:translate3d(calc(var(--tx,0) * var(--depth) * 10px / var(--stack-s)), calc(var(--ty,0) * var(--depth) * 10px / var(--stack-s)), 0)}}}@media (prefers-reduced-motion:no-preference){.film .film-word .film-letter{animation:film-slit .35s var(--ease-settle) calc(var(--i) * 50ms) both}.film .hero-enter-drop{transform-origin:50% 100%;animation:film-drop var(--enter-dur) var(--ease-settle) var(--enter-delay) both}.film .hero-phase-lead{animation:hero-settle var(--dur) var(--ease-settle) var(--delay) both}.film .hero-phase-ctas{animation:hero-arrive var(--dur) var(--ease-settle) var(--delay) both}.film .film-cue .perforation:before{animation:.9s linear 1s 3 film-cue}[data-hero-seen] .film :is(.film-word .film-letter,.hero-enter-drop,.hero-phase-lead,.hero-phase-ctas){animation:none}[data-hero-seen=return] .film :is(.film-word .film-letter,.film-actor:not([data-priority]) .hero-enter-drop){animation:film-in .3s var(--ease-settle) both}[data-hero-seen=return] .film .film-cue .perforation:before{animation:none}@media (hover:hover) and (pointer:fine){.film .hero-depth{transition:transform var(--dur-ui) var(--ease-settle)}.film .film-word{transition:translate var(--dur-ui) var(--ease-settle)}}@supports (animation-timeline:view()) and (timeline-scope:--a){@media screen and (min-width:64rem) and (min-height:37.5rem){.film{timeline-scope:--opening, --ch-1, --ch-2, --ch-3, --ch-4, --closing}.film:before{content:none}.film .film-frame{align-self:start;height:100vh;margin-top:-5rem;padding-top:5rem;position:sticky;top:0;overflow:clip}.film .film-frame:before{content:""}.film .film-opening{view-timeline:--opening;view-timeline-inset:5rem 0;height:250vh;display:block}.film .film-intro{align-content:end;min-height:calc(100vh - 5rem)}.film .film-title{text-align:center;white-space:nowrap;pointer-events:none;position:sticky;top:6rem}.film .film-title :is(.film-letter,.film-letter-in){white-space:pre;display:inline-block}.film .film-floor{z-index:1;inset-inline:0;display:block;position:absolute;bottom:9cqw}.film .film-backdrop:after{content:"";background-color:var(--cellulose);position:absolute;inset:-50vh -50vw}.film .film-intro{animation:linear both film-out,linear both film-gate;animation-timeline:--opening,--opening;animation-range:contain contain 30%,contain contain 30%}.film .film-intro:focus-within{animation:none}.film .film-word{animation:linear both film-word-lift,linear both film-recede,linear forwards film-watermark-out;animation-timeline:--opening,--opening,--ch-1;animation-range:contain contain 30%,contain 30% contain 60%,entry entry 30%}.film .film-word .film-letter-in{animation:linear both film-spread;animation-timeline:--opening;animation-range:contain contain 30%}.film .film-backdrop:after{animation:linear both film-in;animation-timeline:--opening;animation-range:contain 20% contain 70%}.film .actor-unpack{animation:linear both film-unpack;animation-timeline:--opening;animation-range:contain 20% contain 70%}.film .film-title .film-letter{animation:linear both film-slit;animation-timeline:--opening;animation-range:contain calc(60% + var(--i) / var(--n) * 30%) contain calc(70% + var(--i) / var(--n) * 30%)}.film .film-floor{animation:linear both rule-draw,linear forwards film-out;animation-timeline:--opening,--closing;animation-range:contain 60%,entry entry 30%}.film .film-title{animation:linear both film-out;animation-timeline:--ch-1;animation-range:entry entry 30%}.film{--chapter-h:125vh}.film .film-frame{grid-area:1/1/3/2}.film .film-theatre{z-index:1;pointer-events:none;--stage-w:min(100cqw, calc((100vh - 5rem) * 16 / 9));--stage-l:calc((100cqw - var(--stage-w)) / 2);--text-l:max(calc(var(--stage-l) + var(--stage-w) * .04), calc((100cqw - 80rem) / 2 + 1.5rem));--floor-b:calc((100vh - 5rem - var(--stage-w) * 9 / 16) / 2 + var(--stage-w) * .09);grid-area:2/1;max-width:none;margin:0;padding:0;container-type:inline-size}.film .film-chapters{display:block}.film .film-chapter{height:var(--chapter-h);scroll-margin-top:0;position:relative}.film .film-chapter:first-child{view-timeline:--ch-1;--ch:--ch-1}.film .film-chapter:nth-child(2){view-timeline:--ch-2;--ch:--ch-2}.film .film-chapter:nth-child(3){view-timeline:--ch-3;--ch:--ch-3}.film .film-chapter:nth-child(4){view-timeline:--ch-4;--ch:--ch-4}.film .film-progress a:first-child{--ch:--ch-1}.film .film-progress a:nth-child(2){--ch:--ch-2}.film .film-progress a:nth-child(3){--ch:--ch-3}.film .film-progress a:nth-child(4){--ch:--ch-4}.film .film-actor:nth-child(1 of [data-cast]){--ch:--ch-1}.film .film-actor:nth-child(2 of [data-cast]){--ch:--ch-2}.film .film-actor:nth-child(3 of [data-cast]){--ch:--ch-3}.film .film-actor:nth-child(4 of [data-cast]){--ch:--ch-4}.film :is(.actor-queue,.actor-arrive,.actor-leave){transform-origin:50% 100%}.film .film-actor[data-cast] .actor-arrive{animation:linear both film-arrive;animation-timeline:var(--ch);animation-range:entry entry 55%}.film .film-actor[data-cast] .actor-leave{animation:linear both film-leave;animation-timeline:var(--ch);animation-range:exit exit 55%}.film .film-actor[data-cast] .actor-look{animation:linear forwards film-wipe-out;animation-timeline:var(--ch);animation-range:entry 55% entry 58%}.film .film-actor:nth-child(n+2 of [data-cast]) .actor-queue{animation:linear both film-queue;animation-timeline:--ch-1;animation-range:entry entry 55%}.film .film-actor:nth-child(n+2 of [data-cast]) .actor-look{animation:linear both film-dim,linear forwards film-undim,linear forwards film-wipe-out;animation-timeline:--ch-1, var(--ch), var(--ch);animation-range:entry entry 55%,entry entry 40%,entry 55% entry 58%}.film .film-actor:not([data-cast]) .actor-look{animation:linear both film-out;animation-timeline:--ch-1;animation-range:entry entry 30%}.film .chapter-layer{height:100vh;display:block;position:absolute;inset:0 0 auto}.film .chapter-hold{height:100vh;animation:linear both film-hold;animation-timeline:var(--ch);justify-content:center;align-items:center;padding-top:5rem;animation-range:cover;display:flex;overflow:clip}.film .chapter-stage{aspect-ratio:16/9;width:min(100%,177.778vh - 8.88889rem);position:relative;container-type:inline-size}.film .layer-name{top:1cqw;left:calc(4cqw + (100vh + var(--chapter-h)) * .25);white-space:nowrap;color:#0000;-webkit-text-stroke:1.5px var(--feather);animation:linear both film-name,linear both film-in,linear forwards film-out;animation-timeline:var(--ch), var(--ch), var(--ch);font-size:12cqw;line-height:1;animation-range:cover,entry 60%,exit exit 40%;position:absolute}.film .big-arrive{transform-origin:50% 100%;width:44cqw;animation:linear both film-from;animation-timeline:var(--ch);animation-range:entry entry 55%;position:absolute;bottom:9cqw;left:40cqw}.film .big-leave{transform-origin:50% 100%;animation:linear both film-leave;animation-timeline:var(--ch);animation-range:exit exit 55%}.film .film-chapter:last-child .big-leave{animation-range:exit exit 40%}.film .big-look{animation:linear both film-wipe-in;animation-timeline:var(--ch);animation-range:entry 55% entry 58%;position:relative}.film .big-look-tilt{animation-name:film-wipe-in-tilt}.film .angle-front{animation:linear both film-wipe-out;animation-timeline:var(--ch);animation-range:exit 2% exit 5%}.film .angle-side{animation:linear both film-wipe-in;animation-timeline:var(--ch);animation-range:exit 2% exit 5%;position:absolute;inset:0}.film .big-tilt{animation:linear both film-tilt;animation-timeline:var(--ch);animation-range:cover}.film .chapter-card{top:max(calc(50vh - 8rem), calc(5rem + var(--stage-w) * .14));width:calc(var(--stage-l) + var(--stage-w) * .4);height:auto;padding:0 1.5rem 0 var(--text-l);background:0 0;border:0;border-radius:0;gap:.5rem;position:sticky}.film .chapter-picture{display:none}.film .film-line{animation:linear both film-line-in,linear forwards film-line-out;animation-timeline:var(--ch), var(--ch);animation-range:entry calc(60% + var(--line) * 6%) entry 100%, exit 0% exit 25%}.film .film-more{scroll-margin-block:40vh}.film :is(.film-more,.film-progress a,.film-closing){pointer-events:auto}.film .film-progress{bottom:var(--floor-b);z-index:1;width:max-content;gap:1rem;margin-inline-start:var(--text-l);animation:linear both film-out,linear both film-gate;animation-timeline:--closing,--closing;animation-range:entry entry 30%,entry entry 30%;display:flex;position:sticky}.film .film-progress:focus-within{animation:none}.film .film-progress a{font-variant-numeric:tabular-nums;min-width:3rem;color:var(--accent);animation:linear both film-undim,linear forwards film-dim;animation-timeline:var(--ch), var(--ch);flex-direction:column;gap:.25rem;padding-top:.5rem;font-size:.875rem;animation-range:entry 90%,exit exit 10%;display:flex}.film .film-progress a:after{content:"";background-color:var(--accent);transform-origin:0;height:2px;animation:linear both film-tick;animation-timeline:var(--ch);animation-range:contain}.film .film-progress a:focus-visible{animation:none}.film .film-closing{padding:8rem 1.5rem 6rem var(--text-l);view-timeline:--closing;margin:0;position:relative}}@media screen and not ((min-width:64rem) and (min-height:37.5rem)){.film .film-theatre{max-width:none;padding-inline:0}.film .film-chapters{scroll-snap-type:x mandatory;overscroll-behavior-x:contain;gap:.75rem;padding-inline:max(9%,50% - 18rem);scroll-padding-inline:max(9%,50% - 18rem);display:flex;overflow-x:auto}.film .film-chapter{scroll-snap-align:center;flex:0 0 min(100%,36rem);min-width:0}.film .film-name{overflow-wrap:break-word;letter-spacing:-.02em;order:-1;font-size:min(2.5rem,10vw);line-height:1.1}.film .film-kicker{order:-2}.film .film-line{animation:linear both film-line-in;animation-timeline:view(inline);animation-range:entry 60%}.film .film-closing{padding-inline:1rem}}}.film .film-chapter:focus-within .film-line{animation:none}.film .film-more:after{transition:clip-path var(--dur-ui) var(--ease-settle)}}.paper-story .story-strip{background-color:var(--feather);width:2px;-webkit-mask-image:var(--dash-y);mask-image:var(--dash-y);position:absolute;top:0;bottom:6rem;left:1rem;-webkit-mask-size:2px 14px;mask-size:2px 14px}.paper-story :is(.story-title,.story-stages,.story-cta){padding-left:1.75rem}.paper-story .story-stages{gap:4rem;margin-top:2.5rem;display:grid}.paper-story .story-stage{gap:1.5rem;display:grid}.paper-story .story-cta{margin-top:4rem}@media (min-width:40rem){.paper-story .story-strip{bottom:8rem;left:1.5rem}}@media (min-width:48rem){.paper-story .story-strip{left:calc(50% - 1px)}.paper-story :is(.story-title,.story-stages,.story-cta){padding-left:0}.paper-story .story-title{max-width:calc(50% - 3rem)}.paper-story .story-stages{gap:6rem;margin-top:4rem}.paper-story .story-stage{grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;column-gap:6rem}.paper-story .story-stage:nth-child(2n) .story-art{order:1}.paper-story .story-cta{justify-content:center;display:flex}}@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){.paper-story .story-strip{animation:linear both story-draw;animation-timeline:view();animation-range:cover contain}.paper-story .scroll-reveal{view-timeline:--story-stage;animation:linear both story-slit;animation-timeline:view();animation-range:entry 10%}.paper-story .scroll-reveal:focus-within{animation:none}.paper-story .story-art img{animation:linear both story-drift;animation-timeline:--story-stage;animation-range:cover;scale:1.06}}.finale .panel-arrow{transition:transform var(--dur-ui) var(--ease-settle)}@media (hover:hover){.finale a:hover .panel-arrow{transform:translate(6px)}}}}@media print{.paper-story .story-art p{font-size:1.75rem;line-height:1.25}.paper-story .story-art img{scale:none}.finale section{background-color:var(--paper);color:var(--ink)}.finale :is(h2,a){border-color:var(--ink);color:var(--ink)}@media (prefers-reduced-motion:no-preference){.film *,.paper-story *,.finale *{animation:none}}}@keyframes film-slit{0%{clip-path:inset(100% 0 0);translate:0 40%}to{clip-path:inset(0);translate:0}}@keyframes film-drop{0%{transform:translateY(calc(var(--dist-l) * -1)) rotate(3deg)}to{transform:none}}@keyframes film-cue{0%{translate:0}to{translate:0 14px}}@keyframes hero-settle{0%{transform:translateY(12px)}}@keyframes hero-arrive{0%{opacity:0;transform:translateY(var(--dist-s))}}@keyframes film-out{0%{opacity:1}to{opacity:0}}@keyframes film-in{0%{opacity:0}to{opacity:1}}@keyframes film-word-lift{0%{transform:none}to{transform:translateY(-8cqw)scale(1.4)}}@keyframes film-recede{0%{opacity:1}to{opacity:.1}}@keyframes film-spread{0%{translate:0}to{translate:calc((var(--i) - 2.5) * 3cqw) 0}}@keyframes film-unpack{0%{transform:translate(var(--stack-x), var(--stack-y)) scale(var(--stack-s)) rotate(0deg)}50%{transform:translate(calc(var(--stack-x) / 2), calc(var(--stack-y) / 2)) scale(calc((var(--stack-s) + 1) / 2)) rotate(var(--travel))}to{transform:none}}@keyframes film-gate{0%{clip-path:inset(-100vh -100vw)}99%{clip-path:inset(-100vh -100vw)}to{clip-path:inset(50%)}}@keyframes film-watermark-out{0%{opacity:.1}to{opacity:0}}@keyframes film-dim{0%{opacity:1}to{opacity:.5}}@keyframes film-undim{0%{opacity:.5}to{opacity:1}}@keyframes film-queue{0%{transform:none}to{transform:translate(var(--queue-x), var(--queue-y)) scale(var(--queue-s))}}@keyframes film-arrive{0%{transform:none}to{transform:translate(var(--arrive-x), var(--arrive-y)) scale(var(--arrive-s))}}@keyframes film-leave{0%{transform:none}to{transform:translate(var(--leave-x), var(--leave-y)) scale(var(--leave-s))}}@keyframes film-from{0%{transform:translate(var(--from-x), var(--from-y)) scale(var(--from-s))}to{transform:none}}@keyframes film-hold{0%{translate:0 -100vh}to{translate:0 var(--chapter-h)}}@keyframes film-name{0%{translate:0}to{translate:calc((100vh + var(--chapter-h)) * -.5) 0}}@keyframes film-tilt{0%{transform:perspective(1200px)rotateY(-5deg)}to{transform:perspective(1200px)rotateY(5deg)}}@keyframes film-tick{0%{scale:0 1}to{scale:1}}@keyframes film-line-in{0%{clip-path:inset(0 0 100%);translate:0 .4em}to{clip-path:inset(0);translate:0}}@keyframes film-line-out{0%{clip-path:inset(0)}to{clip-path:inset(100% 0 0)}}@keyframes film-wipe-in{0%{clip-path:inset(0 calc(100% - 1px) 0 0)}to{clip-path:inset(0)}}@keyframes film-wipe-out{0%{clip-path:inset(0)}to{clip-path:inset(0 0 0 100%)}}@keyframes film-wipe-in-tilt{0%{clip-path:inset(0 98% 0 0)}to{clip-path:inset(0)}}@keyframes story-slit{0%{clip-path:inset(0 0 100%);translate:0 var(--dist-l)}to{clip-path:inset(0);translate:0}}@keyframes story-draw{0%{clip-path:inset(0 0 100%)}to{clip-path:inset(0)}}@keyframes story-drift{0%{translate:0 var(--dist-l)}to{translate:0 calc(var(--dist-l) * -1)}}
