:root{--marke:#C75E7D;--text:#222;--leise:#666;--grund:#faf7f8;--karte:#fff;--rand:#e6dde0;--gruen:#2e7d4f;--rot:#b3261e}
@media (prefers-color-scheme:dark){:root{--text:#eee;--leise:#aaa;--grund:#17141a;--karte:#221e25;--rand:#3a3340}}
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--text);background:var(--grund)}
header{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;padding:.75rem 1rem;background:var(--marke);color:#fff}
header nav{display:flex;flex-wrap:wrap;gap:.25rem 1rem}
header a{color:#fff;text-decoration:none}
main{max-width:900px;margin:0 auto;padding:1rem}
h1{font-size:1.3rem;word-break:break-word}h2{font-size:1.1rem;margin-top:1.5rem}
a{color:var(--marke)}
.karte{background:var(--karte);border:1px solid var(--rand);border-radius:10px;padding:1rem;margin:1rem 0}
.hinweis{border-left:4px solid var(--marke)}
.schmal{max-width:360px;margin:3rem auto;display:grid;gap:.75rem}
.zeile{display:grid;grid-template-columns:7rem 9rem 1fr auto;gap:.5rem;align-items:center;padding:.6rem .75rem;margin:.35rem 0;background:var(--karte);border:1px solid var(--rand);border-radius:8px;color:var(--text);text-decoration:none}
.zeile:hover{border-color:var(--marke)}
.kanal{font-weight:600}.titel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.leise{color:var(--leise);font-size:.9rem}
@media (max-width:640px){.zeile{grid-template-columns:1fr auto}.zeile>span:nth-child(2){display:none}.zeile .titel{grid-column:1/-1;white-space:normal}}
.badge{font-size:.8rem;padding:.1rem .5rem;border-radius:999px;background:var(--rand);white-space:nowrap}
.s-geprueft{background:#d8eadf;color:#1d5134}.s-durchgefallen,.s-abgelehnt{background:#f6d9d7;color:#7a1a14}
.s-freigegeben{background:#d9e6f6;color:#173f6e}.s-gepostet{background:#e7e7e7;color:#333}
pre{white-space:pre-wrap;word-break:break-word;font:15px/1.5 ui-monospace,Consolas,monospace;margin:.5rem 0}
dl.kopf{display:grid;grid-template-columns:max-content 1fr;gap:.2rem 1rem;font-size:.9rem}
dl.kopf dt{color:var(--leise)}dl.kopf dd{margin:0;word-break:break-word}
.aktionen{display:flex;flex-wrap:wrap;gap:.75rem;margin:1rem 0}
.aktionen form{display:flex;flex-wrap:wrap;gap:.5rem;flex:1 1 260px}
input,textarea{width:100%;font:inherit;padding:.55rem;border:1px solid var(--rand);border-radius:8px;background:var(--karte);color:var(--text)}
textarea{font-family:ui-monospace,Consolas,monospace;font-size:14px}
button{font:inherit;padding:.55rem 1rem;border:0;border-radius:8px;background:var(--marke);color:#fff;cursor:pointer}
a.knopf{display:inline-block;padding:.55rem 1rem;border-radius:8px;background:var(--marke);color:#fff;text-decoration:none}
button.gruen{background:var(--gruen)}button.rot{background:var(--rot)}
.fehler{color:var(--rot)}
details{margin:.75rem 0}summary{cursor:pointer;font-weight:600}
button.mikro{background:transparent;color:var(--marke);border:1px solid var(--marke);padding:.35rem .8rem;margin:.35rem 0;font-size:.9rem}
button.leise-knopf{background:transparent;color:var(--leise);border:1px solid var(--rand);padding:.3rem .7rem;font-size:.85rem}
#idee{display:grid;gap:.6rem}
.vorschau{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.vorschau img{width:96px;height:96px;object-fit:cover;border-radius:6px;border:1px solid var(--rand)}
form.inline{display:inline}
