:root {
    --brand: #ee8b23;
    --brand-dark: #bd5d00;
    --ink: #172033;
    --muted: #657087;
    --line: #dfe3eb;
    --danger: #b42318;
    --success: #067647;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    color: var(--ink);
    font: 15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif;
}

.auth-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background: linear-gradient(135deg, #fff4e8, #f4f6fa);
}

.auth-card {
    width: min(460px, 100%);
    padding: 34px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 20px;
    box-shadow: 0 24px 60px rgba(23, 32, 51, .12);
}

.auth-logo {
    display: block;
    width: 150px;
    max-height: 90px;
    object-fit: contain;
}

.auth-kicker {
    margin: 22px 0 0;
    color: var(--brand-dark);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

h1 { margin: 8px 0; font-size: 28px; line-height: 1.15; }
h2 { margin: 24px 0 8px; font-size: 22px; }
.auth-intro { margin: 0 0 22px; color: var(--muted); }

form { display: grid; gap: 10px; }
label { margin-top: 4px; font-size: 13px; font-weight: 700; }

input {
    width: 100%;
    padding: 12px 13px;
    color: var(--ink);
    background: #fff;
    border: 1px solid #c7cdd8;
    border-radius: 9px;
    font: inherit;
}

input:focus {
    outline: 3px solid rgba(238, 139, 35, .18);
    border-color: var(--brand);
}

button { font: inherit; cursor: pointer; }

.auth-primary {
    margin-top: 10px;
    padding: 12px 18px;
    color: #fff;
    background: var(--brand);
    border: 0;
    border-radius: 9px;
    font-weight: 750;
}

.auth-primary:hover { background: var(--brand-dark); }

.auth-link {
    justify-self: start;
    padding: 8px 0;
    color: var(--brand-dark);
    background: transparent;
    border: 0;
    font-weight: 700;
}

.auth-alert {
    margin: 20px 0;
    padding: 12px 14px;
    border-radius: 9px;
}

.auth-alert.is-error { color: var(--danger); background: #fff1f0; border: 1px solid #fecdca; }
.auth-alert.is-success { color: var(--success); background: #ecfdf3; border: 1px solid #abefc6; }

[hidden] { display: none !important; }

@media (max-width: 520px) {
    .auth-shell { padding: 14px; }
    .auth-card { padding: 24px 20px; }
}