:root{color-scheme:dark;--void:#05060b;--soft-white:rgba(239,239,244,.72);--quiet:rgba(224,226,235,.38);--edge:rgba(223,225,238,.13);font-family:Inter,"Helvetica Neue",Helvetica,Arial,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
*{box-sizing:border-box}
html,body{width:100%;height:100%;min-height:100%;margin:0;overflow:hidden;background:var(--void)}
body{color:var(--soft-white)}
.installation{position:relative;isolation:isolate;width:100%;height:100vh;height:100svh;min-height:320px;overflow:hidden;background:radial-gradient(ellipse at 51% 47%,#111320 0%,#090a11 42%,var(--void) 78%)}
.artwork,.fallback-art,.grain{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.artwork{z-index:1;display:block;opacity:0;transition:opacity 1.5s ease}
.installation.has-webgl .artwork{opacity:1}
.fallback-art{z-index:0;overflow:hidden;background:radial-gradient(ellipse 42% 24% at 45% 51%,rgba(22,107,143,.27),transparent 72%),radial-gradient(ellipse 31% 21% at 65% 46%,rgba(110,53,144,.25),transparent 73%),radial-gradient(ellipse 22% 15% at 35% 61%,rgba(24,129,123,.18),transparent 74%);filter:blur(34px);animation:fallback-drift 24s ease-in-out infinite alternate}
.installation.has-webgl .fallback-art{opacity:.16}
.grain{z-index:2;opacity:.105;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='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.21'/%3E%3C/svg%3E");background-size:180px 180px;mix-blend-mode:soft-light}
.frame-mark{position:absolute;z-index:3;inset:clamp(21px,4.1vw,58px);pointer-events:none}
.frame-mark span{position:absolute;width:13px;height:13px;opacity:.38}
.frame-mark span:nth-child(1){top:0;left:0;border-top:1px solid var(--edge);border-left:1px solid var(--edge)}
.frame-mark span:nth-child(2){top:0;right:0;border-top:1px solid var(--edge);border-right:1px solid var(--edge)}
.frame-mark span:nth-child(3){bottom:0;left:0;border-bottom:1px solid var(--edge);border-left:1px solid var(--edge)}
.frame-mark span:nth-child(4){right:0;bottom:0;border-right:1px solid var(--edge);border-bottom:1px solid var(--edge)}
.colophon{position:absolute;z-index:4;right:clamp(34px,7.2vw,104px);bottom:clamp(32px,6vw,82px);left:clamp(34px,7.2vw,104px);display:flex;align-items:flex-end;justify-content:space-between;gap:28px}
.invitation,.copyright{margin:0;font-size:clamp(10px,.78vw,12px);font-weight:400;letter-spacing:.045em;line-height:1.6}
.invitation{display:flex;flex-direction:column;gap:3px;color:var(--quiet)}
.invitation a{width:fit-content;color:var(--soft-white);text-decoration:none;transition:color .3s ease}
.invitation a:hover{color:#ccd9ed}
.invitation a:focus-visible{outline:1px solid rgba(220,229,246,.65);outline-offset:5px}
.copyright{color:var(--quiet);text-align:right}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes fallback-drift{0%{transform:translate3d(-3%,1%,0) scale(.96) rotate(-2deg)}50%{transform:translate3d(2%,-2%,0) scale(1.08) rotate(1deg)}100%{transform:translate3d(4%,2%,0) scale(1.02) rotate(-1deg)}}
@media(max-width:600px){.installation{min-height:420px}.frame-mark{inset:22px}.colophon{right:28px;bottom:max(29px,env(safe-area-inset-bottom));left:28px;align-items:flex-end;gap:20px}.invitation,.copyright{font-size:10px}.grain{opacity:.085}}
@media(max-height:430px) and (orientation:landscape){.colophon{bottom:24px}.frame-mark{inset:18px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.fallback-art{animation:none}}