/* auswahl.css – Entwurf v1 (04.10.2026). Nur Klassen mit Präfix fm-au-. Variablen überschreibbar: --fm-ok, --fm-bad, --fm-text, --fm-flaeche, --fm-linie, --fm-akzent. */
.fm-au{
  --fm-ok:#1f9d74; --fm-ok-bg:#e3f6ee; --fm-bad:#d9503f; --fm-bad-bg:#fdeae7;
  --fm-text:#1d2940; --fm-flaeche:#ffffff; --fm-linie:#d5dbe6; --fm-akzent:#2d4a8a;
  color:var(--fm-text); font-size:1.1rem; line-height:1.4;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .fm-au{
    --fm-ok:#46c79a; --fm-ok-bg:#16372d; --fm-bad:#ff7d6b; --fm-bad-bg:#40201b;
    --fm-text:#eef1f7; --fm-flaeche:#1e2538; --fm-linie:#3a4560; --fm-akzent:#9db7f0;
  }
}
:root[data-theme="dark"] .fm-au{
  --fm-ok:#46c79a; --fm-ok-bg:#16372d; --fm-bad:#ff7d6b; --fm-bad-bg:#40201b;
  --fm-text:#eef1f7; --fm-flaeche:#1e2538; --fm-linie:#3a4560; --fm-akzent:#9db7f0;
}
.fm-au-titel{margin:0 0 .3em;font-size:1.25em}
.fm-au-hinweis{margin:0 0 .8em}
.fm-au-liste{list-style:none;margin:0;padding:0}
.fm-au-item{background:var(--fm-flaeche);border:3px solid var(--fm-linie);border-radius:20px;padding:12px 14px;margin:0 0 14px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.fm-au-item[hidden]{display:none}
.fm-au-item.is-ok{border-color:var(--fm-ok);background:var(--fm-ok-bg)}
.fm-au-item.is-bad{border-color:var(--fm-bad)}
.fm-au-item.is-fehlt{border-color:var(--fm-bad);animation:fm-au-puls 1s ease 2}
.fm-au-zitat{margin:0 0 .6em;padding:.4em .8em;border-left:4px solid var(--fm-akzent);font-style:italic}
.fm-au-quelle{display:block;font-style:normal;opacity:.8}
.fm-au-frage{margin:0 0 .6em;display:flex;gap:10px;align-items:flex-start;font-weight:600}
.fm-au-nr{flex:0 0 auto;min-width:34px;height:34px;border-radius:17px;background:var(--fm-akzent);color:var(--fm-flaeche);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.95em}
.fm-au-text{flex:1;min-width:0;overflow-wrap:anywhere}
.fm-au-luecke{display:inline-block;min-width:3.5em;border-bottom:3px solid var(--fm-akzent);text-align:center;letter-spacing:.1em}
.fm-au-optionen{display:flex;flex-direction:column;gap:10px}
.fm-au-opt{-webkit-appearance:none;appearance:none;display:flex;align-items:center;gap:10px;text-align:left;width:100%;min-height:52px;min-width:44px;padding:8px 14px;border-radius:16px;border:3px solid var(--fm-linie);
  background:var(--fm-flaeche);color:var(--fm-text);font:inherit;cursor:pointer;touch-action:manipulation}
.fm-au-opt:focus-visible{outline:3px solid var(--fm-akzent);outline-offset:2px}
.fm-au-opt[disabled]{cursor:default}
.fm-au-opt[disabled]:not(.is-gewaehlt){opacity:.55}
.fm-au-buchstabe{flex:0 0 auto;width:30px;height:30px;border-radius:15px;background:var(--fm-linie);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9em}
.fm-au-optext{flex:1;min-width:0;overflow-wrap:anywhere}
.fm-au-opt.is-gewaehlt{border-color:var(--fm-akzent)}
.fm-au-opt.is-richtig{border-color:var(--fm-ok);background:var(--fm-ok-bg)}
.fm-au-opt.is-falsch{border-color:var(--fm-bad);background:var(--fm-bad-bg)}
.fm-au-opt.is-loesung{outline:3px dashed var(--fm-ok);outline-offset:2px}
.fm-au-rueck{margin-top:8px;font-weight:600;min-height:1.3em}
.fm-au-rueck.is-ok{color:var(--fm-ok)}
.fm-au-rueck.is-bad{color:var(--fm-bad)}
.fm-au-zaehler,.fm-au-karte-kopf,.fm-au-ergebnis{margin:.5em 0 0;font-weight:600}
.fm-au-zusatz{margin-top:10px}
.fm-au-pruefen,.fm-au-weiter{-webkit-appearance:none;appearance:none;min-height:48px;min-width:44px;padding:0 24px;border-radius:24px;border:3px solid var(--fm-akzent);
  background:var(--fm-akzent);color:var(--fm-flaeche);font:inherit;font-weight:800;cursor:pointer;touch-action:manipulation;margin-top:6px}
.fm-au-pruefen[disabled]{opacity:.5;cursor:default}
.fm-au-item.is-schuettelt{animation:fm-au-wackeln .5s ease}
@keyframes fm-au-wackeln{0%,100%{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}
@keyframes fm-au-puls{0%,100%{box-shadow:0 0 0 0 transparent}50%{box-shadow:0 0 0 6px var(--fm-bad-bg)}}
@media (prefers-reduced-motion:reduce){.fm-au-item.is-schuettelt,.fm-au-item.is-fehlt{animation:none}}
