/* ── Form elements ──────────────────────────────────────────────────────── */
.field          { margin-bottom: 16px; }
.field label    { display: block; font-family: 'Space Mono'; font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--mute); margin-bottom: 7px; }
.field input    { width: 100%; background: var(--field); border: 1px solid var(--line); border-radius: 12px; padding: 13px 15px; color: var(--frost); font-family: 'Archivo'; font-size: 15px; outline: none; transition: border-color .2s, box-shadow .2s; -webkit-appearance: none; }
.field input:focus       { border-color: var(--track); box-shadow: 0 0 0 3px rgba(70,224,232,.12); }
.field input::placeholder { color: var(--mute); }

.btn-primary   { display: block; width: 100%; font-family: 'Space Mono'; font-weight: 700; font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; background: var(--track); color: var(--field); border: none; border-radius: 14px; padding: 15px; cursor: pointer; transition: filter .2s; margin-top: 8px; }
.btn-primary:hover { filter: brightness(1.1); }

.btn-ghost     { display: block; width: 100%; font-family: 'Space Mono'; font-weight: 700; font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; background: transparent; color: var(--mute); border: 1px solid var(--line); border-radius: 14px; padding: 14px; cursor: pointer; transition: border-color .2s, color .2s; margin-top: 8px; text-decoration: none; text-align: center; }
.btn-ghost:hover { border-color: var(--frost); color: var(--frost); }

.alert         { border-radius: 12px; padding: 12px 15px; font-family: 'Space Mono'; font-size: 11px; margin-bottom: 16px; line-height: 1.6; }
.alert-error   { background: rgba(225,31,58,.10); border: 1px solid rgba(225,31,58,.35); color: var(--fire); }
.alert-success { background: rgba(70,224,232,.10); border: 1px solid rgba(70,224,232,.35); color: var(--track); }

/* ── Auth card layout (login / forgot-password etc.) ────────────────────── */
.auth-page {
    min-height: 100vh;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 24px 20px;
    position: relative; z-index: 1;
}
.auth-lang {
    position: fixed; top: 18px; right: 20px; z-index: 20;
}
.auth-brand {
    text-align: center; margin-bottom: 28px;
}
.auth-brand img    { width: 44px; height: 44px; margin-bottom: 12px; }
.auth-brand h1     { font-family: 'Anton'; font-weight: 400; font-size: 28px; letter-spacing: .5px; line-height: 1; }
.auth-brand h1 span { color: var(--track); }
.auth-brand p      { font-family: 'Space Mono'; font-size: 10px; color: var(--mute); letter-spacing: 1.5px; text-transform: uppercase; margin-top: 6px; }

.auth-card {
    width: 100%; max-width: 380px;
    background: var(--surface-2); border: 1px solid var(--line); border-radius: 22px;
    padding: 28px 24px;
}
.auth-card h2  { font-family: 'Anton'; font-weight: 400; font-size: 20px; letter-spacing: .5px; margin-bottom: 20px; }
.auth-footer   { margin-top: 18px; text-align: center; font-family: 'Space Mono'; font-size: 10px; color: var(--mute); letter-spacing: .5px; }
.auth-footer a { color: var(--track); text-decoration: none; }
.auth-footer a:hover { text-decoration: underline; }