:root{--ps-ground: #d4cfca;--ps-ink: #1f1c1a;--ps-ink-soft: #3d3936;--ps-on-ink: #f3efeb;--ps-pill: rgba(36, 34, 33, .72);--ps-line: rgba(31, 28, 26, .34);--ps-sans: "Mona Sans", ui-sans-serif, sans-serif;--pad: clamp(16px, 2.6vw, 40px);--ease: cubic-bezier(.22, .61, .24, 1)}*{box-sizing:border-box;margin:0;padding:0}html{background:var(--ps-ground)}body{background:var(--ps-ground);color:var(--ps-ink);font-family:var(--ps-sans);font-stretch:112%;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}ul{list-style:none}:focus-visible{outline:2px solid var(--ps-ink);outline-offset:3px}.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.bar{position:fixed;inset:0 0 auto;z-index:10;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:var(--pad) var(--pad) 0}.mark{display:flex;align-items:center;gap:12px;justify-self:start}.mark svg{width:22px;height:22px;stroke:var(--ps-ink);stroke-width:2.6;fill:none}.mark-text{display:flex;flex-direction:column;line-height:1.15}.mark-text b{font-weight:560;font-size:16px;letter-spacing:-.01em}.mark-text small{font-size:12px;color:var(--ps-ink);letter-spacing:.01em}.pill{display:flex;gap:2px;padding:5px;background:var(--ps-pill);border-radius:999px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.pill a{color:var(--ps-on-ink);font-size:14px;padding:8px 15px;border-radius:999px;transition:background-color .2s var(--ease)}.sub{justify-self:end;display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:14px;padding:6px 6px 6px 18px;border-radius:999px;border:1px solid var(--ps-line);transition:background-color .2s var(--ease)}.sub .dot{width:30px;height:30px;border-radius:50%;background:var(--ps-ink);position:relative;transition:transform .2s var(--ease)}.sub .dot:after{content:"";position:absolute;inset:11px 10px 11px 9px;border:solid var(--ps-on-ink);border-width:1.6px 1.6px 0 0;transform:rotate(45deg)}@media (hover: hover){.pill a:hover{background:#ffffff1f}.sub:hover{background:#1f1c1a0f}.sub:hover .dot{transform:translate(2px)}.side a:hover{color:var(--ps-ink)}.join button:hover{background:#3a3532}}.stage{height:720vh;position:relative}.sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}#film{position:absolute;inset:0;width:100%;height:100%;display:block}.scan{position:absolute;left:0;top:0;width:0;height:0;pointer-events:none;opacity:0;mix-blend-mode:screen}.scan i{position:absolute;inset:0;border-radius:50%;background:radial-gradient(50% 9% at 50% 50%,#fff,#fff0),radial-gradient(50% 30% at 50% 50%,#ffffff8c,#fff0),radial-gradient(14% 40% at var(--hx, 50%) 50%,rgba(255,246,236,.9),rgba(255,255,255,0) 100%);filter:blur(2px)}.copy{position:absolute;left:var(--pad);top:50%;transform:translateY(-38%);width:min(480px,32vw)}.chapter{position:absolute;left:0;top:0;width:100%;transition:opacity .4s var(--ease),transform .6s var(--ease),visibility 0s linear .4s}.js .chapter{opacity:0;visibility:hidden;transform:translateY(18px);pointer-events:none}.js .chapter.on{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}.tag{display:inline-block;background:var(--ps-ink);color:var(--ps-on-ink);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px 4px;margin-bottom:18px}h1,h2{font-weight:330;font-size:clamp(40px,4.1vw,62px);line-height:.98;letter-spacing:-.035em;text-wrap:balance}h1 em,h2 em{font-style:italic;font-weight:300}.chapter p{margin-top:20px;max-width:30ch;font-size:17px;line-height:1.45;color:var(--ps-ink-soft)}.join{margin-top:22px;display:flex;gap:6px;max-width:420px}.join input{flex:1;min-width:0;font:inherit;font-size:16px;color:var(--ps-ink);background:transparent;border:1px solid var(--ps-line);border-radius:999px;padding:12px 18px}.join input::placeholder{color:var(--ps-ink-soft)}.join input:focus-visible{outline:none;border-color:var(--ps-ink)}.join button{font:inherit;font-size:16px;color:var(--ps-on-ink);background:var(--ps-ink);border:0;border-radius:999px;padding:12px 20px;cursor:pointer;min-height:44px;transition:background-color .2s var(--ease),transform .15s var(--ease)}.join button:active{transform:scale(.97)}.mark-text,.chapter p,.side{text-shadow:0 0 2px var(--ps-ground),0 0 10px var(--ps-ground)}.side{position:absolute;right:var(--pad);top:0;bottom:0;display:flex;flex-direction:column;justify-content:center;gap:40px;text-align:right;font-size:12px;line-height:2;color:var(--ps-ink-soft)}.cue{position:absolute;right:0;bottom:var(--pad);white-space:nowrap;font-size:12px;letter-spacing:.12em;text-transform:uppercase}html:not(.js) .stage{height:auto}html:not(.js) .sticky{position:static;height:auto;overflow:visible}html:not(.js) #film,html:not(.js) .scan,html:not(.js) .cue{display:none}html:not(.js) .copy{position:static;transform:none;width:auto;max-width:560px;padding:22vh var(--pad) 10vh}html:not(.js) .chapter{position:static;margin-bottom:30vh}html:not(.js) .side{position:static;padding:0 var(--pad) 10vh;text-align:left}@media (max-width: 760px){.pill{display:none}.bar{grid-template-columns:1fr auto}.side{display:none}.copy{top:auto;bottom:calc(var(--pad) + 8px);transform:none;width:calc(100% - 2 * var(--pad))}.chapter{top:auto;bottom:0}h1,h2{font-size:40px}.chapter p{margin-top:14px;font-size:16px}}@media (prefers-reduced-motion: reduce){.js .chapter,.js .chapter.on{transform:none;transition:opacity .2s linear}}
