/* Login only. Slow decorative motion is separate from fast, interruptible controls. */
.apple-ui.auth-page { position:relative; isolation:isolate; overflow-x:clip; background:#e0ebf8; }
.login-atmosphere { position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
.atmosphere-band { position:absolute; width:120vw; height:34vh; left:-10vw; border-radius:50%; background:linear-gradient(180deg,transparent, rgb(0 102 214 / .2),transparent); transform:rotate(-24deg); animation:login-tide 18s cubic-bezier(.77,0,.175,1) infinite alternate; }
.band-one { top:-8%; }
.band-two { top:42%; animation-delay:-8s; opacity:.7; }
.band-three { top:80%; animation-delay:-16s; opacity:.4; }
.dark .apple-ui.auth-page { background:#0c1422; }
.dark .atmosphere-band { background:linear-gradient(180deg,transparent,rgb(22 111 238 / .25),transparent); }
.apple-ui .auth-topbar { padding:24px 40px; max-width:1360px; position:relative; z-index:1; }
.apple-ui .auth-shell { width:calc(100% - 80px); max-width:1160px; grid-template-columns:1.2fr 1fr; min-height:620px; margin:14px auto 24px; border:0; border-radius:32px; box-shadow:0 28px 80px rgb(20 35 65 / .12); overflow:hidden; background:transparent; }
.apple-ui .auth-intro { position:relative; padding:48px 48px 30px; color:#fff; background:#07397d; overflow:hidden; }
.auth-intro::before { content:""; position:absolute; width:760px; height:760px; left:-240px; top:-340px; border:1px solid rgb(191 218 255 / .18); border-radius:50%; pointer-events:none; }
.auth-intro::after { content:""; position:absolute; width:690px; height:690px; right:-490px; bottom:-420px; border:100px solid rgb(68 146 255 / .08); border-radius:50%; pointer-events:none; }
.apple-ui .auth-intro h2 { position:relative; font-size:clamp(2.6rem,4.6vw,4.3rem); color:#fff; line-height:1.02; font-weight:650; letter-spacing:-.035em; z-index:1; }
.auth-intro h2 span { display:block; }
.apple-ui .auth-intro h2 span { color:inherit; }
.apple-ui .auth-intro h2 span:last-child { color:#b8d8ff; }
.apple-ui .auth-intro>p { position:relative; color:#cee0fa; font-size:15px; line-height:1.65; margin-top:22px; max-width:38ch; z-index:1; }
.login-scene { position:relative; height:270px; margin:12px -16px 0; perspective:900px; }
.scene-depth { position:absolute; inset:0; transform:none; transform-style:preserve-3d; }
.scene-ring { position:absolute; border:1px solid rgb(182 216 255 / .23); border-radius:50%; left:50%; top:50%; margin-left:-140px; margin-top:-110px; width:280px; height:220px; animation:login-orbit 32s linear infinite; }
.ring-outer { width:370px; height:260px; margin-left:-185px; margin-top:-130px; }
.ring-inner { animation-direction:reverse; animation-duration:24s; }
.scene-ring>span { position:absolute; width:7px; height:7px; background:#94c8ff; border-radius:50%; top:22%; left:9%; }
.scene-core { position:absolute; left:50%; top:50%; width:116px; height:116px; margin:-58px 0 0 -58px; animation:login-float 8s var(--ease-out) infinite alternate; }
.core-face { width:100%; height:100%; display:grid; place-items:center; border-radius:29px; background:linear-gradient(145deg,#f9fcff,#b8d7fa); box-shadow:0 22px 36px rgb(0 20 55 / .28),inset 0 1px 1px #fff; color:#0750a4; position:relative; overflow:hidden; }
.core-face>svg { width:58px; height:58px; stroke-width:1.4; }
.core-face::after { content:""; position:absolute; inset:-30%; background:linear-gradient(110deg,transparent 38%,rgb(255 255 255 / .7) 50%,transparent 62%); transform:translateX(-100%); animation:login-specular 2200ms var(--ease-out) 350ms both; }
.scene-node { position:absolute; display:flex; align-items:center; gap:10px; padding:12px 15px 12px 12px; color:#fff; background:#165198; border-radius:17px; box-shadow:0 16px 26px rgb(0 20 55 / .24); font-size:12px; font-weight:550; animation:login-float 7s var(--ease-out) infinite alternate; }
.scene-node-icon { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; background:rgb(197 224 255 / .13); }
.scene-node svg { width:20px; height:20px; stroke-width:1.6; }
.node-ticket { left:4%; top:20%; animation-delay:-3s; }
.node-laptop { right:1%; top:33%; animation-delay:-1s; }
.node-check { left:19%; bottom:1%; animation-delay:-5s; }
.apple-ui .auth-intro-footer,.apple-ui .auth-intro-footer span { color:#cee0fa; position:relative; z-index:1; }
.apple-ui .auth-access { padding:46px 44px; background:rgb(247 251 255 / .92); backdrop-filter:blur(20px); }
.dark .apple-ui .auth-access { background:rgb(24 33 48 / .94); }
.apple-ui .auth-access-inner { max-width:354px; }
.login-access-mark { display:grid; place-items:center; width:52px; height:52px; margin-bottom:24px; border-radius:15px; background:var(--ui-selected); color:var(--ui-selected-text); }
.login-access-mark svg { width:29px; height:29px; stroke-width:1.5; }
.apple-ui .auth-access h1 { font-size:clamp(1.65rem,2.6vw,2rem); line-height:1.14; letter-spacing:-.03em; max-width:15ch; }
.apple-ui .auth-description { margin:12px 0 30px; line-height:1.6; }
.apple-ui .login-field input { min-height:54px; background:var(--ui-input); border:1px solid var(--ui-border); border-radius:14px; transition:border-color 160ms var(--ease-out),background-color 160ms var(--ease-out); caret-color:var(--ui-accent); }
.login-input-wrap>svg { transition:color 160ms var(--ease-out); top:18px; }
.login-input-wrap:focus-within>svg { color:var(--ui-accent); }
.apple-ui .login-field input:focus { background:var(--ui-surface); }
.apple-ui .login-form>button { min-height:54px; font-weight:600; border-radius:14px; transition:transform 160ms var(--ease-out),background-color 160ms var(--ease-out); }
.apple-ui .login-submit:active { transform:scale(.98); transition-duration:100ms; }
.login-submit-spinner { display:none; }
.login-submit[aria-busy="true"] .login-submit-arrow { display:none; }
.login-submit[aria-busy="true"] .login-submit-spinner { display:block; animation:login-orbit 900ms linear infinite; }
.apple-ui .auth-security { margin-top:24px; line-height:1.6; }
.apple-ui .auth-footer { max-width:1360px; padding:20px 40px; flex-wrap:wrap; gap:12px; }
.login-motion-hint { margin-left:auto; }
.auth-intro h2,.auth-intro>p,.login-scene,.auth-access-inner { animation:login-arrive 280ms var(--ease-out) both; }
.auth-intro>p { animation-delay:50ms; }
.login-scene { animation-delay:90ms; }
.auth-access-inner { animation-delay:120ms; }
.auth-page.motion-suspended .login-atmosphere *,.auth-page.motion-suspended .login-scene *,.auth-page.motion-stopped .login-atmosphere *,.auth-page.motion-stopped .login-scene * { animation-play-state:paused; }
.auth-page.motion-stopped .login-motion-hint { visibility:hidden; }
@media (hover:hover) and (pointer:fine) { .apple-ui .login-submit:not(:disabled):hover .login-submit-arrow { transform:translateX(3px); } .login-submit-arrow { transition:transform 160ms var(--ease-out); } }
@keyframes login-arrive { from { opacity:0; transform:translateY(10px) scale(.99); } to { opacity:1; transform:none; } }
@keyframes login-tide { from { transform:translate3d(-12%,-12%,0) rotate(-28deg); } to { transform:translate3d(12%,18%,0) rotate(-15deg); } }
@keyframes login-orbit { to { transform:rotate(360deg); } }
@keyframes login-float { from { transform:translate3d(0,-5px,0); } to { transform:translate3d(0,7px,0); } }
@keyframes login-specular { to { transform:translateX(100%); } }
@media (max-width:1000px) { .apple-ui .auth-shell { width:calc(100% - 48px); grid-template-columns:1fr 1fr; min-height:570px; } .apple-ui .auth-intro { padding:40px 30px 26px; } .apple-ui .auth-access { padding:40px 30px; } .scene-node { padding:9px 11px; gap:7px; } .node-ticket { left:0; } .node-laptop { right:0; } }
@media (max-width:767px) { .apple-ui .auth-topbar { padding:20px 24px; } .apple-ui .auth-shell { display:flex; flex-direction:column; max-width:480px; width:calc(100% - 32px); margin:8px auto 18px; border-radius:26px; min-height:0; } .apple-ui .auth-intro { padding:25px 26px; } .apple-ui .auth-intro h2 { font-size:2rem; } .auth-intro h2 span { display:inline; } .auth-intro h2 span+span::before { content:' '; } .apple-ui .auth-intro>p { font-size:13px; margin-top:10px; } .apple-ui .auth-intro>p br { display:none; } .login-scene { display:none; } .apple-ui .auth-intro-footer { display:none; } .apple-ui .auth-access { padding:30px 26px; } .apple-ui .auth-access-inner { max-width:none; } .login-access-mark { display:none; } .apple-ui .auth-access h1 { max-width:none; font-size:1.65rem; } .apple-ui .auth-description { margin-bottom:24px; } .apple-ui .auth-footer { padding:18px 24px; } .login-motion-hint { width:100%; margin-left:0; } }
@media (prefers-reduced-motion:reduce) { .auth-page .login-atmosphere *,.auth-page .login-scene * { animation:none; } .auth-page .auth-intro h2,.auth-page .auth-intro>p,.auth-page .login-scene,.auth-page .auth-access-inner { animation:none; } .auth-page .scene-depth { transform:none; } .auth-page .login-submit:active,.auth-page .login-submit:hover .login-submit-arrow { transform:none; } .login-motion-hint { display:none; } .auth-page .login-submit-spinner { animation:none; } }