* { box-sizing: border-box; margin: 0; }
body { font-family: system-ui, sans-serif; background: #f4f2ec; color: #222; height: 100dvh; display: flex; flex-direction: column; }
.versteckt { display: none !important; }
.karte { max-width: 26rem; margin: 20vh auto; background: #fff; padding: 2rem; border-radius: 12px; box-shadow: 0 2px 12px #0002; }
.karte h1 { font-size: 1.6rem; margin-bottom: 1rem; }
.karte input { width: 100%; padding: .6rem; margin: .8rem 0; font-size: 1rem; }
.karte button, #frage-formular button { padding: .6rem 1.2rem; background: #1a1a2e; color: #fff; border: 0; border-radius: 8px; cursor: pointer; }
.fehler { color: #a33; margin-top: .6rem; }
#chat-bereich { display: flex; flex-direction: column; height: 100dvh; max-width: 52rem; margin: 0 auto; width: 100%; }
header { display: flex; gap: .8rem; align-items: center; padding: .6rem .8rem; background: #1a1a2e; color: #fff; }
header select { font-size: .9rem; }
header #budget-anzeige { margin-left: auto; font-size: .8rem; opacity: .85; }
header button { background: transparent; border: 1px solid #fff5; color: #fff; border-radius: 6px; padding: .25rem .6rem; font-size: .8rem; cursor: pointer; }
#verlauf { flex: 1; overflow-y: auto; padding: 1rem; }
.nachricht { margin-bottom: 1rem; padding: .7rem .9rem; border-radius: 10px; white-space: pre-wrap; line-height: 1.45; }
.nachricht.nutzer { background: #dde4f0; margin-left: 15%; }
.nachricht.dtalk { background: #fff; margin-right: 10%; box-shadow: 0 1px 4px #0001; }
.nachricht h2, .nachricht h3, .nachricht h4 { margin: .4rem 0 .2rem; font-size: 1.05rem; }
.nachricht code { background: #eee; padding: 0 .3rem; border-radius: 4px; font-size: .9em; }
.nachricht .meta { display: block; margin-top: .5rem; font-size: .75rem; color: #667; }
#status { min-height: 1.4rem; padding: 0 .9rem; font-size: .8rem; color: #557; font-style: italic; }
#frage-formular { display: flex; gap: .6rem; padding: .8rem; background: #fff; border-top: 1px solid #ddd; }
#frage { flex: 1; resize: none; padding: .6rem; font-size: 1rem; border: 1px solid #ccc; border-radius: 8px; }
.warnung { color: #96a; }