.fx-auth { min-height: 100vh; display: grid; place-items: center; padding: 1rem; position: relative; }

.fx-auth-card {
    width: 100%;
    max-width: 420px;
    padding: 2.2rem 2rem;
    border-radius: 24px;
    background: rgba(12, 16, 38, .72);
    backdrop-filter: blur(20px);
    box-shadow: 0 0 70px rgba(139, 92, 246, .28);
    animation: fx-auth-in .8s cubic-bezier(.2, .9, .2, 1) both;
}

@keyframes fx-auth-in {
    from { opacity: 0; transform: translateY(26px) scale(.95) rotateX(9deg); filter: blur(8px); }
}

.fx-auth-logo { position: relative; width: 104px; height: 104px; margin: 0 auto 1rem; display: grid; place-items: center; }
.fx-auth-logo img { width: 62px; height: 62px; }
.fx-auth-logo::before, .fx-auth-logo::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px dashed rgba(34, 230, 255, .5); animation: fx-orbit 14s linear infinite; }
.fx-auth-logo::after { inset: 9px; border: 2px solid transparent; border-top-color: var(--fx-magenta); border-bottom-color: var(--fx-violet); animation-duration: 3.4s; animation-direction: reverse; }

@keyframes fx-orbit {
    to { transform: rotate(360deg); }
}

.fx-auth-card h1 { font-family: var(--fx-display); font-size: 1.75rem; font-weight: 700; letter-spacing: .12em; text-align: center; margin: 0; }
.fx-auth-sub { min-height: 1.3em; margin: .35rem 0 1.5rem; text-align: center; font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--fx-cyan); }
.fx-auth-sub::after { content: "_"; animation: fx-blink 1s steps(1) infinite; }

@keyframes fx-blink {
    50% { opacity: 0; }
}

.fx-input { position: relative; margin-bottom: .95rem; }
.fx-input i { position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); color: var(--fx-muted); pointer-events: none; }
.fx-input input { padding-left: 2.5rem; height: 46px; }
.fx-auth-card .btn { height: 48px; font-family: var(--fx-display); letter-spacing: .12em; font-size: .85rem; }
.fx-auth-foot { margin: 1.2rem 0 0; text-align: center; font-size: .74rem; color: var(--fx-muted); }
.fx-auth-foot i { color: var(--fx-green); }
