:root {
    --auth-bg: #070a12;
    --auth-panel: rgba(15, 22, 37, .9);
    --auth-text: #f5f7fb;
    --auth-soft: #aab4c7;
    --auth-muted: #727e94;
    --auth-accent: #6c91ff;
    --auth-line: rgba(255,255,255,.1);
}

*, *::before, *::after { box-sizing: border-box; }
html { min-height: 100%; }
body {
    min-height: 100vh !important;
    height: auto !important;
    margin: 0 !important;
    padding: 36px 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--auth-text) !important;
    background:
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
        radial-gradient(circle at 50% 42%, rgba(108,145,255,.14), transparent 27rem),
        radial-gradient(circle at 76% 70%, rgba(168,140,255,.08), transparent 22rem),
        var(--auth-bg) !important;
    background-size: 48px 48px, 48px 48px, auto, auto, auto !important;
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    line-height: 1.55;
}

.login-card,
body > .card {
    position: relative;
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    margin: 0 !important;
    padding: 44px 40px 38px !important;
    border: 1px solid var(--auth-line) !important;
    border-radius: 24px !important;
    color: var(--auth-text) !important;
    background: var(--auth-panel) !important;
    box-shadow: 0 28px 80px rgba(0,0,0,.48), inset 0 1px rgba(255,255,255,.06) !important;
    text-align: left !important;
    backdrop-filter: blur(20px);
}

.auth-brand {
    margin-bottom: 30px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--auth-text);
    font-size: 14px;
    font-weight: 750;
    letter-spacing: -.025em;
    text-decoration: none;
}

.auth-brand::before {
    content: 'L';
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(108,145,255,.34);
    border-radius: 10px;
    color: #aebfff;
    background: linear-gradient(145deg, rgba(108,145,255,.18), rgba(168,140,255,.07));
    font-size: 15px;
    font-weight: 850;
}

.login-card h2,
body > .card h2 {
    margin: 0 0 9px !important;
    color: var(--auth-text) !important;
    font-size: 29px !important;
    font-weight: 730 !important;
    line-height: 1.16;
    letter-spacing: -.045em;
}

.auth-subtitle {
    margin: 0 0 28px !important;
    color: var(--auth-muted) !important;
    font-size: 14px !important;
}

.input-group { margin-bottom: 18px !important; text-align: left; }
.input-group label {
    margin-bottom: 7px !important;
    display: block;
    color: var(--auth-soft) !important;
    font-size: 13px !important;
    font-weight: 620;
}

.input-group input {
    width: 100% !important;
    min-height: 46px;
    padding: 11px 13px !important;
    border: 1px solid var(--auth-line) !important;
    border-radius: 11px !important;
    color: var(--auth-text) !important;
    background: rgba(7,10,18,.74) !important;
    font: inherit;
    outline: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.input-group input:focus {
    border-color: var(--auth-accent) !important;
    box-shadow: 0 0 0 4px rgba(108,145,255,.12);
}

.btn-primary {
    width: 100% !important;
    min-height: 46px;
    margin-top: 8px !important;
    padding: 11px 18px !important;
    border: 0 !important;
    border-radius: 11px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    background: linear-gradient(135deg, #557ef3, #775ee5) !important;
    box-shadow: 0 12px 28px rgba(82,104,226,.28), inset 0 1px rgba(255,255,255,.18);
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease;
}
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 16px 34px rgba(82,104,226,.4); }

.error,
.success {
    margin: 0 0 20px !important;
    padding: 12px 14px !important;
    border: 1px solid currentColor;
    border-radius: 11px !important;
    font-size: 13px !important;
    line-height: 1.55;
}
.error { color: #ff9898 !important; background: rgba(255,120,120,.07) !important; }
.success { color: #75e7c4 !important; background: rgba(80,227,180,.07) !important; }

.link {
    margin-top: 24px !important;
    display: block !important;
    color: #9cb2ff !important;
    font-size: 13px !important;
    font-weight: 620;
    text-align: center;
    text-decoration: none !important;
}
.link:hover { color: #fff !important; text-decoration: none !important; }

@media (max-width: 520px) {
    body { padding: 18px 14px !important; align-items: flex-start !important; }
    .login-card,
    body > .card { margin-top: 24px !important; padding: 34px 24px 30px !important; border-radius: 19px !important; }
}