.reader-tools {
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:90;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.reader-tools button {
  width:48px;
  height:48px;
  flex-shrink:0;
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid #72766f;
  background:#202522;
  color:#faf7ef;
  display:grid;
  place-items:center;
  padding:0;
}

.reader-tools svg {
  width:24px;
  height:24px;
  aspect-ratio:1;
  flex-shrink:0;
}

.reader-tools button:focus-visible {
  outline:3px solid #fff;
  outline-offset:2px;
  box-shadow:0 0 0 6px #b93022;
}

.reader-trigger[aria-expanded=true] {
  background:#b93022;
  border-color:#b93022;
}

.reader-panel {
  position:fixed;
  right:20px;
  bottom:128px;
  z-index:90;
  width:292px;
  max-width:calc(100vw - 32px);
  max-height:calc(100svh - 144px);
  overflow-y:auto;
  overscroll-behavior:contain;
  box-sizing:border-box;
  padding:16px;
  background:#faf7ef;
  color:#20201d;
  border:1px solid #ded9ce;
  box-shadow:0 10px 24px #0003;
  font:14px/1.3 Arial,sans-serif;
  color-scheme:light;
}

.reader-panel * {
  box-sizing:border-box;
}

.reader-panel button,.reader-panel input,.reader-panel output {
  font:inherit;
  color:#20201d;
}

.reader-panel :focus-visible {
  outline:2px solid #b93022;
  outline-offset:3px;
}

.reader-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-bottom:12px;
  margin-bottom:14px;
  border-bottom:1px solid #d4cfc4;
  font-size:16px;
  font-weight:600;
}

.reader-heading button {
  width:27px;
  height:27px;
  padding:4px;
  border:1px solid #b93022;
  border-radius:5px;
  background:none;
  display:grid;
  place-items:center;
}

.reader-panel fieldset {
  border:0;
  padding:0;
  margin:0 0 14px;
  min-width:0;
}

.reader-panel legend {
  font-size:10px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#69624f;
  margin-bottom:9px;
  padding:0;
}

.a11y-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:38px;
  padding:8px 10px;
  gap:10px;
  margin-bottom:7px;
  border:1px solid #d4cfc4;
  font:14px/1.25 Arial,sans-serif;
  cursor:pointer;
}

.a11y-switch {
  position:relative;
  display:block;
  flex:0 0 30px;
  width:30px;
  height:17px;
}

.a11y-switch input {
  position:absolute;
  inset:0;
  width:30px;
  height:17px;
  margin:0;
  opacity:0;
  cursor:pointer;
  z-index:1;
}

.switch-track {
  position:absolute;
  inset:0;
  border-radius:12px;
  background:#eee9dd;
  border:1px solid #d1cbbd;
  pointer-events:none;
}

.switch-track:after {
  content:"";
  position:absolute;
  width:9px;
  height:9px;
  left:3px;
  top:3px;
  border-radius:50%;
  background:#69624f;
  transition:transform 150ms;
}

.a11y-switch input:checked+.switch-track {
  background:#b93022;
  border-color:#b93022;
}

.a11y-switch input:checked+.switch-track:after {
  background:white;
  transform:translateX(13px);
}

.a11y-switch input:focus-visible+.switch-track {
  outline:2px solid #b93022;
  outline-offset:3px;
}

.text-size {
  display:grid;
  grid-template-columns:38px 1fr 38px;
  gap:7px;
}

.text-size button,.text-size output {
  height:30px;
  border:1px solid #d4cfc4;
  background:none;
  display:grid;
  place-items:center;
  padding:0;
}

.text-size output {
  background:#efeadf;
  font-variant-numeric:tabular-nums;
}

.reader-themes {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-bottom:7px;
}

.reader-themes button {
  min-height:34px;
  border:1px solid #d4cfc4;
  background:none;
  font-size:14px;
}

.reader-themes button[aria-pressed=true] {
  background:#272722;
  color:#fff;
}

.reader-reset {
  width:100%;
  min-height:38px;
  padding:10px 8px;
  font-size:12px!important;
  border:1px solid #272722;
  background:transparent;
}

.grayscale main,.grayscale .site-header,.grayscale .site-footer {
  filter:grayscale(1);
}

.reader-dark {
  --bg:#17191a;
  --surface:#222526;
  --text:#f1eee7;
  --muted:#c8c4bb;
  --line:#666;
  --accent:#ff9b8e;
  --soft:#222526;
  color-scheme:dark;
}

.reader-dark .dark,.reader-dark .anatomy {
  --bg:#17191a;
  --surface:#222526;
  --text:#f1eee7;
  --muted:#c8c4bb;
  --line:#666;
  --accent:#ff9b8e;
  --soft:#222526;
  background:var(--bg);
  color:var(--text);
}

.reader-light {
  --bg:#fff;
  --surface:#fff;
  --text:#17191a;
  --muted:#484848;
  --line:#bbb;
  --accent:#a32619;
  --soft:#f0ede7;
  color-scheme:light;
}

.reader-light .dark,.reader-light .anatomy {
  --bg:#f0ede7;
  --surface:#fff;
  --text:#17191a;
  --muted:#484848;
  --line:#bbb;
  --accent:#a32619;
  --soft:#f0ede7;
  background:var(--bg);
  color:var(--text);
}

.reader-light .site-header {
  background:#f0ede7;
  color:#17191a;
  border-color:#bbb;
}

.reader-light .brand img {
  background:#141a18;
  padding:6px;
}

.reader-light .site-footer .footer-brand img {
  background:#141a18;
  padding:8px;
}

.reader-light .site-nav a:hover {
  color:#a32619;
}

.reader-light .site-nav .nav-cta,.reader-light .nav-toggle {
  border-color:#777;
}

.reader-light .hero:after {
  background:linear-gradient(90deg,#f0ede7 0%,#f0ede7ef 34%,#f0ede722 72%,transparent);
}

.reader-light .hero h1 .product-title,.reader-light .hero .eyebrow,.reader-light .hero .lead,.reader-light .hero-meta {
  color:#17191a;
}

.reader-light .hero-meta {
  border-color:#777;
}

.reader-dark .medical-warning {
  background:#222526;
  color:#f1eee7;
  border-color:#666;
}

.reader-dark .certificate {
  background:#222526;
  color:#f1eee7;
}

.reader-light .certificate {
  background:#f0ede7;
  color:#17191a;
}

.high-contrast {
  --text:#111;
  --muted:#222;
  --line:#333;
  --accent:#9a2117;
}

.high-contrast .dark {
  --text:#fff;
  --muted:#eee;
  --line:#aaa;
  --accent:#ffb1a6;
}

.high-contrast.reader-dark,.high-contrast.reader-dark .dark,.high-contrast.reader-dark .anatomy {
  --text:#fff;
  --muted:#eee;
  --line:#aaa;
  --accent:#ffb1a6;
}

.high-contrast.reader-light,.high-contrast.reader-light .dark,.high-contrast.reader-light .anatomy {
  --text:#111;
  --muted:#222;
  --line:#333;
  --accent:#9a2117;
}

.high-contrast .button:not(.primary) {
  border-color:currentColor;
}

.wide-spacing main p,.wide-spacing main li,.wide-spacing .site-footer p {
  line-height:1.85;
  letter-spacing:.045em;
  word-spacing:.09em;
}

.underlined-links main a,.underlined-links .site-header a,.underlined-links .site-footer a {
  text-decoration:underline;
  text-underline-offset:.18em;
}

.legible-type main,.legible-type .site-header,.legible-type .site-footer,.legible-type main *,.legible-type .site-header *,.legible-type .site-footer * {
  font-family:Arial,sans-serif!important;
}

.reduce-motion {
  scroll-behavior:auto;
}

.reduce-motion *,.reduce-motion *:before,.reduce-motion *:after {
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important;
}

@media(max-width:800px) {
  .large-text .protocol-grid {
    grid-template-columns:minmax(0,1fr);
  }

  .large-text .protocol-item {
    padding:1.5rem 0;
    border-left:0;
    border-top:1px solid var(--line);
  }

  .reader-light .hero:after {
    display:none;
  }

}

@media(max-width:600px) {
  .reader-tools {
    right:12px;
    bottom:12px;
  }

  .reader-panel {
    right:12px;
    bottom:120px;
    max-height:calc(100svh - 128px);
  }

}
