/* 공통 테마 전환 버튼 — 밝은 배경/어두운 배경 모두에서 쓰도록 중립 색으로 만든다.
   페이지에서 --tg-on-bg 등을 재정의하면 그 값이 우선한다. */
.theme-toggle {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  border-radius: 12px;
  background: var(--tg-bg, rgba(128, 140, 160, .16));
  line-height: 1;
  flex: none;
}
.theme-toggle .tg {
  width: 30px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  border: none; border-radius: 9px;
  background: transparent;
  font-family: inherit; font-size: .84rem;
  cursor: pointer;
  opacity: .5;
  transition: opacity .15s, background .15s;
  padding: 0;
}
.theme-toggle .tg:hover { opacity: .85; background: var(--tg-hover, rgba(128, 140, 160, .16)); }
.theme-toggle .tg.on {
  opacity: 1;
  background: var(--tg-on-bg, #4C6FFF);
  box-shadow: 0 1px 4px rgba(31, 41, 55, .18);
}