* {
    box-sizing: border-box;
}

:root {
    --bg: #111214;
    --panel: #1d1e21;
    --field: #2d2f34;
    --line: #36373c;
    --text: #f5f5f6;
    --muted: #92959f;
    --blue: #147cf4;
    --green: #04b85b;
    --error: #ff6670;
}

html,
body {
    margin: 0;
    min-height: 100%;
}

body {
    min-height: 100vh;

    background: var(--bg);
    color: var(--text);

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

.auth-page {
    min-height: 100vh;

    display: grid;
    place-items: center;

    padding: 20px;
}

.auth-card {
    width: min(430px, 100%);

    padding: 26px 20px;

    border-radius: 14px;

    background: var(--panel);
}

.brand {
    width: fit-content;

    margin: 0 auto 25px;

    padding: 10px 25px;

    border-radius: 7px;

    background: #242529;

    color: white;

    font-weight: 900;
    letter-spacing: .12em;
}

h1 {
    margin: 0 0 8px;

    text-align: center;

    font-size: 29px;
}

.intro {
    margin: 0 0 25px;

    text-align: center;

    color: var(--muted);

    font-size: 14px;
}

label {
    display: block;
    margin-bottom: 15px;
}

label span {
    display: block;

    margin-bottom: 7px;

    color: #aaa;

    font-size: 13px;
}

input {
    width: 100%;
    height: 50px;

    border: 1px solid var(--line);
    border-radius: 8px;

    background: var(--field);
    color: white;

    padding: 0 14px;

    outline: none;
}

input:focus {
    border-color: var(--blue);
}

form > button {
    width: 100%;
    height: 52px;

    margin-top: 4px;

    border: 0;
    border-radius: 8px;

    background: var(--blue);
    color: white;

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

    cursor: pointer;
}

.switch-link {
    margin: 22px 0 0;

    text-align: center;

    color: var(--muted);

    font-size: 14px;
}

.switch-link a {
    color: #42a0ff;

    text-decoration: none;

    font-weight: 700;
}

.error-box {
    margin-bottom: 18px;

    padding: 11px 13px;

    border-radius: 8px;

    background:
        rgba(255,102,112,.1);

    color: var(--error);

    font-size: 13px;
}