.auth-page { color: #263038; font-family: Manrope, Arial, sans-serif; }
.auth-sheet { background: #f3f3f5; padding-bottom: 100px; }
.auth-header { width: min(1280px, calc(100% - 64px)); height: 104px; margin: auto; padding: 24px 0; gap: 12px; }
.auth-header nav { gap: 14px; padding: 10px; }
.auth-header nav a { padding: 6px 16px; font: 500 16px/24px Manrope, sans-serif; }
.auth-header nav, .auth-header .language-trigger, .auth-header .language-options, .auth-header-current { color: #263038; background: #fff; box-shadow: 0 1px 4px #72727226, 0 1px 3px #8f8f8f4d; }
.auth-header .language-picker { color: #263038; }
.auth-header .language-trigger { height: 56px; }
.auth-header-current { display: grid; place-items: center; height: 56px; padding: 0 26px; border-radius: 28px; font-size: 16px; }
.auth-header .menu i { background: #263038; }
.auth-content { width: min(687px, calc(100% - 48px)); margin: 56px auto 0; }
.auth-content .visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.auth-art { display: flex; flex-direction: column; align-items: center; gap: 24px; margin-bottom: 24px; }
.auth-brand { display: flex; align-items: center; justify-content: center; gap: 24px; height: 59.1px; }
.auth-brand img { display: block; flex: none; }
.auth-community { display: block; width: 435px; height: 290px; max-width: 100%; object-fit: contain; }
.auth-form { display: flex; flex-direction: column; gap: 24px; }
.auth-fields { display: grid; gap: 16px; }
.auth-field { display: grid; gap: 6px; }
.auth-field label { font-size: 14px; line-height: 19px; font-weight: 600; }
.auth-field input { display: block; width: 100%; height: 52px; padding: 12px 16px; border: 1px solid #dde5ec; border-radius: 12px; background: #fff; color: #263038; font: 400 16px/22px Manrope, sans-serif; }
.auth-field input::placeholder { color: #7d8388; opacity: 1; }
.auth-field input:focus { outline: 2px solid #00a6fc; outline-offset: 2px; }
.auth-password { position: relative; }
.auth-password input { padding-right: 58px; }
.auth-eye { display: grid; place-items: center; position: absolute; top: 4px; right: 4px; width: 44px; height: 44px; border: 0; border-radius: 10px; background: transparent; cursor: pointer; }
.auth-eye img { display: block; }
.auth-eye[aria-pressed="true"] { background: #e6f7ff; }
.auth-links { display: flex; justify-content: flex-end; gap: 16px; font: 600 14px/19px Manrope, sans-serif; }
.auth-links a, .auth-register a { color: #008fd9; }
.auth-links .auth-create { display: none; }
.auth-actions { display: flex; flex-direction: column; gap: 4px; }
.auth-primary, .auth-provider { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 54px; padding: 12px 20px; border: 1px solid #dde5ec; border-radius: 999px; font: 600 16px/24px Manrope, sans-serif; cursor: pointer; }
.auth-primary { background: #00a6fc; border-color: #00a6fc; color: #fff; }
.auth-primary:hover { background: #0098e7; }
.auth-provider { background: #fff; color: #263038; }
.auth-provider:hover { background: #f7fbff; border-color: #a9c9dd; }
.auth-provider img { display: block; flex: none; }
.auth-apple { margin-top: 8px; }
.auth-apple img { object-fit: contain; }
.auth-divider { display: flex; align-items: center; gap: 12px; height: 18px; color: #7d8388; font-size: 13px; }
.auth-divider::before, .auth-divider::after { content: ""; height: 1px; background: #dde5ec; flex: 1; }
.auth-register { margin: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; color: #7d8388; font-size: 14px; line-height: 19px; }
.auth-register a { font-weight: 600; }
.auth-error { margin: 0; padding: 14px 16px; border: 1px solid #efc5c5; border-radius: 12px; background: #fff2f2; color: #9e2424; font-size: 14px; line-height: 1.5; }
.auth-error[hidden], .auth-google-host[hidden], .auth-provider[hidden] { display: none; }
.auth-hint { color: #7d8388; font-size: 14px; }
.auth-google-host { display: flex; justify-content: center; min-height: 54px; align-items: center; }
.auth-content [aria-busy="true"] { cursor: progress; opacity: .7; }
.auth-content button:disabled { cursor: wait; }
.auth-content a:focus-visible, .auth-content button:focus-visible, .auth-dialog :focus-visible { outline: 2px solid #008fd9; outline-offset: 4px; }
.auth-dialog { width: min(440px, calc(100% - 32px)); padding: 32px; border: 1px solid #dde5ec; border-radius: 24px; color: #263038; font-family: Manrope, sans-serif; box-shadow: 0 12px 64px #10213b33; }
.auth-dialog::backdrop { background: #10213b80; }
.auth-dialog h2 { font: 700 28px/1.2 Nunito, sans-serif; margin: 0 0 16px; }
.auth-dialog p { margin: 0 0 24px; font-size: 16px; line-height: 1.5; }
.auth-dialog-close { display: block; margin: 16px auto 0; padding: 10px 20px; border: 0; background: transparent; color: #008fd9; font: 600 14px Manrope, sans-serif; cursor: pointer; }
@media (max-width: 1200px) {
    .auth-header nav { gap: 0; }
    .auth-header nav a { padding-inline: 10px; font-size: 14px; }
    .auth-header-current { padding-inline: 18px; }
}
@media (max-width: 1000px) {
    .auth-header nav { position: static; transform: none; margin-left: auto; }
    .auth-header form { margin-left: 0; }
    .auth-header-current { display: none; }
}
@media (max-width: 900px) {
    .auth-header { width: calc(100% - 64px); height: 80px; padding: 24px 0 0; gap: 20px; }
    .auth-header nav { display: none; }
    .auth-header form { margin-left: auto; }
    .auth-header .menu { display: block; width: 48px; padding: 0; flex: none; }
    .auth-content { width: min(440px, calc(100% - 64px)); margin-top: 0; }
    .auth-art { gap: 12px; margin-bottom: 20px; }
    .auth-brand { gap: 12px; }
    .auth-fields { gap: 12px; }
    .auth-links { justify-content: space-between; }
    .auth-links .auth-create { display: inline; }
}
@media (max-width: 700px) {
    .auth-sheet { background: #fff; padding-bottom: 40px; }
    .auth-header { width: calc(100% - 32px); height: 80px; padding: 24px 0 0; gap: 20px; }
    .auth-header .logo { width: 112px; }
    .auth-header .language-trigger { width: 118px; font-size: 16px; }
    .auth-content { width: calc(100% - 48px); max-width: 440px; margin-top: 80px; }
    .auth-art { gap: 12px; margin-bottom: 24px; }
    .auth-brand { height: 43.5px; gap: 16.28px; transform: scale(.737); }
    .auth-community { width: 286px; height: 191px; }
    .auth-fields { gap: 12px; }
    .auth-links { justify-content: space-between; }
    .auth-links .auth-create { display: inline; }
    .auth-register { margin-top: 4px; }
}
@media (max-width: 370px) {
    .auth-header { gap: 8px; }
    .auth-header .logo { width: 92px; }
    .auth-header .language-trigger { width: auto; padding-inline: 14px; }
    .auth-content { width: calc(100% - 32px); }
}