/* Re-themes the shared Nagish accessibility panel (nagish-panel.css)
   from its default purple to the site's putty/bronze palette,
   and defines the floating trigger button. */

/* ── Floating trigger button ─────────────────────── */
#nt-a11y-trigger {
  position: fixed;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--color-paper);
  border: 1px solid var(--color-hairline-light);
  color: var(--color-bronze);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100001;
  box-shadow: var(--shadow-soft);
  transition: transform var(--duration-fast) var(--ease-out-expo),
              background var(--duration-fast) var(--ease-out-expo),
              color var(--duration-fast) var(--ease-out-expo);
  padding: 0;
}
#nt-a11y-trigger svg { width: 22px; height: 22px; }
#nt-a11y-trigger:hover,
#nt-a11y-trigger:focus-visible {
  transform: translateY(-50%) scale(1.08);
  background: var(--color-bronze);
  color: var(--color-paper);
  border-color: var(--color-bronze);
  outline: none;
}

@media (max-width: 639px) {
  #nt-a11y-trigger {
    top: auto;
    bottom: calc(64px + 14px);
    left: 14px;
    transform: none;
    width: 42px;
    height: 42px;
  }
  #nt-a11y-trigger:hover,
  #nt-a11y-trigger:focus-visible { transform: scale(1.08); }
}

/* ── Panel re-theme: purple → bronze ─────────────── */
.nagish-header,
.nagish-title-bar { background: var(--color-bronze) !important; }

.nagish-lang-menu { background: var(--color-putty) !important; border-bottom-color: var(--color-hairline-light) !important; }
.nagish-lang-item { color: var(--color-ink) !important; border-color: var(--color-hairline-light) !important; }
.nagish-lang-item:hover { background: var(--color-putty-deep) !important; border-color: var(--color-bronze) !important; }

.nagish-feat-btn:hover { border-color: var(--color-bronze) !important; background: var(--color-putty) !important; }
.nagish-feat-btn.active {
  border-color: var(--color-bronze) !important;
  background: var(--color-putty-deep) !important;
  box-shadow: 0 0 0 2px oklch(58% 0.035 70 / 0.18) !important;
}
.nagish-feat-icon { color: var(--color-bronze) !important; }
.nagish-feat-btn.active .nagish-feat-label { color: var(--color-bronze) !important; }

.nagish-sec-title,
.nagish-sec-icon { color: var(--color-bronze) !important; }

.nagish-tab.active { background: var(--color-bronze) !important; border-color: var(--color-bronze) !important; }

.nagish-reset-colors-btn { color: var(--color-bronze) !important; }
.nagish-reset-colors-btn:hover { border-color: var(--color-bronze) !important; }

.nagish-cursor-btn:hover { border-color: var(--color-bronze) !important; color: var(--color-bronze) !important; }
.nagish-cursor-btn.active { background: var(--color-bronze) !important; border-color: var(--color-bronze) !important; }

.nagish-font-step { background: var(--color-bronze) !important; }
.nagish-font-step:hover { background: var(--color-bronze-dim) !important; }
.nagish-font-track::-webkit-slider-thumb { background: var(--color-bronze) !important; }

.nagish-reset-all-btn { background: var(--color-bronze) !important; }
.nagish-reset-all-btn:hover { background: var(--color-bronze-dim) !important; }

body.nagish-kbd-focus *:focus { outline-color: var(--color-bronze) !important; }