:root{
  --a11y-font-size: 100%;
}

/* top button near language/currency */
.a11y-top-btn,
.a11y-mobile-btn{
  width: 38px;
  height: 38px;
  min-width: 38px;
  max-width: 38px;
  padding: 0 !important;
  border-radius: 12px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: transparent !important;
  color: #0f172a !important;
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
  flex: 0 0 38px !important;
  overflow: hidden;
  cursor: pointer;
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
  text-decoration: none !important;
}

.a11y-top-btn:hover,
.a11y-top-btn:focus,
.a11y-mobile-btn:hover,
.a11y-mobile-btn:focus,
.a11y-top-btn.is-active,
.a11y-mobile-btn.is-active{
  background: rgba(212,175,55,.12) !important;
  color: #241403 !important;
  border-color: rgba(212,175,55,.4) !important;
  box-shadow: 0 10px 24px rgba(212,175,55,.16);
}

.a11y-top-btn::after,
.a11y-mobile-btn::after,
.a11y-top-btn::before,
.a11y-mobile-btn::before{
  display: none !important;
  content: none !important;
}

.a11y-top-btn i,
.a11y-mobile-btn i{
  font-size: 18px;
  line-height: 1;
  pointer-events: none;
}

.a11y-top-btn .a11y-btn-text,
.a11y-mobile-btn .a11y-btn-text{
  display: none !important;
}

.a11y-trigger-wrap{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.a11y-mobile-wrap{
  flex: 0 0 42px;
  width: 42px;
  min-width: 42px;
  max-width: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* panel */
.a11y-panel,
.a11y-panel *{
  box-sizing: border-box;
}

.a11y-panel{
  position: fixed;
  top: 68px;
  right: 12px;
  width: 360px;
  max-width: min(360px, calc(100vw - 24px));
  background: rgba(10,10,12,.97);
  color: #fff;
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 24px 50px rgba(0,0,0,.32);
  border: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  z-index: 2147483640;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}

.a11y-panel.is-open{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.a11y-panel-title{
  font-size: 15px;
  line-height: 1.3;
  font-weight: 800;
  margin: 2px 2px 10px;
  color: #fff;
}

.a11y-panel-group{
  display: grid;
  gap: 8px;
}

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

.a11y-panel-row--2{
  grid-template-columns: 1fr 1fr;
}

.a11y-font-row{
  display: grid;
  grid-template-columns: 62px 1fr 62px;
  gap: 8px;
  align-items: center;
}

.a11y-font-value{
  min-height: 42px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.05);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.a11y-panel-button{
  min-height: 42px;
  width: 100%;
  border: 0;
  border-radius: 12px;
  padding: 10px 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.05));
  color: #fff;
  text-align: left;
  font-size: 14px;
  line-height: 1.35;
  font-weight: 600;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  transition: background .16s ease, transform .16s ease, box-shadow .16s ease;
}

.a11y-panel-button--center{
  text-align: center;
  justify-content: center;
}

.a11y-panel-button:hover,
.a11y-panel-button:focus{
  background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.08));
  color: #fff;
}

.a11y-panel-button.is-active,
.a11y-panel-button[data-a11y-action="speak"].is-speaking{
  background: linear-gradient(180deg, #f4df8f 0%, #d7a63d 100%);
  color: #241403;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 8px 18px rgba(212,175,55,.18);
}

.a11y-panel-sep{
  height: 1px;
  background: rgba(255,255,255,.08);
  margin: 4px 0;
}

/* modes */
html.a11y-font-scaled body{
  font-size: var(--a11y-font-size, 100%) !important;
}

html.a11y-font-scaled p,
html.a11y-font-scaled li,
html.a11y-font-scaled a,
html.a11y-font-scaled button,
html.a11y-font-scaled input,
html.a11y-font-scaled textarea,
html.a11y-font-scaled label,
html.a11y-font-scaled span,
html.a11y-font-scaled small,
html.a11y-font-scaled div{
  font-size: inherit !important;
}

html.a11y-bw{
  filter: grayscale(100%) contrast(120%);
}

html.a11y-yellow,
html.a11y-yellow body{
  background: #000 !important;
  color: #ffeb3b !important;
}

html.a11y-yellow *{
  color: #ffeb3b !important;
  border-color: rgba(255,235,59,.45) !important;
}

html.a11y-light,
html.a11y-light body{
  background: #fff !important;
  color: #111 !important;
}

html.a11y-light *{
  color: #111 !important;
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  border-color: rgba(0,0,0,.25) !important;
}

html.a11y-light a{
  color: #0039a6 !important;
}

html.a11y-sepia,
html.a11y-sepia body{
  background: #f4ecd8 !important;
  color: #332b1f !important;
}

html.a11y-sepia *{
  color: #332b1f !important;
  border-color: rgba(51,43,31,.2) !important;
}

html.a11y-sepia a{
  color: #654321 !important;
}

html.a11y-underline-links a{
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  text-decoration-thickness: 2px !important;
}

html.a11y-wide-line p,
html.a11y-wide-line li,
html.a11y-wide-line div,
html.a11y-wide-line span,
html.a11y-wide-line a,
html.a11y-wide-line button,
html.a11y-wide-line input,
html.a11y-wide-line textarea,
html.a11y-wide-line label,
html.a11y-wide-line h1,
html.a11y-wide-line h2,
html.a11y-wide-line h3,
html.a11y-wide-line h4,
html.a11y-wide-line h5,
html.a11y-wide-line h6{
  line-height: 1.95 !important;
}

html.a11y-letter-spacing,
html.a11y-letter-spacing body,
html.a11y-letter-spacing p,
html.a11y-letter-spacing li,
html.a11y-letter-spacing div,
html.a11y-letter-spacing span,
html.a11y-letter-spacing a,
html.a11y-letter-spacing button,
html.a11y-letter-spacing input,
html.a11y-letter-spacing textarea,
html.a11y-letter-spacing label,
html.a11y-letter-spacing h1,
html.a11y-letter-spacing h2,
html.a11y-letter-spacing h3,
html.a11y-letter-spacing h4,
html.a11y-letter-spacing h5,
html.a11y-letter-spacing h6{
  letter-spacing: .06em !important;
  word-spacing: .12em !important;
}

html.a11y-large-cursor,
html.a11y-large-cursor *{
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='42' height='42' viewBox='0 0 42 42'><path d='M6 4 L6 30 L13 23 L18 36 L24 33 L19 21 L29 21 Z' fill='black' stroke='yellow' stroke-width='2'/></svg>") 4 4, auto !important;
}

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

html.a11y-hide-images img,
html.a11y-hide-images svg,
html.a11y-hide-images video,
html.a11y-hide-images picture,
html.a11y-hide-images canvas,
html.a11y-hide-images iframe{
  visibility: hidden !important;
}

@media (max-width: 575.98px){
  .a11y-panel{
    top: 74px;
    right: 12px;
    left: 12px;
    width: auto;
    max-width: none;
  }

  .a11y-font-row{
    grid-template-columns: 56px 1fr 56px;
  }

  .a11y-panel-row--2{
    grid-template-columns: 1fr;
  }
}