/* The public entrance is a single frame. Workspace styles stay in app.css. */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
body.homepage{background:#183738;color:#fff;overflow:hidden}
.homepage .site-header{position:absolute;inset:0 0 auto;z-index:4;height:120px;padding:0 clamp(28px,4.5vw,80px);border:0;gap:40px;color:#fff}
.homepage .brand{gap:15px;flex-shrink:0;color:#fff;text-shadow:0 1px 12px #0004}
.homepage .brand img{width:56px;height:62px;filter:brightness(0) invert(1)}
.homepage .brand span{font-size:15px;letter-spacing:.17em;font-weight:600}
.homepage .brand small{font-size:11px;letter-spacing:.28em;margin-top:9px}
.homepage #public-nav{display:flex;align-items:center;gap:34px;margin:0;font-size:16px}
.entry-link,.entry-join{appearance:none;color:inherit;font:inherit;font-weight:500;letter-spacing:.015em;white-space:nowrap}
.entry-link{position:relative;padding:14px 0;background:none;border:0;text-shadow:0 1px 9px #0005}
.entry-link:after{content:'';position:absolute;bottom:5px;left:0;right:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
.entry-link:hover:after,.entry-link:focus-visible:after{transform:scaleX(1)}
.entry-join{padding:13px 22px;background:#fff;border:1px solid #fff;color:#183b34;border-radius:2px;transition:background .2s ease,border-color .2s ease}
.entry-join:hover{background:#e8eee8;border-color:#e8eee8}
.homepage button:focus-visible,.homepage a:focus-visible{outline:2px solid #fff;outline-offset:6px}
.homepage dialog button:focus-visible,.homepage dialog input:focus-visible,.homepage dialog a:focus-visible{outline-color:#ab7e3c}
#landing{position:relative;width:100%;height:100vh;height:100svh;min-height:420px;isolation:isolate;background:#23454a;overflow:hidden}
.film-background,.film-shade{position:absolute;inset:0;pointer-events:none}
.film-background{z-index:-2}.film-poster,.film-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:48% 44%;margin:0;max-height:none;border:0}
.film-layer{opacity:0;transition:opacity .45s linear}.film-layer.is-visible{opacity:1}.film-next{z-index:1}
.film-shade{z-index:-1;background:linear-gradient(180deg,rgba(8,26,35,.60) 0,rgba(8,26,35,.26) 100px,transparent 235px,transparent 75%,rgba(8,26,35,.16) 100%)}
.film-controls{position:absolute;right:clamp(28px,4.5vw,80px);bottom:32px;display:flex;gap:12px;align-items:center;z-index:2}
.film-toggle{position:relative;display:grid;place-items:center;width:42px;height:42px;border:1px solid #ffffff6b;border-radius:50%;color:white;background:#102f3540;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:0;transition:background .2s ease;z-index:2}
.film-toggle:hover{background:#102f3580}.film-toggle svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;fill:none;grid-area:1/1}.film-toggle .play-symbol{width:16px;height:16px;fill:currentColor;stroke:none}.film-toggle .pause-symbol{display:none}.film-toggle.is-playing .pause-symbol{display:block}.film-toggle.is-playing .play-symbol{display:none}
.homepage dialog{color:var(--ink)}.homepage dialog::backdrop{background:#071d285c;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
@media(min-width:1600px){.homepage .site-header{height:140px}.homepage .brand span{font-size:17px}.homepage .brand small{font-size:12px}.homepage #public-nav{font-size:18px;gap:40px}}
@media(max-width:1000px){.homepage .site-header{height:100px;padding:0 25px;gap:25px}.homepage .brand span{font-size:12px;letter-spacing:.13em}.homepage .brand small{font-size:9px}.homepage .brand img{width:46px;height:54px}.homepage #public-nav{gap:24px;font-size:14px}.entry-join{padding:12px 16px}}
@media(max-width:650px){.homepage .site-header{height:104px;padding:0 24px;align-items:center}.homepage .brand{gap:12px}.homepage .brand img{width:42px;height:50px}.homepage .brand span{font-size:12px;letter-spacing:.13em}.homepage .brand small{font-size:9px;letter-spacing:.23em;margin-top:8px}.homepage #public-nav{position:fixed;z-index:5;left:24px;right:24px;bottom:max(28px,env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:16px}.entry-link{padding:16px 12px;border:1px solid #ffffff8a;border-radius:2px;background:#0c2b354d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);text-shadow:none}.entry-link:after{display:none}.entry-link:hover{background:#0c2b3580}.entry-join{grid-column:1/-1;padding:14px 20px;background:#f8faf5;color:#183b34;border-color:#f8faf5}.film-poster,.film-layer{object-position:48% 44%}.film-shade{background:linear-gradient(180deg,#081a239c 0,#081a2330 130px,transparent 240px,transparent 55%,#081a23a6 100%)}.film-controls{position:static}.film-toggle{position:absolute;top:34px;right:24px;bottom:auto;width:34px;height:34px}.film-toggle svg{width:16px;height:16px}.homepage .brand span{max-width:215px;font-size:11px}#landing{min-height:460px}}
@media(max-width:365px){.homepage .site-header{padding:0 18px}.homepage .brand{gap:8px}.homepage .brand span{font-size:10px}.homepage .brand small{font-size:8px}.film-toggle{right:18px}.homepage #public-nav{left:18px;right:18px}}
@media(max-height:500px) and (min-width:651px){.homepage .site-header{height:88px}#landing{min-height:100svh}.film-shade{background:linear-gradient(180deg,#081a2399,transparent 170px)}}
@media(prefers-reduced-motion:reduce){.film-layer,.entry-link:after,.entry-join,.film-toggle{transition:none}}

#homepage-film{transition:none}

/* Account paths share one calm footer without competing primary buttons. */
.auth-actions{justify-content:space-between;gap:20px}.auth-switch{font-size:14px;line-height:1.5;color:var(--ink);text-decoration:underline;text-underline-offset:4px;max-width:60%}.auth-switch:hover{text-decoration-thickness:2px}
@media(max-width:650px){.auth-actions .button{padding:15px 18px}.auth-switch{max-width:none}.auth-actions{column-gap:14px;row-gap:18px}}
@media(max-width:365px){.homepage .brand img{width:37px}}

/* 10 October: original photographic layout, native scroll scrubs one paused film. */
body.homepage{overflow:visible;overflow-x:clip}
.homepage .site-header{position:fixed}
#landing{height:100svh;min-height:0;overflow:visible}
#landing.film-scroll{height:400svh}
.film-stage{position:sticky;top:0;height:100svh;min-height:420px;isolation:isolate;overflow:hidden}
.film-scroll-hint{margin:0;font:12px/1.5 Arial,sans-serif;color:#fff;text-shadow:0 1px 6px #0008}
.film-progress{position:absolute;bottom:0;left:0;right:0;height:2px;background:#ffffff30;pointer-events:none}
.film-progress span{display:block;height:100%;background:#fff;transform:scaleX(0);transform-origin:left}
@media(max-width:650px){.film-stage{min-height:460px}.film-scroll-hint{position:absolute;bottom:210px;left:24px;right:24px;text-align:center;font-size:11px}.homepage #preview-launcher{bottom:165px}.film-toggle{z-index:6}}
@media(max-height:500px){.film-stage{min-height:100svh}}