/* Schalter: Kippschalter (Fizzy .switch) und Schloss/Weltkugel für innen/öffentlich. */
@layer bausteine {
  .kipp { appearance: none; -webkit-appearance: none; width: 2.7rem; height: 1.5rem; margin: 0; border-radius: var(--rundung-pille); background: var(--ton-5); position: relative; cursor: pointer; transition: background var(--dauer); flex-shrink: 0; }
  .kipp::after { content: ""; position: absolute; top: .18rem; left: .18rem; width: 1.14rem; height: 1.14rem; border-radius: 50%; background: Canvas; box-shadow: 0 1px 3px rgba(0, 0, 0, .4); transition: transform var(--dauer) var(--kurve-schwung); }
  .kipp:hover { background: color-mix(in srgb, var(--ton-5) 80%, CanvasText); }
  .kipp:checked { background: var(--d-akzent); }
  .kipp:checked::after { transform: translateX(1.2rem); }
  .kipp:disabled { opacity: .5; cursor: not-allowed; }
  .welt-schalter { display: inline-flex; align-items: center; gap: .5rem; cursor: pointer; font-size: .9rem; }
  .welt-schalter .symbol { opacity: .6; }
  .welt-text .welt-offen, .welt-schalter:has(.kipp:checked) .welt-innen { display: none; }
  .welt-schalter:has(.kipp:checked) .welt-offen { display: inline; }
  .schalter { display: flex; gap: .5rem; align-items: center; font-size: .9rem; }
  .geraet-wahl { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
  .geraet-wahl label { display: inline-flex; flex-direction: row; gap: .3rem; align-items: center; }
  .art-wahl, .sichtbar-wahl { display: flex; gap: .8rem; flex-wrap: wrap; font-size: .9rem; }
  .art-wahl label, .sichtbar-wahl label { display: inline-flex; flex-direction: row; align-items: center; gap: .3rem; cursor: pointer; }
  .sichtbar-wahl { flex: 1; font-size: var(--klein); }
  .sichtbar-wahl small { opacity: .5; }
}