/* ============================================================
   Switch — トグル
   オンの色は署名色 --brand。設定はシステム自身の振る舞いであり、
   記号色を許す数少ない例外。
   ============================================================ */

.toggle {
  width: 46px; height: 26px; border-radius: var(--radius-pill);
  background: var(--line); position: relative; flex: none;
  transition: background var(--dur-fast);
}
.toggle::after {
  content: ""; position: absolute; top: 3px; left: 3px;
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--surface); box-shadow: 0 1px 2px rgba(0,0,0,.18);
  transition: transform var(--dur-fast);
}
.toggle[aria-pressed="true"] { background: var(--brand); }
.toggle[aria-pressed="true"]::after { transform: translateX(20px); }
.toggle:disabled { opacity: .4; }