body {

    margin: 0;

    min-height: 100vh;

    display: flex;
    justify-content: center;
    align-items: center;

    background:
        radial-gradient(circle at top left,
            rgba(79,124,255,0.25),
            transparent 30%),
        radial-gradient(circle at bottom right,
            rgba(0,212,255,0.18),
            transparent 25%),
        #0B1020;

    font-family:
        Inter,
        Segoe UI,
        sans-serif;

    overflow: hidden;
}

.login-bg {

    position: fixed;
    inset: 0;

    background:
        linear-gradient(
            135deg,
            rgba(79,124,255,0.08),
            rgba(0,212,255,0.04)
        );

    backdrop-filter: blur(20px);
}

.login-card {

    position: relative;

    width: 420px;

    padding: 42px;

    border-radius: 28px;

    background:
        linear-gradient(
            180deg,
            rgba(26,35,56,0.92),
            rgba(11,16,32,0.96)
        );

    border:
        1px solid rgba(255,255,255,0.08);

    box-shadow:
        0 20px 60px rgba(0,0,0,0.45);

    z-index: 2;
}

.login-logo {

    font-size: 38px;
    font-weight: 800;

    color: white;

    margin-bottom: 10px;
}

.login-logo span {

    color: #00D4FF;
}

.login-subtitle {

    color: #94A3B8;

    margin-bottom: 36px;

    line-height: 1.6;
}

.login-input {

    width: 100%;

    box-sizing: border-box;

    padding: 16px 18px;

    border-radius: 16px;

    border:
        1px solid rgba(255,255,255,0.08);

    background:
        rgba(255,255,255,0.04);

    color: white;

    font-size: 15px;

    margin-bottom: 18px;

    outline: none;

    transition: all 0.25s ease;
}

.login-input:focus {

    border-color:
        rgba(79,124,255,0.8);

    box-shadow:
        0 0 0 4px rgba(79,124,255,0.15);
}

.login-button {

    width: 100%;

    border: none;

    padding: 16px;

    border-radius: 16px;

    background:
        linear-gradient(
            135deg,
            #4F7CFF,
            #00D4FF
        );

    color: white;

    font-size: 16px;
    font-weight: 700;

    cursor: pointer;

    transition: all 0.25s ease;
}

.login-button:hover {

    transform: translateY(-2px);

    box-shadow:
        0 10px 30px rgba(79,124,255,0.35);
}

.login-footer {

    margin-top: 24px;

    color: #94A3B8;

    text-align: center;

    font-size: 13px;
}