@font-face{font-family:Instrument Serif;src:url('assets/instrument-serif-italic.ttf') format('truetype');font-style:italic;font-weight:400;font-display:swap}
:root{color-scheme:dark;--paper:#f7f5ed;--line:rgba(247,245,237,.28)}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{background:#171a17}
body{margin:0;color:var(--paper);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
button,input,a{-webkit-tap-highlight-color:transparent}
button,input{font:inherit}
button,a{touch-action:manipulation}
button{cursor:pointer;color:inherit}
button:disabled{cursor:not-allowed}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--paper);outline-offset:5px}
a{color:inherit}
.skip-link{position:fixed;left:24px;top:-80px;z-index:20;padding:14px;background:#171a17}
.skip-link:focus{top:20px}
.background-film{position:fixed;inset:0;z-index:0;overflow:hidden;background:#171a17}
.film-poster,.film{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:var(--video-position)}
.film{opacity:0;transition:opacity .14s ease}
.film.is-active{opacity:1}
.film-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,9,7,.15),transparent 25%,rgba(5,9,7,.12) 44%,rgba(5,9,7,.68) 100%)}
.analog-texture{position:absolute;inset:0;pointer-events:none;opacity:.25;background:repeating-linear-gradient(0deg,rgba(0,0,0,.3) 0,rgba(0,0,0,.3) 1px,transparent 1px,transparent 3px);box-shadow:inset 0 0 130px rgba(0,0,0,.26)}
.analog-texture:after{content:"";position:absolute;inset:0;opacity:.14;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.91' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' opacity='.65' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.page{position:relative;z-index:1;min-height:100svh;display:flex;flex-direction:column;padding:28px 34px 20px;padding-top:max(28px,env(safe-area-inset-top));padding-bottom:max(20px,env(safe-area-inset-bottom))}
.masthead{display:flex;align-items:center;justify-content:space-between;gap:20px}
.wordmark{font-size:18px;font-weight:500;letter-spacing:-.04em;max-width:65%;overflow-wrap:anywhere;text-shadow:0 1px 10px #0008}
.arrow-icon{width:13px;height:13px;flex:none;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:square;stroke-linejoin:miter}
.hero{margin-top:auto;padding-top:clamp(90px,18vh,240px);padding-bottom:45px;outline:none}
.edition{font-size:10px;text-transform:uppercase;letter-spacing:.16em;display:flex;gap:10px;align-items:center;margin-bottom:23px;text-shadow:0 1px 10px #000}
.status-dot{width:5px;height:5px;background:#e8efda;border-radius:50%}
h1{font-family:Instrument Serif,Georgia,serif;font-style:italic;font-size:clamp(110px,16.4vw,300px);line-height:.88;letter-spacing:-.045em;font-weight:400;margin:0 0 38px -5px;text-shadow:1px 0 1px #deaaaa28,-1px 0 1px #bbdada35}
.hero-details{display:grid;grid-template-columns:1fr 1fr auto;gap:36px;align-items:center;max-width:1800px}
.hero-details h2{font-size:clamp(24px,2.4vw,38px);font-weight:400;letter-spacing:-.045em;margin:0;line-height:1.15}
.short-description{font-size:14px;line-height:1.55;max-width:315px;margin:0;text-wrap:pretty}
.primary-button{display:flex;gap:32px;align-items:center;justify-content:space-between;background:var(--paper);color:#20231e;border:1px solid var(--paper);border-radius:2px;min-height:50px;padding:15px 22px;font-size:13px;transition:background .2s,transform .2s}
.primary-button:hover{background:#deded2;transform:translateY(-2px)}
.footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:46px;padding-top:12px;font-size:10px;letter-spacing:.025em}
.footer>span{font-size:12px}
.social-links,.dialog-socials{display:flex;flex-wrap:wrap;gap:22px}
.social-links a,.dialog-socials a{text-decoration:none;min-height:44px;display:flex;align-items:center;gap:6px}
.social-links a:hover,.dialog-socials a:hover{text-decoration:underline;text-underline-offset:5px}
dialog{padding:0;border:1px solid #62655a;border-radius:3px;background:#1e241f;color:var(--paper);width:min(560px,calc(100% - 32px));max-height:calc(100svh - 36px);overscroll-behavior:contain;box-shadow:0 24px 100px #0008}
dialog::backdrop{background:rgba(5,10,6,.55);backdrop-filter:blur(7px)}
/* Keep Safari dialog text on its own layer above the blurred video backdrop. */
.dialog-inner{padding:50px 40px 30px;position:relative;transform:translateZ(0)}
.close-button{display:flex;align-items:center;gap:12px;position:absolute;top:10px;right:17px;background:transparent;border:0;font-size:11px;min-height:44px}
.close-button span{font-size:24px}
.eyebrow{text-transform:uppercase;font-size:9px!important;letter-spacing:.13em;margin:10px 0 25px!important}
dialog h2{font-family:Instrument Serif,Georgia,serif;font-style:italic;letter-spacing:-.035em;font-weight:400;font-size:65px;line-height:1;margin:0 0 22px}
dialog p{font-size:13px;line-height:1.65;margin:12px 0}
.launch-message{font-size:19px;line-height:1.4!important}
.collection-note{color:#c7ccc1}
form{margin-top:27px;padding-top:24px;border-top:1px solid var(--line)}
label{display:block;font-size:13px;margin-bottom:13px}
.signup-row{display:flex;border-bottom:1px solid #9dA393;padding-bottom:8px;gap:8px}
input{color:var(--paper);border:0;background:transparent;border-radius:0;min-width:0;width:100%;padding:10px 3px;min-height:44px;font-size:13px}
input::placeholder{color:#b7bcae;opacity:1}
.signup-row button{white-space:nowrap;background:var(--paper);color:#23291f;border:0;padding:12px;font-size:12px;min-height:44px}
.signup-row button:disabled{background:#b7bcaf;color:#34392e}
.signup-note{color:#c4c9bd;font-size:11px;margin-top:12px}
.dialog-socials{margin-top:20px;font-size:12px}
.return-note{margin-top:25px;font-size:11px;color:#c4c9bd}
body:has(dialog[open]){overflow:hidden}
@media(min-width:1800px){.page{padding-left:54px;padding-right:54px}.hero-details{grid-template-columns:1fr 1fr auto}.short-description{font-size:16px;max-width:350px}}
@media(max-width:900px){.page{padding:24px 25px 16px}.hero{padding-top:150px;padding-bottom:35px}.hero-details{grid-template-columns:1fr auto;gap:18px 35px}.hero-details h2{grid-column:1 / -1;font-size:30px}.short-description{max-width:330px}.edition{margin-bottom:30px}h1{font-size:19vw;margin-bottom:30px}.footer{flex-wrap:wrap;gap:8px 18px}}
@media(max-width:560px){.page{padding:20px 21px max(10px,env(safe-area-inset-bottom));padding-top:max(20px,env(safe-area-inset-top))}.wordmark{font-size:16px;max-width:55%}
/* The phone view holds its scale and pans horizontally; the two versions are selected in main.js. */
.film-poster,.film{top:0;bottom:auto;height:100%;object-position:12% 50%;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 80%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 12%,#000 80%,transparent 100%)}
.background-film.is-panning .film,.background-film.is-panning .film-poster{animation:mobile-pan 8.85s cubic-bezier(.42,0,1,1) forwards}
.background-film.is-rewinding .film,.background-film.is-rewinding .film-poster{animation:mobile-pan-rewind 8.85s cubic-bezier(.42,0,1,1) forwards}
.film-shade{background:linear-gradient(180deg,rgba(5,9,7,.28) 0%,rgba(5,9,7,.02) 27%,rgba(5,9,7,.14) 53%,rgba(5,9,7,.82) 100%)}.hero{padding-top:130px;padding-bottom:20px}.edition{font-size:8px;letter-spacing:.12em;margin-bottom:18px;gap:8px}h1{font-size:20vw;letter-spacing:-.04em;margin:0 0 20px -2px;white-space:nowrap}.hero-details{display:flex;flex-direction:column;align-items:flex-start;gap:13px}.hero-details h2{font-size:31px;line-height:1.1}.short-description{font-size:14px;max-width:305px;line-height:1.45}.primary-button{margin-top:3px;min-height:50px;padding:15px 19px;gap:52px}.footer{font-size:9px;padding-top:4px}.footer>span{font-size:11px}.social-links{order:3;width:100%;gap:22px}.dialog-inner{padding:50px 24px 25px}dialog h2{font-size:56px}.eyebrow{font-size:8px!important}.dialog-socials{gap:18px}}
@keyframes mobile-pan{from{object-position:12% 50%}to{object-position:86% 50%}}
@keyframes mobile-pan-rewind{from{object-position:86% 50%}to{object-position:12% 50%}}
@media(max-height:600px) and (min-width:561px){.hero{padding-top:65px;padding-bottom:25px}h1{font-size:19vh;margin-bottom:20px}.edition{margin-bottom:18px}.page{padding-top:16px;padding-bottom:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.film{display:none!important}}

.signup-note a{color:inherit;text-underline-offset:3px}
.signup-note[data-state="error"]{color:#f3c5b5}
.signup-note[data-state="success"]{color:#d6e4bc}

.site-loader{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:#171a17;color:var(--paper);padding:32px;opacity:1;transition:opacity .3s ease}
.site-loader.is-leaving{opacity:0;pointer-events:none}
.loader-content{text-align:center;width:min(320px,100%)}
.loader-wordmark{font-size:16px;letter-spacing:.12em}
.loader-tagline{font-family:Instrument Serif,Georgia,serif;font-style:italic;font-size:clamp(36px,7vw,46px);font-weight:400;letter-spacing:-.025em;margin:24px 0 30px}
.loader-thread{height:1px;position:relative;overflow:hidden;background:var(--line);max-width:160px;margin:auto}
.loader-thread:after{content:"";position:absolute;inset:0;background:var(--paper);transform:translateX(-100%);animation:thread-loading 1.4s ease-in-out infinite}
.loader-status{font-size:11px;letter-spacing:.03em;color:#c4c9bd;margin:17px 0 0}
.loader-enter{font-size:11px;background:none;border:0;border-bottom:1px solid var(--line);padding:8px 0;margin-top:22px;min-height:44px}
@keyframes thread-loading{to{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.site-loader{transition:none}.loader-thread:after{animation:none;transform:none}}
