/* Account center: one content scroller, shared light/dark design tokens. */
#settings-dialog {
  width: min(1120px, calc(100vw - 64px));
  height: min(860px, calc(100dvh - 64px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--ui-border, #303238);
  border-radius: 22px;
  color: var(--ui-text, #f3f4f6);
  background: var(--ui-surface, #17191e);
  box-shadow: 0 36px 120px #0007;
}
#settings-dialog[open] { display: flex; flex-direction: column; }
#settings-dialog::backdrop { background: #07090bc2; backdrop-filter: blur(10px); }
#settings-dialog .modal-close {
  position: absolute; top: 24px; right: 24px; float: none; z-index: 5; margin: 0;
  display: grid; place-items: center; width: 36px; height: 36px;
  border: 1px solid var(--ui-border); border-radius: 10px;
  color: var(--ui-muted); background: var(--ui-surface-soft); font-size: 24px;
}
#settings-dialog .modal-close:hover { color: var(--ui-text); background: var(--ui-surface-raised); }
#settings-dialog .settings-heading {
  flex: 0 0 auto; min-height: 130px; display: block; padding: 28px 80px 25px 30px;
  border-bottom: 1px solid var(--ui-border); background: var(--ui-surface);
}
#settings-dialog .micro-label { margin: 0; color: var(--ui-subtle); font: 700 10px/1.4 var(--font-mono); letter-spacing: .14em; }
#settings-dialog .settings-heading h2 { margin: 9px 0 0; color: var(--ui-text); font-size: 27px; font-weight: 760; letter-spacing: -.055em; line-height: 1.2; }
#settings-dialog .settings-heading p:last-child { margin: 9px 0 0; color: var(--ui-muted); font-size: 13px; }
#settings-dialog .settings-layout { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 218px minmax(0, 1fr); }
#settings-dialog .settings-sidebar { min-height: 0; display: flex; flex-direction: column; padding: 25px 14px 23px; border-right: 1px solid var(--ui-border); background: var(--ui-bg); }
#settings-dialog .settings-sidebar__label { margin: 0 12px 16px; color: var(--ui-subtle); font: 700 9px/1.4 var(--font-mono); letter-spacing: .12em; }
#settings-dialog .settings-tabs { position: static; display: grid; grid-template-columns: 1fr; gap: 6px; border: 0; background: transparent; backdrop-filter: none; }
#settings-dialog .settings-tabs button {
  min-height: 68px; grid-template-columns: 32px minmax(0, 1fr); grid-template-rows: auto auto; align-content: center;
  column-gap: 10px; row-gap: 5px; padding: 12px; border: 1px solid transparent; border-radius: 10px;
  color: var(--ui-muted); background: transparent; text-align: left;
}
#settings-dialog .settings-tabs button > span { grid-column: 1; grid-row: 1 / 3; display: grid; place-items: center; color: inherit; }
#settings-dialog svg { display: block; width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#settings-dialog .settings-tabs strong { color: inherit; font: 700 13px/1.3 var(--font-sans, sans-serif); letter-spacing: -.015em; }
#settings-dialog .settings-tabs small { color: var(--ui-subtle); font-size: 10px; }
#settings-dialog .settings-tabs button:hover { color: var(--ui-text); background: var(--ui-surface-soft); }
#settings-dialog .settings-tabs button.is-active { color: var(--ui-text); background: var(--ui-surface-raised); border-color: var(--ui-border); box-shadow: 0 3px 10px #00000008; }
#settings-dialog .settings-tabs button.is-active > span { color: var(--ui-accent); }
#settings-dialog .settings-sidebar__note { margin-top: auto; padding: 35px 12px 0; color: var(--ui-subtle); }
#settings-dialog .settings-sidebar__note > span { display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid var(--ui-border); border-radius: 50%; font-size: 19px; }
#settings-dialog .settings-sidebar__note p { margin: 14px 0 20px; color: var(--ui-muted); font-size: 12px; line-height: 1.7; }
#settings-dialog .settings-sidebar__note strong { color: var(--ui-text); font-weight: 600; }
#settings-dialog .settings-sidebar__note small { font: 700 8px/1 var(--font-mono); letter-spacing: .16em; }
#settings-dialog .settings-modal__inner {
  min-width: 0; min-height: 0; height: 100%; max-height: none; overflow: auto; overscroll-behavior: contain;
  scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: var(--ui-border) transparent;
  padding: 0; background: var(--ui-surface); -webkit-overflow-scrolling: touch;
}
#settings-dialog .settings-panel { min-height: 100%; margin: 0; padding: 30px 32px 40px; border: 0; background: var(--ui-surface); }
#settings-dialog .settings-panel[hidden] { display: none !important; }
#settings-dialog .account-panel-heading { margin-bottom: 25px; }
#settings-dialog .account-panel-heading h3, #settings-dialog .security-hero h3 { margin: 7px 0 8px; color: var(--ui-text); font-size: 24px; font-weight: 740; line-height: 1.22; letter-spacing: -.045em; }
#settings-dialog .account-panel-heading p, #settings-dialog .security-hero p:last-child { margin: 0; color: var(--ui-muted); font-size: 13px; line-height: 1.65; }
#settings-dialog .field-label { display: block; margin: 18px 0 8px; color: var(--ui-text); font-size: 12px; font-weight: 650; }
#settings-dialog .field-label small { margin-left: 4px; color: var(--ui-subtle); font-size: 10px; font-weight: 400; }
#settings-dialog .field-wrap { min-height: 48px; border: 1px solid var(--ui-border); border-radius: 9px; overflow: hidden; color: var(--ui-text); background: var(--ui-bg); box-shadow: none; }
#settings-dialog .field-wrap > span { min-width: 42px; color: var(--ui-subtle); border-color: var(--ui-border); background: transparent; font-size: 10px; }
#settings-dialog .field-wrap input, #settings-dialog .field-wrap select { width: 100%; min-width: 0; color: var(--ui-text); background: transparent; font-size: 14px; }
#settings-dialog select option, #settings-dialog select optgroup { color: var(--ui-text); background: var(--ui-surface); }
#settings-dialog input::placeholder, #settings-dialog textarea::placeholder { color: var(--ui-subtle); }
#settings-dialog .field-wrap:focus-within, #settings-dialog input:focus-visible, #settings-dialog textarea:focus-visible { border-color: var(--ui-accent); outline: 2px solid color-mix(in srgb, var(--ui-accent) 18%, transparent); outline-offset: 2px; }
#settings-dialog :is(button, a, summary):focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 3px; }
#settings-dialog .settings-profile-row { grid-template-columns: 80px minmax(0, 1fr); gap: 20px; margin-bottom: 23px; padding: 20px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-bg); }
#settings-dialog .settings-avatar-preview { width: 80px; height: 80px; border: 1px solid var(--ui-border); color: var(--ui-muted); background: var(--ui-surface-raised); font-size: 18px; }
#settings-dialog .settings-profile-row .field-label { margin: 0 0 4px; font-size: 14px; }
#settings-dialog .account-field-hint { display: block; margin-bottom: 13px; color: var(--ui-muted); font-size: 11px; }
#settings-dialog input[type=file] { width: 100%; color: var(--ui-muted); font-size: 11px; }
#settings-dialog input[type=file]::file-selector-button { padding: 7px 10px; margin-right: 10px; border: 1px solid var(--ui-border); border-radius: 6px; color: var(--ui-text); background: var(--ui-surface); font-size: 11px; font-weight: 650; cursor: pointer; }
#settings-dialog .text-action { margin-top: 10px; color: var(--ui-subtle); font: 500 11px/1.4 var(--font-sans, sans-serif); text-underline-offset: 3px; }
#settings-dialog .password-change { margin-top: 22px; padding: 16px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-bg); }
#settings-dialog .password-change summary { color: var(--ui-text); font-size: 12px; font-weight: 650; }
#settings-dialog .primary-action { min-height: 46px; margin-top: 22px; padding-left: 17px; border: 1px solid var(--ui-text); border-radius: 9px; overflow: hidden; color: var(--ui-bg); background: var(--ui-text); box-shadow: none; font: 700 13px/1.3 var(--font-sans, sans-serif); letter-spacing: 0; }
#settings-dialog .primary-action b { width: 46px; border-left-color: color-mix(in srgb, var(--ui-bg) 22%, transparent); font-size: 18px; }
#settings-dialog .primary-action:hover { opacity: .88; }
#settings-dialog .form-status { min-height: 0; margin: 12px 0 0; color: var(--ui-muted); font-size: 12px; }
#settings-dialog .form-status:empty { display: none; }
#settings-dialog .windows-download-card { grid-template-columns: 44px minmax(0, 1fr); gap: 12px 14px; margin: 30px 0 0; padding: 20px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-bg); }
#settings-dialog .windows-download-icon { width: 44px; height: 44px; border: 1px solid var(--ui-border); border-radius: 10px; color: var(--ui-text); background: var(--ui-surface-raised); font-size: 9px; }
#settings-dialog .windows-download-card > div > small { color: var(--ui-subtle); font-size: 8px; letter-spacing: .08em; }
#settings-dialog .windows-download-card > div > strong { margin: 5px 0 6px; color: var(--ui-text); font-size: 15px; }
#settings-dialog .windows-download-card > div > p { color: var(--ui-muted); font-size: 12px; line-height: 1.55; }
#settings-dialog .windows-download-card > a { grid-column: 2; justify-self: start; display: flex; align-items: center; gap: 16px; min-height: 40px; padding: 11px 13px; border: 1px solid var(--ui-border); color: var(--ui-text); background: var(--ui-surface-raised); font: 650 12px/1.3 var(--font-sans, sans-serif); letter-spacing: 0; white-space: normal; }
#settings-dialog .windows-download-card > a:hover { border-color: var(--ui-accent); }
#settings-dialog .windows-download-card > small:last-child { grid-column: 2; margin: 0; color: var(--ui-subtle); font-size: 10px; line-height: 1.5; text-align: left; }
#settings-dialog .security-hero { display: block; }
#settings-dialog .security-hero > header { padding: 0; }
#settings-dialog .security-summary { min-height: 68px; display: grid; gap: 5px; margin-top: 22px; padding: 15px 18px; border: 1px solid var(--ui-border); border-left-width: 3px; border-radius: 9px; background: var(--ui-bg); }
#settings-dialog .security-summary strong { color: var(--ui-text); font-size: 10px; letter-spacing: .08em; }
#settings-dialog .security-summary span { color: var(--ui-muted); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
#settings-dialog .security-summary.is-protected { border-left-color: var(--ui-success); background: color-mix(in srgb, var(--ui-success) 5%, var(--ui-bg)); }
#settings-dialog .security-summary.is-protected strong { color: var(--ui-success); }
#settings-dialog .security-summary.is-warning { border-left-color: var(--ui-warning); background: color-mix(in srgb, var(--ui-warning) 5%, var(--ui-bg)); }
#settings-dialog .security-summary.is-warning strong { color: var(--ui-warning); }
#settings-dialog .security-password-gate { display: grid; grid-template-columns: 1fr; gap: 15px; margin-top: 18px; padding: 18px; border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-bg); box-shadow: none; }
#settings-dialog .security-password-copy { grid-template-columns: 33px minmax(0, 1fr); gap: 10px; }
#settings-dialog .security-password-copy > span { width: 33px; height: 33px; border: 0; border-radius: 8px; color: var(--ui-muted); background: var(--ui-surface-soft); }
#settings-dialog .security-password-copy svg { width: 18px; height: 18px; }
#settings-dialog .security-password-copy strong { color: var(--ui-text); font-size: 12px; }
#settings-dialog .security-password-copy small { margin-top: 3px; color: var(--ui-muted); font-size: 11px; line-height: 1.5; }
#settings-dialog .security-password-control > label { color: var(--ui-muted); font-size: 11px; }
#settings-dialog .security-password-control > small { margin-top: 7px; color: var(--ui-subtle); font-size: 10px; }
#settings-dialog .security-group-heading { align-items: center; margin-top: 29px; padding: 0 0 14px; border-color: var(--ui-border); }
#settings-dialog .security-group-heading h4 { margin: 0; color: var(--ui-text); font-size: 16px; letter-spacing: -.02em; }
#settings-dialog .security-group-heading p { margin: 5px 0 0; color: var(--ui-muted); font-size: 12px; }
#settings-dialog .security-group-heading > span { color: var(--ui-subtle); font-size: 8px; letter-spacing: .08em; }
#settings-dialog .security-method-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 14px; margin-top: 16px; }
#settings-dialog .security-method-card { align-self: stretch; padding: 18px; border: 1px solid var(--ui-border); border-radius: 12px; color: var(--ui-text); background: var(--ui-bg); box-shadow: none; }
#settings-dialog .security-method-card:hover { border-color: color-mix(in srgb, var(--ui-muted) 55%, var(--ui-border)); box-shadow: none; }
#settings-dialog .security-method-card.is-configured { border-color: color-mix(in srgb, var(--ui-success) 35%, var(--ui-border)); box-shadow: none; }
#settings-dialog .security-method-card.is-unavailable { opacity: 1; }
#settings-dialog .security-method-card.is-recommended:not(.is-configured)::before { display: none; }
#settings-dialog .security-method-head { min-height: 0; grid-template-columns: 35px minmax(0, 1fr); gap: 8px 11px; margin-bottom: 16px; }
#settings-dialog .security-method-icon { width: 35px; height: 35px; border: 1px solid var(--ui-border); border-radius: 9px; color: var(--ui-muted); background: var(--ui-surface); font-size: 13px; }
#settings-dialog .security-method-icon svg { width: 18px; height: 18px; }
#settings-dialog .security-method-icon.is-discord { color: #fff; border-color: #6370e8; background: #5865f2; }
#settings-dialog .security-method-head strong { color: var(--ui-text); font-size: 13px; font-weight: 700; line-height: 1.4; }
#settings-dialog .security-method-head small { margin-top: 5px; color: var(--ui-muted); font-size: 11px; line-height: 1.55; }
#settings-dialog .security-method-head em { grid-column: 2; width: fit-content; padding: 5px 7px; border: 1px solid var(--ui-border); color: var(--ui-subtle); background: var(--ui-surface); font-size: 8px; letter-spacing: .035em; }
#settings-dialog .security-method-card.is-configured .security-method-head em { color: var(--ui-success); border-color: color-mix(in srgb, var(--ui-success) 25%, var(--ui-border)); background: color-mix(in srgb, var(--ui-success) 8%, var(--ui-bg)); }
#settings-dialog .security-method-card .field-label { margin-top: 0; margin-bottom: 8px; font-size: 11px; }
#settings-dialog .security-method-card > input, #settings-dialog .totp-setup-panel input, #settings-dialog #email-setup-panel input { min-height: 43px; width: 100%; margin: 0; padding: 11px 12px; border: 1px solid var(--ui-border); border-radius: 8px; color: var(--ui-text); background: var(--ui-surface); font-size: 13px; }
#settings-dialog .secondary-submit { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 43px; margin-top: 12px; padding: 11px 12px; border: 1px solid var(--ui-border); border-radius: 8px; color: var(--ui-text); background: var(--ui-surface-raised); font: 650 12px/1.45 var(--font-sans, sans-serif); letter-spacing: 0; }
#settings-dialog .secondary-submit:hover { border-color: var(--ui-muted); background: var(--ui-surface-soft); }
#settings-dialog .secondary-submit:disabled { cursor: not-allowed; opacity: .5; }
#settings-dialog .security-method-head + .secondary-submit { margin-top: auto; }
#settings-dialog .security-device-list { margin-top: 14px; }
#settings-dialog .security-device { align-items: center; gap: 10px; padding-top: 12px; border-color: var(--ui-border); }
#settings-dialog .security-device strong { display: block; color: var(--ui-text); font-size: 11px; line-height: 1.4; }
#settings-dialog .security-device small, #settings-dialog .security-empty { display: block; margin-top: 4px; color: var(--ui-subtle); font-size: 10px; line-height: 1.55; }
#settings-dialog .security-device button { flex: 0 0 auto; min-height: 32px; padding: 8px; border-color: var(--ui-border); color: var(--ui-danger); background: transparent; font-size: 8px; }
#settings-dialog .security-remove { min-height: 36px; margin-top: 8px; color: var(--ui-danger); font-size: 11px; text-underline-offset: 4px; }
#settings-dialog .totp-setup-panel, #settings-dialog #email-setup-panel { border-color: var(--ui-border); }
#settings-dialog .totp-setup-panel code { color: var(--ui-muted); font-size: 12px; line-height: 1.8; }
#settings-dialog .totp-setup-panel .field-label, #settings-dialog #email-setup-panel .field-label { margin-top: 16px; }
#settings-dialog .recovery-method-card { grid-column: 1 / -1; }
#settings-dialog .recovery-method-card .security-method-head { grid-template-columns: 35px minmax(0, 1fr) auto; margin-bottom: 0; }
#settings-dialog .recovery-method-card .security-method-head em { grid-column: auto; }
#settings-dialog .recovery-method-action { margin-top: 16px; padding-top: 14px; gap: 22px; border-color: var(--ui-border); }
#settings-dialog .recovery-method-action p { color: var(--ui-muted); font-size: 11px; line-height: 1.6; }
#settings-dialog .recovery-method-action .secondary-submit { width: auto; min-width: 145px; margin: 0; }
#settings-dialog .security-settings > .form-status { position: sticky; bottom: 0; margin: 16px 0 0; border-radius: 8px; background: var(--ui-surface-raised); backdrop-filter: blur(10px); }
#settings-dialog .security-settings > .form-status:not(:empty) { border-color: var(--ui-border); }
#settings-dialog .form-status.is-error { color: var(--ui-danger); }
#settings-dialog .form-status.is-success { color: var(--ui-success); }
#settings-dialog .account-duty-current { margin-bottom: 26px; padding: 18px; border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-bg); }
#settings-dialog .account-duty-current > span { color: var(--ui-subtle); font: 700 9px/1.4 var(--font-mono); letter-spacing: .08em; }
#settings-dialog .account-duty-current > strong { display: block; margin-top: 9px; color: var(--ui-text); font-size: 15px; }
#settings-dialog .account-duty-current p { margin: 8px 0 0; color: var(--ui-muted); font-size: 12px; }
#settings-dialog textarea { min-height: 116px; width: 100%; padding: 14px; border: 1px solid var(--ui-border); border-radius: 9px; color: var(--ui-text); background: var(--ui-bg); font-size: 13px; line-height: 1.6; }
#settings-dialog .privacy-note { color: var(--ui-subtle); font-size: 11px; }
#settings-dialog .my-role-requests { margin-top: 25px; gap: 10px; }
#settings-dialog .role-request-item { padding: 14px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-bg); }
#settings-dialog .role-request-item strong { color: var(--ui-text); font-size: 11px; line-height: 1.7; }
#settings-dialog .role-request-item small { color: var(--ui-muted); font-size: 12px; line-height: 1.6; }
#recovery-codes-dialog { width: min(530px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; border: 1px solid var(--ui-border); border-radius: 16px; color: var(--ui-text); background: var(--ui-surface); overscroll-behavior: contain; }
#recovery-codes-dialog > div { padding: 30px; }
#recovery-codes-dialog h2 { padding-right: 24px; color: var(--ui-text); font-size: 25px; letter-spacing: -.035em; }
#recovery-codes-dialog p { color: var(--ui-muted); font-size: 13px; }
#recovery-codes-dialog pre { padding: 17px; border-color: var(--ui-border); color: var(--ui-text); background: var(--ui-bg); line-height: 2; }

@media (max-width: 1000px) {
  #settings-dialog { width: calc(100vw - 40px); height: calc(100dvh - 40px); }
  #settings-dialog .settings-layout { grid-template-columns: 188px minmax(0, 1fr); }
  #settings-dialog .settings-sidebar { padding-inline: 10px; }
  #settings-dialog .settings-panel { padding: 25px 24px 36px; }
  #settings-dialog .settings-tabs button { padding: 10px 8px; column-gap: 8px; }
  #settings-dialog .settings-tabs strong { font-size: 12px; }
  #settings-dialog .security-method-grid { grid-template-columns: 1fr; }
  #settings-dialog .security-method-head { grid-template-columns: 35px minmax(0, 1fr) auto; }
  #settings-dialog .security-method-head em { grid-column: auto; }
}
@media (max-width: 680px) {
  #settings-dialog { width: 100vw; height: 100dvh; max-height: 100dvh; margin: 0; border: 0; border-radius: 0; }
  #settings-dialog .settings-heading { min-height: 116px; padding: max(22px, env(safe-area-inset-top)) 58px 20px 20px; }
  #settings-dialog .settings-heading h2 { margin-top: 7px; font-size: 23px; }
  #settings-dialog .settings-heading p:last-child { max-width: 255px; font-size: 12px; line-height: 1.5; }
  #settings-dialog .modal-close { top: max(20px, env(safe-area-inset-top)); right: 16px; }
  #settings-dialog .settings-layout { display: flex; flex-direction: column; }
  #settings-dialog .settings-sidebar { flex: 0 0 auto; padding: 8px 10px; border-right: 0; border-bottom: 1px solid var(--ui-border); }
  #settings-dialog .settings-sidebar__label, #settings-dialog .settings-sidebar__note { display: none; }
  #settings-dialog .settings-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
  #settings-dialog .settings-tabs button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 66px; padding: 9px 4px; text-align: center; }
  #settings-dialog .settings-tabs button > span { display: block; }
  #settings-dialog .settings-tabs svg { width: 18px; height: 18px; }
  #settings-dialog .settings-tabs strong { font-size: 11px; line-height: 1.3; white-space: nowrap; }
  #settings-dialog .settings-tabs small { display: none; }
  #settings-dialog .settings-modal__inner { flex: 1 1 auto; height: auto; scrollbar-gutter: auto; }
  #settings-dialog .settings-panel { padding: 24px 20px max(36px, env(safe-area-inset-bottom)); }
  #settings-dialog .account-panel-heading h3, #settings-dialog .security-hero h3 { font-size: 22px; }
  #settings-dialog .account-panel-heading p, #settings-dialog .security-hero p:last-child { font-size: 12px; }
  #settings-dialog .settings-profile-row { grid-template-columns: 64px minmax(0, 1fr); gap: 14px; padding: 16px; }
  #settings-dialog .settings-avatar-preview { width: 64px; height: 64px; }
  #settings-dialog .settings-profile-row .field-label { font-size: 12px; }
  #settings-dialog .account-field-hint { font-size: 10px; line-height: 1.5; }
  #settings-dialog input[type=file] { font-size: 10px; }
  #settings-dialog input[type=file]::file-selector-button { padding: 7px; margin-right: 5px; font-size: 10px; }
  #settings-dialog .field-wrap input, #settings-dialog .field-wrap select, #settings-dialog textarea, #settings-dialog .security-method-card > input, #settings-dialog .totp-setup-panel input, #settings-dialog #email-setup-panel input { font-size: 16px; }
  #settings-dialog .windows-download-card { padding: 16px; }
  #settings-dialog .windows-download-card > a, #settings-dialog .windows-download-card > small:last-child { grid-column: 1 / -1; }
  #settings-dialog .windows-download-card > a { justify-self: stretch; justify-content: center; }
  #settings-dialog .windows-download-card > small:last-child { text-align: center; }
  #settings-dialog .security-password-gate { padding: 16px; }
  #settings-dialog .security-group-heading { flex-direction: row; align-items: center; gap: 10px; }
  #settings-dialog .security-group-heading > span { display: none; }
  #settings-dialog .security-method-card { padding: 16px; }
  #settings-dialog .security-method-head, #settings-dialog .recovery-method-card .security-method-head { grid-template-columns: 35px minmax(0, 1fr); }
  #settings-dialog .security-method-head em, #settings-dialog .recovery-method-card .security-method-head em { grid-column: 2; }
  #settings-dialog .recovery-method-action { grid-template-columns: 1fr; gap: 14px; }
  #settings-dialog .recovery-method-action .secondary-submit { width: 100%; }
  #recovery-codes-dialog > div { padding: 22px; }
  #recovery-codes-dialog h2 { font-size: 22px; }
  #recovery-codes-dialog pre { columns: 1; }
}
@media (max-height: 550px) and (min-width: 681px) {
  #settings-dialog { height: calc(100dvh - 24px); }
  #settings-dialog .settings-heading { min-height: 0; padding-top: 17px; padding-bottom: 17px; }
  #settings-dialog .settings-heading p:last-child, #settings-dialog .settings-sidebar__note { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  #settings-dialog *, #recovery-codes-dialog * { scroll-behavior: auto !important; transition: none !important; }
}