:root {
    color-scheme: light;
    --auth-page-background: #f1f3f6;
    --auth-surface: #ffffff;
    --auth-text: rgba(0, 0, 0, 0.87);
    --auth-muted-text: rgba(0, 0, 0, 0.6);
    --auth-border: #cbd2dc;
    --auth-input-border: #cbd2dc;
    --auth-input-text: rgba(0, 0, 0, 0.87);
    --auth-header: #b71c1c;
    --auth-accent: #8e1111;
    --auth-primary: #b71c1c;
    --auth-danger: #f44336;
    --auth-notice: #e3e7ed;
    --auth-success: #e8f5e9;
    --auth-warning: #fff8e1;
    --auth-error: #ffebee;
    --auth-focus: #b71c1c;
    --auth-shadow: rgb(0 0 0 / 14%);
}

.auth-shell {
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--auth-page-background);
    color: var(--auth-text);
    font-family: Roboto, Helvetica, Arial, sans-serif;
}

.auth-header {
    display: flex;
    align-items: center;
    min-height: 4rem;
    padding: 0.5rem clamp(1rem, 4vw, 2rem);
    background: var(--auth-header);
}

.auth-brand {
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    color: #ffffff;
    font-size: 1.35rem;
    font-weight: 700;
    text-decoration: none;
}

.auth-main {
    width: 100%;
    padding: clamp(1rem, 4vw, 3rem);
}

.auth-main:focus {
    outline: none;
}

.auth-card {
    width: min(100%, 32rem);
    margin: 0 auto;
    padding: clamp(1.25rem, 4vw, 2rem);
    border: 1px solid var(--auth-border);
    border-radius: 0.25rem;
    background: var(--auth-surface);
    box-shadow: 0 0.5rem 1.5rem var(--auth-shadow);
}

.auth-card-wide {
    width: min(100%, 42rem);
}

.auth-management-shell {
    width: min(100%, 72rem);
    display: grid;
    grid-template-columns: minmax(13rem, 16rem) minmax(0, 1fr);
    gap: clamp(1rem, 3vw, 2rem);
    margin: 0 auto;
    align-items: start;
}

.auth-management-sidebar {
    position: sticky;
    top: 1.5rem;
    padding: 1rem;
    border: 1px solid var(--auth-border);
    border-radius: 0.25rem;
    background: var(--auth-surface);
    box-shadow: 0 0.5rem 1.5rem var(--auth-shadow);
}

.auth-management-title {
    margin: 0 0 0.75rem;
    color: var(--auth-muted-text);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.auth-management-navigation {
    display: grid;
    gap: 0.25rem;
}

.auth-management-link,
.auth-management-back {
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    padding: 0.65rem 0.75rem;
    border-radius: 0.25rem;
    color: var(--auth-text);
    font-weight: 650;
    text-decoration: none;
}

.auth-management-link:hover,
.auth-management-link.active {
    background: var(--auth-notice);
    color: var(--auth-accent);
}

.auth-management-link.active {
    box-shadow: inset 0.25rem 0 var(--auth-primary);
}

.auth-management-back {
    margin-top: 0.75rem;
    border-top: 1px solid var(--auth-border);
    border-radius: 0;
    color: var(--auth-accent);
    font-size: 0.9rem;
}

.auth-management-content,
.auth-management-content > .auth-card {
    min-width: 0;
}

.auth-management-content > .auth-card {
    width: 100%;
    margin: 0;
}

.auth-card-header {
    margin-bottom: 1.5rem;
}

.auth-card-header h1,
.auth-notice h2 {
    margin: 0 0 0.5rem;
    line-height: 1.25;
}

.auth-card-header p,
.auth-notice p {
    margin: 0;
}

.auth-eyebrow {
    margin-bottom: 0.35rem !important;
    color: var(--auth-accent);
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.auth-field,
.auth-fieldset {
    margin: 0 0 1.25rem;
}

.auth-field label,
.auth-fieldset legend {
    display: block;
    margin-bottom: 0.4rem;
    font-weight: 650;
}

.auth-input {
    box-sizing: border-box;
    width: 100%;
    min-height: 2.75rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--auth-input-border);
    border-radius: 0.25rem;
    background: var(--auth-surface);
    color: var(--auth-input-text);
    font: inherit;
}

.auth-input[aria-invalid="true"],
.auth-input.invalid {
    border-color: var(--auth-danger);
    border-width: 2px;
}

.auth-help {
    margin: 0.35rem 0 0;
    color: var(--auth-muted-text);
    font-size: 0.9rem;
}

.validation-message,
.auth-validation-summary {
    color: var(--auth-danger);
}

.validation-message {
    margin-top: 0.35rem;
    font-size: 0.9rem;
}

.auth-validation-summary:empty {
    display: none;
}

.auth-validation-summary ul {
    margin: 0 0 1.25rem;
    padding: 0.75rem 0.75rem 0.75rem 2rem;
    border-left: 0.25rem solid var(--auth-danger);
    background: var(--auth-error);
}

.auth-checkbox,
.auth-color-option {
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    gap: 0.65rem;
    cursor: pointer;
}

.auth-checkbox {
    margin-bottom: 1.25rem;
}

.auth-checkbox input,
.auth-color-option input {
    width: 1.25rem;
    height: 1.25rem;
    accent-color: var(--auth-primary);
}

.auth-fieldset {
    padding: 0;
    border: 0;
}

.auth-color-options > div {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
    gap: 0.5rem;
}

.auth-color-option {
    padding: 0.3rem 0.5rem;
    border: 1px solid var(--auth-border);
    border-radius: 0.25rem;
}

.auth-color-swatch {
    width: 1.5rem;
    height: 1.5rem;
    flex: 0 0 auto;
    border: 2px solid var(--auth-surface);
    border-radius: 50%;
    box-shadow: 0 0 0 1px var(--auth-input-border);
}

.auth-color-blue { background: #0d47a1; }
.auth-color-indigo { background: #283593; }
.auth-color-purple { background: #6a1b9a; }
.auth-color-magenta { background: #ad1457; }
.auth-color-red { background: #b71c1c; }
.auth-color-orange { background: #a43d00; }
.auth-color-green { background: #1b5e20; }
.auth-color-teal { background: #00695c; }

.auth-primary-action,
.auth-secondary-action,
.auth-danger-action {
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1rem;
    border-radius: 0.35rem;
    font: inherit;
    font-weight: 700;
    text-decoration: none;
}

.auth-form-footer {
    margin: 1.25rem 0 0;
    text-align: center;
}

.auth-text-link {
    color: var(--auth-accent);
    font-weight: 650;
    text-underline-offset: 0.18em;
}

.auth-primary-action {
    width: 100%;
    border: 2px solid var(--auth-primary);
    background: var(--auth-primary);
    color: #ffffff;
    cursor: pointer;
}

.auth-primary-action:disabled {
    cursor: wait;
    opacity: 0.7;
}

.auth-danger-zone {
    border-color: var(--auth-danger);
}

.auth-settings-section {
    margin-top: 1.25rem;
    padding: clamp(1rem, 3vw, 1.5rem);
    border: 1px solid var(--auth-border);
    border-radius: 0.25rem;
    background: var(--auth-page-background);
}

.auth-settings-section > :first-child {
    margin-top: 0;
}

.auth-settings-section > :last-child {
    margin-bottom: 0;
}

.auth-section-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.auth-section-heading h2,
.auth-section-heading p {
    margin: 0;
}

.auth-section-heading p {
    margin-top: 0.3rem;
    color: var(--auth-muted-text);
}

.auth-compact-action {
    width: auto;
    flex: 0 0 auto;
    margin-top: 0;
}

.auth-data-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    gap: 0.75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.auth-data-card {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 0.75rem;
    padding: 1rem;
    border: 1px solid var(--auth-border);
    border-radius: 0.25rem;
    background: var(--auth-surface);
}

.auth-data-card strong,
.auth-data-secondary {
    display: block;
    overflow-wrap: anywhere;
}

.auth-data-secondary {
    margin-top: 0.2rem;
    color: var(--auth-muted-text);
    font-size: 0.9rem;
}

.auth-data-card-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.auth-data-card-meta .auth-data-secondary {
    margin-top: 0;
}

.auth-status-badge {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    min-height: 1.75rem;
    padding: 0.2rem 0.55rem;
    border: 1px solid var(--auth-border);
    border-radius: 999px;
    background: var(--auth-notice);
    color: var(--auth-text);
    font-size: 0.8rem;
    font-weight: 700;
}

.auth-dialog {
    position: fixed;
    inset: 0;
    width: min(calc(100% - 2rem), 36rem);
    max-height: min(calc(100dvh - 2rem), 48rem);
    margin: auto;
    padding: 0;
    border: 1px solid var(--auth-border);
    border-radius: 0.25rem;
    background: var(--auth-surface);
    color: var(--auth-text);
    box-shadow: 0 1rem 3rem rgb(0 0 0 / 35%);
}

.auth-dialog::backdrop {
    background: rgb(15 23 42 / 70%);
    backdrop-filter: blur(0.15rem);
}

.auth-dialog-surface {
    max-height: inherit;
    overflow-y: auto;
    padding: clamp(1.25rem, 4vw, 2rem);
}

.auth-dialog-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.auth-dialog-header h2 {
    margin: 0;
}

.auth-dialog-close {
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 auto;
    border: 1px solid var(--auth-border);
    border-radius: 50%;
    background: var(--auth-surface);
    color: var(--auth-text);
    cursor: pointer;
    font: inherit;
    font-size: 1.5rem;
    line-height: 1;
}

.auth-dialog-actions {
    display: flex;
    flex-wrap: wrap-reverse;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

.auth-dialog-actions .auth-primary-action,
.auth-dialog-actions .auth-danger-action,
.auth-dialog-actions .auth-secondary-action {
    width: auto;
    margin-top: 0;
}

.auth-second-factor-step {
    padding: 1rem;
    border-left: 0.25rem solid var(--auth-primary);
    background: var(--auth-notice);
}

.auth-danger-action {
    width: 100%;
    border: 2px solid var(--auth-accent);
    background: var(--auth-surface);
    color: var(--auth-accent);
    cursor: pointer;
}

.auth-danger-action:disabled {
    cursor: wait;
    opacity: 0.7;
}

.auth-secondary-action {
    margin-top: 1rem;
    border: 2px solid var(--auth-accent);
    color: var(--auth-accent);
}

.auth-notice {
    padding: 1rem;
    border-left: 0.3rem solid var(--auth-muted-text);
    background: var(--auth-notice);
}

.auth-notice-success {
    border-color: #166534;
    background: var(--auth-success);
}

.auth-notice-warning {
    border-color: #92400e;
    background: var(--auth-warning);
}

.auth-notice-error {
    margin-bottom: 1rem;
    border-color: var(--auth-danger);
    background: var(--auth-error);
}

.auth-notice:focus,
.auth-validation-summary:focus {
    outline: 3px solid var(--auth-focus);
    outline-offset: 3px;
}

.auth-skip-link {
    position: fixed;
    z-index: 1000;
    top: 0.5rem;
    left: 0.5rem;
    padding: 0.75rem 1rem;
    transform: translateY(-200%);
    border-radius: 0.35rem;
    background: var(--auth-surface);
    color: var(--auth-accent);
    font-weight: 700;
}

.auth-skip-link:focus {
    transform: translateY(0);
}

.auth-brand:focus-visible,
.auth-management-link:focus-visible,
.auth-management-back:focus-visible,
.auth-input:focus-visible,
.auth-checkbox input:focus-visible,
.auth-color-option input:focus-visible,
.auth-primary-action:focus-visible,
.auth-secondary-action:focus-visible,
.auth-danger-action:focus-visible {
    outline: 3px solid var(--auth-focus);
    outline-offset: 3px;
}

.auth-dialog-close:focus-visible {
    outline: 3px solid var(--auth-focus);
    outline-offset: 3px;
}

.auth-text-link:focus-visible {
    border-radius: 0.2rem;
    outline: 3px solid var(--auth-focus);
    outline-offset: 3px;
}

body.auth-appearance {
    color-scheme: light;
    --auth-text: rgba(0, 0, 0, 0.87);
    --auth-muted-text: rgba(0, 0, 0, 0.6);
    --auth-input-text: rgba(0, 0, 0, 0.87);
    --auth-danger: #f44336;
    --auth-success: #e8f5e9;
    --auth-warning: #fff8e1;
    --auth-error: #ffebee;
    --auth-shadow: rgb(0 0 0 / 14%);
}

body.auth-appearance.auth-dark {
    color-scheme: dark;
    --auth-text: rgba(255, 255, 255, 0.7);
    --auth-muted-text: rgba(255, 255, 255, 0.5);
    --auth-input-text: rgba(255, 255, 255, 0.7);
    --auth-danger: #ff5252;
    --auth-success: #1b5e20;
    --auth-warning: #e65100;
    --auth-error: #b71c1c;
    --auth-shadow: rgb(0 0 0 / 20%);
}

body.auth-theme-default.auth-light {
    --auth-page-background: #f1f3f6;
    --auth-surface: #ffffff;
    --auth-border: #cbd2dc;
    --auth-input-border: #cbd2dc;
    --auth-header: #b71c1c;
    --auth-accent: #8e1111;
    --auth-primary: #b71c1c;
    --auth-notice: #e3e7ed;
    --auth-focus: #b71c1c;
}

body.auth-theme-default.auth-dark {
    --auth-page-background: #1c1c20;
    --auth-surface: #2b2b31;
    --auth-border: #4b4b54;
    --auth-input-border: #4b4b54;
    --auth-header: #b71c1c;
    --auth-accent: #ef5350;
    --auth-primary: #ef5350;
    --auth-notice: #2b2b31;
    --auth-focus: #ef5350;
}

body.auth-theme-sakura.auth-light {
    --auth-page-background: #fff7fa;
    --auth-surface: #ffffff;
    --auth-border: #c9a4b4;
    --auth-input-border: #c9a4b4;
    --auth-header: #8e244d;
    --auth-accent: #8e244d;
    --auth-primary: #8e244d;
    --auth-notice: #f7e9ef;
    --auth-focus: #8e244d;
}

body.auth-theme-sakura.auth-dark {
    --auth-page-background: #24171d;
    --auth-surface: #302129;
    --auth-border: #4f3944;
    --auth-input-border: #4f3944;
    --auth-header: #631735;
    --auth-accent: #f48fb1;
    --auth-primary: #f48fb1;
    --auth-notice: #302129;
    --auth-focus: #f48fb1;
}

body.auth-theme-indigo-night.auth-light {
    --auth-page-background: #f6f7ff;
    --auth-surface: #ffffff;
    --auth-border: #b9c1db;
    --auth-input-border: #b9c1db;
    --auth-header: #263b73;
    --auth-accent: #263b73;
    --auth-primary: #263b73;
    --auth-notice: #e9ecf8;
    --auth-focus: #263b73;
}

body.auth-theme-indigo-night.auth-dark {
    --auth-page-background: #171a2b;
    --auth-surface: #22263a;
    --auth-border: #3e4663;
    --auth-input-border: #3e4663;
    --auth-header: #17234a;
    --auth-accent: #9fa8da;
    --auth-primary: #9fa8da;
    --auth-notice: #22263a;
    --auth-focus: #9fa8da;
}

body.auth-theme-matcha.auth-light {
    --auth-page-background: #f7faf3;
    --auth-surface: #ffffff;
    --auth-border: #b7c8b2;
    --auth-input-border: #b7c8b2;
    --auth-header: #386641;
    --auth-accent: #386641;
    --auth-primary: #386641;
    --auth-notice: #e8f0e3;
    --auth-focus: #386641;
}

body.auth-theme-matcha.auth-dark {
    --auth-page-background: #18221a;
    --auth-surface: #243126;
    --auth-border: #405444;
    --auth-input-border: #405444;
    --auth-header: #24482d;
    --auth-accent: #81c784;
    --auth-primary: #81c784;
    --auth-notice: #243126;
    --auth-focus: #81c784;
}

body.auth-theme-momiji.auth-light {
    --auth-page-background: #fff8f4;
    --auth-surface: #ffffff;
    --auth-border: #d5b5a8;
    --auth-input-border: #d5b5a8;
    --auth-header: #9d341f;
    --auth-accent: #9d341f;
    --auth-primary: #9d341f;
    --auth-notice: #f8e9e1;
    --auth-focus: #9d341f;
}

body.auth-theme-momiji.auth-dark {
    --auth-page-background: #261a17;
    --auth-surface: #33231f;
    --auth-border: #574039;
    --auth-input-border: #574039;
    --auth-header: #682012;
    --auth-accent: #ff8a65;
    --auth-primary: #ff8a65;
    --auth-notice: #33231f;
    --auth-focus: #ff8a65;
}

body.auth-theme-sumi-e.auth-light {
    --auth-page-background: #fafafa;
    --auth-surface: #ffffff;
    --auth-border: #c5c5c5;
    --auth-input-border: #c5c5c5;
    --auth-header: #3c4043;
    --auth-accent: #3c4043;
    --auth-primary: #3c4043;
    --auth-notice: #eeeeee;
    --auth-focus: #3c4043;
}

body.auth-theme-sumi-e.auth-dark {
    --auth-page-background: #1d1d1d;
    --auth-surface: #292929;
    --auth-border: #4b4b4b;
    --auth-input-border: #4b4b4b;
    --auth-header: #202124;
    --auth-accent: #bdbdbd;
    --auth-primary: #bdbdbd;
    --auth-notice: #292929;
    --auth-focus: #bdbdbd;
}

body.auth-accent-sakura.auth-light {
    --auth-accent: #ad1457;
    --auth-primary: #ad1457;
    --auth-focus: #ad1457;
}

body.auth-accent-sakura.auth-dark {
    --auth-accent: #f06292;
    --auth-primary: #f06292;
    --auth-focus: #f06292;
}

body.auth-accent-aizome.auth-light {
    --auth-accent: #1a4f7a;
    --auth-primary: #1a4f7a;
    --auth-focus: #1a4f7a;
}

body.auth-accent-aizome.auth-dark {
    --auth-accent: #64b5f6;
    --auth-primary: #64b5f6;
    --auth-focus: #64b5f6;
}

body.auth-accent-matcha.auth-light {
    --auth-accent: #2e6b43;
    --auth-primary: #2e6b43;
    --auth-focus: #2e6b43;
}

body.auth-accent-matcha.auth-dark {
    --auth-accent: #81c784;
    --auth-primary: #81c784;
    --auth-focus: #81c784;
}

body.auth-accent-momiji.auth-light {
    --auth-accent: #b43c2c;
    --auth-primary: #b43c2c;
    --auth-focus: #b43c2c;
}

body.auth-accent-momiji.auth-dark {
    --auth-accent: #ff8a65;
    --auth-primary: #ff8a65;
    --auth-focus: #ff8a65;
}

body.auth-accent-kogane.auth-light {
    --auth-accent: #865600;
    --auth-primary: #865600;
    --auth-focus: #865600;
}

body.auth-accent-kogane.auth-dark {
    --auth-accent: #ffd54f;
    --auth-primary: #ffd54f;
    --auth-focus: #ffd54f;
}

body.auth-card-style-washi .auth-card,
body.auth-card-style-washi .auth-management-sidebar,
body.auth-card-style-washi .auth-data-card {
    background-image: linear-gradient(135deg, rgb(255 255 255 / 40%), transparent 42%);
}

body.auth-card-style-hanko .auth-card,
body.auth-card-style-hanko .auth-management-sidebar,
body.auth-card-style-hanko .auth-data-card {
    border-left: 0.3rem solid var(--auth-primary);
}

body.auth-card-style-seigaiha .auth-card,
body.auth-card-style-seigaiha .auth-management-sidebar,
body.auth-card-style-seigaiha .auth-data-card {
    background-image: radial-gradient(circle at 50% 100%, transparent 1.25rem, color-mix(in srgb, var(--auth-primary) 8%, transparent) 1.3rem, transparent 1.36rem);
    background-size: 2.75rem 2.75rem;
}

body.auth-card-style-sumi-brush .auth-card,
body.auth-card-style-sumi-brush .auth-management-sidebar,
body.auth-card-style-sumi-brush .auth-data-card {
    box-shadow: inset 0.32rem 0 0 color-mix(in srgb, var(--auth-primary) 70%, transparent);
}

@media (max-width: 30rem) {
    .auth-main {
        padding: 1rem 0.75rem;
    }

    .auth-card {
        padding: 1.25rem 1rem;
        border-radius: 0.5rem;
    }

    .auth-section-heading,
    .auth-dialog-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .auth-section-heading .auth-compact-action,
    .auth-dialog-actions .auth-primary-action,
    .auth-dialog-actions .auth-danger-action,
    .auth-dialog-actions .auth-secondary-action {
        width: 100%;
    }
}

@media (max-width: 48rem) {
    .auth-management-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .auth-management-sidebar {
        position: static;
    }

    .auth-management-navigation {
        grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    }
}

@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
        --auth-page-background: #121212;
        --auth-surface: #1e1e1e;
        --auth-text: #f3f4f6;
        --auth-muted-text: #d0d5dd;
        --auth-border: #667085;
        --auth-input-border: #98a2b3;
        --auth-input-text: #f9fafb;
        --auth-header: #7f1d1d;
        --auth-accent: #ffb4ab;
        --auth-primary: #dc2626;
        --auth-danger: #ffb4ab;
        --auth-notice: #29313d;
        --auth-success: #173b2a;
        --auth-warning: #473916;
        --auth-error: #4a2222;
        --auth-focus: #fbbf24;
        --auth-shadow: rgb(0 0 0 / 45%);
    }

    .auth-notice-success {
        border-color: #86efac;
    }

    .auth-notice-warning {
        border-color: #fcd34d;
    }
}

@media (forced-colors: active) {
    .auth-card,
    .auth-management-sidebar,
    .auth-settings-section,
    .auth-data-card,
    .auth-dialog,
    .auth-dialog-close,
    .auth-input,
    .auth-color-option,
    .auth-danger-action,
    .auth-secondary-action {
        border-color: CanvasText;
    }

    .auth-card,
    .auth-input,
    .auth-danger-action,
    .auth-skip-link {
        background: Canvas;
        color: CanvasText;
    }

    .auth-primary-action {
        border-color: ButtonText;
        background: ButtonFace;
        color: ButtonText;
    }

    .auth-notice,
    .auth-validation-summary ul {
        border-color: CanvasText;
        background: Canvas;
        color: CanvasText;
    }

    .auth-brand:focus-visible,
    .auth-management-link:focus-visible,
    .auth-management-back:focus-visible,
    .auth-input:focus-visible,
    .auth-checkbox input:focus-visible,
    .auth-color-option input:focus-visible,
    .auth-primary-action:focus-visible,
    .auth-secondary-action:focus-visible,
    .auth-danger-action:focus-visible,
    .auth-text-link:focus-visible,
    .auth-notice:focus,
    .auth-validation-summary:focus {
        outline-color: Highlight;
    }

    .auth-color-swatch {
        forced-color-adjust: none;
    }
}
.auth-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}