/* SummitGO OP — Gestaltungs-Grundlage nach dem Designleitfaden des Klickdummys F22.
   Grundfläche #F4F1E9, weiße Karten ohne Verläufe und Schatten, Gold nur als Marke. */
:root{
 --navy:var(--navy-800); --navy2:#1E3C5F; --gold:var(--gold-500); --goldhell:#FDFBF5; --goldlinie:#E4D6B8;
 --grund:#F4F1E9; --linie:#D9DEE2; --text:var(--navy-900); --neben:var(--grau-700); --leise:#8A93A0;
 --flaeche2:#EEF2F4;
 --gruen:var(--gruen-600); --gruenf:var(--gruen-100);
 --orange:var(--orange-700); --orangef:var(--gold-100);
 --rot:var(--rot-700); --rotf:var(--rot-100);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--schrift-familie);font-size:14px;color:var(--text);background:var(--grund);min-height:100vh;display:flex;flex-direction:column}
h1{font-size:24px;line-height:32px;font-weight:800;letter-spacing:-.015em;margin-bottom:8px}
h2{font-size:16px;line-height:24px;font-weight:600;margin:24px 0 8px}
.unter{font-size:13px;color:var(--neben);margin-bottom:14px}

/* Marke: woertlich aus standard-referenz/logo/erscheinungsbild.css (Angleich 30.08.2026) */
.sgo-marke{display:flex;align-items:center;text-decoration:none;color:inherit}
.sgo-marke .sgo-schleife{width:48px;height:48px;display:block}
.sgo-marke .sgo-strich{width:1px;height:30px;background:#8A9BB0;margin:0 10px}
.sgo-marke .sgo-text{display:flex;flex-direction:column;gap:4px}
.sgo-marke .sgo-schriftzug{height:21px;width:auto;display:block}
.sgo-marke .sgo-modulname{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;
  font-size:8.5px;letter-spacing:.32em;text-transform:uppercase;color:#C3CDD8;padding-left:1px;white-space:nowrap}
header{background:var(--navy);color:var(--weiss);display:flex;align-items:center;gap:14px;padding:8px 18px}
.wortmarke{font-family:Georgia,serif;font-size:17px;letter-spacing:1px;line-height:1.1}
.wortmarke i{font-style:italic;font-weight:600;color:var(--weiss)}
.wortmarke b{color:var(--gold);font-weight:700;font-style:normal}
.wortmarke small{display:block;font-family:var(--schrift-familie);font-size:8.5px;letter-spacing:3.5px;color:#9FB0C4;margin-top:2px}
header .praxis{margin-left:auto;font-size:12px;color:#9FB0C4}

main.mitte{flex:1;width:100%;max-width:860px;margin:0 auto;padding:24px 20px 40px}
footer{text-align:center;font-size:11.5px;color:var(--leise);padding:14px}

/* Arbeitsansicht: Seitenleiste + Inhalt (nach Klickdummy F22) */
.rumpf{display:flex;flex:1;min-height:0}
.rumpf aside{width:248px;flex:0 0 auto;background:#FBFAF5;border-right:1px solid var(--linie);padding:10px 0 24px}
.rumpf main{flex:1;min-width:0;padding:24px 32px 64px}
/* Zwei-Spalten-Raster für die Bögen. Der OP-Doku-Bogen füllt es mit zwei
   .bogen-spalte, die je für sich dicht stapeln (keine verstreuten Leerflächen mehr,
   wie sie ein starres Zeilenraster bei ungleich hohen Nachbarn lässt); die übrigen
   Bögen legen ihre Rubriken direkt hinein (grid-column:1/-1 = volle Breite). */
.bogen-gitter{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 12px;align-items:start}
.s-arbeit{background:var(--orangef);color:var(--orange)}
.s-offen{background:var(--flaeche2);color:var(--neben)}
.s-voll{background:var(--gruenf);color:var(--gruen)}
.rerg{display:flex;align-items:center;gap:8px;padding:3px 12px 6px;border-top:1px dashed var(--sand-200)}
.rerg form{display:flex;flex:1;gap:6px;align-items:center}
.rerg input{font-size:13px;padding:7px 9px}

/* Klickfelder: Chip (übernommen) und offene Kachelreihe */
.kfix{display:inline-flex;align-items:center;gap:7px;padding:5px 4px 5px 13px;border:1px solid var(--linie);border-radius:999px;background:var(--weiss);max-width:100%}
.kf{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap;margin:2px 0;padding:4px 9px;border:1px dashed #DDE2E6;border-radius:12px;max-width:100%}
.zu-ende{border:none;background:none;color:var(--neben);font-size:12px;text-decoration:none}
.zu-ende:hover{color:var(--gold)}
form.kwf{display:contents}
.kachel{border:1px solid var(--grau-300);background:var(--weiss);border-radius:14px;padding:6px 11px;font-size:13px;color:var(--text);cursor:pointer;font-family:inherit}
.kachel:hover{border-color:var(--gold)}
.kachel.gewaehlt{background:var(--navy);border-color:var(--navy);color:var(--weiss);font-weight:600}
.kachel .eigen{color:var(--gold);margin-right:3px}
/* Einstellungen: dichtes Raster kompakter Listen; „eigener Begriff" hinter dem ⚙ */
.eleg{white-space:nowrap}
/* Zeiten kompakt: Felder mehrspaltig, Auswertung als waagerechte Kennzahl-Leiste */
.zeiten-felder{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:2px 18px}
.zsum{display:flex;flex-direction:column;gap:1px;background:var(--flaeche2);border:1px solid var(--linie);border-radius:8px;padding:5px 10px;min-width:96px}
.zsum b{font-size:15px;font-variant-numeric:tabular-nums;color:var(--text)}
.zsum small{font-size:11px;color:var(--neben);line-height:1.15}
.atab{width:100%;border-collapse:collapse;font-size:13.5px}

@media(max-width:1000px){
 .rumpf{flex-direction:column}
 .rumpf aside{width:100%;border-right:none;border-bottom:1px solid var(--linie)}
 .kachel{padding:9px 14px;font-size:14.5px}
}

@keyframes sgo-atmen{0%,100%{transform:scale(1);opacity:.92}50%{transform:scale(1.05);opacity:1}}
.kreisschleife.atmet{animation:sgo-atmen 5s ease-in-out infinite}
@keyframes sgo-drehen{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.kreisschleife.dreht{animation:sgo-drehen 2.6s linear infinite}
@media (prefers-reduced-motion:reduce){.kreisschleife.atmet,.kreisschleife.dreht{animation:none}}

.karte{background:var(--weiss);border:1px solid var(--linie);border-radius:12px;padding:18px 20px;margin-bottom:14px}
.karte.schmal{max-width:440px;margin:40px auto 14px}

input,select{font-family:inherit;font-size:14px;min-height:40px;padding:8px 16px;border:1px solid var(--grau-300);border-radius:10px;background:var(--weiss);color:var(--text);width:100%}
/* Ankreuz- und Optionsfelder sind keine Textfelder — nicht auf 100 % Breite blähen */
input[type=checkbox],input[type=radio]{width:auto;padding:0;margin:0;flex:0 0 auto}
/* Ankreuz-Zeile: Kästchen und Beschriftung auf einer Linie, normale Schrift */
label.ankreuz{display:flex;gap:8px;align-items:center;font-weight:500;color:var(--text);margin:8px 0}
input:focus{outline:2px solid var(--gold);outline-offset:0;border-color:var(--gold)}
label{display:block;font-size:12.5px;font-weight:600;color:var(--navy);margin:12px 0 5px}

/* Beschluss 30.08. (Abend): CTAs vollrund, 40er-Hoehe, sanftes Anheben. */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;border:1px solid var(--navy);background:var(--navy);color:var(--weiss);border-radius:999px;padding:0 24px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;transition:transform var(--uebergang),box-shadow var(--uebergang),background var(--uebergang)}
.knopf:hover{background:var(--navy2);transform:translateY(-1px);box-shadow:0 4px 12px rgba(23,37,56,.16)}
.knopf.gold{background:var(--gold);border-color:var(--gold)}
.knopf.zweit{background:var(--weiss);color:var(--navy)}
.knopf.zweit:hover{background:#F1EFE7}
.knopf.klein{min-height:32px;padding:0 16px;font-size:13px}

.meldung{border-radius:7px;padding:11px 14px;font-size:13.5px;margin:10px 0;line-height:1.5}
.m-rot{background:var(--rotf);color:var(--rot);border:1px solid #E8C4C0}
.m-gruen{background:var(--gruenf);color:var(--gruen);border:1px solid #BBDCD2}
.m-gelb{background:var(--orangef);color:var(--orange);border:1px solid #E8D3A8}
.hinweis{font-size:12px;color:var(--neben);margin-top:8px;line-height:1.5}

table{width:100%;border-collapse:collapse;font-size:13.5px}
th{background:#EDEDE6;color:var(--navy);text-align:left;padding:7px 10px;font-weight:700;font-size:12.5px;border-bottom:1px solid var(--linie)}
td{padding:8px 10px;border-bottom:1px solid #F0EEE6;vertical-align:middle}
.s-gruen{background:var(--gruenf);color:var(--gruen)}
.s-rot{background:var(--rotf);color:var(--rot)}
.s-grau{background:var(--flaeche2);color:var(--neben)}

.zeile{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.rechtsbund{margin-left:auto}
a{color:var(--navy);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--gold)}
a:hover{color:var(--gold)}

@media(max-width:700px){
 body{font-size:15px}
 input,select{font-size:16px}
 main{padding:16px 12px 40px}
}
.ckbox{width:34px;height:34px;flex:0 0 auto;border:1.5px solid var(--grau-300);border-radius:8px;background:var(--weiss);color:var(--weiss);font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:center;cursor:pointer}
.ckbox:hover{border-color:var(--gold)}
.ckbox.an{background:var(--navy);border-color:var(--navy)}

/* M4: OP-Steuerung (Designleitfaden F22) */
.steuerung .s-titel{font-size:24px;font-weight:500;margin-bottom:2px}
.steuerung .s-unter{font-size:13px;color:var(--neben);margin-bottom:12px}
.s-pillen{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.s-pille{border:1px solid var(--linie);background:var(--weiss);color:var(--text);border-radius:8px;padding:8px 14px;font-size:13px;cursor:pointer;text-decoration:none;font-family:inherit}
.s-pille.aktiv{background:var(--text);border-color:var(--text);color:var(--weiss);font-weight:600}
.steuerung select{width:auto;border:1px solid var(--linie);border-radius:8px;padding:8px 11px;font-size:13px;background:var(--weiss)}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
@media(min-width:1200px){.hero{grid-template-columns:repeat(4,1fr)}}
.balken{height:6px;border-radius:3px;background:var(--flaeche2);overflow:hidden;margin-top:12px}
.balken i{display:block;height:100%;border-radius:3px}
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:14px}
@media(min-width:1200px){.kpis{grid-template-columns:repeat(4,1fr)}}
.kpi{background:var(--weiss);border:1px solid var(--linie);border-radius:12px;padding:13px 14px;text-align:left;cursor:pointer;text-decoration:none;color:var(--text);display:block}
.kpi:hover{border-color:var(--navy-600)}
.kpi .kz{font-size:22px;font-weight:500}
.kpi .kz small{font-size:12px;color:var(--neben);font-weight:400}
.kpi .kl{font-size:12px;font-weight:600;margin-top:3px}
.kpi .ku{font-size:11px;color:var(--neben);margin-top:2px}
.g-achse{position:relative;height:20px;margin-left:64px;font-size:11px;color:var(--neben)}
.g-achse span{position:absolute;transform:translateX(-50%)}
.g-zeile{display:flex;align-items:flex-start;gap:8px;margin-bottom:14px}
.g-name{width:56px;flex:0 0 auto;font-size:13px;font-weight:600;padding-top:16px}
.g-spur{position:relative;flex:1;height:74px;border-top:1px solid var(--linie);border-bottom:1px solid var(--linie);background:repeating-linear-gradient(to right,var(--linie) 0,var(--linie) 1px,transparent 1px,transparent 25%)}
.g-block{position:absolute;top:10px;height:38px;background:#D9EAF4;border:1px solid #C2D8E8;border-left:4px solid var(--navy-600);border-radius:8px;font-size:12px;line-height:1.25;padding:4px 8px;cursor:pointer;overflow:hidden;white-space:nowrap;color:var(--text);text-align:left;text-decoration:none}
.g-block b{display:block;font-weight:600}
.g-block.spaet{background:var(--orangef);border-color:#E5CD9E;border-left-color:var(--orange)}
.g-luecke{position:absolute;top:52px;transform:translateX(-50%);font-size:11.5px;font-weight:600;color:var(--rot)}
.g-legende{display:flex;gap:18px;font-size:11.5px;color:var(--neben);margin-top:2px;flex-wrap:wrap;align-items:center}
.g-legende .lb{display:inline-block;width:16px;height:10px;border-radius:2px;margin-right:6px}
.steuerung .karte .kinhalt{padding:10px 16px 14px}

/* M4: Druckblätter */
.bogen{background:var(--weiss);border:1px solid var(--linie);border-radius:8px;padding:22px 24px}
.bogen .adresse{font-size:13px;color:var(--neben);line-height:1.5;flex:1}
.bogen h2.titel{font-size:19px;border-bottom:2px solid var(--navy);padding-bottom:6px;margin-bottom:14px}
.btab{width:100%;border-collapse:collapse;font-size:14px;margin-bottom:12px}
.btab th{background:#EDEDE6;color:var(--navy);font-weight:700;text-align:left;padding:7px 10px;border:1px solid var(--linie);font-size:13px}
.btab td{border:1px solid var(--linie);padding:7px 10px;vertical-align:middle}
/* Druck: sauberes DIN A4 für jedes Blatt — alle Bögen nutzen dieselbe Druckvorlage
   (#druckbereich), also gilt das hier für alles, was gedruckt wird. */
@page{size:A4;margin:14mm}
@media print{
 html,body{background:var(--weiss)}
 body *{visibility:hidden}
 #druckbereich,#druckbereich *{visibility:visible}
 #druckbereich{position:absolute;left:0;top:0;width:100%}
 .nicht-drucken,header,footer{display:none!important}
 /* Keine Karten-Optik im Druck — der Seitenrand kommt aus @page */
 .bogen{border:none;border-radius:0;box-shadow:none;padding:0}
 /* Hinterlegungen (Kopfzeilen der Tabellen, goldene Marke) mitdrucken */
 #druckbereich,#druckbereich *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
 /* Zeilen und Kopf nicht über den Seitenumbruch zerreißen */
 .btab{break-inside:auto}
 .btab tr{break-inside:avoid}
 .bogen h2.titel{break-after:avoid}
}

/* Abmelden-Knopf oben rechts im Kopf (auf allen angemeldeten Seiten) */
.kopf-abmelden{margin-left:14px;display:flex}
.kopf-abmelden button{background:transparent;color:var(--navy-100);border:1px solid #4A5F79;border-radius:7px;
 padding:6px 14px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;white-space:nowrap}
.kopf-abmelden button:hover{background:#24405f;border-color:#7E93AE;color:var(--weiss)}
@media(max-width:700px){.kopf-abmelden button{padding:6px 10px}}

/* Die Meldekarte — der eine KI-Eingang (Suite-Standard 04.08.2026, goldumrandet, oben).
   Gold ist hier Rahmen und Marke, der Senden-Knopf bleibt Marineblau. */
.meldekarte{border:1.5px solid var(--gold);background:var(--goldhell);padding:14px 16px 12px}
.meldekarte .mk-einladung{font-size:14.5px;font-weight:600;color:var(--navy);margin-bottom:8px}
.meldekarte .mk-saetze{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:8px}
.meldekarte .mk-eingabe{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.meldekarte textarea{flex:1 1 320px;min-height:44px;font-family:inherit;font-size:14px;padding:10px 12px;border:1px solid var(--grau-300);border-radius:6px;background:var(--weiss);color:var(--text);resize:vertical}
.meldekarte textarea:focus{outline:2px solid var(--gold);outline-offset:0;border-color:var(--gold)}
.meldekarte .mk-neben{border:1px solid var(--grau-300);background:var(--weiss);border-radius:7px;width:40px;height:40px;font-size:17px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:var(--neben)}
.meldekarte .mk-neben:hover{border-color:var(--gold);color:var(--gold)}
.meldekarte .mk-neben input{display:none}
.meldekarte .mk-anhang{font-size:12.5px;color:var(--neben);margin-top:6px}
.meldekarte .mk-anhang .kachel{padding:3px 9px;font-size:12.5px}
.meldekarte .mk-hinweis{font-size:12px;color:var(--neben);margin-top:8px;line-height:1.5}
/* Vorschau: links der Satz, rechts die Felder — live gekoppelt (KI-Vollmacht §5.5) */
.vorschau h1{font-size:20px}
.sprechprobe{font-size:15px;color:var(--navy);background:var(--weiss);border:1px solid var(--goldlinie);border-left:4px solid var(--gold);border-radius:8px;padding:10px 14px;margin:8px 0 12px}
.planliste{list-style:decimal inside;margin:8px 0}
.planliste li{padding:8px 0;border-bottom:1px dashed var(--sand-200)}
.planliste li.gedimmt{color:var(--neben)}
.planliste .hinweise{display:block;font-size:12.5px;color:var(--orange);margin-top:3px}
.planliste .felder{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:6px}
.planliste .felder label{margin:0;font-size:12px}
.planliste .felder input{width:auto;min-width:160px;font-size:13px;padding:6px 9px}
.planer{font-size:12px;color:var(--leise);margin-top:6px}
/* Haftende Bestätigungsleiste: bleibt sichtbar, bis der Mensch übernimmt (eiserne Regel) */
.haftleiste{position:sticky;bottom:0;display:flex;gap:12px;align-items:center;flex-wrap:wrap;background:var(--navy);color:var(--weiss);padding:12px 16px;border-radius:10px;margin-top:14px;font-size:14px}
.haftleiste .knopf{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.haftleiste a{color:var(--navy-100);text-decoration-color:var(--gold)}
.antwortknoepfe{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.antwortknoepfe form{display:contents}
.ergebnisliste{list-style:none;margin:8px 0}
.ergebnisliste li{padding:7px 0;border-bottom:1px dashed var(--sand-200)}

/* Hilfe und Kontakt (Suite-Standard 1.5, 22.08.2026) — Eingang in der Kopfzeile,
   Haftleiste am Telefon und das Fenster nach Punkt 28. Stile Wort für Wort aus der
   OP-Dokumentation (Referenz-Umsetzung), Farben aus den Variablen dieses Moduls. */
.hilfe-eingang{display:inline-flex;align-items:center;gap:7px;text-decoration:none;
 color:var(--weiss);font-size:13px;font-weight:600;padding:6px 12px;border-radius:999px;
 border:1px solid var(--gold);background:transparent;white-space:nowrap}
.hilfe-eingang:hover{background:#24405f;color:var(--weiss)}
.hilfe-eingang .ring{font-size:16px;line-height:1}
/* Handy-Fußleiste: am Bildschirm verborgen, unter 700 px eingeblendet. */
.hilfe-haft{display:none}
@media(max-width:700px){
 .hilfe-haft{position:fixed;left:0;right:0;bottom:0;z-index:90;background:var(--weiss);
  border-top:1px solid var(--linie);padding:9px 14px;display:flex;justify-content:center}
 .hilfe-haft .hilfe-eingang{color:var(--navy);border-color:var(--gold);background:var(--weiss)}
 .hilfe-haft .hilfe-eingang:hover{background:var(--goldhell);color:var(--navy)}
 body{padding-bottom:52px}
}
@media print{.hilfe-eingang,.hilfe-haft{display:none!important}}

/* Das Fenster: Kopfbalken, feine Linie, zwei Knöpfe — Punkt 28 des Standards.
   Der Rettungsring erscheint im Fenster nur EINMAL, in der Überschrift. */
.huk-kopf{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
 padding-bottom:12px;border-bottom:1px solid var(--linie);margin-bottom:14px}
.huk-kopf h1{margin:0;font-size:20px;display:flex;align-items:center;gap:9px}
.huk-kopf .modul{color:var(--neben);font-weight:400;font-size:15px}
.huk-trenner{width:1px;align-self:stretch;background:var(--linie);margin:0 4px}
.huk-knopf{display:inline-block;padding:7px 14px;border-radius:8px;text-decoration:none;
 border:1px solid var(--linie);background:var(--weiss);color:var(--text);font-size:14px;
 font-family:inherit;cursor:pointer}
.huk-knopf:hover{border-color:var(--navy)}
.huk-knopf.aktiv{background:var(--navy);border-color:var(--navy);color:var(--weiss)}
.huk-rechts{margin-left:auto;display:flex;gap:8px}
.huk-neu{display:block;text-align:center;margin-bottom:10px;
 background:var(--goldhell);border-color:var(--gold)}

.huk-zwei{display:grid;grid-template-columns:300px 1fr;gap:18px;align-items:start}
.huk-liste{border:1px solid var(--linie);border-radius:10px;background:var(--weiss);overflow:hidden}
.huk-liste .eintrag{display:block;padding:11px 13px;border-bottom:1px solid var(--linie);
 text-decoration:none;color:var(--text)}
.huk-liste .eintrag:last-child{border-bottom:none}
.huk-liste .eintrag:hover{background:var(--goldhell)}
.huk-liste .eintrag.aktiv{background:var(--sand-100)}
.huk-liste .betreff{font-weight:500;font-size:14px}
.huk-liste .neben{color:var(--neben);font-size:12.5px;margin-top:2px}
/* Der goldene Punkt: es liegt eine Antwort vor (Suite-Bauteil hilfe_dienst, Schlüssel „neu") */
.huk-neu-punkt{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold,var(--gold-500));margin-right:6px;vertical-align:middle}
.huk-inhalt{border:1px solid var(--linie);border-radius:10px;background:var(--weiss);padding:16px 18px}
.huk-titel{margin:0;font-size:18px;font-weight:600}
.huk-stand{color:var(--neben);font-size:12.5px;margin-top:10px}
.huk-kapitel{border-bottom:1px solid var(--linie);padding:12px 0}
.huk-kapitel:last-child{border-bottom:none}
.huk-kapitel h3{margin:0 0 3px;font-size:15.5px}
.huk-kapitel .dauer,.huk-inhalt .dauer{color:var(--neben);font-size:12.5px}
.huk-inhalt textarea{font-family:inherit;font-size:14px;padding:10px 12px;
 border:1px solid var(--grau-300);border-radius:6px;background:var(--weiss);color:var(--text);width:100%}
.huk-inhalt textarea:focus{outline:2px solid var(--gold);outline-offset:0;border-color:var(--gold)}
.huk-bildkasten{padding:10px 12px;background:var(--goldhell);border:1px solid var(--goldlinie);
 border-radius:8px;margin-top:10px;display:block}
.huk-bildkasten .dauer{display:block;margin-top:6px}

/* Verlauf eines Vorgangs — links die eigenen Zeilen, rechts unsere. */
.huk-gespraech{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.huk-gespraech .blase{max-width:82%;padding:10px 13px;border-radius:12px;border:1px solid var(--linie)}
.huk-gespraech .blase p{margin:0 0 6px}
.huk-gespraech .blase p:last-of-type{margin-bottom:0}
.huk-gespraech .meine{align-self:flex-end;background:var(--sand-100);border-color:#E8E2D0}
.huk-gespraech .ihre{align-self:flex-start;background:var(--flaeche2)}
.huk-gespraech .zeit{color:var(--neben);font-size:12px;margin-top:6px}

/* Handy: die beiden Knöpfe rücken in eine zweite Zeile, der Zweispalter wird einspaltig. */
@media(max-width:900px){
 .huk-zwei{grid-template-columns:1fr}
 .huk-rechts{margin-left:0;width:100%}
}

/* Der Satzspeicher der Meldekarte (KI-Vollmacht §13.2, Fassung 28.08.2026).
   Zwei Vorräte an zwei Orten: die grüne Reihe über dem Feld trägt NUR eigene
   Standards, das zuletzt Gesagte liegt hinter dem Pfeil neben dem Feld. */
.mk-eingabe{position:relative}
.mk-zuletzt{position:absolute;right:0;top:100%;z-index:40;margin-top:4px;
 max-height:19rem;overflow-y:auto;min-width:22rem;max-width:min(34rem,90vw);
 background:var(--flaeche,var(--weiss));border:1px solid var(--rand,#D6DAE0);
 border-radius:10px;box-shadow:0 8px 24px rgba(31,44,61,.18);padding:.3rem}
.mk-zuletzt-satz{display:block;width:100%;text-align:left;background:none;
 border:0;padding:.45rem .6rem;border-radius:7px;font:inherit;color:inherit;
 cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-zuletzt-satz:hover,.mk-zuletzt-satz:focus{background:var(--grundf,#F2F4F7)}
#mk-standard-form{display:flex;gap:.5rem;margin:.35rem 0 .1rem}
#mk-standard-feld{flex:1;min-width:0}
