.a11y-fab {
  position: fixed;
  left: 14px;
  right: auto;
  bottom: calc(18px + env(safe-area-inset-bottom));
  z-index: 120;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #cbd9e9;
  border-radius: 14px;
  background: #fff;
  color: #102650;
  cursor: pointer;
  box-shadow: 0 14px 30px -16px rgba(4, 16, 31, .55);
}
.a11y-fab:hover { background: #eef5ff; }
.a11y-fab:focus-visible { outline: 3px solid #4189f7; outline-offset: 3px; }
.a11y-fab svg { width: 24px; height: 24px; }

.a11y-panel {
  position: fixed;
  left: 14px;
  right: auto;
  bottom: calc(76px + env(safe-area-inset-bottom));
  z-index: 125;
  width: min(88vw, 300px);
  padding: 14px;
  border: 1px solid #cbd9e9;
  border-radius: 18px;
  background: #fff;
  color: #102650;
  box-shadow: 0 26px 56px -20px rgba(4, 16, 31, .55);
  text-align: start;
}
.a11y-panel[hidden] { display: none; }
.a11y-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.a11y-head h2 { margin: 0; font: 800 16px/1.3 Assistant, sans-serif; color: #102650; }
.a11y-x {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #d8e4f1;
  border-radius: 10px;
  background: #fff;
  color: #435873;
  cursor: pointer;
}
.a11y-rows { display: grid; gap: 8px; }
.a11y-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.a11y-row > span { font: 600 14.5px/1.35 Assistant, sans-serif; color: #435873; }
.a11y-steps { display: flex; align-items: center; gap: 6px; }
.a11y-steps button,
.a11y-toggle,
.a11y-reset {
  min-height: 40px;
  padding: 0 13px;
  border: 1px solid #cbd9e9;
  border-radius: 11px;
  background: #fff;
  color: #102650;
  font: 700 14.5px/1 Assistant, sans-serif;
  cursor: pointer;
}
.a11y-steps button { width: 40px; padding: 0; font-size: 19px; }
.a11y-steps button:disabled { opacity: .45; cursor: default; }
.a11y-steps output { min-width: 20px; text-align: center; font: 700 14.5px/1 Assistant, sans-serif; }
.a11y-toggle[aria-pressed='true'] { background: #eef5ff; border-color: #4189f7; color: #0e4cb4; }
.a11y-reset { width: 100%; margin-top: 10px; }
.a11y-panel .a11y-link { display: block; margin-top: 10px; color: #0e4cb4; font: 600 14px/1.4 Assistant, sans-serif; }
.a11y-x:focus-visible,
.a11y-row button:focus-visible,
.a11y-panel a:focus-visible { outline: 3px solid #4189f7; outline-offset: 2px; }

html.a11y-text-1 .article-prose p,
html.a11y-text-1 .article-prose li,
html.a11y-text-1 .article-page__lead,
html.a11y-text-1 .article-card p { font-size: 112.5%; }
html.a11y-text-2 .article-prose p,
html.a11y-text-2 .article-prose li,
html.a11y-text-2 .article-page__lead,
html.a11y-text-2 .article-card p { font-size: 125%; }
html.a11y-text-1 .article-page h1 { font-size: clamp(42px, 5.4vw, 62px); }
html.a11y-text-2 .article-page h1 { font-size: clamp(45px, 5.8vw, 66px); }
html.a11y-text-1 .article-prose h2,
html.a11y-text-1 .article-faq h2 { font-size: 34px; }
html.a11y-text-2 .article-prose h2,
html.a11y-text-2 .article-faq h2 { font-size: 37px; }

html.a11y-links a:not(.article-btn):not(.article-brand):not(.a11y-fab) {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
}

html.a11y-contrast body { background: #fff; color: #0a1622; }
html.a11y-contrast .article-card,
html.a11y-contrast .article-toc,
html.a11y-contrast .article-author,
html.a11y-contrast .article-side-card,
html.a11y-contrast .article-faq details,
html.a11y-contrast .a11y-panel { border-color: #31404f; }
html.a11y-contrast .article-btn { background: #0b3e96; color: #fff; border-color: #0b3e96; }
html.a11y-contrast .article-btn--ghost { background: #fff; color: #0a1622; border-color: #31404f; }
html.a11y-contrast .article-header { background: #fff; border-bottom-color: #31404f; }
html.a11y-contrast a:not(.article-btn) { color: #0b3e96; }
html.a11y-contrast *:focus-visible { outline: 3px solid #0b3e96; outline-offset: 2px; }

html.a11y-no-motion *,
html.a11y-no-motion *::before,
html.a11y-no-motion *::after {
  animation-duration: .01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .01ms !important;
  scroll-behavior: auto !important;
}

@media (min-width: 760px) {
  .a11y-fab { left: 22px; bottom: 22px; }
  .a11y-panel { left: 22px; bottom: 80px; }
}

@media (max-width: 640px) {
  .a11y-fab { bottom: calc(16px + env(safe-area-inset-bottom)); }
  .a11y-panel { bottom: calc(72px + env(safe-area-inset-bottom)); }
  html.a11y-text-1 .article-page h1 { font-size: 40px; }
  html.a11y-text-2 .article-page h1 { font-size: 43px; }
}