/* Entrance page: the existing carousel owns image transitions. */
.login-page {
    min-height: 100svh;
    overflow-x: hidden;
    background: #273735;
    font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei UI", sans-serif;
}
.auth-scenery, .auth-scene-wash { position: fixed; inset: 0; pointer-events: none; }
.auth-scenery { overflow: hidden; isolation: isolate; background: #566c68; }
.auth-scene-layer { position: absolute; inset: 0; opacity: 0; }
.auth-scene-layer.is-current { opacity: 1; }
.auth-scene-layer img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.auth-scene-wash { background: linear-gradient(180deg, rgba(9, 24, 24, .24), rgba(9, 24, 24, .5)); }
.auth-github { position: fixed; z-index: 3; top: 25px; left: clamp(24px, 4vw, 64px); display: inline-flex; align-items: center; gap: 9px; min-height: 36px; padding: 0 11px; border: 1px solid rgba(255,255,255,.34); border-radius: 999px; color: rgba(255,255,255,.93); background: rgba(17, 28, 31, .17); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); font-size: 12px; font-weight: 500; text-decoration: none; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.auth-github svg { width: 17px; height: 17px; }
.auth-github:hover { color: #fff; background: rgba(17, 28, 31, .38); border-color: rgba(255,255,255,.63); transform: translateY(-1px); }
.auth-github:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.auth-page { position: relative; display: grid; place-items: center; min-height: 100svh; padding: 32px 24px 76px; }
.auth-hero { display: flex; flex-direction: column; align-items: center; color: #fff; text-align: center; text-shadow: 0 2px 18px rgba(8, 24, 24, .22); }
.auth-logo { width: 78px; height: 44px; margin-bottom: 19px; color: #fff; }
.auth-logo .brand-route-node { stroke: #e8b595; }
.auth-hero h1 { margin: 0; font-size: clamp(37px, 6vw, 50px); font-weight: 500; line-height: 1.2; letter-spacing: -.05em; }
.auth-open { display: grid; place-items: center; width: 48px; height: 48px; margin-top: 34px; padding: 0; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; color: #fff; background: rgba(22, 29, 35, .26); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 12px 32px rgba(0,0,0,.12), inset 0 1px rgba(255,255,255,.1); transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
.auth-open svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.auth-open:hover { color: #fff; transform: translateY(-2px); background: rgba(255,255,255,.25); box-shadow: 0 16px 40px rgba(0,0,0,.18); }
.auth-open:hover svg { transform: translateX(2px); }
.auth-open:active { transform: translateY(0); }
.auth-open:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.auth-scene-controls { display: none !important; }
.login-page .icp-footer { position: fixed; right: 0; bottom: 0; left: 0; display: flex; justify-content: center; padding: 14px 20px 20px; background: transparent; }
.login-page .icp-footer a { color: rgba(255,255,255,.8); font-size: 11px; text-decoration: none; text-shadow: 0 1px 6px rgba(0,0,0,.3); }
.login-page .icp-footer a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
@media (prefers-reduced-motion: no-preference) {
    .auth-hero, .auth-github { animation: auth-home-enter .42s ease-out both; }
    .auth-github { animation-delay: .08s; }
    .login-page.auth-leaving .auth-hero, .login-page.auth-leaving .auth-github { opacity: 0; transform: translateY(-8px); transition: opacity .2s ease, transform .2s ease; animation: none; }
    .login-page.auth-leaving .icp-footer { opacity: 0; transition: opacity .2s ease; }
}
@keyframes auth-home-enter { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 480px) { .auth-logo { width: 72px; height: 40px; } .auth-github { top: 18px; left: 18px; } }
