:root {
  --anna-a11y-focus: #ffd166;
  --anna-a11y-panel-bg: #101827;
  --anna-a11y-panel-text: #ffffff;
  --anna-a11y-panel-border: rgba(255, 255, 255, 0.22);
}

/*
 * Touch-first interfaces keep native scrolling, wheel and keyboard navigation,
 * but do not reserve screen space for browser scrollbar chrome.
 */
html,
body,
* {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
*::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

html,
body,
button,
input,
textarea,
select,
option {
  font-family: Arial, Helvetica, sans-serif !important;
}

*:focus-visible {
  outline: 3px solid var(--anna-a11y-focus) !important;
  outline-offset: 3px !important;
}

.anna-a11y-toggle {
  position: fixed;
  left: max(12px, env(safe-area-inset-left));
  bottom: max(82px, calc(env(safe-area-inset-bottom) + 18px));
  z-index: 2147483000;
  width: 52px;
  height: 52px;
  border: 2px solid rgba(255, 255, 255, 0.72);
  border-radius: 50%;
  background: #075985;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.38);
  cursor: pointer;
  font: 900 27px/1 Arial, Helvetica, sans-serif !important;
  touch-action: manipulation;
}

.anna-a11y-toggle:hover,
.anna-a11y-toggle:focus-visible {
  background: #0ea5e9;
}

.anna-a11y-panel {
  position: fixed;
  left: max(12px, env(safe-area-inset-left));
  bottom: max(142px, calc(env(safe-area-inset-bottom) + 78px));
  z-index: 2147483001;
  width: min(320px, calc(100vw - 24px));
  padding: 14px;
  border: 1px solid var(--anna-a11y-panel-border);
  border-radius: 18px;
  background: var(--anna-a11y-panel-bg);
  color: var(--anna-a11y-panel-text);
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.55);
  font-family: Arial, Helvetica, sans-serif !important;
}

.anna-a11y-panel[hidden] {
  display: none !important;
}

.anna-a11y-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.anna-a11y-title {
  margin: 0;
  font: 900 18px/1.25 Arial, Helvetica, sans-serif !important;
}

.anna-a11y-close {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  cursor: pointer;
  font: 900 22px/1 Arial, Helvetica, sans-serif !important;
}

.anna-a11y-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.anna-a11y-action {
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  cursor: pointer;
  text-align: start;
  font: 800 14px/1.25 Arial, Helvetica, sans-serif !important;
}

.anna-a11y-action[aria-pressed="true"] {
  border-color: #22c55e;
  background: rgba(34, 197, 94, 0.25);
}

.anna-a11y-reset {
  margin-top: 10px;
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  cursor: pointer;
  font: 900 14px/1 Arial, Helvetica, sans-serif !important;
}

html.anna-a11y-large-text {
  font-size: 118% !important;
}

html.anna-a11y-large-text button,
html.anna-a11y-large-text a,
html.anna-a11y-large-text input,
html.anna-a11y-large-text textarea,
html.anna-a11y-large-text select {
  min-height: 44px;
}

html.anna-a11y-high-contrast {
  background: #000000 !important;
}

html.anna-a11y-high-contrast body,
html.anna-a11y-high-contrast main,
html.anna-a11y-high-contrast section,
html.anna-a11y-high-contrast article,
html.anna-a11y-high-contrast header,
html.anna-a11y-high-contrast footer,
html.anna-a11y-high-contrast nav,
html.anna-a11y-high-contrast div {
  background-image: none !important;
}

html.anna-a11y-high-contrast body {
  background: #000000 !important;
  color: #ffffff !important;
}

html.anna-a11y-high-contrast a,
html.anna-a11y-high-contrast button {
  color: #ffffff !important;
  border-color: #ffffff !important;
}

html.anna-a11y-high-contrast input,
html.anna-a11y-high-contrast textarea,
html.anna-a11y-high-contrast select {
  background: #000000 !important;
  color: #ffffff !important;
  border-color: #ffffff !important;
}

html.anna-a11y-underline-links a {
  text-decoration: underline !important;
  text-underline-offset: 0.18em;
}

html.anna-a11y-reduced-motion *,
html.anna-a11y-reduced-motion *::before,
html.anna-a11y-reduced-motion *::after {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}

html.anna-a11y-readable-font *,
html.anna-a11y-readable-font *::before,
html.anna-a11y-readable-font *::after {
  font-family: Arial, Helvetica, sans-serif !important;
  letter-spacing: 0 !important;
}

html.anna-a11y-grayscale body {
  filter: grayscale(1);
}

@media (max-width: 560px) {
  .anna-a11y-toggle {
    width: 48px;
    height: 48px;
    bottom: max(74px, calc(env(safe-area-inset-bottom) + 14px));
    font-size: 25px !important;
  }

  .anna-a11y-panel {
    bottom: max(128px, calc(env(safe-area-inset-bottom) + 68px));
  }
}