/* Shared Zeelm surfaces. Content stays usable without decorative motion. */
.access-stage{position:relative;isolation:isolate;overflow:hidden;width:min(1560px,calc(100% - 64px));max-width:none;min-height:min(760px,calc(100dvh - 150px));margin:24px auto 48px;padding:clamp(32px,6vw,100px);grid-template-columns:minmax(0,1.25fr) minmax(310px,.75fr);gap:clamp(50px,9vw,160px);border-radius:32px;background:#07090d;color:#f5f6fa}
.login-cinema{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.login-cinema video{width:100%;height:100%;object-fit:cover;opacity:.55}
.login-cinema-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,6,10,.2) 0%,rgba(4,6,10,.45) 45%,rgba(4,6,10,.94) 73%),linear-gradient(0deg,#050609dd,transparent 70%)}
.access-stage .access-identity{align-self:center;text-align:left;position:relative;padding-bottom:90px;pointer-events:none;text-shadow:0 2px 24px #000}
.access-stage .access-identity>img{width:clamp(100px,14vw,210px);margin-left:-22px;filter:drop-shadow(0 8px 22px #0008)}
.access-stage .access-identity h1{font-size:clamp(42px,5vw,76px);margin:8px 0 0;letter-spacing:-.07em;color:#fff}
.access-stage .access-form{position:relative;width:100%;max-width:390px;justify-self:end;background:none;border:0;box-shadow:none;padding:0;color:#f5f6fa}
.access-stage .access-form h2{font-size:30px;letter-spacing:-.045em;font-weight:600;margin-bottom:30px}
.access-stage .access-form label,.access-stage .access-form .muted{color:#c8ced8}
.access-stage .access-form input:not([type="checkbox"]){color:#fff;background:#0d111abd;border:1px solid #ffffff26;min-height:50px;border-radius:10px}
.access-stage .access-form input:not([type="checkbox"]):focus-visible{outline:2px solid #bccfea;outline-offset:3px}
.access-stage .access-form .text-link{color:#d7deea}
.access-stage .access-form .primary{background:#e5edfa;color:#101621;min-height:48px}
.login-motion-toggle{position:absolute;bottom:30px;left:clamp(32px,6vw,100px);display:flex;align-items:center;gap:9px;border:0;background:#0004;color:#d3dae7;font:inherit;font-size:12px;border-radius:20px;padding:10px 14px;cursor:pointer;backdrop-filter:blur(8px)}
.login-motion-toggle::before{content:'▶';font-size:9px}.login-motion-toggle[aria-pressed="true"]::before{content:'Ⅱ'}
.signed-out .hub-atmosphere{opacity:.35}.signed-out #view{padding-bottom:0}
.access-stage{padding-top:48px;padding-bottom:66px}.login-cinema-shade{background:linear-gradient(90deg,#03050aba 0%,#03050a88 42%,#03050af2 73%),linear-gradient(0deg,#050609dd,transparent 70%)}
body[data-theme="light"] .access-stage{box-shadow:0 24px 80px #182d5420}
@media(max-width:900px){.access-stage{width:calc(100% - 32px);padding:44px;gap:38px;grid-template-columns:minmax(0,.8fr) minmax(290px,1fr)}.access-stage .access-identity>img{width:150px}.login-cinema-shade{background:linear-gradient(90deg,#03050a55,#03050add 58%)}.login-motion-toggle{left:36px}}
@media(max-width:650px){.access-stage{min-height:730px;margin:8px 16px 28px;padding:32px 24px 76px;grid-template-columns:1fr;gap:28px;align-content:center;border-radius:22px}.access-stage .access-identity{display:flex;align-items:center;gap:12px;padding:0}.access-stage .access-identity>img{width:72px;margin:0}.access-stage .access-identity h1{font-size:39px;margin:0}.access-stage .access-form{justify-self:stretch;max-width:none}.login-cinema video{object-position:45% 50%;opacity:.38}.login-cinema-shade{background:linear-gradient(0deg,#03050af5 8%,#03050acc 58%,#03050a66)}.login-motion-toggle{left:24px;bottom:22px}.access-stage .access-form h2{font-size:25px;margin-bottom:22px}}
@media(prefers-reduced-motion:reduce){.access-stage *{animation:none!important;transition:none!important}}

/* Context changes the decoration, never personal media. */
body.personal-photo-viewing .hub-atmosphere,body[data-route=pc] .hub-atmosphere{display:none}
body[data-route=music] .ambient-object-1{border-radius:50%;transform:rotate(-20deg)}
body[data-route=photos] .ambient-object-3{opacity:.28;transform:rotate(12deg)}
body[data-route=minecraft] .ambient-object-2{transform:rotate(45deg);opacity:.3}
body[data-route=assistant] .hub-atmosphere,body[data-route=admin] .hub-atmosphere{opacity:.38}
