/* SAGE Accessibility Controls v0.1 */
.sage-a11y {
  --sage-a11y-ink: #14202c;
  --sage-a11y-muted: #485563;
  --sage-a11y-paper: #fff;
  --sage-a11y-border: #d0d5dd;
  --sage-a11y-highlight: #9e0821;
  --sage-a11y-focus: #0769c6;
  position: fixed;
  bottom: 1.1rem;
  right: 1.1rem;
  z-index: 2000;
  font: 400 1rem/1.5 system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--sage-a11y-ink);
}
html.sage-a11y-high-contrast .sage-a11y {
  --sage-a11y-ink: #fff;
  --sage-a11y-muted: #f0f0f0;
  --sage-a11y-paper: #070707;
  --sage-a11y-border: #fff;
  --sage-a11y-highlight: #fff16a;
  --sage-a11y-focus: #fff16a;
}
.sage-a11y * { box-sizing: border-box; }
.sage-a11y [hidden] { display: none !important; }
.sage-a11y button, .sage-a11y input, .sage-a11y select {
  font: inherit;
}
.sage-a11y button { cursor: pointer; }
.sage-a11y button:disabled { opacity: .52; cursor: not-allowed; }
.sage-a11y :focus-visible { outline: 3px solid var(--sage-a11y-focus); outline-offset: 3px; }
.sage-a11y-toggle {
  background: #9e0821;
  border: 2px solid #fff;
  color: #fff;
  font-weight: 700 !important;
  padding: .8rem 1rem;
  min-height: 3.25rem;
  border-radius: 999px;
  box-shadow: 0 10px 28px rgb(0 0 0 / .24);
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-left: auto;
}
html.sage-a11y-high-contrast .sage-a11y-toggle {
  background: #fff16a;
  border-color: #000;
  color: #000;
}
.sage-a11y-symbol {
  width: 1.9rem;
  height: 1.9rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgb(255 255 255 / .18);
  font-weight: 800;
}
.sage-a11y-panel {
  width: min(24rem, calc(100vw - 2.2rem));
  max-height: min(74vh, 41rem);
  max-height: min(74dvh, 41rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  margin: 0 0 .6rem auto;
  padding: 1rem;
  border: 2px solid var(--sage-a11y-border);
  background: var(--sage-a11y-paper);
  color: var(--sage-a11y-ink);
  border-radius: 1.15rem;
  box-shadow: 0 16px 50px rgb(0 0 0 / .2);
}
.sage-a11y-header { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: space-between; align-items: start; }
.sage-a11y-header > div { min-width: 0; }
.sage-a11y h2, .sage-a11y h3 { overflow-wrap: anywhere; }
.sage-a11y h2, .sage-a11y h3, .sage-a11y p { margin: 0; color: inherit; }
.sage-a11y h2 { font-size: 1.15rem; line-height: 1.4; }
.sage-a11y h3 { font-size: .99rem; margin-bottom: .4rem; }
.sage-a11y p { font-size: .88rem; line-height: 1.5; color: var(--sage-a11y-muted); }
.sage-a11y-section { margin-top: .8rem; padding-top: .8rem; border-top: 1px solid var(--sage-a11y-border); }
.sage-a11y-controls { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .65rem; align-items: center; }
.sage-a11y-controls button, .sage-a11y-switches button, .sage-a11y-reset, .sage-a11y-close {
  min-height: 2.75rem;
  padding: .45rem .75rem;
  border: 1px solid var(--sage-a11y-border);
  background: var(--sage-a11y-paper);
  color: var(--sage-a11y-ink);
  border-radius: .6rem;
}
.sage-a11y-controls button:first-child:not(:disabled) { background: var(--sage-a11y-highlight); color: #fff; border-color: var(--sage-a11y-highlight); }
html.sage-a11y-high-contrast .sage-a11y-controls button:first-child:not(:disabled) { color: #000; }
.sage-a11y-close { min-height: 2.5rem; padding: .3rem .5rem; }
.sage-a11y-label { display: block; font-size: .85rem; font-weight: 600; margin: .75rem 0 .3rem; }
.sage-a11y select { width: 100%; min-height: 2.8rem; padding: .4rem; border: 1px solid var(--sage-a11y-border); background: var(--sage-a11y-paper); color: var(--sage-a11y-ink); border-radius: .5rem; }
.sage-a11y input[type="range"] { width: 100%; accent-color: var(--sage-a11y-highlight); }
.sage-a11y-status { min-height: 1.4rem; margin-top: .5rem !important; }
.sage-a11y-switches { display: grid; gap: .4rem; margin: .65rem 0; }
.sage-a11y-switches button { width: 100%; text-align: left; }
.sage-a11y-switches [aria-pressed="true"] { font-weight: 700; border-width: 2px; border-color: var(--sage-a11y-highlight); }
.sage-a11y-current { font-size: .88rem; font-weight: 800; }
.sage-a11y-reset { width: 100%; }
.sage-a11y-note { margin-top: .75rem !important; font-size: .78rem !important; }

/* Theme tokens: connect these to your site's design variables. */
html.sage-a11y-high-contrast {
  --site-bg: #000;
  --site-surface: #050505;
  --site-ink: #fff;
  --site-muted: #f1f1f1;
  --site-accent: #fff16a;
  --site-border: #fff;
}
html.sage-a11y-high-contrast :is(a, button):focus-visible { outline: 3px solid #fff16a; outline-offset: 3px; }
html.sage-a11y-text-spacing main :is(p, li, blockquote) {
  line-height: 1.85 !important;
  letter-spacing: .035em !important;
  word-spacing: .11em !important;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
html.sage-a11y-reduce-motion *,
html.sage-a11y-reduce-motion *::before,
html.sage-a11y-reduce-motion *::after {
  animation-duration: .01ms !important;
  transition-duration: .01ms !important;
  scroll-behavior: auto !important;
}
@media (max-width: 370px) {
  .sage-a11y { bottom: .5rem; right: .5rem; }
  .sage-a11y-panel { width: calc(100vw - 1rem); }
  .sage-a11y-toggle { font-size: .84rem; }
}
