/* Baustein [mischungsberater] (mischungsberater.js): Fragen als Bild-Kacheln, Raigras-Check, Ergebnis-Karten mit Guetezeichen */
.mb-berater{--g:#2f6b62;--g-hell:#e3efeb;--g-rand:#cfe0db;--flaeche:#f6faf8;--leise:#5d6b67;--text:#1f2d2a;
  margin:1.5rem 0;padding:16px;border:1px solid #d9e4e0;border-radius:14px;background:#fff;color:var(--text)}
.mbb-kopf{display:flex;align-items:center;gap:10px;margin-bottom:10px;color:var(--g)}
.mbb-kopf svg{width:36px;height:36px;flex:none}
.mbb-kopf b{display:block;font-size:1.2rem;color:var(--text)}.mbb-kopf span{font-size:.82rem;color:var(--leise)}
.mbb-fragen{display:grid;gap:14px;margin:0}
.mbb-frage{border:0;margin:0;padding:0;min-width:0}
.mbb-frage legend{display:flex;align-items:center;gap:8px;font-weight:700;font-size:.98rem;margin-bottom:8px;padding:0}
.mbb-nr{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--g-hell);color:var(--g);font-size:.8rem;font-variant-numeric:tabular-nums}
.mbb-frage.beantwortet .mbb-nr{background:var(--g);color:#fff}
.mbb-optionen{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:8px}
.mbb-kachel{position:relative;cursor:pointer;display:flex}
.mbb-kachel input{position:absolute;opacity:0;width:1px;height:1px}
.mbb-kachel>span{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-height:92px;padding:10px 12px;border:1.5px solid var(--g-rand);border-radius:12px;background:var(--flaeche);line-height:1.2;transition:border-color .15s,background .15s}
.mbb-kachel svg{width:30px;height:30px;color:var(--g);margin-bottom:4px}
.mbb-kachel b{font-size:.94rem}
.mbb-kachel small{font-size:.76rem;color:var(--leise)}
.mbb-kachel:hover>span{border-color:var(--g)}
.mbb-kachel input:checked+span{border-color:var(--g);background:var(--g);color:#fff}
.mbb-kachel input:checked+span svg,.mbb-kachel input:checked+span small{color:#e3efeb}
.mbb-kachel input:focus-visible+span{outline:3px solid var(--g);outline-offset:2px}
.mbb-check{margin-top:10px;padding:12px 14px;border-radius:12px;background:#f3f7ee;border:1px dashed #b9cfa8}
.mbb-check-kopf{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.mbb-punkte{display:flex;gap:6px}.mbb-punkte i{width:10px;height:10px;border-radius:50%;background:#d6e2cf}
.mbb-punkte i.fertig{background:var(--g)}.mbb-punkte i.jetzt{background:#fff;box-shadow:0 0 0 2px var(--g)}
.mbb-check-frage{font-weight:600;margin:4px 0 8px}
.mbb-check-urteil{display:flex;align-items:center;gap:8px;margin:4px 0 8px;font-size:1.02rem}
.mbb-check-urteil svg{width:28px;height:28px}
.mbb-u-ja{color:#1f6b3c}.mbb-u-nein{color:#8a2c1c}.mbb-u-offen{color:#7a5500}
.mbb-klein{font-size:.76rem;color:var(--leise);margin:8px 0 0}
.mbb-zurueck{display:inline-flex;align-items:center;gap:4px;justify-self:start;font:inherit;font-size:.85rem;color:var(--g);background:none;border:0;text-decoration:underline;cursor:pointer;min-height:36px;padding:0;margin-top:6px}
.mbb-zurueck svg{width:16px;height:16px}
.mbb-ergebnis{margin-top:18px;border-top:1px solid #e3ebe8;padding-top:12px}
.mbb-ergebnis-kopf{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.mbb-ergebnis h4{margin:4px 0;font-size:1.1rem}.mbb-ergebnis h5{margin:18px 0 6px;font-size:.92rem;color:var(--leise)}
.mbb-offen{font-size:.8rem;color:var(--leise);background:var(--flaeche);border-radius:999px;padding:1px 10px}
.mbb-leer{font-size:.9rem;color:var(--leise);margin:4px 0 8px}
.mbb-karten{display:grid;gap:10px;margin-top:8px}
.mbb-karte{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;border:1px solid #d9e4e0;border-radius:12px;padding:12px}
.mbb-karte.mbb-eingeschraenkt{background:#fffdf6}
.mbb-etikett{align-self:start;display:flex;flex-direction:column;align-items:center;justify-content:center;width:56px;height:68px;border-radius:6px;background:var(--zeichen);color:#fff;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.mbb-etikett span{font-size:.62rem;letter-spacing:.08em;font-weight:700;opacity:.9}
.mbb-etikett b{font-size:1.3rem;line-height:1.1}
.mbb-karte-inhalt{min-width:0}
.mbb-titel{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}.mbb-titel b{font-variant-numeric:tabular-nums}
.mbb-meta{margin:2px 0 8px;font-size:.84rem;color:var(--leise)}
.mbb-gruende{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px}
.mbb-gruende li{font-size:.8rem;border-radius:999px;padding:2px 10px 2px 8px}
.mbb-ja{background:#e3efeb;color:#1f4d46}
.mbb-warn{background:#fff4d6;color:#7a5500}
.mbb-nein{background:#fbe7e3;color:#8a2c1c}
.mbb-gruende li::before{content:"";display:inline-block;width:.8em;height:.8em;margin-right:5px;vertical-align:-.05em;background:currentColor;-webkit-mask:var(--z) center/contain no-repeat;mask:var(--z) center/contain no-repeat}
.mbb-ja{--z:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E")}
.mbb-warn{--z:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v9M12 19v.01'/%3E%3C/svg%3E")}
.mbb-nein{--z:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E")}
.mbb-hinweis{font-size:.84rem;margin:8px 0 0}
.mbb-knoepfe{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.mbb-mehr{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:.86rem;font-weight:600;color:var(--g);background:var(--flaeche);border:1px solid var(--g-rand);border-radius:8px;min-height:40px;padding:0 12px;cursor:pointer}
.mbb-mehr svg{width:20px;height:20px}
.mbb-mehr[aria-expanded="true"]{background:var(--g-hell)}
.mbb-detail .mb-wurzeln{margin:10px 0 0;border:0;padding:0}
.mbb-detail .mbw-info,.mbb-detail .mbw-kopf b{display:none}
.mbb-quelle{font-size:.78rem;color:var(--leise);margin-top:14px}
@media (max-width:520px){.mb-berater{padding:12px}.mbb-optionen{grid-template-columns:repeat(2,minmax(0,1fr))}.mbb-kachel>span{min-height:84px;padding:8px 10px}
 .mbb-karte{grid-template-columns:40px minmax(0,1fr);gap:10px;padding:10px}.mbb-etikett{width:40px;height:52px}.mbb-etikett b{font-size:1rem}}
@media (prefers-reduced-motion:reduce){.mbb-kachel>span{transition:none}}
