.theme-switcher,
.theme-switcher * {
  box-sizing: border-box !important;
}

body {
  padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
}

.theme-switcher {
  position: fixed !important;
  z-index: 2147483000 !important;
  left: 50% !important;
  bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  width: max-content !important;
  margin: 0 !important;
  padding: 5px !important;
  border: 1px solid rgba(255, 255, 255, .2) !important;
  border-radius: 999px !important;
  background: rgba(17, 18, 18, .88) !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .24) !important;
  -webkit-backdrop-filter: blur(14px) saturate(130%) !important;
  backdrop-filter: blur(14px) saturate(130%) !important;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-style: normal !important;
  line-height: 1 !important;
  isolation: isolate !important;
}

.theme-switcher__link {
  display: grid !important;
  place-items: center !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: rgba(255, 255, 255, .62) !important;
  font-size: 21px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  text-transform: none !important;
  transition: color .2s ease, background-color .2s ease, transform .2s ease !important;
  -webkit-tap-highlight-color: transparent;
}

.theme-switcher__link:hover {
  color: #fff !important;
  transform: translateY(-1px) !important;
}

.theme-switcher__link[aria-current="page"] {
  background: #fff !important;
  color: #111 !important;
}

.theme-switcher__link:focus-visible {
  outline: 2px solid #fff !important;
  outline-offset: 2px !important;
}

@media (max-width: 480px) {
  body {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .theme-switcher {
    bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
  }

  .theme-switcher__link {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    font-size: 20px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .theme-switcher__link {
    transition: none !important;
  }
}