/* Shared sign-in material, inspired by Kevin's Login V7 reference. */
body.auth-screen{--ink:#F4F6F9;--ink2:#DCE2EA;--muted:#b8c5d9;--blue-ink:#8fb1ff;--line:rgba(255,255,255,.2);background:#101721 url('/media/auth-ribbons.svg') center/cover fixed;color:var(--ink)}
.auth-screen .center{min-height:100svh;padding:48px 24px}
.auth-screen .signin,.auth-screen .login-card{position:relative;isolation:isolate;width:min(460px,100%);max-width:460px;padding:38px 30px;border:1px solid #61728c;border-radius:4px;background:rgba(24,34,49,.62);box-shadow:0 28px 90px #0008,inset 0 1px 0 #ffffff20;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.auth-screen .signin::before,.auth-screen .login-card::before{content:"";position:absolute;pointer-events:none;inset:-9px auto auto -9px;width:40px;height:40px;border-top:1px solid #8fb1ff;border-left:1px solid #8fb1ff;border-radius:20px 0 0}
.auth-screen .signin::after,.auth-screen .login-card::after{content:"";position:absolute;pointer-events:none;inset:auto -9px -9px auto;width:40px;height:40px;border-bottom:1px solid #8fb1ff;border-right:1px solid #8fb1ff;border-radius:0 0 20px}
.auth-screen h1{font-size:30px;letter-spacing:-.04em;color:#F4F6F9}
.auth-screen .brand{color:#DCE2EA;font-size:14px;padding:0 0 20px;letter-spacing:.01em}
.auth-screen .brand .mark{background:#2F6BF5;color:#ffffff;border-radius:9px}
.auth-screen .signin{gap:18px}
.auth-screen .signin>p,.auth-screen .login-card p{color:#b8c5d9;font-size:14px;line-height:1.65}
.auth-screen input{background:#ffffff08;color:#fff;border:1px solid #ffffff25;border-radius:10px;min-height:48px}
.auth-screen input:focus{outline:2px solid #5EE6BE;outline-offset:2px;border-color:transparent;box-shadow:none}
.auth-screen label{color:#DCE2EA}
.auth-screen .btn.primary{width:100%;min-height:48px;border:1px solid #74a0ff;border-radius:10px;background:linear-gradient(#2F6BF5,#1E52C7);color:#ffffff;box-shadow:0 4px 22px #2F6BF540;font-weight:700}
.auth-screen .btn.primary:hover{background:#1E52C7;color:#ffffff;transform:none}
.auth-screen .btn.google,.auth-screen .btn.ghost{background:#ffffff08;color:#DCE2EA;border-color:#ffffff29;border-radius:10px}
.auth-screen .btn.google:hover,.auth-screen .btn.ghost:hover{background:#ffffff14;color:#fff}
.auth-screen a{color:#8fb1ff}.auth-screen a:hover{color:#5EE6BE}
.auth-screen :focus-visible{outline:2px solid #8fb1ff;outline-offset:3px}
.auth-screen .err,.auth-screen .error{color:#ffa6a6}.auth-screen .ok{color:#a9ecd0}
.auth-screen .solid{background:#182231;border-color:#ffffff20}
.auth-screen .login-card{margin:9vh auto 40px}.auth-screen .login-card h1{margin-bottom:8px}
.auth-screen .brand span{color:#8fb1ff}.auth-screen .pw-toggle{color:#b8c5d9}
.auth-screen .or{color:#b8c5d9}.auth-screen .form>.btn{align-self:stretch}
.auth-foot{padding-top:10px;border-top:1px solid #ffffff20;display:flex;justify-content:space-between;gap:16px;font-size:12px}
@media(max-width:540px){.auth-screen .center{padding:32px 20px}.auth-screen .signin,.auth-screen .login-card{padding:28px 22px;border-radius:4px}.auth-screen h1{font-size:27px}.auth-screen .login-card{margin-top:5vh}.auth-screen .wrap>.top{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.auth-screen .btn.primary:hover{transform:none}.auth-screen .panel{animation:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.auth-screen .signin,.auth-screen .login-card{background:#182231}}

/* Cut corners and separate glass tabs echo the reference; colors come from site.css. */
.auth-screen .signin,.auth-screen .login-card{--auth-open:polygon(44px 0,100% 0,100% calc(100% - 44px),calc(100% - 44px) 100%,0 100%,0 44px);clip-path:var(--auth-open);background:linear-gradient(125deg,#dce2ea18,#18223170 45%,#10172188);animation:auth-reveal 280ms cubic-bezier(.23,1,.32,1) both}
.auth-screen .signin::before,.auth-screen .login-card::before{inset:0 auto auto 0;width:42px;height:42px;border:1px solid #8fb1ff88;border-radius:5px;background:linear-gradient(135deg,#dce2ea26,#18223115);clip-path:polygon(0 0,100% 0,0 100%)}
.auth-screen .signin::after,.auth-screen .login-card::after{inset:auto 0 0 auto;width:42px;height:42px;border:1px solid #8fb1ff88;border-radius:5px;background:linear-gradient(135deg,#18223115,#dce2ea26);clip-path:polygon(100% 0,100% 100%,0 100%)}
.auth-screen h1 em{font-style:normal;color:#5EE6BE}
.auth-screen .brand{padding-bottom:4px}.auth-screen .signin{gap:14px}
.auth-screen .solid{background:#18223160}
@keyframes auth-reveal{from{opacity:0}to{opacity:1}}
@media(hover:hover) and (pointer:fine){.auth-screen .btn.primary:hover{transform:translateY(-1px)}}
@media(prefers-reduced-motion:reduce){.auth-screen .signin,.auth-screen .login-card{animation:none}.auth-screen .btn.primary:hover{transform:none}}

.auth-screen [hidden]{display:none!important}

.auth-corner-flight{position:fixed;z-index:1000;pointer-events:none}
.auth-corner-flight svg{position:absolute;top:0;left:0;width:48px;height:48px;overflow:visible;fill:#dce2ea0d;stroke:#b8c5d9;stroke-width:1}
.auth-screen .corners-moving::before,.auth-screen .corners-moving::after{visibility:hidden}

/* Keep the diagonal cutouts; detached half-moons are drawn outside the clipped card. */
.auth-screen .signin,.auth-screen .login-card{clip-path:var(--auth-open);border-radius:4px}
.auth-screen .signin::before,.auth-screen .signin::after,.auth-screen .login-card::before,.auth-screen .login-card::after{display:none}
.auth-corner-flight svg{fill:#24324abf}
.auth-corner-flight[hidden]{display:none!important}

/* Complete the diagonal glass edge and seat the half-moons into the cutouts. */
.auth-screen .signin::after,.auth-screen .login-card::after{display:block;inset:0;width:100%;height:100%;border:0;border-radius:0;clip-path:none;background:linear-gradient(135deg,transparent calc(50% - .6px),#8291a6 50%,transparent calc(50% + .6px)) left top/44px 44px no-repeat,linear-gradient(135deg,transparent calc(50% - .6px),#8291a6 50%,transparent calc(50% + .6px)) right bottom/44px 44px no-repeat}
.auth-screen .corners-moving::after{visibility:visible}

/* One glass material and one 1px edge for both the panel and detached pieces. */
body.auth-screen{--auth-glass:rgba(24,34,49,.62);--auth-edge:#61728c}
.auth-screen .signin,.auth-screen .login-card{background:var(--auth-glass);border-color:transparent;box-shadow:inset 0 1px 0 #ffffff14,0 28px 90px #0008}
.auth-screen .signin::after,.auth-screen .login-card::after{display:none}
.auth-corner-flight svg{fill:var(--auth-glass);stroke:var(--auth-edge);stroke-width:1}
.auth-corner-flight .auth-panel-outline{width:100%;height:100%;fill:none;stroke:var(--auth-edge);stroke-width:1}