.auth-page {
    width: min(96%, 460px);
    padding: 6px 0 28px;
}

.auth-logo {
    width: 118px;
    height: 68px;
    margin: 0 auto -8px;
}

.auth-logo img {
    width: 100%;
    height: 68px;
    object-fit: contain;
}

.auth-card {
    padding: 18px 26px 24px;
}

.auth-card h1 {
    margin: 14px 0 5px;
    font-size: 28px;
}

.auth-card > p {
    margin-bottom: 12px;
}

.role-tabs {
    margin-top: 12px;
}

label {
    margin-top: 11px;
}

button {
    margin-top: 16px;
}

/* Поле и его переключатель остаются единым блоком при любой высоте окна. */
.auth-card .password-field {
    position: relative;
    display: block;
}

.auth-card .password-field input {
    width: 100%;
    padding-right: 50px;
}

.auth-card .password-field .password-toggle {
    position: absolute;
    top: 1px;
    right: 1px;
    width: 44px;
    height: calc(100% - 2px);
    min-height: 0;
    margin: 0;
    padding: 0;
    border-radius: 0 5px 5px 0;
}

.auth-card .password-toggle svg,
.registration-paper .password-toggle svg {
    display: block;
    margin: auto;
}

@media (max-width: 480px) {
    body { min-height: 100dvh; background-attachment: scroll; }
    .auth-page { width: 100%; min-height: 100dvh; padding: max(8px, env(safe-area-inset-top)) 10px max(16px, env(safe-area-inset-bottom)); }
    .auth-logo { width: 104px; height: 60px; margin-bottom: -5px; }
    .auth-logo img { height: 60px; }
    .auth-card {
        padding: 18px 18px 22px;
        border-radius: 12px;
        box-shadow: 0 10px 28px #2f180e73;
    }
    .auth-card h1 { margin-top: 8px; font-size: 29px; line-height: 1.1; }
    .auth-card > p { line-height: 1.3; }
    .role-tabs { gap: 10px; padding: 10px 12px; }
    .role-tabs label { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0; font-weight: 400; }
    .role-tabs input { width: 20px; min-height: 20px; height: 20px; margin: 0; accent-color: var(--green); }
    .auth-card input { min-height: 46px; font-size: 16px; }
    .auth-card button[type="submit"] { min-height: 48px; }
    .back { margin-top: 18px; }
}

@media (max-height: 600px) {
    .auth-page { padding-top: 4px; }
    .auth-logo { display: none; }
    .auth-card { padding: 10px 18px 18px; }
    .auth-card h1 { margin: 8px 0 3px; font-size: 22px; }
    .auth-card > p { display: none; }
    .auth-tabs a, .role-tabs a { padding: 7px 6px; }
    .role-tabs { margin: 7px 0 0; }
    .auth-card label { margin: 7px 0 4px; }
    .auth-card input { min-height: 38px; }
    .auth-card button { min-height: 40px; margin-top: 12px; }
    .auth-card .password-field .password-toggle { min-height: 0; margin: 0; }
}

/* Edge adds its own intermittent reveal control; the site uses one consistent control. */
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear {
    display: none;
}

.latin-input-error {
    margin: 8px 0 0;
    color: #a51f18;
    font-weight: 700;
}