/* MBO ERP-Mobil – Projekt-Chat am Handy (Stufe 3) – Chat im Auftrag MSO. Präfix .mc- (keine Überschneidung mit index.html). */
.mc-badge{display:inline-block;min-width:18px;height:18px;border-radius:9px;background:var(--crit);color:#fff;font:700 11px 'IBM Plex Mono',monospace;line-height:18px;text-align:center;padding:0 5px}
.nav button{position:relative}
.nav button .mc-badge{position:absolute;top:2px;left:calc(50% + 4px)}
.mc-demo{background:var(--warn-soft);color:var(--warn);font:600 11px 'IBM Plex Mono',monospace;letter-spacing:.04em;border:1px solid var(--warn);border-radius:10px;padding:5px 10px;margin-bottom:10px;text-align:center}
.mc-such{display:flex;gap:8px;margin-bottom:10px;position:sticky;top:0;background:var(--bg);padding:4px 0;z-index:3}
.mc-such input{flex:1;min-height:46px;border:1px solid var(--accent);border-radius:12px;background:var(--panel);color:var(--text);padding:0 12px;font:inherit;font-size:16px}
.mc-qr{width:46px;min-height:46px;border-radius:12px;border:1px solid var(--border);background:var(--panel);font-size:19px;cursor:pointer}
.mc-chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin-bottom:8px;scrollbar-width:none}
.mc-chip{border:1px solid var(--border);border-radius:20px;padding:7px 12px;font-weight:600;font-size:12.5px;background:var(--panel);white-space:nowrap;cursor:pointer;color:var(--text);font-family:inherit}
.mc-chip.akt{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.mc-gl{font:600 10px 'IBM Plex Mono',monospace;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;margin:4px 0}
.mc-proj{display:flex;gap:10px;align-items:center;padding:11px 0;border-top:1px solid var(--border);cursor:pointer}
.mc-proj:first-child{border-top:0}
.mc-proj .mitte{flex:1;min-width:0}
.mc-proj .nr{font:600 13.5px 'IBM Plex Mono',monospace}
.mc-proj .nr mark{background:var(--accent-soft);color:var(--accent);border-radius:3px}
.mc-proj .nm{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-proj.fett .nr{font-weight:700}
.mc-stern{font-size:20px;color:var(--border);background:none;border:0;cursor:pointer;padding:4px}
.mc-stern.an{color:var(--warn)}
.mc-kopf{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.mc-kopf button{border:0;background:none;color:var(--accent);font-size:24px;padding:2px 8px 2px 0;cursor:pointer}
.mc-kopf .t{font:700 15px 'IBM Plex Mono',monospace}
.mc-kopf .s{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-verlauf{display:flex;flex-direction:column;gap:8px;padding-bottom:84px}
.mc-msg{max-width:86%}
.mc-msg .von{font-size:11px;color:var(--muted);margin:0 2px 2px}
.mc-msg .bl{background:var(--panel);border:1px solid var(--border);border-radius:14px 14px 14px 4px;padding:8px 10px;white-space:pre-wrap;word-wrap:break-word}
.mc-msg.ich{align-self:flex-end}
.mc-msg.ich .bl{background:var(--accent-soft);border-color:var(--accent);border-radius:14px 14px 4px 14px}
.mc-msg.system .bl{background:transparent;border-style:dashed;color:var(--muted);font-size:12px}
.mc-msg img{display:block;max-width:100%;border-radius:10px;margin-top:6px}
.mc-msg .datei{display:block;margin-top:6px;font-size:12.5px;color:var(--accent);text-decoration:none}
.mc-msg .dok{font:600 10px 'IBM Plex Mono',monospace;color:var(--muted);margin-top:3px}
.mc-eingabe{position:fixed;left:0;right:0;bottom:calc(66px + env(safe-area-inset-bottom));background:var(--panel);border-top:1px solid var(--border);padding:8px 12px;display:flex;gap:8px;align-items:flex-end;max-width:520px;margin:0 auto;z-index:6}
.mc-eingabe textarea{flex:1;min-height:42px;max-height:120px;border:1px solid var(--border);border-radius:20px;padding:10px 14px;font:inherit;font-size:16px;resize:none;background:var(--bg);color:var(--text)}
.mc-rund{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:18px;border:1px solid var(--border);background:var(--panel);cursor:pointer;flex:none;color:var(--text)}
.mc-rund.prim{background:var(--accent);border-color:var(--accent);color:#fff}
.mc-leer{text-align:center;color:var(--muted);padding:24px 8px}
.mc-qrbox video{width:100%;border-radius:12px;background:#000}

/* Live-Bild (live.js) */
.mc-live-knoepfe{display:flex;gap:6px;flex:none}
.mc-live-k{width:40px;height:40px;border-radius:12px;border:1px solid var(--border);background:var(--panel);font-size:18px;cursor:pointer}
.mc-live-k.aus{opacity:.45}
.mc-live-band{display:flex;align-items:center;gap:8px;background:var(--accent-soft);border:1px solid var(--accent);border-radius:12px;padding:8px 10px;margin-bottom:8px;font-size:13px}
.mc-live-band span{flex:1;min-width:0}
.mc-live-band .knopf{width:auto;min-height:34px;padding:0 12px}
.mc-live{position:fixed;inset:0;background:#000;z-index:50;display:flex;flex-direction:column}
.mc-live-kopf{display:flex;align-items:center;gap:8px;color:#fff;padding:calc(10px + env(safe-area-inset-top)) 14px 8px}
.mc-live-kopf .sp{flex:1}.mc-live-kopf .klein{color:#B9C6D8}
.mc-live video{flex:1;width:100%;min-height:0;object-fit:contain;background:#000}
.mc-live-status{position:absolute;top:50%;left:0;right:0;text-align:center;color:#fff;font-size:14px}
.mc-live-fuss{display:flex;gap:8px;padding:10px 14px calc(12px + env(safe-area-inset-bottom));justify-content:center;flex-wrap:wrap}
.mc-live-fuss .knopf{width:auto;padding:0 16px}

.mc-live-flaeche{position:relative;flex:1;min-height:0;display:flex;cursor:crosshair}
.mc-live-flaeche video{flex:1;width:100%;height:100%;min-height:0;object-fit:contain;background:#000}
.mc-live-zeiger{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.mc-live-tipp{color:#93A3C2;font-size:12px;text-align:center;padding:4px 10px 0}
.mc-puls{animation:mc-puls 1.2s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes mc-puls{0%{opacity:1;transform:scale(.6)}100%{opacity:0;transform:scale(1.8)}}

/* Sender Bildschirm: kompakte Vorschau unten rechts statt Vollbild (kein Spiegel-im-Spiegel, Chat bleibt bedienbar) – MSO 11.11.2026 */
.mc-live.mc-live-mini{inset:auto 16px 16px auto;width:min(380px,calc(100vw - 32px));height:auto;border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.45);overflow:hidden;border:2px solid #F17368}
.mc-live-mini .mc-live-kopf{padding:8px 10px;font-size:13px}
.mc-live-mini .mc-live-flaeche{flex:none;height:210px}
.mc-live-mini .mc-live-tipp{font-size:11px}
.mc-live-mini .mc-live-fuss{padding:8px 10px;gap:6px}
.mc-live-mini .mc-live-fuss .knopf{min-height:34px;padding:0 10px;font-size:13px}
.mc-live-mini.mc-live-zu .mc-live-flaeche,.mc-live-mini.mc-live-zu .mc-live-tipp{display:none}
.mc-live-mini.mc-live-blink{animation:mc-blink .5s ease-in-out 3}
@keyframes mc-blink{50%{box-shadow:0 0 0 6px #F0BB53}}
.mc-live.mc-live-impip{position:static;inset:auto;width:100vw;height:100vh;border:0;border-radius:0;box-shadow:none}
.mc-live-impip .mc-live-flaeche{flex:1;height:auto}

/* ---- Fassung 6 (MSO 11.11.2026): Live-Bild im Chat – Knöpfe, Band, Bühne, kompakte Sender-Vorschau, Aufnahme ---- */
.ch-live-k{display:inline-flex;gap:4px}
.cl-k{border:1px solid var(--border,#dde3ea);background:var(--panel,#fff);border-radius:8px;min-width:32px;height:32px;font-size:16px;cursor:pointer;padding:0 6px}
.cl-k:hover{border-color:var(--accent,#1f5fbf)}.cl-k.cl-aus{opacity:.45}
.cl-band{display:flex;align-items:center;gap:8px;background:var(--accent-soft,#e8f0fc);border:1px solid var(--accent,#1f5fbf);border-radius:10px;padding:6px 10px;margin:4px 0;font-size:13px}
.cl-band span{flex:1;min-width:0}.cl-ansehen{border:0;background:var(--accent,#1f5fbf);color:#fff;border-radius:8px;padding:5px 12px;font-weight:600;cursor:pointer}
.cl-rec,.cl-rec-anz{color:#F17368;font-weight:700}.cl-rec-anz{margin-left:10px;font-size:12px;animation:cl-rec 1.2s ease-in-out infinite}
@keyframes cl-rec{50%{opacity:.35}}
.cl-live{position:fixed;inset:0;background:#000;z-index:9000;display:flex;flex-direction:column;font:14px system-ui,sans-serif}
.cl-kopf{display:flex;align-items:center;gap:8px;color:#fff;padding:calc(10px + env(safe-area-inset-top)) 14px 8px}
.cl-sp{flex:1}.cl-info{color:#B9C6D8;font-size:12px}
.cl-flaeche{position:relative;flex:1;min-height:0;display:flex;cursor:crosshair}
.cl-flaeche video{flex:1;width:100%;height:100%;min-height:0;object-fit:contain;background:#000}
.cl-zeiger{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.cl-status{position:absolute;top:50%;left:0;right:0;text-align:center;color:#fff}
.cl-tipp{color:#93A3C2;font-size:12px;text-align:center;padding:4px 10px 0}
.cl-fuss{display:flex;gap:8px;padding:10px 14px calc(12px + env(safe-area-inset-bottom));justify-content:center;flex-wrap:wrap}
.cl-btn{border:1px solid #3a4a63;background:#1b2636;color:#fff;border-radius:10px;min-height:38px;padding:0 14px;font-size:14px;cursor:pointer}
.cl-btn:hover{background:#26344a}.cl-rot{border-color:#F17368;color:#F17368}.cl-rot-voll{background:#c0392b;border-color:#c0392b}
.cl-puls{animation:cl-puls 1.2s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes cl-puls{0%{opacity:1;transform:scale(.6)}100%{opacity:0;transform:scale(1.8)}}
.cl-live.cl-mini{inset:auto 16px 16px auto;width:min(400px,calc(100vw - 32px));border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.45);overflow:hidden;border:2px solid #F17368}
.cl-mini .cl-kopf{padding:8px 10px;font-size:13px}.cl-mini .cl-flaeche{flex:none;height:220px}.cl-mini .cl-tipp{font-size:11px}
.cl-mini .cl-fuss{padding:8px 10px;gap:6px}.cl-mini .cl-btn{min-height:32px;padding:0 10px;font-size:12.5px}
.cl-mini.cl-zu .cl-flaeche,.cl-mini.cl-zu .cl-tipp{display:none}
.cl-mini.cl-blink{animation:cl-blink .5s ease-in-out 3}@keyframes cl-blink{50%{box-shadow:0 0 0 6px #F0BB53}}
.cl-live.cl-impip{position:static;inset:auto;width:100vw;height:100vh;border:0;border-radius:0;box-shadow:none}
.cl-impip .cl-flaeche{flex:1;height:auto}
.cl-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:#0D1B2E;color:#fff;padding:10px 16px;border-radius:12px;font:14px system-ui,sans-serif;opacity:0;transition:.25s;z-index:9100;pointer-events:none;max-width:90vw}
.cl-toast.an{opacity:1;transform:translateX(-50%) translateY(0)}
#mc-live-k .cl-k{width:40px;height:40px;border-radius:12px;font-size:18px}
.cl-teilen-jetzt{position:fixed;inset:0;background:rgba(13,27,46,.55);z-index:9050;display:flex;align-items:center;justify-content:center;font:14px system-ui,sans-serif}
.cl-teilen-jetzt>div{background:#fff;color:#1b2430;border-radius:14px;padding:20px 22px;max-width:360px;box-shadow:0 10px 40px rgba(0,0,0,.35)}
.cl-teilen-jetzt .cl-btn{background:#eef2f7;color:#1b2430;border-color:#dde3ea}