@font-face{font-family:MeridianPixel;src:url('/meridian/assets/PressStart2P.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Jost;src:url('/meridian/assets/Jost-latin.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{color-scheme:dark;font-family:Jost,sans-serif;color:#f6e4cd;background:#5b426f url('/meridian/assets/sunset/meridian-sunset-open-valley.png') center/cover no-repeat; height:100vh;height:calc(100lvh + env(safe-area-inset-top,0px) + env(safe-area-inset-bottom,0px));overflow:hidden;overscroll-behavior:none;touch-action:pinch-zoom}
*{box-sizing:border-box}body{margin:0;width:100%;height:100%;overscroll-behavior:none;touch-action:pinch-zoom}.filter-defs{position:absolute;width:0;height:0;overflow:hidden}
.arrival{height:100vh;height:100dvh;position:relative;isolation:isolate}
/* Safari clips to the document extent behind its toolbar. The root and artwork
   share a large-viewport canvas; .arrival uses the visible viewport for controls.
   Keep the canvas non-fixed and scrolling locked independently. */
.landscape{position:absolute;top:calc(0px - env(safe-area-inset-top,0px));left:0;width:100%;height:100vh;height:calc(100lvh + env(safe-area-inset-top,0px) + env(safe-area-inset-bottom,0px));object-fit:cover;object-position:50% 50%;image-rendering:pixelated;z-index:-1}
.identity{position:absolute;top:19%;left:50%;transform:translateX(-50%);width:min(92%,740px);text-align:center;pointer-events:none}
/* Source-matched outlines: no raster sampling, alpha threshold or blur. */
.wordmark{position:relative}
h1{margin:0;line-height:1}
h1 img{display:block;width:clamp(280px,77vw,430px);max-width:100%;height:auto;margin:0 auto;image-rendering:auto}
.subtitle{margin:4px 0 0;padding-left:1.15em;white-space:nowrap;font:300 9px/1 Jost,sans-serif;letter-spacing:1.15em;text-transform:uppercase;color:#f4dcc9}
.invitation{position:absolute;top:33%;left:50%;transform:translateX(-50%);text-align:center;width:max-content;max-width:calc(100% - 40px)}
.resident-link{display:flex;justify-content:center;align-items:center;gap:16px;min-width:224px;min-height:48px;padding:0 23px;background:#f3d8b6;color:#453248;font-family:MeridianPixel,monospace;font-size:10px;font-weight:400;line-height:1.4;letter-spacing:0;text-decoration:none;border:3px solid #000;border-radius:0;transition:background .18s,transform .18s;-webkit-tap-highlight-color:transparent}
.resident-link svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.3;flex:none;transition:transform .18s}
.resident-link:hover{background:#ffe7c8}.resident-link:hover svg{transform:translateX(3px)}.resident-link:active{transform:translateY(2px)}
.invitation:has(.resident-link:focus-visible){outline:2px solid #fff2d9;outline-offset:7px}.resident-link:focus-visible{outline:none}
.access-note{margin:12px 0 0;font-size:11px;font-weight:400;letter-spacing:.04em;color:#53394c}.access-note span{padding:0 5px}
@media(min-aspect-ratio:17/10){.identity{top:13%;width:min(92%,740px)}.invitation{top:30%}.landscape{object-position:50% 56%}}
@media(max-width:600px){.identity{top:20%;width:92%}.subtitle{font-size:7px;margin-top:4px}.invitation{top:33%}.resident-link{min-width:220px;min-height:46px}.access-note{font-size:10px}}
@media(max-height:580px) and (min-width:601px){.identity{top:10%;width:520px}.invitation{top:35%}}
@media(prefers-reduced-motion:reduce){.resident-link,.resident-link svg{transition:none}}

/* Safari's opaque toolbar fill can persist after sampling page content.
   Keep its edge sample transparent without painting a visible strip.
   Source: https://fantinel.dev/blog/safari-floating-url-bar-background (2026-10-07). */
.safari-toolbar-sample{display:none;position:sticky;left:0;bottom:-2px;width:100%;height:6px;background-color:transparent;z-index:999;pointer-events:none}
@supports (-webkit-touch-callout:none){.safari-toolbar-sample{display:block}}

/* Resident access: the same cream, ink and square pixel border as the invitation. */
button.resident-link{cursor:pointer}
.resident-access{position:fixed;inset:0;margin:auto;width:min(336px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:22px;border:3px solid #000;border-radius:0;background:#f3d8b6;color:#453248;box-shadow:none;text-align:center;overflow:auto}
.resident-access::backdrop{background:rgba(18,15,25,.65)}
.access-options{display:grid;gap:12px}
.access-option{display:grid;gap:9px;justify-items:center;min-height:56px;align-content:center;padding:16px 8px;border:2px solid #000;border-radius:0;text-decoration:none;color:#453248;background:transparent;-webkit-tap-highlight-color:transparent}
.access-option span{font:400 10px/1.5 MeridianPixel,monospace}
.access-download{background:#453248;color:#f3d8b6}
.access-download:hover{background:#302335}.access-community:hover{background:#ffe7c8}
.access-option:focus-visible{outline:2px solid currentColor;outline-offset:3px}
