/* Style wyłącznie dla stron logowania i resetu hasła. */
/* `height: auto` jest tu KONIECZNE, mimo że wygląda na zbędne.

   W arkuszu głównym stoi `html, body { height: 100% }`. Przy stronie
   logowania to bez znaczenia — mieści się na ekranie. Ale strona oferty
   dla klienta bywa znacznie dłuższa: treść wychodzi poza pudełko `body`,
   które dalej ma wysokość jednego ekranu, a tło maluje się WYŁĄCZNIE
   po tym pudełku. Efekt: gradient urywał się w połowie strony ostrą
   krawędzią, a niżej było gołe tło.

   `min-height` samo tego nie naprawia — ustala dolną granicę, ale nie
   zdejmuje sztywnej wysokości ustawionej wyżej. */
body.auth-page {
    display: grid; place-items: center; min-height: 100vh; height: auto;
    padding: 24px;
    background:
        radial-gradient(900px 500px at 50% -12%, rgba(217,180,74,.10), transparent 65%),
        var(--plane);
    background-repeat: no-repeat;
}
.login { width: 100%; max-width: 396px; }
.login-brand { display: flex; flex-direction: column; align-items: center;
    gap: 13px; margin-bottom: 30px; }
.login-brand .brand-mark { width: 54px; height: 54px; border-radius: 15px; font-size: 19px; }
.login-brand h1 { font-size: 21px; letter-spacing: -.02em; }
.login-brand p { margin: 3px 0 0; color: var(--ink-3); font-size: 13.5px; text-align: center; }
.field { margin-bottom: 15px; }
.field label { display: block; color: var(--ink-2); font-size: 13px;
    font-weight: 550; margin-bottom: 6px; }
.field .input { width: 100%; }
.row-between { display: flex; align-items: center; justify-content: space-between;
    margin: 4px 0 20px; font-size: 13px; }
.check { display: flex; align-items: center; gap: 8px; color: var(--ink-2); cursor: pointer; }
.check input { accent-color: var(--gold-400); width: 15px; height: 15px; }
.btn.full { width: 100%; padding: 12px; font-size: 15px; }
.alert { display: flex; gap: 10px; align-items: flex-start; padding: 11px 13px;
    border-radius: var(--r); font-size: 13.5px; margin-bottom: 18px;
    background: var(--crit-wash); border: 1px solid rgba(240,78,78,.3); color: var(--crit); }
.alert.info { background: var(--info-wash); border-color: rgba(76,154,255,.3); color: var(--info); }
.alert b { display: block; }
.alert span { color: var(--ink-2); font-weight: 400; }
.auth-page footer { margin-top: 26px; text-align: center;
    color: var(--ink-4); font-size: 12px; line-height: 1.7; }