/* Sprich mit dem Agenten · Ergänzungen zu spiel.css */

/* Begriffe-Zuordnung (Level 1) */
.mpool{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.mterm{border:1px solid var(--ink-600);border-radius:var(--r-full);background:transparent;color:var(--ink-50);font-family:var(--mono);font-size:13px;padding:8px 15px;cursor:pointer;transition:border-color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}
.mterm:hover{border-color:var(--gold-400)}
.mterm.sel{border-color:var(--gold-500);background:rgba(237,170,60,.14);color:var(--gold-400)}
.mterm.gone{display:none}
.mcards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mcard{position:relative;padding:14px 16px;border:1px solid var(--ink-700);border-radius:var(--r-md);background:var(--ink-900);color:var(--ink-300);font-size:14px;line-height:1.55;text-align:left;cursor:pointer;transition:border-color var(--dur-fast) var(--ease)}
.mcard:hover{border-color:var(--blue-400)}
.mcard.solved{border-color:rgba(61,214,140,.5);color:var(--ink-50);cursor:default}
.mcard.solved::before{content:attr(data-term);display:block;margin-bottom:5px;font-family:var(--mono);font-size:12px;color:#3DD68C}
.mcard.shake{animation:mshake .26s}
@keyframes mshake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media (max-width:720px){
  .mcards{grid-template-columns:1fr}
}

/* Chat mit dem Agenten (Level 2 bis 4) */
.chat{display:flex;flex-direction:column;gap:11px;margin-top:4px}
.bub{max-width:88%;padding:12px 16px;border-radius:14px;font-size:14.5px;line-height:1.6;color:var(--ink-50)}
.bub .who{display:block;margin-bottom:4px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-300)}
.bub.agent{align-self:flex-start;background:var(--ink-800);border:1px solid var(--ink-700);border-bottom-left-radius:4px}
.bub.agent code{font-family:var(--mono);font-size:13px;color:var(--gold-400)}
.bub.you{align-self:flex-end;background:rgba(46,92,255,.15);border:1px solid rgba(46,92,255,.42);border-bottom-right-radius:4px}
.bub.you .who{color:var(--blue-400)}
.copts{display:flex;flex-direction:column;gap:8px;align-self:flex-end;width:88%;margin-top:2px}
.copt{padding:11px 15px;border:1px solid var(--ink-600);border-radius:12px;background:transparent;color:var(--ink-50);font-size:14px;line-height:1.5;text-align:left;cursor:pointer;transition:border-color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}
.copt:hover{border-color:var(--blue-400);background:rgba(46,92,255,.07)}
.copt.wrong{border-color:rgba(242,84,91,.55);color:var(--ink-300);cursor:default}
.copt.shake{animation:mshake .26s}
.chint{align-self:flex-end;width:88%;margin:0;font-size:13px;line-height:1.55;color:var(--gold-400)}
.chint:empty{display:none}