.agn-admin-mode-toggle {
  position: relative;
  top: auto;
  right: auto;
  z-index: 1000002;
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  margin-left: auto;
  padding: 0 11px 0 13px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 210, 125, .28);
  border-radius: 999px;
  background: rgba(12, 12, 18, .9);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
  color: rgba(255,255,255,.78);
  font: 800 12px/1 Arial, Helvetica, sans-serif;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* The admin switch and account button share the header instead of overlapping. */
.site-header > .agn-admin-mode-toggle + .agn-account-root {
  margin-left: 0 !important;
}

.agn-admin-mode-toggle button {
  position: relative;
  width: 42px;
  height: 24px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  cursor: pointer;
}

.agn-admin-mode-toggle button i {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #b8b8c1;
  box-shadow: 0 2px 6px rgba(0,0,0,.45);
  transition: transform .16s ease, background .16s ease;
}

.agn-admin-mode-toggle.is-enabled {
  border-color: rgba(255, 200, 85, .55);
  color: #ffe8b4;
}

.agn-admin-mode-toggle.is-enabled button {
  border-color: rgba(255, 200, 85, .55);
  background: rgba(166, 103, 24, .62);
}

.agn-admin-mode-toggle.is-enabled button i {
  transform: translateX(18px);
  background: #fff0c7;
}

@media (max-width: 1100px) {
  .agn-admin-mode-toggle {
    padding: 0 8px;
    gap: 0;
  }
  .agn-admin-mode-toggle > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
}

@media (max-width: 760px) {
  .agn-admin-mode-toggle {
    min-height: 34px;
    padding: 0 6px;
  }
  .agn-admin-mode-toggle button {
    width: 36px;
    height: 22px;
  }
  .agn-admin-mode-toggle button i {
    width: 14px;
    height: 14px;
  }
  .agn-admin-mode-toggle.is-enabled button i {
    transform: translateX(14px);
  }
}