.auth-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 2rem 1rem;
}

.auth-card {
    position: relative;
    width: 100%;
    max-width: 460px;
    padding: 2.25rem 2rem;
    border: 1px solid var(--ac-line-accent);
    border-radius: 32px;
    background:
        radial-gradient(circle at 14% 0%, rgba(200, 255, 0, 0.16), transparent 38%),
        radial-gradient(circle at 92% 12%, rgba(0, 217, 255, 0.1), transparent 34%),
        var(--ac-grad-panel);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.48);
    backdrop-filter: blur(18px);
}

.auth-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 14%;
    right: 14%;
    height: 1px;
    background: var(--ac-grad-hairline);
}

.auth-brand {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-bottom: 1.75rem;
}

.auth-brand .app-brand-mark { width: 50px; height: 50px; font-size: 1.5rem; border-radius: 17px; }

.auth-title {
    margin-bottom: 0.35rem;
    font-size: clamp(1.8rem, 5vw, 2.3rem);
    line-height: 1;
    letter-spacing: -0.045em;
}

.auth-title span { color: var(--ac-lime); }
.auth-subtitle { margin-bottom: 1.5rem; color: var(--ac-text-dim); font-weight: 600; }

.auth-card .form-control { min-height: 54px; }
.auth-card .btn-primary { width: 100%; min-height: 54px; font-size: 1rem; font-weight: 800; }

.auth-foot { margin-top: 1.5rem; text-align: center; font-size: 0.78rem; color: var(--ac-text-faint); }

.input-icon { position: relative; }
.input-icon > .bi:first-child { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--ac-lime); pointer-events: none; }
.input-icon .form-control { padding-left: 2.8rem; }
.input-icon .toggle-visibility { position: absolute; right: 0.4rem; top: 50%; transform: translateY(-50%); color: var(--ac-text-dim); background: transparent; border: 0; padding: 0.5rem 0.7rem; border-radius: 10px; }
.input-icon .toggle-visibility:hover { color: var(--ac-lime); }