@font-face{font-family:Syne;src:url(fonts/syne.ttf) format('truetype');font-weight:400 800;font-display:swap}
@font-face{font-family:Karla;src:url(fonts/karla.ttf) format('truetype');font-weight:200 800;font-display:swap}
:root{color-scheme:dark;--ink:#eae6dd;--muted:#888176;--paper:#060605}*{box-sizing:border-box}html,body{margin:0;background:var(--paper);color:var(--ink)}body{font-family:Karla,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:1px solid #bea488;outline-offset:9px}::selection{background:#9a7658;color:#fff}
.observatory{height:100svh;min-height:660px;position:relative;isolation:isolate;overflow:hidden}.masthead{position:absolute;z-index:3;left:4.5vw;right:4.5vw;top:30px;display:flex;align-items:center;justify-content:space-between}.wordmark{font-family:Syne,Arial,sans-serif;font-size:32px;font-weight:650;line-height:1;letter-spacing:-.09em}.wordmark span{font-weight:400;color:#b3a999;font-size:20px;letter-spacing:-.06em;margin-left:2px}.place-name{position:absolute;left:50%;transform:translateX(-50%);font-size:13px;font-weight:400;color:#8c8378;margin:0}.social{display:flex;gap:10px;align-items:center;font-size:12px;color:#a99c8b}.social svg{width:14px;height:14px;fill:currentColor}.social[aria-disabled=true]{cursor:default}.social[href]:hover{color:#f1e9dc}
.stage{position:absolute;z-index:0;width:min(88vw,83svh);aspect-ratio:1;left:50%;top:44.5%;transform:translate(-50%,-50%);touch-action:pan-y}.stage>img,.stage>canvas{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.stage>canvas{opacity:0}.stage>canvas.ready{opacity:1}#cycle{display:none}
.whisper{position:absolute;z-index:2;font-size:15px;line-height:1.45;color:#aba090;pointer-events:none;font-weight:350;letter-spacing:-.025em}.whisper span{display:block}.whisper-left{left:8.3vw;top:45.5%;transform:rotate(-5deg)}.whisper-right{right:8.2vw;top:47.5%;transform:rotate(4deg);text-align:right}.whisper-right span{transition:opacity .45s,transform .45s}.whisper-right.changing span{opacity:0;transform:translateY(4px)}
.caption{position:absolute;z-index:2;left:20px;right:20px;bottom:92px;text-align:center;pointer-events:none}.phase-line{display:flex;justify-content:center;align-items:baseline;gap:10px;color:#918373;font-size:11px;margin-bottom:18px;min-height:15px;transition:opacity .38s,transform .38s}.phase-line.changing{opacity:0;transform:translateY(4px)}#phase-name{color:#b4a38e;font-size:12px}#phase-note{color:#776d60}h1{font-family:Syne,Arial,sans-serif;font-size:clamp(29px,3.25vw,49px);font-weight:500;line-height:1.035;letter-spacing:-.058em;margin:0}h1 span{color:#b5a48f}
.footnote{position:absolute;bottom:27px;left:4.5vw;right:4.5vw;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#756e63;font-size:11px;z-index:3}.footnote p{margin:0}.footnote button{padding:4px 0;color:#9a8c7c;font-size:11px}.footnote button:hover{color:#efe3d1}.screen-reader{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.no-script{position:absolute;bottom:70px;width:100%;text-align:center;font-size:12px;color:#b9a78c}
@media(min-width:1700px){.stage{width:min(85vw,85svh)}.caption{bottom:12vh}.whisper-left{left:12vw}.whisper-right{right:12vw}}
@media(max-width:760px){.observatory{min-height:730px}.masthead{top:26px;left:6vw;right:6vw}.wordmark{font-size:29px}.wordmark span{font-size:18px}.place-name{display:none}.social{font-size:11px;gap:8px}.social svg{width:12px;height:12px}.stage{width:112vw;max-width:620px;top:40%}.whisper{font-size:12px;top:auto}.whisper-left{left:7vw;bottom:26.5%;transform:rotate(-4deg)}.whisper-right{right:7vw;bottom:29%;transform:rotate(4deg)}.caption{bottom:100px;left:15px;right:15px}.phase-line{margin-bottom:17px;gap:8px;font-size:10px}#phase-name{font-size:11px}h1{font-size:35px;letter-spacing:-.065em}.footnote{bottom:25px;left:6vw;right:6vw;font-size:10px;gap:15px}.footnote p{max-width:175px}.footnote button{font-size:10px;white-space:nowrap}}
@media(max-height:700px) and (min-width:761px){.observatory{min-height:620px}.stage{top:42%;width:79svh}.caption{bottom:70px}h1{font-size:34px}.phase-line{margin-bottom:12px}.masthead{top:24px}.footnote{bottom:20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
.stage>img,.stage>canvas{mix-blend-mode:screen}
.stage{mix-blend-mode:screen;mask-image:radial-gradient(ellipse at center,#000 55%,rgba(0,0,0,.95) 64%,transparent 75%)}
.stage>img,.stage>canvas{mix-blend-mode:normal}
.stage{mask-image:radial-gradient(ellipse at center,#000 45%,rgba(0,0,0,.95) 55%,transparent 70%)}
.world{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:0;pointer-events:none;mix-blend-mode:screen}
.world.ready{opacity:1}
.observatory[data-rendered=true] #poster{visibility:hidden}
.caption,.whisper,.masthead,.footnote{text-shadow:0 2px 22px rgba(0,0,0,.9)}
.observatory::after{content:"";position:absolute;inset:60% 0 0;z-index:1;pointer-events:none;background:linear-gradient(transparent,rgba(0,0,0,.54))}
.whisper,.phase-line{text-shadow:0 1px 5px #000,0 0 16px #000}
#phase-name{color:#c8b69c}#phase-note{color:#a49786}

/* Keep the marginal notes in the dark areas around the four-way light field. */
@media(min-width:761px){.whisper-left{top:24%}.whisper-right{top:66%}}

.morph-film{position:absolute;z-index:0;left:50%;top:44.5%;transform:translate(-50%,-50%) scale(var(--phase-scale,1));width:100%;height:auto;pointer-events:none;opacity:0;mix-blend-mode:screen;will-change:transform}
.morph-film.ready{opacity:1}
@media(max-width:760px){.morph-film{width:245vw;max-width:none;top:40%}}

/* Feather only the outer black border, leaving the face and fragments sharp. */
.morph-film{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%)}