/* A1 student auth pages. Every selector is scoped to the unique page root. */
.student-auth-page {
    min-width: 0;
    --student-auth-danger: #d93025;
    --student-auth-success: #188038;
    --student-auth-warning: #8a5a00;
}

.student-auth-page .student-auth-page__layout,
.student-auth-page .student-auth-page__account {
    display: grid;
    gap: 32px;
}

.student-auth-page .student-auth-page__layout {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 460px);
    align-items: start;
    max-width: 980px;
    margin: 0 auto;
}

.student-auth-page .student-auth-page__intro {
    padding: 34px 8px 0;
}

.student-auth-page .student-auth-page__intro h1,
.student-auth-page .student-auth-page__page-header h1,
.student-auth-page .student-auth-page__narrow h1,
.student-auth-page .student-auth-page__state h1 {
    margin: 7px 0 12px;
    color: #172033;
    font-size: clamp(28px, 4vw, 40px);
    line-height: 1.2;
}

.student-auth-page .student-auth-page__intro p,
.student-auth-page .student-auth-page__page-header p,
.student-auth-page .student-auth-page__narrow > p,
.student-auth-page .student-auth-page__state > p,
.student-auth-page .student-auth-page__card > p {
    color: #526071;
}

.student-auth-page .student-auth-page__eyebrow {
    color: #2457d6;
    font-size: 13px;
    font-weight: 750;
    letter-spacing: .08em;
}

.student-auth-page .student-auth-page__card,
.student-auth-page .student-auth-page__narrow,
.student-auth-page .student-auth-page__state {
    border: 1px solid #dfe7f3;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 16px 38px rgba(36, 50, 74, .08);
}

.student-auth-page .student-auth-page__card {
    padding: 28px;
}

.student-auth-page .student-auth-page__card h2 {
    margin: 0 0 12px;
    color: #24324a;
    font-size: 20px;
}

.student-auth-page .student-auth-page__narrow,
.student-auth-page .student-auth-page__state {
    width: min(100%, 600px);
    margin: 0 auto;
    padding: 32px;
}

.student-auth-page .student-auth-page__state {
    text-align: center;
}

.student-auth-page .student-auth-page__field {
    margin-bottom: 18px;
}

.student-auth-page .student-auth-page__field label {
    display: block;
    margin-bottom: 7px;
    color: #24324a;
    font-weight: 700;
}

.student-auth-page .student-auth-page__field input {
    width: 100%;
    min-height: 46px;
    border: 1px solid #cfd9e8;
    border-radius: 9px;
    padding: 9px 12px;
    color: #172033;
    background: #ffffff;
}

.student-auth-page .student-auth-page__field input:hover {
    border-color: #aebed5;
}

.student-auth-page .student-auth-page__field input:focus {
    border-color: #2457d6;
    box-shadow: 0 0 0 4px rgba(36, 87, 214, .12);
}

.student-auth-page .student-auth-page__registration {
    width: min(100%, 680px);
    padding: 24px;
    text-align: left;
}

.student-auth-page .student-auth-page__registration-header {
    margin-bottom: 18px;
}

.student-auth-page .student-auth-page__registration-header h1 {
    margin: 0;
    color: #172033;
    font-size: clamp(24px, 4vw, 28px);
    line-height: 1.2;
}

.student-auth-page .student-auth-page__registration-header p {
    margin: 0;
    color: #526071;
}

.student-auth-page .student-auth-page__mail-status {
    margin: 8px 0 0;
    color: #526071;
    font-size: 13px;
}

.student-auth-page .student-auth-page__mail-status {
    color: #135f2a;
}

.student-auth-page .student-auth-page__send-code {
    margin-bottom: 18px;
}

.student-auth-page .student-auth-page__code-field {
    max-width: 340px;
}

.student-auth-page .student-auth-page__registration-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 14px;
}

.student-auth-page .student-auth-page__registration .student-auth-page__field {
    min-width: 0;
    margin: 0 0 12px;
}

.student-auth-page .student-auth-page__registration .student-auth-page__field label {
    margin-bottom: 5px;
    font-size: 14px;
}

.student-auth-page .student-auth-page__registration input:not([type="hidden"]) {
    height: 44px;
    min-height: 44px;
    font-size: 16px;
}

.student-auth-page .student-auth-page__registration .student-auth-page__send-code,
.student-auth-page .student-auth-page__captcha-picture {
    width: 100%;
    height: 44px;
    margin: 8px 0 0;
    padding: 0 8px;
}

.student-auth-page .student-auth-page__captcha-picture {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dfe7f3;
    border-radius: 9px;
    background: #f1f5fb;
    cursor: pointer;
}

.student-auth-page .student-auth-page__captcha-picture img {
    width: 112px;
    height: 40px;
    max-width: 100%;
    object-fit: contain;
}

.student-auth-page .student-auth-page__captcha-picture:hover {
    border-color: #aebed5;
}

.student-auth-page .student-auth-page__captcha-picture:focus-visible {
    outline: 2px solid #2457d6;
    outline-offset: 2px;
}

.student-auth-page .student-auth-page__captcha-picture:disabled {
    opacity: .6;
    cursor: wait;
}

.student-auth-page .student-auth-page__verification-note {
    align-self: center;
    padding-bottom: 12px;
}

.student-auth-page .student-auth-page__registration .student-auth-page__password-note {
    margin: -5px 0 14px;
}

.student-auth-page .student-auth-page__registration .student-auth-page__help:empty {
    display: none;
}

.student-auth-page .student-auth-page__field--wide {
    grid-column: 1 / -1;
}

.student-auth-page .student-auth-page__help,
.student-auth-page .student-auth-page__alternate,
.student-auth-page .student-auth-page__submit-status {
    margin: 7px 0 0;
    color: #526071;
    font-size: 13px;
}

.student-auth-page .errorlist {
    margin: 7px 0 0;
    padding: 0;
    color: var(--student-auth-danger);
    font-size: 13px;
    list-style: none;
}

.student-auth-page .student-auth-page__primary,
.student-auth-page .student-auth-page__secondary {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    padding: 10px 16px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}

.student-auth-page button.student-auth-page__primary {
    width: 100%;
}

.student-auth-page .student-auth-page__primary {
    border: 1px solid #2457d6;
    color: #ffffff;
    background: #2457d6;
}

.student-auth-page .student-auth-page__primary:hover {
    border-color: #1f4fd8;
    background: #1f4fd8;
}

.student-auth-page .student-auth-page__primary[disabled] {
    border-color: #aebbd0;
    background: #aebbd0;
    cursor: wait;
}

.student-auth-page .student-auth-page__secondary {
    border: 1px solid #dfe7f3;
    color: #24324a;
    background: #f7f9fd;
}

.student-auth-page .student-auth-page__secondary--danger {
    color: var(--student-auth-danger);
}

.student-auth-page .student-auth-page__danger-form {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid #e6ebf3;
}

.student-auth-page .student-auth-page__links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-top: 20px;
}

.student-auth-page .student-auth-page__links a,
.student-auth-page .student-auth-page__alternate a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    padding-block: 8px;
    color: #2457d6;
}

.student-auth-page .student-auth-page__alert,
.student-auth-page .student-auth-page__status {
    margin: 0 0 18px;
    border: 1px solid #f3c7c2;
    border-radius: 9px;
    padding: 11px 13px;
    color: #8f2118;
    background: #fff6f5;
}

.student-auth-page .student-auth-page__alert--info {
    border-color: #c8d8f5;
    color: #244b91;
    background: #f3f7ff;
}

.student-auth-page .student-auth-page__alert--warning,
.student-auth-page .student-auth-page__status--warning {
    border-color: #f0d295;
    color: var(--student-auth-warning);
    background: #fffaf0;
}

.student-auth-page .student-auth-page__status--success {
    border-color: #b9dcc2;
    color: #135f2a;
    background: #f2fbf4;
}

.student-auth-page .student-auth-page__status--empty {
    border-color: #dfe7f3;
    color: #526071;
    background: #f7f9fd;
}

.student-auth-page .student-auth-page__handle {
    margin: 22px 0;
    overflow-wrap: anywhere;
    border: 1px dashed #9db3d4;
    border-radius: 10px;
    padding: 16px;
    color: #172033;
    background: #f7f9fd;
    font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
    font-size: clamp(16px, 4vw, 21px);
    font-weight: 750;
}

.student-auth-page .student-auth-page__state-mark {
    display: grid;
    width: 52px;
    height: 52px;
    margin: 0 auto 10px;
    place-items: center;
    border-radius: 50%;
    color: #ffffff;
    background: #5f6368;
    font-size: 24px;
    font-weight: 800;
}

.student-auth-page .student-auth-page__state-mark--success {
    background: var(--student-auth-success);
}

.student-auth-page .student-auth-page__state-mark--error,
.student-auth-page .student-auth-page__state-mark--revoked,
.student-auth-page .student-auth-page__state-mark--session-expired {
    background: var(--student-auth-danger);
}

.student-auth-page .student-auth-page__state-mark--loading {
    background: #2457d6;
}

.student-auth-page .student-auth-page__page-header {
    max-width: 760px;
}

.student-auth-page .student-auth-page__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

@media (max-width: 768px) {
    .student-auth-page .student-auth-page__layout,
    .student-auth-page .student-auth-page__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .student-auth-page .student-auth-page__intro {
        padding-top: 0;
    }

    .student-auth-page .student-auth-page__field--wide {
        grid-column: auto;
    }
}

@media (max-width: 430px) {
    .student-auth-page .student-auth-page__registration {
        padding: 16px;
    }

    .student-auth-page .student-auth-page__registration-grid {
        gap: 0 10px;
    }

    .student-auth-page .student-auth-page__registration .student-auth-page__send-code {
        font-size: 13px;
    }
    .student-auth-page .student-auth-page__layout {
        gap: 20px;
    }

    .student-auth-page .student-auth-page__card,
    .student-auth-page .student-auth-page__narrow,
    .student-auth-page .student-auth-page__state {
        border-radius: 13px;
        padding: 22px;
    }

    .student-auth-page .student-auth-page__links {
        flex-direction: column;
    }
}

@media (max-width: 360px) {
    .student-auth-page .student-auth-page__links {
        flex-direction: column;
        align-items: stretch;
    }

    .student-auth-page .student-auth-page__links a {
        width: 100%;
    }

    .student-auth-page .student-auth-page__card,
    .student-auth-page .student-auth-page__narrow,
    .student-auth-page .student-auth-page__state {
        padding: 18px;
    }
}


.student-auth-page .student-auth-page__captcha { margin: 18px 0; }
.student-auth-page .student-auth-page__captcha > label { display: block; margin-bottom: 8px; font-weight: 600; }
.student-auth-page .student-auth-page__captcha-row { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.student-auth-page .student-auth-page__captcha-row img { width: 168px; height: 60px; border: 1px solid #dfe7f3; border-radius: 8px; }
.student-auth-page .student-auth-page__captcha-row button { min-height: 44px; }

.student-site-page .student-auth-page__account { max-width: 1100px; margin: 0 auto; gap: 22px; }
.student-site-page .student-auth-page__page-header h1 { font-size: 28px; margin: 0; }
.student-site-page .student-site-page__details { display: grid; gap: 14px; margin: 20px 0; }
.student-site-page .student-site-page__details > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; }
.student-site-page .student-site-page__details dt { color: #526071; }
.student-site-page .student-site-page__details dd { margin: 0; overflow-wrap: anywhere; }
.student-site-page .student-site-page__actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.student-site-page .student-site-page__add-form { display: grid; grid-template-columns: minmax(0, 440px) auto; gap: 12px; align-items: end; justify-content: start; }
.student-site-page .student-site-page__add-form .student-auth-page__field { margin: 0; }
.student-site-page .student-site-page__add-form > .errorlist { grid-column: 1 / -1; }
.student-site-page .student-site-page__person { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; border-top: 1px solid #dfe7f3; }
.student-site-page .student-site-page__person p { margin: 4px 0 0; color: #526071; overflow-wrap: anywhere; }
.student-site-page .student-site-page__table-wrap { overflow-x: auto; }
.student-site-page .student-site-page__table { width: 100%; border-collapse: collapse; text-align: left; font-size: 14px; }
.student-site-page .student-site-page__table th { background: #f7f9fd; color: #526071; white-space: nowrap; }
.student-site-page .student-site-page__table th, .student-site-page .student-site-page__table td { padding: 12px; border-bottom: 1px solid #dfe7f3; }
@media (max-width: 600px) {
    .student-site-page .student-site-page__add-form { grid-template-columns: minmax(0, 1fr); }
    .student-site-page .student-site-page__details > div { grid-template-columns: 96px minmax(0, 1fr); }
    .student-site-page .student-site-page__person { align-items: flex-start; flex-direction: column; }
}

.student-auth-page--login .student-auth-page__layout { display: block; max-width: 460px; }
.student-auth-page--login .student-auth-page__login-title { margin: 0 0 24px; font-size: 28px; color: #172033; }