@font-face { font-family: IRANYekan; src: url('../dist/fonts/woff/iranyekanweblightfanum.woff') format('woff'); font-style: normal; font-weight: 300; font-display: swap; }
@font-face { font-family: IRANYekan; src: url('../dist/fonts/woff/iranyekanwebregularfanum.woff') format('woff'); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: IRANYekan; src: url('../dist/fonts/woff/iranyekanwebmediumfanum.woff') format('woff'); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: IRANYekan; src: url('../dist/fonts/woff/iranyekanwebboldfanum.woff') format('woff'); font-style: normal; font-weight: 700; font-display: swap; }
/* MudBlazor buttons and popover menus use their own typography variables. */
html:lang(fa) {
    --mud-typography-default-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-button-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-body1-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-body2-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-caption-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-overline-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-subtitle1-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-subtitle2-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-h1-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-h2-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-h3-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-h4-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-h5-family: IRANYekan, Tahoma, sans-serif;
    --mud-typography-h6-family: IRANYekan, Tahoma, sans-serif;
}
html:lang(fa) button, html:lang(fa) input, html:lang(fa) select, html:lang(fa) textarea { font-family: IRANYekan, Tahoma, sans-serif; }
body { margin: 0; background: var(--mud-palette-background); color: var(--mud-palette-text-primary); }
html[dir="rtl"] body { font-family: IRANYekan, Tahoma, sans-serif; }
html[dir="rtl"] .mud-typography, html[dir="rtl"] .mud-input { font-family: IRANYekan, Tahoma, sans-serif; }
.sts-remember { display: flex; align-items: center; gap: .5rem; }
.sts-client-logo { max-width: 100%; height: 96px; object-fit: contain; margin-bottom: 1rem; }
.sts-login-client { display: flex; align-items: center; gap: 1rem; }
.sts-login-client + .sts-login-form { padding-top: 32px; }
.sts-login-client-logo { width: 80px; height: 80px; object-fit: contain; flex-shrink: 0; }
.sts-login-client-titles { min-width: 0; overflow-wrap: anywhere; }
.sts-profile-avatar { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; }
.sts-avatar { border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.sts-avatar-file-label { display: block; margin-bottom: .5rem; }
.sts-avatar-file { display: block; max-width: 100%; }
.sts-avatar-address { display: block; overflow-wrap: anywhere; color: var(--mud-palette-primary); }
.sts-avatar-page { max-width: 1100px; margin-inline: auto; }
.sts-avatar-page-header { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.sts-avatar-page-header > div { flex: 1; min-width: 220px; }
.sts-avatar-muted { color: var(--mud-palette-text-secondary); }
.sts-avatar-preview-card { display: flex; flex-direction: column; align-items: center; text-align: center; }
.sts-avatar-preview-ring { padding: .5rem; border: 2px solid var(--mud-palette-lines-default); border-radius: 50%; background: var(--mud-palette-background); }
.sts-avatar-preview-ring .sts-avatar { display: block; }
.sts-avatar-section-heading { display: flex; align-items: center; gap: .75rem; }
.sts-avatar-upload-zone { display: flex; flex-direction: column; align-items: center; gap: .75rem; padding: 1.5rem; border: 1px dashed var(--mud-palette-lines-inputs); border-radius: var(--mud-default-borderradius); background: var(--mud-palette-background); text-align: center; }
.sts-avatar-upload-zone .sts-avatar-file-label { margin: 0; cursor: pointer; }
.sts-avatar-upload-zone .sts-avatar-file { width: 100%; max-width: 420px; min-width: 0; font: inherit; color: var(--mud-palette-text-primary); }
.sts-avatar-file::file-selector-button { margin-inline-end: .75rem; padding: .6rem .9rem; border: 1px solid var(--mud-palette-lines-inputs); border-radius: var(--mud-default-borderradius); background: var(--mud-palette-surface); color: var(--mud-palette-text-primary); font: inherit; cursor: pointer; }
.sts-avatar-file:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 4px; }
.sts-avatar-file-hints { display: flex; justify-content: center; flex-wrap: wrap; gap: .5rem 1rem; color: var(--mud-palette-text-secondary); font-size: .8rem; }
.sts-avatar-upload-actions { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.sts-avatar-upload-actions > .mud-typography { flex: 1; min-width: 180px; }
.sts-avatar-cropper { text-align: center; }
.sts-avatar-crop-frame { width: min(100%, 360px); margin-inline: auto; overflow: hidden; border-radius: 50%; border: 3px solid var(--mud-palette-primary); background: #111; touch-action: none; cursor: grab; }
.sts-avatar-crop-frame:active { cursor: grabbing; }
.sts-avatar-crop-frame canvas { display: block; width: 100%; height: auto; }
.sts-avatar-zoom { display: flex; align-items: center; justify-content: center; gap: 1rem; }
.sts-avatar-zoom input { width: min(280px, 65vw); accent-color: var(--mud-palette-primary); }
.sts-avatar-public-address { padding: .75rem 1rem; border: 1px solid var(--mud-palette-lines-default); border-radius: var(--mud-default-borderradius); background: var(--mud-palette-background); font-family: ui-monospace, Consolas, monospace; font-size: .875rem; text-align: left; }
@media (max-width: 599px) {
    .sts-avatar-upload-zone { padding: 1rem; }
    .sts-avatar-upload-actions > .mud-button-root { width: 100%; }
}
.sts-profile { max-width: 1100px; margin-inline: auto; }
.sts-passkeys-muted { color: var(--mud-palette-text-secondary); }
.sts-passkey-row { display: flex; align-items: center; gap: 1rem; padding: .75rem; border: 1px solid var(--mud-palette-lines-default); border-radius: var(--mud-default-borderradius); }
.sts-passkey-row-content { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.sts-passkey-row-actions { display: flex; align-items: center; gap: .25rem; }
.sts-passkey-name-page { max-width: 640px; margin-inline: auto; }
.sts-passkey-name-intro { display: flex; align-items: center; gap: 1rem; padding: 1rem; border-radius: var(--mud-default-borderradius); background: var(--mud-palette-primary-hover); }
.sts-passkey-name-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; }
.sts-recovery-page { max-width: 720px; margin-inline: auto; }
.sts-recovery-muted { color: var(--mud-palette-text-secondary); }
.sts-recovery-methods { display: grid; width: 100%; grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); gap: .75rem; align-items: stretch; }
.sts-recovery-method { min-width: 0; box-sizing: border-box; padding: .75rem; border: 1px solid var(--mud-palette-lines-default); border-radius: var(--mud-default-borderradius); background: var(--mud-palette-background); }
.sts-recovery-method .mud-radio { margin-inline: -.5rem; }
.sts-recovery-selected { border-color: var(--mud-palette-primary); background: color-mix(in srgb, var(--mud-palette-surface) 94%, var(--mud-palette-primary) 6%); }
.sts-recovery-section { display: flex; align-items: center; gap: .75rem; }
.sts-recovery-resend { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.sts-page-heading {
    position: sticky;
    top: calc(var(--mud-appbar-height) - var(--mud-appbar-height) / 8);
    z-index: calc(var(--mud-zindex-appbar) - 1);
    display: flex;
    align-items: center;
    gap: .5rem;
    min-width: 0;
    background-color: var(--mud-palette-background);
}
.sts-page-heading-static { position: static; }
.sts-linked-heading {
    position: sticky;
    top: calc(var(--mud-appbar-height) - var(--mud-appbar-height) / 8);
    z-index: calc(var(--mud-zindex-appbar) - 1);
    background-color: var(--mud-palette-background);
}
@media (max-width: 599px) and (orientation: landscape) {
    .sts-page-heading, .sts-linked-heading { top: calc(var(--mud-appbar-height) - var(--mud-appbar-height) / 4); }
}
@media (min-width: 600px) {
    .sts-page-heading, .sts-linked-heading { top: var(--mud-appbar-height); }
}
.sts-page-heading-title { min-width: 0; overflow-wrap: anywhere; font-size: 1.75rem; line-height: 1.35; }
@media (max-width: 599px) { .sts-page-heading-title { font-size: 1.4rem; line-height: 1.45; } }
.sts-page-back { flex-shrink: 0; width: 48px; height: 48px; margin-inline-start: -.5rem; }
.sts-linked-heading > .sts-page-heading { flex: 1; }
.sts-profile-summary { display: flex; align-items: center; flex-direction: column; text-align: center; }
.sts-profile-email { max-width: 100%; overflow-wrap: anywhere; }
.sts-profile-save { display: flex; justify-content: flex-end; padding-block: .5rem; }
.sts-profile-security-actions .mud-button-root { justify-content: flex-start; text-align: start; }
.sts-profile-security-actions .mud-button-label { justify-content: flex-start; width: 100%; }
.sts-home-dashboard { max-width: 1100px; margin-inline: auto; }
.sts-home-welcome { display: flex; align-items: center; flex-wrap: wrap; gap: 1.5rem; }
.sts-home-welcome-text { flex: 1; min-width: 180px; overflow-wrap: anywhere; }
.sts-home-public { max-width: 1100px; margin-inline: auto; text-align: center; }
.sts-home-public .mud-card { height: 100%; display: flex; flex-direction: column; }
.sts-home-public .mud-card-content { flex: 1; }
.sts-home-public .mud-card-actions { justify-content: center; }
.sts-home-guest-hero { text-align: center; border: 1px solid var(--mud-palette-lines-default); background: color-mix(in srgb, var(--mud-palette-surface) 96%, var(--mud-palette-primary) 4%); }
.sts-home-guest-hero .sts-page-heading { justify-content: center; }
.sts-home-auth-actions { display: flex; align-items: stretch; justify-content: center; gap: 1rem; }
.sts-home-auth-divider { width: 1px; align-self: stretch; background: var(--mud-palette-lines-default); }
.sts-home-guest-intro { color: var(--mud-palette-text-secondary); }
.sts-home-card { height: 100%; display: flex; flex-direction: column; }
.sts-home-card .mud-card-content { flex: 1; }
.sts-home-security-suggestions { border: 1px solid var(--mud-palette-warning); background: color-mix(in srgb, var(--mud-palette-surface) 92%, var(--mud-palette-warning) 8%); }
.sts-home-security-suggestions-heading { display: flex; align-items: center; gap: .75rem; color: var(--mud-palette-warning-darken); }
.sts-account-menu-popover { width: min(320px, calc(100vw - 24px)); border: 1px solid var(--mud-palette-lines-default); border-radius: 14px; max-height: calc(100vh - 80px); max-height: calc(100dvh - 80px); overflow-y: auto; }
.sts-account-menu-list { padding: .5rem; }
.sts-account-menu-header { display: flex; align-items: center; gap: .75rem; padding: .75rem .5rem 1rem; }
.sts-account-menu-avatar-link { display: inline-flex; flex-shrink: 0; border-radius: 50%; transition: box-shadow .15s ease, transform .15s ease; }
.sts-account-menu-avatar-link:hover { box-shadow: 0 0 0 3px color-mix(in srgb, var(--mud-palette-primary) 24%, transparent); transform: scale(1.04); }
.sts-account-menu-avatar-link:focus-visible { outline: 2px solid var(--mud-palette-primary); outline-offset: 3px; }
.sts-account-menu-identity { min-width: 0; overflow-wrap: anywhere; }
.sts-account-menu-section { padding: .75rem .75rem .375rem; color: var(--mud-palette-text-secondary); font-size: .75rem; font-weight: 500; }
.sts-account-menu-link { border-radius: 8px; min-height: 44px; text-align: start; margin-block: 2px; }
.sts-account-menu-active { background: var(--mud-palette-primary-hover); color: var(--mud-palette-primary); }
.sts-account-menu-signout { color: var(--mud-palette-error); }
.sts-personal-data { max-width: 1000px; margin-inline: auto; }
.sts-personal-data-card { display: flex; flex-direction: column; align-items: flex-start; height: 100%; }
.sts-personal-data-details { display: flex; align-items: center; gap: .5rem; color: var(--mud-palette-text-secondary); }
.sts-personal-data-danger { border: 1px solid var(--mud-palette-error); }
.sts-personal-data-action { margin-top: auto; padding-top: 1rem; }
.sts-linked-apps { max-width: 1100px; margin-inline: auto; }
.sts-security-page { max-width: 1000px; margin-inline: auto; }
.sts-twofactor-card { height: 100%; }
.sts-security-tips { padding-inline-start: 1.25rem; margin-block: 1rem; }
.sts-security-tips li { margin-block: .75rem; }
.sts-security-save { display: flex; justify-content: flex-end; }
@media (max-width: 599px) { .sts-security-save .mud-button-root { width: 100%; } }
.sts-linked-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; }
.sts-linked-empty { text-align: center; }
.sts-linked-card { height: 100%; display: flex; flex-direction: column; }
.sts-linked-brand { display: flex; align-items: flex-start; gap: 1rem; }
.sts-linked-logo { object-fit: contain; flex-shrink: 0; }
.sts-linked-logo-fallback { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; flex-shrink: 0; border-radius: 12px; background: var(--mud-palette-primary-hover); }
.sts-linked-name { min-width: 0; overflow-wrap: anywhere; }
.sts-linked-dates { display: flex; flex-wrap: wrap; gap: 1rem 2rem; }
.sts-linked-scopes { display: flex; flex-wrap: wrap; gap: .25rem; }
.sts-linked-scopes .mud-chip { max-width: 100%; height: auto; min-height: 28px; }
.sts-linked-scopes .mud-chip-content { white-space: normal; overflow-wrap: anywhere; }
.sts-linked-revoke { margin-top: auto; border-top: 1px solid var(--mud-palette-lines-default); padding-top: 1rem; }
@media (max-width: 599px) { .sts-linked-revoke .mud-button-root { width: 100%; } }
@media (max-width: 599px) { .sts-personal-data-action, .sts-personal-data-action .mud-button-root { width: 100%; } }
@media (max-width: 599px) {
    .sts-home-welcome > .mud-button-root, .sts-home-security .mud-button-root { width: 100%; }
    .sts-home-security .mud-button-root { justify-content: flex-start; text-align: start; }
    .sts-home-auth-actions { width: 100%; flex-direction: column; }
    .sts-home-auth-actions .mud-button-root { width: 100%; }
    .sts-home-auth-divider { width: 100%; height: 1px; }
}
@media (max-width: 599px) { .sts-profile-save .mud-button-root { width: 100%; } }
@media (max-width: 599px) {
    .sts-passkey-row { align-items: flex-start; flex-wrap: wrap; }
    .sts-passkey-row-content { flex-basis: calc(100% - 64px); }
    .sts-passkey-row-actions { width: 100%; justify-content: flex-end; border-top: 1px solid var(--mud-palette-lines-default); padding-top: .5rem; }
}
@media (max-width: 599px) { .sts-passkey-name-actions, .sts-passkey-name-actions .mud-button-root { width: 100%; } }
.sts-signout { width: 0; height: 0; border: 0; position: absolute; }
.sts-host { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
.sts-page-content { flex: 1 0 auto; min-width: 0; }
.sts-layout { min-height: 0; }
.sts-footer { flex-shrink: 0; margin-top: auto; background: var(--mud-palette-surface); border-top: 1px solid var(--mud-palette-lines-default); }
.sts-footer-content { max-width: 1280px; margin-inline: auto; padding: .5rem 1.5rem; padding-bottom: max(.5rem, env(safe-area-inset-bottom)); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem 1rem; font-size: .8rem; }
.sts-footer-links { display: flex; align-items: center; gap: 1rem; }
.sts-footer-links a { color: var(--mud-palette-text-secondary); text-decoration: none; }
.sts-footer-links a:hover { color: var(--mud-palette-primary); text-decoration: underline; }
.sts-language { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .5rem; margin: 0; }
.sts-language select { padding: .25rem .5rem; border: 1px solid var(--mud-palette-lines-inputs); border-radius: .375rem; background: var(--mud-palette-surface); color: var(--mud-palette-text-primary); }
.sts-error-list { margin: .25rem 0 0; padding-inline-start: 1.25rem; }
.sts-error-list li + li { margin-top: .25rem; }
.sts-public-info { max-width: 850px; margin-inline: auto; }
.sts-policy { border: 0; display: flex; gap: 1rem; margin-bottom: 1rem; padding: 0; }
.sts-private-panel { max-width: 640px; margin: 0 auto 2rem; }
.sts-private-container { padding-inline: 16px; }
.sts-recovery-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-block: 1.5rem; }
.sts-recovery-codes code, .sts-authenticator-key { display: block; padding: .75rem; text-align: center; background: var(--mud-palette-background); border: 1px solid var(--mud-palette-lines-default); border-radius: var(--mud-default-borderradius); font-size: 1.15rem; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.sts-authenticator-qr { width: fit-content; max-width: 100%; margin: 1.5rem auto; padding: 1rem; background: white; border-radius: .75rem; }
.sts-authenticator-qr img, .sts-authenticator-qr canvas { max-width: 100%; height: auto; }
.sts-code-confirmation { padding-top: 72px; }
.sts-header-brand { display: inline-flex; align-items: center; flex-shrink: 0; color: inherit; margin-inline-end: .75rem; }
.sts-header-logo { display: block; max-width: 120px; height: 40px; object-fit: contain; }
.sts-header-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mud-appbar.sts-appbar {
    background-color: var(--mud-palette-background);
    color: var(--mud-palette-text-primary);
    border-bottom: 1px solid transparent;
    transition: background-color 160ms ease, border-color 160ms ease;
}
.sts-page-scrolled .mud-appbar.sts-appbar {
    background-color: var(--mud-palette-surface);
    background-color: color-mix(in srgb, var(--mud-palette-background) 94%, var(--mud-palette-text-primary) 6%);
    border-bottom-color: var(--mud-palette-lines-default);
}
@media (prefers-reduced-motion: reduce) {
    .mud-appbar.sts-appbar { transition: none; }
}
@media (max-width: 599px) {
    .sts-login-client { gap: .75rem; }
    .sts-login-client-logo { width: 56px; height: 56px; }
    .sts-header-logo { max-width: 80px; height: 32px; }
    .sts-header-title { font-size: .875rem; }
}
.sts-login-page { max-width: 460px; margin: clamp(0rem, 3vh, 2rem) auto; }
.sts-login-intro { color: var(--mud-palette-text-secondary); margin-block: 1.5rem .75rem; line-height: 1.8; }
.sts-login-or { display: flex; align-items: center; gap: 1rem; margin-block: 1.25rem; color: var(--mud-palette-text-secondary); }
.sts-login-or::before, .sts-login-or::after { content: ""; flex: 1; border-top: 1px solid var(--mud-palette-lines-default); }
.sts-login-links { justify-content: space-between; gap: 1rem; border-top: 1px solid var(--mud-palette-lines-default); padding-top: 1.25rem; }
.sts-login-links .mud-link { display: inline-flex; align-items: center; min-height: 44px; }
.sts-captcha-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; gap: .75rem; margin-block: 1rem; }
.sts-captcha-image-wrap { display: flex; min-width: 0; overflow: hidden; border: 1px solid var(--mud-palette-lines-inputs); border-radius: var(--mud-default-borderradius); background: #f6f8fc; }
.sts-captcha-image { display: block; width: 100%; height: 56px; object-fit: cover; }
.sts-captcha-input { min-width: 0; margin: 0; }
.sts-captcha-input .mud-input-control, .sts-captcha-input .mud-input { height: 100%; }
.sts-captcha-input input { direction: ltr; text-align: center; letter-spacing: .2em; text-transform: uppercase; font-size: 1.15rem; font-weight: 600; }
@media (max-width: 599px) { .sts-login-page { width: 100%; } }
@media (max-width: 359px) { .sts-captcha-row { gap: .4rem; } .sts-captcha-image { height: 52px; } }
@media (max-width: 599px) { .sts-registration-submit { width: 100%; } }
.sts-reconnect-overlay {
    position: fixed; inset: 0; z-index: 20000; padding: 1rem;
    align-items: center; justify-content: center;
    background: rgba(15, 23, 42, .58); backdrop-filter: blur(7px);
}
#components-reconnect-modal.components-reconnect-hide { display: none; }
#components-reconnect-modal.components-reconnect-show,
#components-reconnect-modal.components-reconnect-failed,
#components-reconnect-modal.components-reconnect-rejected,
#components-reconnect-modal.components-reconnect-paused,
#components-reconnect-modal.components-reconnect-resume-failed { display: flex; }
.sts-reconnect-card {
    width: min(440px, 100%); padding: clamp(1.5rem, 5vw, 2.25rem); text-align: center;
    color: var(--mud-palette-text-primary); background: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-lines-default); border-radius: 20px;
    box-shadow: 0 24px 64px rgba(0, 0, 0, .28); animation: sts-reconnect-enter 180ms ease-out;
}
.sts-reconnect-visual { position: relative; display: grid; place-items: center; width: 72px; height: 72px; margin: 0 auto 1.25rem; color: var(--mud-palette-primary); }
.sts-reconnect-visual svg { position: relative; width: 38px; height: 38px; fill: currentColor; }
.sts-reconnect-pulse { position: absolute; inset: 0; border-radius: 50%; background: var(--mud-palette-primary-hover); animation: sts-reconnect-pulse 1.5s ease-in-out infinite; }
.sts-reconnect-state { display: none; }
.components-reconnect-show:not(.components-reconnect-retrying) .sts-reconnect-connecting,
.components-reconnect-retrying .sts-reconnect-waiting { display: block; }
.components-reconnect-failed .sts-reconnect-failure,
.components-reconnect-resume-failed .sts-reconnect-failure { display: block; }
.components-reconnect-rejected .sts-reconnect-expired,
.components-reconnect-paused .sts-reconnect-expired { display: block; }
.sts-reconnect-state h2 { margin: 0 0 .75rem; font-size: 1.25rem; font-weight: 700; }
.sts-reconnect-state p { margin: 0; color: var(--mud-palette-text-secondary); line-height: 1.8; }
.sts-reconnect-progress { height: 4px; margin-top: 1.5rem; overflow: hidden; border-radius: 999px; background: var(--mud-palette-primary-hover); }
.sts-reconnect-progress span { display: block; width: 42%; height: 100%; border-radius: inherit; background: var(--mud-palette-primary); animation: sts-reconnect-progress 1.2s ease-in-out infinite; }
.sts-reconnect-meta { margin-top: 1rem !important; font-size: .875rem; font-variant-numeric: tabular-nums; }
.sts-reconnect-actions { display: flex; justify-content: center; gap: .75rem; margin-top: 1.5rem; }
.sts-reconnect-primary, .sts-reconnect-secondary { min-height: 44px; padding: .65rem 1.25rem; border-radius: 8px; font: inherit; font-weight: 600; cursor: pointer; }
.sts-reconnect-primary { border: 1px solid var(--mud-palette-primary); color: var(--mud-palette-primary-text); background: var(--mud-palette-primary); }
.sts-reconnect-secondary { border: 1px solid var(--mud-palette-lines-inputs); color: var(--mud-palette-text-primary); background: transparent; }
.sts-reconnect-primary:focus-visible, .sts-reconnect-secondary:focus-visible { outline: 3px solid var(--mud-palette-primary-hover); outline-offset: 2px; }
.sts-reconnect-primary:disabled { opacity: .65; cursor: wait; }
@keyframes sts-reconnect-enter { from { opacity: 0; transform: translateY(12px) scale(.98); } }
@keyframes sts-reconnect-pulse { 50% { transform: scale(1.12); opacity: .55; } }
@keyframes sts-reconnect-progress { from { transform: translateX(-110%); } to { transform: translateX(250%); } }
html[dir="rtl"] .sts-reconnect-progress span { animation-direction: reverse; }
@media (max-width: 479px) { .sts-reconnect-actions { flex-direction: column; } .sts-reconnect-actions button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .sts-reconnect-card, .sts-reconnect-pulse, .sts-reconnect-progress span { animation: none; } }
.sts-otp-control { margin-block: 1rem; }
.sts-otp-digits { display: flex; gap: .5rem; justify-content: center; flex-wrap: wrap; }
.sts-otp-digit { flex: 0 0 2.75rem; width: 2.75rem; margin: 0; }
.sts-otp-digit .mud-input-slot { text-align: center; font-size: 2.5rem; font-weight: 600; line-height: 1.25; padding-inline: .25rem; font-variant-numeric: tabular-nums; }
.sts-otp-digit .mud-input > input.mud-input-root-outlined,
.sts-otp-digit div.mud-input-slot.mud-input-root-outlined { padding: 18.5px 7px; }
@media (max-width: 399px) { .sts-otp-digits { gap: .25rem; } .sts-otp-digit { flex-basis: 2.25rem; width: 2.25rem; } }
.sts-recovery-login-input input { direction: ltr; text-align: center; font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.sts-login-history-details {
    display: grid;
    grid-template-columns: minmax(5rem, auto) minmax(0, 1fr);
    gap: .5rem 1rem;
    margin: 0;
}

.sts-login-history-details dt { font-weight: 600; }
.sts-login-history-details dd { margin: 0; overflow-wrap: anywhere; }
.sts-login-history-filters { display: inline-flex; align-items: center; gap: .25rem; padding: .25rem; max-width: 100%; border: 1px solid var(--mud-palette-lines-default); border-radius: var(--mud-default-borderradius); background: var(--mud-palette-background-gray); }
.sts-login-history-filters .mud-button-root { white-space: nowrap; }
@media (max-width: 599px) { .sts-login-history-filters { display: flex; overflow-x: auto; } .sts-login-history-filters .mud-button-root { flex: 1 0 auto; } }
.sts-current-account { display: flex; align-items: center; gap: .875rem; padding: 1rem; border: 1px solid var(--mud-palette-lines-default); border-radius: var(--mud-default-borderradius); background: var(--mud-palette-background-gray); }
.sts-current-account-avatar { width: 48px; height: 48px; flex: 0 0 48px; border-radius: 50%; object-fit: cover; }
.sts-current-account-username { display: block; color: var(--mud-palette-text-secondary); direction: ltr; unicode-bidi: plaintext; }
.sts-login-client + .sts-account-chooser { padding-top: 1.5rem; }
.sts-account-chooser-intro { color: var(--mud-palette-text-secondary); font-size: .8125rem; line-height: 1.75; }