.site-toggle{
  position:fixed;
  top:12px;
  right:12px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(2px);
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  color:#ddd;
  z-index:100;
}

.site-toggle .label{
  font-size:13px;
  margin:0;
  opacity:.9;
}

.toggle-chip{
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(2px);
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  padding:8px 12px;
  display:flex;
  align-items:center;
  gap:10px;
  color:#ddd;
  font-size:13px;
}

.toggle-chip.pref-toggle{
  position:fixed;
  bottom:20px;
  right:20px;
  box-shadow:0 6px 18px rgba(0,0,0,.45);
  z-index:100;
}

.switch{
  position:relative;
  width:36px;
  height:18px;
}

.switch input{
  appearance:none;
  -webkit-appearance:none;
  width:0;
  height:0;
}

.slider{
  position:absolute;
  inset:0;
  cursor:pointer;
  border-radius:999px;
  background:var(--rail-green);
  transition:background .2s;
}

.switch input:checked + .slider{
  background:var(--rail-amber);
}

.slider::before{
  content:"";
  position:absolute;
  width:14px;
  height:14px;
  left:2px;
  top:2px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 1px 3px rgba(0,0,0,.4);
  transition:transform .2s;
}

.switch input:checked + .slider::before{
  transform:translateX(16px);
}

.label-left,
.label-right{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  white-space:nowrap !important;
  border:0 !important;
}