/* werkstatt-kern.css — gemeinsame Tokens und Grundformen der Denkwerkstatt (06.11.2026), auf jeder Seite.
   FARBE BEDEUTET IMMER EINE STIMME ODER EINEN ZUSTAND (Konzept Abschnitt 5), in allen Geräten gleich, nie mehr als diese vier:
     --stimme-kant  Gold   = Kant und das Gesetz
     --stimme-du    Blau   = das eigene Urteil der Besucherin / des Besuchers
     --stimme-gegen Grau   = die belegte Gegenstimme
     --widerspruch  Siegelrot = Widerspruch, Bruchpunkt
   Je Farbe eine *-soft-Fläche. Textfarben erfüllen ≥ 4,5:1 auf --box und --bg (hell und dunkel). */
:root[data-theme="light"] {
  --stimme-kant: #835f0e; --stimme-kant-soft: rgba(169, 125, 30, .13);
  --stimme-du: #1e3a5f;   --stimme-du-soft: rgba(30, 58, 95, .10);
  --stimme-gegen: #555c6b; --stimme-gegen-soft: rgba(85, 92, 107, .11);
  --widerspruch: #a63429; --widerspruch-soft: rgba(166, 52, 41, .10);
}
:root[data-theme="dark"] {
  --stimme-kant: #d3a94f; --stimme-kant-soft: rgba(211, 169, 79, .15);
  --stimme-du: #8fb4e8;   --stimme-du-soft: rgba(143, 180, 232, .15);
  --stimme-gegen: #b7bdcb; --stimme-gegen-soft: rgba(183, 189, 203, .12);
  --widerspruch: #ec7466; --widerspruch-soft: rgba(236, 116, 102, .15);
}

/* Rahmen jedes neuen Mitmach-Geräts: <div class="geraet" data-geraet="<register-id>"> … </div>
   (data-geraet schneidet der Vorleser heraus, s. gen-audio.mjs MITMACH). */
.geraet {
  background: var(--box); border: 1px solid var(--line); border-radius: var(--radius);
  padding: clamp(16px, 3vw, 28px); margin: 1.6rem 0; position: relative;
}
.geraet :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.geraet button { min-height: 44px; }
.geraet button:active { scale: .97; }

/* Drei Stimmen der Auflösung: <div class="stimmen"><div class="stimme stimme--du">…</div><div class="stimme stimme--kant">…</div><div class="stimme stimme--gegen">…</div></div> */
.stimmen { display: grid; gap: 12px; margin-top: 1rem; }
@media (min-width: 760px) { .stimmen { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } }
.stimme { border-radius: 10px; padding: 12px 14px; border-left: 4px solid; }
.stimme__wer { display: block; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; font-weight: 600; margin-bottom: .3rem; }
.stimme--du { background: var(--stimme-du-soft); border-color: var(--stimme-du); }
.stimme--du .stimme__wer { color: var(--stimme-du); }
.stimme--kant { background: var(--stimme-kant-soft); border-color: var(--stimme-kant); }
.stimme--kant .stimme__wer { color: var(--stimme-kant); }
.stimme--gegen { background: var(--stimme-gegen-soft); border-color: var(--stimme-gegen); }
.stimme--gegen .stimme__wer { color: var(--stimme-gegen); }
.ist-widerspruch { color: var(--widerspruch); }

/* Beamer-Modus (Paket K2 schaltet html[data-beamer="1"]; hier nur der Knopf in der Kopfleiste). */
.beamer-toggle[hidden] { display: none; }