/* Claude 04.10.2026 (Etappe 55b): Layout-Vorlagen M09–M16 (Mein Begleiter, Rückfragen, Fundstücke, Ein Gedanke,
   Daumenleiste, Gedankenbuch, Sprechraum, Der nächste Schritt) nach Bild (853x1844 -> 390x844 CSS-px, Farben per
   Pipette aus den Originalen). Vertrag (Bausteine, IDs, Tokens, Testregeln): docs/designvorschlaege/LAYOUT_VERTRAG.md.
   Grundregeln und Token-Abbildung stehen in layouts-a.css; hier
     6) Grundregeln der Bausteine aus Etappe 55b (Begrüssung, Rückfrage, Sprechraum, grosses Ergebnis, Kopf-Zusätze,
        Avatarwechsel am Portrait, „Zum Gedächtnis“) – ohne Vorlage unsichtbar, von jeder Vorlage nutzbar
     7) M09 … M16
   Jede Regel ist mit html[data-layout…] eingegrenzt; keine Inline-Styles (CSP), nur lokale Schriften. */

/* ---------- 6) Bausteine aus Etappe 55b --------------------------------- */
/* M09–M16 setzen alle Abstände der Gesprächsspalte selbst (app.css gibt #conversation sonst gap:14px). */
html[data-layout]:is([data-layout="m09"],[data-layout="m10"],[data-layout="m11"],[data-layout="m12"],[data-layout="m13"],[data-layout="m14"],[data-layout="m15"],[data-layout="m16"]):root #app #conversation:not(.hidden){row-gap:0}
html[data-layout]:root #app #conversation #layoutWechsel{order:3}
html[data-layout]:root #app #conversation #layoutFuss{order:15}
html[data-layout]:root #app #conversation #layoutFuss:empty{display:none}
html[data-layout]:root #layoutKopf .lay-verlauf{gap:6px;font-weight:600}
html[data-layout]:root #layoutKopf .lay-verlauf .lay-chevron{width:16px;height:16px}
html[data-layout]:root #layoutKopf .lay-erweitern{gap:10px;font-size:13.5px}
html[data-layout]:root #layoutKopf .lay-erweitern .lay-icon{width:18px;height:18px}
html[data-layout]:root #layoutIdentitaet .lay-identitaet-wechseln:not([hidden]){display:inline-flex;align-items:center;gap:4px;align-self:flex-start;min-height:40px;margin-block:-5px;padding:0;border:0;background:none;color:var(--theme-accent-text);font:inherit;font-size:13.5px;cursor:pointer}
html[data-layout]:root #layoutIdentitaet .lay-identitaet-wechseln .lay-icon{width:16px;height:16px}
html[data-layout]:root #app #conversation #layoutWechsel:not([hidden]){display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--muted);box-shadow:0 2px 8px rgba(0,0,0,.12);cursor:pointer}
html[data-layout]:root #app #conversation #layoutWechsel .lay-icon{width:22px;height:22px}

/* Begrüssung (Panel „gruss“): Vorzeile, Titel, Unterzeile, Notiz; optional zwei Einstiegskarten */
html[data-layout]:root .lay-gruss{display:grid;gap:18px;padding:8px 20px 4px;text-align:center}
html[data-layout]:root .lay-gruss-woerter{display:grid;gap:8px;justify-items:center}
html[data-layout]:root .lay-gruss-vor{margin:0;font-size:15px;color:var(--muted)}
html[data-layout]:root .lay-gruss-titel{margin:0;font-size:24px;font-weight:700;line-height:1.2;letter-spacing:-.01em;color:var(--text)}
html[data-layout]:root .lay-gruss-zeile{margin:0;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
html[data-layout]:root .lay-gruss-unter{max-width:320px;margin:0;font-size:15.5px;line-height:1.5;color:var(--muted)}
html[data-layout]:root .lay-gruss-notiz{margin:0;font-family:"Segoe Script","Bradley Hand","Snell Roundhand","URW Chancery L",cursive;font-size:15px;line-height:1.35;color:var(--muted)}
html[data-layout]:root .lay-gruss-karten{display:grid;gap:14px;padding:0 17px}
html[data-layout]:root .lay-gruss-karte{display:grid;grid-template-columns:56px 1fr 24px;align-items:center;gap:20px;min-height:100px;padding:14px 16px 14px 18px;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--text);font:inherit;text-align:left;cursor:pointer}
html[data-layout]:root .lay-gruss-karte:focus-visible{outline:2px solid var(--d-focus);outline-offset:2px}
html[data-layout]:root .lay-gruss-symbol{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--theme-accent-soft);color:var(--theme-accent-text)}
html[data-layout]:root .lay-gruss-symbol .lay-icon{width:26px;height:26px}
html[data-layout]:root .lay-gruss-karte-woerter{display:grid;gap:5px;min-width:0}
html[data-layout]:root .lay-gruss-karte-woerter strong{font-size:17.5px;font-weight:700;line-height:1.25}
html[data-layout]:root .lay-gruss-karte-woerter small{font-size:13.5px;line-height:1.4;color:var(--muted)}
html[data-layout]:root .lay-gruss-pfeil{color:var(--theme-accent-text)}

/* Rückfrage als Hauptabschnitt (Panel „rueckfrage“) mit Fuss unter dem Composer */
html[data-layout]:root .lay-rf{display:grid;gap:14px;padding:18px 18px 8px}
html[data-layout]:root .lay-rf-kopf{display:flex;align-items:center;gap:14px}
html[data-layout]:root .lay-rf-bild{width:66px;height:66px;flex:0 0 66px}
html[data-layout]:root .lay-rf-woerter{display:grid;gap:5px;min-width:0}
html[data-layout]:root .lay-rf-titel{margin:0;font-size:20px;font-weight:700;line-height:1.25;color:var(--text);overflow-wrap:anywhere}
html[data-layout]:root .lay-rf-text{margin:0;font-size:15px;line-height:1.45;color:var(--text)}
html[data-layout]:root .lay-rf-label{display:block;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
html[data-layout]:root .lay-rf-verlauf{display:grid;gap:8px;padding:14px 14px 12px;border-radius:12px;background:var(--lay-rf-verlauf,var(--lay-erhoben))}
html[data-layout]:root .lay-rf-zeile{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px}
html[data-layout]:root .lay-rf-wer{min-width:28px;font-size:13px;color:var(--muted)}
html[data-layout]:root .lay-rf-blase{justify-self:start;max-width:100%;padding:6px 14px;border-radius:10px;background:var(--lay-blase-user);color:var(--text);font-size:13.5px;line-height:1.4;overflow-wrap:anywhere}
html[data-layout]:root .lay-rf-zeile[data-rolle="avatar"] .lay-rf-blase{background:var(--lay-blase)}
html[data-layout]:root .lay-rf-trenn{padding-top:16px;border-top:1px solid var(--line)}
html[data-layout]:root .lay-rf .lay-ablage{min-height:104px;gap:4px;padding:12px 14px;border-radius:10px}
html[data-layout]:root .lay-rf .lay-ablage-symbol .lay-icon{width:32px;height:32px}
html[data-layout]:root .lay-rf .lay-ablage-titel{font-size:13.5px;font-weight:400}
html[data-layout]:root .lay-ablage-link{color:var(--theme-accent-text)}
html[data-layout]:root .lay-rf .lay-ablage-formate{margin-top:2px;font-size:10.5px}
html[data-layout]:root .lay-rf-antwort{padding-top:6px}
html[data-layout]:root #layoutFuss{display:grid;gap:14px;padding:14px 18px 20px}
html[data-layout]:root .lay-fuss-spaeter{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:40px;padding:0 16px;border:0;border-radius:10px;background:var(--lay-erhoben);color:var(--text);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
html[data-layout]:root .lay-fuss-spaeter .lay-icon{width:20px;height:20px}
html[data-layout]:root .lay-fuss-zurueck{justify-self:start;font-size:14px;font-weight:500}

/* Sprechraum (Panel „sprechen“): grosse Aufnahmetaste, Wechsel zu Text, Transkript */
html[data-layout]:root .lay-sprechraum{display:flex;flex-direction:column;align-items:center;gap:0;padding:0 15px 8px;text-align:center}
html[data-layout]:root .lay-sprech-titel{margin:8px 0 6px;font-size:26px;font-weight:700;line-height:1.2;letter-spacing:-.01em;color:var(--text)}
html[data-layout]:root .lay-sprech-unter{margin:0;font-size:15px;color:var(--muted)}
html[data-layout]:root .lay-sprech-mic{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:136px;height:136px;margin:22px 0 0;padding:0;border:2px solid var(--accent);border-radius:50%;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--accent) 34%,var(--lay-bg)) 0%,color-mix(in srgb,var(--accent) 16%,var(--lay-bg)) 70%);color:#ffffff;font:inherit;font-size:13px;box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 10%,transparent),0 0 28px color-mix(in srgb,var(--accent) 45%,transparent);cursor:pointer}
html[data-layout]:root .lay-sprech-mic .lay-icon{width:40px;height:40px;stroke-width:1.6}
html[data-layout]:root .lay-sprech-stopp{display:none}
html[data-layout]:root #app:has(#mic.recording) .lay-sprech-start{display:none}
html[data-layout]:root #app:has(#mic.recording) .lay-sprech-stopp{display:inline}
html[data-layout]:root #app:has(#mic.recording) .lay-sprech-mic{background:color-mix(in srgb,var(--accent) 45%,var(--lay-bg))}
html[data-layout]:root .lay-sprech-text{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-width:206px;min-height:44px;margin-top:18px;padding:0 24px;border:1px solid var(--line);border-radius:22px;background:var(--surface);color:var(--text);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
html[data-layout]:root .lay-sprech-text .lay-icon{width:22px;height:22px}
html[data-layout]:root .lay-sprech-transkript{display:flex;align-items:center;gap:14px;width:100%;min-height:48px;margin-top:20px;padding:0 18px;border:1px solid var(--line);border-radius:14px;background:var(--lay-feld);color:var(--text);font:inherit;font-size:14px;text-align:left;cursor:pointer}
html[data-layout]:root .lay-sprech-transkript .lay-icon{width:20px;height:20px;color:var(--muted)}
html[data-layout]:root .lay-sprech-transkript .lay-chevron{margin-left:auto}

/* Grosses Einzelergebnis (Panel „ergebnis“ mit ansicht.ergebnis) */
html[data-layout]:root .lay-ergebnis-gross{gap:0;padding:0 20px 8px}
html[data-layout]:root .lay-ergebnis-kopf{display:grid;gap:2px;padding-bottom:18px}
html[data-layout]:root .lay-ergebnis-titel{margin:0;font-size:26px;font-weight:700;line-height:1.25;letter-spacing:-.01em;color:var(--text)}
html[data-layout]:root .lay-ergebnis-unter{margin:0;font-size:15px;color:var(--muted)}
html[data-layout]:root .lay-ergebnis-suchzeile{display:flex;gap:9px;margin-top:22px}
html[data-layout]:root .lay-ergebnis-suche{display:flex;flex:1 1 auto;align-items:center;gap:14px;min-height:42px;padding:0 16px;border:0;border-radius:21px;background:var(--lay-suchfeld,var(--lay-feld));color:var(--muted);font:inherit;font-size:15px;text-align:left;cursor:pointer}
html[data-layout]:root .lay-ergebnis-suche .lay-icon{width:21px;height:21px;color:var(--text)}
html[data-layout]:root .lay-ergebnis-filter{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;flex:0 0 42px;padding:0;border:0;border-radius:50%;background:var(--lay-suchfeld,var(--lay-feld));color:var(--text);cursor:pointer}
html[data-layout]:root .lay-ergebnis-filter .lay-icon{width:20px;height:20px}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-vorschau{height:clamp(220px,42svh,353px);padding:0;border-radius:14px}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-bild{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;box-shadow:none}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-zeile{padding:20px 0 0}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-symbol{display:none}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-woerter strong{font-size:20px;font-weight:700;color:var(--text)}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-woerter small{font-size:13px}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-leiste{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:16px;padding:0;background:none}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-leiste>*{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:47px;margin:0;padding:0 10px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);font:inherit;font-size:14.5px;font-weight:700;text-decoration:none;cursor:pointer}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-leiste>.lay-zurueck{border-color:transparent;background:var(--accent);color:var(--theme-accent-ink)}
html[data-layout]:root .lay-ergebnis-gross .lay-ergebnis-leiste .lay-icon{width:21px;height:21px}
html[data-layout]:root .lay-ergebnis-details{margin-top:18px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
html[data-layout]:root .lay-ergebnis-details summary{display:flex;align-items:center;gap:14px;min-height:47px;padding:0 16px;font-size:14px;font-weight:700;list-style:none;cursor:pointer}
html[data-layout]:root .lay-ergebnis-details summary::-webkit-details-marker{display:none}
html[data-layout]:root .lay-ergebnis-details summary .lay-icon{width:20px;height:20px;color:var(--muted)}
html[data-layout]:root .lay-ergebnis-details summary .lay-chevron{margin-left:auto;color:var(--text)}
html[data-layout]:root .lay-ergebnis-details[open] summary .lay-chevron{transform:rotate(180deg)}
html[data-layout]:root .lay-ergebnis-mehr{display:flex;gap:8px;padding:0 10px 10px}
html[data-layout]:root .lay-ergebnis-mehr .lay-leiste-knopf{border:1px solid var(--line);border-radius:10px}
html[data-layout]:root .lay-ergebnis-mehr .lay-leiste-knopf+.lay-leiste-knopf{border-left:1px solid var(--line);border-radius:10px}

/* „Zum Gedächtnis“ unter der neuesten Avatar-Antwort */
html[data-layout]:root #app #conversation .message .lay-gedaechtnis{display:flex;align-items:center;gap:6px;width:max-content;min-height:40px;margin:1px 0 -5px auto;padding:0;border:0;background:none;color:var(--theme-accent-text);font:inherit;font-size:11.5px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
html[data-layout]:root #app #conversation .message .lay-gedaechtnis .lay-icon{width:15px;height:15px}

/* ---------- 7) M09 · Mein Begleiter ---------------------------------------- */
/* Salbei/Weiss: grosses rundes Portrait mit Wechselknopf, Name, „Avatar wechseln“, Begrüssung, zweizeiliger Composer.
   Sobald Nachrichten da sind, rückt das Portrait klein nach oben links (Gesprächsansicht). */
/* Claude 04.10.2026 (Etappe 66, A-083): Schrift auf dem Akzent dunkel (weiss: 3.3:1) */
html[data-layout="m09"]:root{--lay-bg:#fbfcfb;--lay-flaeche:#ffffff;--lay-feld:#f1f4f1;--lay-erhoben:#e9eee9;--lay-linie:#e3e8e3;--lay-text:#13261f;--lay-gedaempft:#5f6764;
  --lay-akzent:#7f927f;--lay-akzent-ink:#121a13;--lay-akzent-text:#4b6652;--lay-zweit:#a9b9aa;
  --lay-blase:#ffffff;--lay-blase-linie:#e5eae5;--lay-blase-user:#e7eee7;--lay-blase-user-ink:#13261f;
  --lay-nav-bg:#fbfcfb;--lay-nav-linie:#eef1ee;--lay-nav-text:#6b6d6d;--lay-nav-aktiv:#3f5a47;--lay-kopf-bg:transparent;--lay-marke:#1d3a32;--lay-marke-zeichen:#2f4a40;
  --lay-pille-bg:#f2f4f1;--lay-pille-linie:transparent;--lay-pille-text:#4f5653;--lay-composer-bg:#f1f4f1;--lay-composer-linie:transparent;
  --lay-knopf-text:#5d6461;--lay-platzhalter:#858c8a;--lay-ring:#e3ebe3;--lay-nav-strich:22px}
html[data-layout="m09"]:root #layoutKopf{min-height:84px;padding:12px 18px 12px 24px}
html[data-layout="m09"]:root #layoutKopf .lay-marke-text{font-size:19px;font-weight:600;letter-spacing:.24em}
html[data-layout="m09"]:root #layoutKopf .lay-marke-svg{width:24px;height:24px;stroke-width:3}
html[data-layout="m09"]:root #layoutKopf .lay-pille.lay-suche{min-width:129px;min-height:40px;border-radius:12px;font-size:14px}
html[data-layout="m09"]:root #app #conversation:not(:has(.message)) #stage{width:238px;height:238px;margin:19px auto 0;border-radius:50%;box-shadow:0 0 0 8px var(--lay-ring),0 6px 24px rgba(40,60,45,.08)}
html[data-layout="m09"]:root #app #conversation:not(:has(.message)) #layoutWechsel{align-self:center;margin:-55px 0 9px;transform:translateX(94px)}
html[data-layout="m09"]:root #app #conversation:has(.message) #layoutWechsel{display:none}
html[data-layout="m09"]:root #app #conversation:not(:has(.message)) #layoutIdentitaet{align-items:center;gap:2px;min-height:0;margin:16px 16px 0}
html[data-layout="m09"]:root #app #conversation:not(:has(.message)) #layoutIdentitaet .lay-identitaet-name{font-size:26px;font-weight:600;color:#0d2420}
/* Claude 24.10.2026 (Handy-Waechter): #6c8270 auf rgb(251,252,251) waren 4.03:1 (UI-Pruefung, Kategorie C).
   Gleicher Farbton, dunkler -> 5.09:1. */
html[data-layout="m09"]:root #app #conversation:not(:has(.message)) #layoutIdentitaet .lay-identitaet-wechseln{align-self:center;color:#5e7162}
html[data-layout="m09"]:root #layoutIdentitaet .lay-identitaet-status{display:none}
html[data-layout="m09"]:root #app #conversation:has(.message) #layoutPanel[data-art="gruss"]{display:none}
html[data-layout="m09"]:root #app #conversation:not(:has(.message)) :is(#suggestions,#messages){display:none}
html[data-layout="m09"]:root #app #conversation:not(:has(.message)) #composer{margin-top:auto}
html[data-layout="m09"]:root #app #conversation:not(:has(.message)) #faehigkeitsVorschlaege{margin-top:10px}
html[data-layout="m09"]:root #app #conversation:not(:has(.message)):has(#faehigkeitsVorschlaege:not(.hidden)) #composer{margin-bottom:22px}
html[data-layout="m09"]:root .lay-gruss{padding:40px 24px 0}
html[data-layout="m09"]:root .lay-gruss-titel{font-size:25px;color:#07201c}
html[data-layout="m09"]:root .lay-gruss-unter{max-width:310px;margin-top:8px;font-size:15.5px;line-height:1.5;color:#4f5654}
html[data-layout="m09"]:root #app #conversation .message.user{border-radius:18px}
/* Composer zweizeilig: Text oben, darunter Anhang links, Mikrofon | Senden rechts */
html[data-layout="m09"]:root #app #conversation #composer{flex-wrap:wrap;gap:0 4px;min-height:97px;margin:6px 18px 46px;padding:12px 10px 9px 10px;border-radius:22px}
html[data-layout="m09"]:root #app #conversation #composer textarea{flex:1 1 100%;order:0;min-height:30px;padding:2px 8px 6px}
html[data-layout="m09"]:root #app #conversation #composer #mic{margin-left:auto}
html[data-layout="m09"]:root #app #conversation #composer .primary-slot{padding-left:10px;border-left:1px solid #dde3dd}
html[data-layout="m09"]:root #app #conversation #composer :is(.send,.stop){width:42px;height:42px;min-width:42px}
html[data-layout="m09"]:root #layoutNav{padding:12px 8px calc(24px + env(safe-area-inset-bottom));border-top-color:#f0f2f0}
html[data-layout="m09"]:root #layoutNav .lay-nav-ziel{gap:7px;font-size:12.5px}
html[data-layout="m09"]:root #layoutNav .lay-nav-ziel.active .lay-icon{fill:currentColor;fill-opacity:.55}
html[data-layout="m09"]:root #layoutNav .lay-nav-ziel.active::after{bottom:-6px;height:3px}

/* ---------- M10 · Rückfragen ------------------------------------------------ */
/* Helles Papier/Rot: offene Rückfrage als Karte (Avatar, Frage, Erklärung, Aus dem Gespräch, Datei optional,
   Antwortfeld mit „Antwort senden“, Später antworten, Zurück zum Gespräch). Ohne offene Rückfrage normales Gespräch. */
html[data-layout="m10"]:root{--lay-bg:#fdfaf8;--lay-flaeche:#ffffff;--lay-feld:#ffffff;--lay-erhoben:#efe7e3;--lay-linie:#ebe2de;--lay-text:#1a100d;--lay-gedaempft:#5e5856;
  --lay-akzent:#b5453c;--lay-akzent-ink:#ffffff;--lay-akzent-text:#a63f3a;--lay-zweit:#dcaaa5;
  --lay-blase:#ffffff;--lay-blase-linie:#efe6e2;--lay-blase-user:#ebe5e2;--lay-blase-user-ink:#1a100d;
  --lay-nav-bg:#fdfcf9;--lay-nav-linie:#efe8e4;--lay-nav-text:#6b6867;--lay-nav-aktiv:#a33c3c;--lay-kopf-bg:transparent;--lay-marke:#170d07;--lay-marke-zeichen:#b5534c;
  --lay-pille-bg:#f3efed;--lay-pille-linie:transparent;--lay-pille-text:#59524f;--lay-composer-bg:#ffffff;--lay-composer-linie:#e8e2df;
  --lay-knopf-bg:#ece9e8;--lay-knopf-text:#4b4847;--lay-platzhalter:#8f8987;--lay-ablage-linie:#dcd2ce;--lay-ablage-bg:#f5f0ee;--lay-ablage-symbol:#2b2523;
  --lay-rf-karte:#fbf5f2;--lay-rf-verlauf:#f3ece9;--lay-nav-strich:58px}
html[data-layout="m10"]:root #layoutKopf{min-height:58px;padding:10px 18px 4px 22px}
html[data-layout="m10"]:root #layoutKopf .lay-marke-text{font-size:19px;font-weight:600;letter-spacing:.22em}
html[data-layout="m10"]:root #layoutKopf .lay-marke-zeichen{color:transparent;background:linear-gradient(135deg,#e7b1a8,#b5453c);-webkit-background-clip:text;background-clip:text}
html[data-layout="m10"]:root #layoutKopf .lay-marke-svg{stroke:#b5534c;stroke-width:3.2}
html[data-layout="m10"]:root #layoutKopf .lay-pille.lay-suche{min-width:151px;min-height:40px;border-radius:12px}
html[data-layout="m10"]:root #app #conversation .message.user{border-radius:16px}
html[data-layout="m10"]:root .lay-rueckfrage{background:var(--lay-rf-karte)}
/* Karte: Panel (oben) + Composer (Mitte, Kartenfläche per Schatten) + Fuss (unten) ergeben eine Fläche */
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]){overflow-y:auto;scrollbar-width:none}
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]) :is(#stage,#layoutIdentitaet,#messages,#suggestions,#layoutKontext,.stage-caption,#faehigkeitsVorschlaege,#callButton){display:none}
html[data-layout="m10"]:root #app #conversation #layoutPanel[data-art="rueckfrage"]{position:relative;z-index:1;margin:8px 13px 0;border-radius:16px 16px 0 0;background:var(--lay-rf-karte)}
html[data-layout="m10"]:root .lay-rf{gap:12px;padding:17px 18px 8px}
html[data-layout="m10"]:root .lay-rf-titel{font-size:18.5px;color:#140908}
html[data-layout="m10"]:root .lay-rf .lay-augenbraue{font-size:10px;letter-spacing:.16em;color:#a83f3d}
html[data-layout="m10"]:root .lay-rf-text{margin-top:2px;font-size:13.5px;color:#1e1412}
html[data-layout="m10"]:root .lay-rf-verlauf{gap:6px;margin-top:6px;padding:12px 12px 10px}
html[data-layout="m10"]:root .lay-rf-zeile{gap:14px}
html[data-layout="m10"]:root .lay-rf-blase{padding:6px 14px;font-size:12.5px}
html[data-layout="m10"]:root .lay-rf-wer{min-width:28px;font-size:12px}
html[data-layout="m10"]:root .lay-rf-trenn{margin-top:2px;padding-top:12px}
html[data-layout="m10"]:root .lay-rf .lay-ablage{min-height:105px}
html[data-layout="m10"]:root .lay-rf .lay-ablage-titel{font-size:12.5px}
html[data-layout="m10"]:root .lay-rf .lay-ablage-formate{font-size:9.5px}
html[data-layout="m10"]:root .lay-rf-antwort{padding-top:14px}
html[data-layout="m10"]:root .lay-rf-label{font-size:9.5px;color:#605c5a}
html[data-layout="m10"]:root .lay-rf-wer{color:#585250}
html[data-layout="m10"]:root .lay-rf .lay-ablage-titel{color:#2b2523}
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]) #composer{flex-wrap:wrap;align-items:flex-end;gap:8px 10px;min-height:121px;margin:0 31px;padding:12px 10px 10px;border-radius:12px;box-shadow:0 0 0 18px var(--lay-rf-karte)}
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]) #composer textarea{flex:1 1 100%;order:0;min-height:52px;padding:4px 4px;font-size:14px}
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]) #composer textarea:placeholder-shown{height:52px}
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]) #composer .icon-button{width:40px;height:40px;min-width:40px;border:0;background:var(--lay-knopf-bg)}
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]) #composer .primary-slot{margin-left:auto}
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]) #composer .send{gap:10px;width:auto;min-width:141px;height:40px;padding:0 18px;border-radius:12px}
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]) #composer .send::before{width:19px;height:19px}
html[data-layout="m10"]:root #app #conversation:has(#layoutPanel[data-art="rueckfrage"]) #composer .send:is(:not([data-queue]),[data-queue=""])::after{content:attr(data-lay-text);font-size:13px;font-weight:600;white-space:nowrap}
html[data-layout="m10"]:root #app #conversation #layoutFuss:not(:empty){position:relative;z-index:1;gap:18px;margin:0 13px 12px;padding:14px 18px 16px;border-radius:0 0 16px 16px;background:var(--lay-rf-karte)}
html[data-layout="m10"]:root .lay-fuss-zurueck{min-height:40px;font-size:13px;color:#a74844}
html[data-layout="m10"]:root .lay-fuss-spaeter{min-height:40px;font-size:13px}
html[data-layout="m10"]:root #layoutNav{padding-top:10px}
html[data-layout="m10"]:root #layoutNav .lay-nav-ziel.active::after{height:3px}

/* ---------- M11 · Fundstücke ------------------------------------------------ */
/* Hellgrau/Lavendel: ein grosses Ergebnisbild unter Titel und Suche, darunter Name, „Zum Gespräch“ und „Original
   öffnen“, „Details“. „Zum Gespräch“ blendet das Gespräch ein; ohne Ergebnis normales Gespräch ohne Bühne. */
/* Claude 04.10.2026 (Etappe 66, A-083): Schrift auf dem Akzent dunkel (weiss: 3.6:1), gedämpfte Schrift etwas dunkler (4.4 → 4.9:1) */
html[data-layout="m11"]:root{--lay-bg:#f7f7fb;--lay-flaeche:#ffffff;--lay-feld:#ffffff;--lay-suchfeld:#ecedf3;--lay-erhoben:#e6e6ef;--lay-linie:#e2e3ec;--lay-text:#10112a;--lay-gedaempft:#62637d;
  --lay-akzent:#8b7bd8;--lay-akzent-ink:#10112a;--lay-akzent-text:#6946c9;--lay-zweit:#b9adf0;
  --lay-blase:#ffffff;--lay-blase-linie:#e7e7f0;--lay-blase-user:#e9e6fb;--lay-blase-user-ink:#10112a;
  --lay-nav-bg:#f8f8fc;--lay-nav-linie:#ebebf3;--lay-nav-text:#6a6b81;--lay-nav-aktiv:#6946c9;--lay-kopf-bg:transparent;--lay-marke:#1a1e3a;--lay-marke-zeichen:#8e8ba7;
  --lay-pille-bg:#ecedf3;--lay-pille-linie:transparent;--lay-pille-text:#55576e;--lay-composer-bg:#ffffff;--lay-composer-linie:#e2e3ec;
  --lay-knopf-text:#3e4060;--lay-platzhalter:#7c7d8f;--lay-vorschau-bg:#e6e6ef;--lay-nav-strich:0px}
html[data-layout="m11"]:root #layoutKopf{align-items:flex-start;min-height:62px;padding:12px 18px 6px 21px}
html[data-layout="m11"]:root #layoutKopf .lay-marke{margin-top:12px}
html[data-layout="m11"]:root #layoutKopf .lay-marke-text{font-size:17px;font-weight:600;letter-spacing:.3em}
html[data-layout="m11"]:root #layoutKopf .lay-marke-svg{stroke:#8e8ba7;stroke-width:3}
html[data-layout="m11"]:root #layoutKopf .lay-pille.lay-suche{min-width:130px;min-height:40px}
html[data-layout="m11"]:root #layoutKopf .lay-rund{border:0;box-shadow:0 0 0 3px #e2dcf8}
html[data-layout="m11"]:root #app:has(#layoutPanel[data-art="ergebnis"]:not(.lay-panel-zu)) #layoutKopf{height:64px;min-height:64px;padding-bottom:0}
html[data-layout="m11"]:root #app:has(#layoutPanel[data-art="ergebnis"]:not(.lay-panel-zu)) #layoutKopf .lay-suche{display:none}
html[data-layout="m11"]:root #app:has(#layoutPanel[data-art="ergebnis"]:not(.lay-panel-zu)) #layoutKopf .lay-rund{width:79px;height:79px;min-width:79px}
html[data-layout="m11"]:root #app #conversation:has(#layoutPanel[data-art="ergebnis"]:not(.lay-panel-zu)) :is(#messages,#suggestions,#layoutKontext,#composer,#faehigkeitsVorschlaege){display:none}
html[data-layout="m11"]:root #app #conversation #layoutPanel[data-art="ergebnis"]:not(.lay-panel-zu){flex:1 1 auto;min-height:0;margin-top:2px;overflow-y:auto;scrollbar-width:none}
html[data-layout="m11"]:root .lay-ergebnis-gross{padding:0 19px 12px 20px}
html[data-layout="m11"]:root .lay-ergebnis-kopf{padding-right:96px}
html[data-layout="m11"]:root .lay-ergebnis-suchzeile{margin:12px -96px 0 0}
html[data-layout="m11"]:root .lay-ergebnis-gross .lay-ergebnis-zeile{padding-top:16px}
html[data-layout="m11"]:root .lay-ergebnis-gross .lay-ergebnis-leiste>:not(.lay-zurueck){border-color:#e0e1ea}
html[data-layout="m11"]:root .lay-ergebnis-details{border-color:#e0e1ea}
html[data-layout="m11"]:root #app #conversation #messages{padding-top:16px}
html[data-layout="m11"]:root #app #conversation .message.user{border-radius:18px}
html[data-layout="m11"]:root #layoutNav{padding-top:10px}
html[data-layout="m11"]:root #layoutNav .lay-nav-ziel{gap:6px}
html[data-layout="m11"]:root #layoutNav .lay-nav-ziel.active::after{display:none}
html[data-layout="m11"]:root #layoutNav .lay-nav-ziel .lay-icon{box-sizing:content-box;padding:2px 18px;border-radius:999px}
html[data-layout="m11"]:root #layoutNav .lay-nav-ziel.active .lay-icon{background:#eae8fc}

/* ---------- M12 · Ein Gedanke ----------------------------------------------- */
/* Mattes Dunkelgrau/Türkis: ruhiger Chat ohne Bühne, Avatar klein im Kopf (mit Status), „Ansicht erweitern“ zeigt
   die Bühne gross über dem Gespräch. */
/* Claude 04.10.2026 (Etappe 66, A-083): Schrift auf dem Akzent dunkel (weiss: 3.7:1) */
html[data-layout="m12"]:root{--lay-bg:#1a1b1d;--lay-flaeche:#232425;--lay-feld:#232425;--lay-erhoben:#2c2d30;--lay-linie:#333438;--lay-text:#f1f3f3;--lay-gedaempft:#a9adb2;
  --lay-akzent:#209497;--lay-akzent-ink:#04121a;--lay-akzent-text:#35c9c5;--lay-zweit:#1f3a3e;
  --lay-blase:#313133;--lay-blase-user:#1f3a3e;--lay-blase-user-linie:#2a5054;--lay-blase-user-ink:#f4fafa;
  --lay-nav-bg:#1a1b1d;--lay-nav-linie:#2a2b2e;--lay-nav-text:#bdc0c5;--lay-nav-aktiv:#2ccfca;--lay-kopf-bg:transparent;--lay-marke:#ffffff;--lay-marke-zeichen:#ffffff;
  --lay-pille-bg:#1e1f22;--lay-pille-linie:#3a3b3f;--lay-pille-text:#d0d2d6;--lay-composer-bg:#232425;--lay-composer-linie:#333436;
  --lay-knopf-text:#c7c9cd;--lay-platzhalter:#98979a;--lay-online:#2bbdbb;--lay-nav-strich:40px}
html[data-layout="m12"]:root #layoutKopf{min-height:78px;padding:12px 13px 10px 15px}
html[data-layout="m12"]:root #layoutKopf .lay-marke{flex:0 1 auto;gap:16px;min-width:0}
html[data-layout="m12"]:root #layoutKopf .lay-marke-zeile{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-layout="m12"]:root #layoutKopf .lay-marke-svg{display:none}
html[data-layout="m12"]:root #layoutKopf .lay-marke-zeichen{position:relative;width:44px;height:44px;border-radius:50%;background:var(--layout-avatar-foto,none) center 22%/cover no-repeat,#2c2d30}
html[data-layout="m12"]:root #layoutKopf .lay-marke-zeichen::after{content:"";position:absolute;right:-1px;bottom:1px;width:9px;height:9px;border:2px solid #1a1b1d;border-radius:50%;background:var(--lay-online)}
html[data-layout="m12"]:root #layoutKopf .lay-marke-text{font-size:17px;font-weight:600;letter-spacing:.32em}
html[data-layout="m12"]:root #layoutKopf .lay-marke-zeile{margin-top:3px;font-size:12px;color:#b5b9bc}
html[data-layout="m12"]:root #layoutKopf .lay-erweitern{min-width:154px;min-height:40px;padding:0 14px}
html[data-layout="m12"]:root #layoutKopf .lay-erweitern .lay-icon{width:17px;height:17px}
html[data-layout="m12"].lay-erweitert:root #app #conversation #stage{display:block;width:auto;height:clamp(220px,40svh,380px);margin:2px 12px 0;border-radius:20px}
html[data-layout="m12"]:root #app #conversation #messages{padding-top:12px;gap:12px}
html[data-layout="m12"]:root #app #conversation .message{padding:10px 14px;border-radius:14px}
html[data-layout="m12"]:root #app #conversation .message p{font-size:15px}
html[data-layout="m12"]:root #app #conversation .message:not(.user){margin-left:50px}
html[data-layout="m12"]:root #app #conversation .message:not(.user)::before{left:-50px;width:38px;height:38px}
html[data-layout="m12"]:root #app #conversation #composer{min-height:54px;margin:6px 12px 16px;padding:5px;border-radius:27px}
html[data-layout="m12"]:root #app #conversation #composer #mic{margin-left:auto}
html[data-layout="m12"]:root #app #conversation #composer :is(.send,.stop){width:42px;height:42px;min-width:42px}
html[data-layout="m12"]:root #layoutNav{padding-top:10px;padding-bottom:calc(14px + env(safe-area-inset-bottom))}
html[data-layout="m12"]:root #layoutNav .lay-nav-ziel{gap:6px}

/* ---------- M13 · Daumenleiste ---------------------------------------------- */
/* Warmes Dunkel/Kupfer: AI-Marke mit „Aiona“, Suche und Avatar im Kopf, Gespräch oben, Dateikarte direkt unter der
   Avatar-Antwort, Composer und vier Ziele im Daumenbereich (aktiver Strich über dem Symbol). */
html[data-layout="m13"]:root{--lay-bg:#0f0a08;--lay-seite:linear-gradient(180deg,#140d0a 0%,#0f0a08 30%,#0e0907 100%);--lay-flaeche:#191410;--lay-feld:#1a130d;--lay-erhoben:#2a2018;--lay-linie:#33281f;
  --lay-text:#f6eee6;--lay-gedaempft:#bdb2a9;--lay-akzent:#cc8e5e;--lay-akzent-ink:#1a0f08;--lay-akzent-text:#f0a868;--lay-zweit:#8a6243;
  --lay-blase:#191512;--lay-blase-linie:#2d241c;--lay-blase-user:#2c2017;--lay-blase-user-linie:#3a2b1f;--lay-blase-user-ink:#fbf4ec;
  --lay-nav-bg:#140e0a;--lay-nav-linie:#2a1f17;--lay-nav-text:#f6efe6;--lay-nav-aktiv:#f0a868;--lay-kopf-bg:transparent;--lay-marke:#fff5e6;--lay-marke-zeichen:#fff5e6;
  --lay-pille-bg:#1d1612;--lay-pille-linie:#43352a;--lay-pille-text:#ece2d8;--lay-composer-bg:#1a130d;--lay-composer-linie:#3a2d22;
  --lay-knopf-text:#e9dfd5;--lay-senden-bg:linear-gradient(145deg,#d9a273,#a8714a);--lay-senden-text:#1a0f08;--lay-platzhalter:#a39890;--lay-online:#45c46e;
  --lay-ablage-bg:#161210;--lay-ablage-linie:#3a2d22;--lay-ablage-symbol:#e3d5c7;--lay-nav-strich:22px}
html[data-layout="m13"]:root #layoutKopf{min-height:74px;padding:12px 12px 10px 16px;border-bottom:1px solid #2a201a}
html[data-layout="m13"]:root #layoutKopf .lay-marke{gap:11px}
html[data-layout="m13"]:root #layoutKopf .lay-marke-svg{display:none}
html[data-layout="m13"]:root #layoutKopf .lay-marke-ai{display:inline-flex;align-items:center;justify-content:center;width:31px;height:31px;border:2px solid #fff5e6;border-radius:7px;color:#fff5e6;font-size:15px;font-weight:800;letter-spacing:-.02em}
html[data-layout="m13"]:root #layoutKopf .lay-marke-text{display:inline-block;font-size:20px;font-weight:700;letter-spacing:0;text-transform:lowercase}
html[data-layout="m13"]:root #layoutKopf .lay-marke-text::first-letter{text-transform:uppercase}
html[data-layout="m13"]:root #layoutKopf .lay-marke-zeile{margin-top:2px;font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:#c8976b}
html[data-layout="m13"]:root #layoutKopf .lay-kopf-aktionen{gap:8px}
html[data-layout="m13"]:root #layoutKopf .lay-pille.lay-suche{min-width:109px;min-height:40px;padding:0 12px;font-size:13px}
html[data-layout="m13"]:root #layoutKopf .lay-pille.lay-suche .lay-icon{width:17px;height:17px}
html[data-layout="m13"]:root #layoutKopf .lay-rund{position:relative;width:46px;height:46px;min-width:46px;overflow:visible;box-shadow:0 0 0 1.5px #5b4636}
html[data-layout="m13"]:root #layoutKopf .lay-rund::after{content:"";position:absolute;right:-1px;bottom:1px;width:10px;height:10px;border:2px solid #0f0a08;border-radius:50%;background:var(--lay-online)}
html[data-layout="m13"]:root #app #conversation #messages{flex:0 1 auto;padding-top:32px;gap:18px}
html[data-layout="m13"]:root #app #conversation #layoutKontext{margin:2px 15px auto 64px}
html[data-layout="m13"]:root #app #conversation #layoutKontext:empty+#composer{margin-top:auto}
html[data-layout="m13"]:root #app #conversation .message{padding:10px 15px;border-radius:12px}
html[data-layout="m13"]:root #app #conversation .message.user{border-radius:14px}
html[data-layout="m13"]:root #app #conversation .message p{font-size:15.5px}
html[data-layout="m13"]:root #app #conversation .message:not(.user){margin-left:50px}
html[data-layout="m13"]:root #app #conversation .message:not(.user)::before{left:-50px;width:38px;height:38px}
/* Dateikarte als Zeile: Symbolfeld, Titel/Hinweis, Plus-Kreis */
html[data-layout="m13"]:root #layoutKontext .lay-ablage{display:grid;grid-template-columns:53px 1fr 40px;grid-template-rows:auto auto;align-items:center;justify-items:start;gap:2px 15px;min-height:83px;margin:0;padding:14px 14px 14px 13px;border:1px solid #3a2d22;border-style:solid;border-radius:14px;text-align:left}
html[data-layout="m13"]:root #layoutKontext .lay-ablage-symbol{grid-row:1/3;display:inline-flex;align-items:center;justify-content:center;width:53px;height:53px;border-radius:10px;background:#3b3029}
html[data-layout="m13"]:root #layoutKontext .lay-ablage-symbol .lay-icon{width:26px;height:26px;stroke-width:1.6;fill:#e3d5c7;stroke:#3b3029}
html[data-layout="m13"]:root #layoutKontext .lay-ablage-titel{align-self:end;font-size:14.5px;font-weight:600;color:#fffefa}
html[data-layout="m13"]:root #layoutKontext .lay-ablage-unter{align-self:start;font-size:10.5px;color:#beb5af}
html[data-layout="m13"]:root #layoutKontext .lay-ablage::after{content:"";grid-column:3;grid-row:1/3;width:40px;height:40px;border:1.5px solid #c8875a;border-radius:50%;background:#fdb47d;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='19' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M20 12v16M12 20h16' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='19' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M20 12v16M12 20h16' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;border:0}
html[data-layout="m13"]:root #app #conversation #composer{min-height:65px;margin:6px 10px 12px;padding:6px 8px;border-radius:33px}
html[data-layout="m13"]:root #app #conversation #composer #attach{box-shadow:1px 0 0 #3a2d22;border-radius:50% 0 0 50%}
html[data-layout="m13"]:root #app #conversation #composer textarea{padding-left:10px}
html[data-layout="m13"]:root #app #conversation #composer #mic{margin-left:auto}
html[data-layout="m13"]:root #app #conversation #composer :is(.send,.stop){width:46px;height:46px;min-width:46px}
html[data-layout="m13"]:root #layoutNav{padding:0 4px calc(14px + env(safe-area-inset-bottom))}
html[data-layout="m13"]:root #layoutNav .lay-nav-ziel{gap:9px;min-height:84px;padding-top:12px;font-size:12.5px;font-weight:500}
html[data-layout="m13"]:root #layoutNav .lay-nav-ziel.active::after{top:10px;bottom:auto}
html[data-layout="m13"]:root #layoutNav .lay-nav-ziel.active .lay-icon{margin-top:2px}

/* ---------- M14 · Gedankenbuch ---------------------------------------------- */
/* Creme/Blaugrün: Notizseite mit Linien und Randlinie, Titel „Gedankenbuch“ neben dem runden Portrait, Einträge ohne
   Blasen (Name über dem Text), „Zum Gedächtnis“ unter der neuesten Antwort, „Gespräche“ und Lupe im Kopf. */
html[data-layout="m14"]:root{--lay-bg:#f4f0e9;--lay-flaeche:#fbf8f3;--lay-feld:#faf7f3;--lay-erhoben:#eae6dd;--lay-linie:#e2dccf;--lay-text:#1e2624;--lay-gedaempft:#5d6564;
  --lay-akzent:#17555b;--lay-akzent-ink:#ffffff;--lay-akzent-text:#0b5560;--lay-zweit:#7fa3a0;
  --lay-blase:transparent;--lay-blase-user:transparent;--lay-blase-user-ink:#1e2624;
  --lay-nav-bg:#ece7de;--lay-nav-linie:#e0d9cc;--lay-nav-text:#4a4e4e;--lay-nav-aktiv:#0b4f56;--lay-kopf-bg:transparent;--lay-marke:#1e2624;--lay-marke-zeichen:#1f4f55;
  --lay-pille-bg:#ffffff;--lay-pille-linie:#ded8cc;--lay-pille-text:#1e2624;--lay-composer-bg:#faf7f3;--lay-composer-linie:#e3ddd2;
  --lay-knopf-text:#3a4442;--lay-platzhalter:#59615f;--lay-online:#23a78b;--lay-serif:Georgia,"Iowan Old Style","Palatino Linotype","Book Antiqua",Cambria,"DejaVu Serif",serif;
  --lay-zeilen:#e5dfd3;--lay-randlinie:#a7bcb8;--lay-nav-strich:60px}
html[data-layout="m14"]:root #layoutKopf{min-height:64px;padding:12px 18px 6px 22px}
html[data-layout="m14"]:root #layoutKopf .lay-marke{gap:6px}
html[data-layout="m14"]:root #layoutKopf .lay-marke-svg{width:21px;height:21px;stroke-width:3.2}
html[data-layout="m14"]:root #layoutKopf .lay-marke-text{font-size:18px;font-weight:700;letter-spacing:.12em}
html[data-layout="m14"]:root #layoutKopf .lay-marke-zeile{margin:3px 0 0 -27px;font-size:7.5px;letter-spacing:.22em;text-transform:uppercase;color:#6f7472}
html[data-layout="m14"]:root #layoutKopf .lay-marke-woerter{align-self:flex-start;margin-top:4px}
html[data-layout="m14"]:root #layoutKopf .lay-kopf-aktionen{gap:14px}
html[data-layout="m14"]:root #layoutKopf .lay-verlauf{min-width:103px;min-height:40px;padding:0 12px 0 14px;font-size:14px}
html[data-layout="m14"]:root #layoutKopf .lay-lupe{width:40px;height:40px;min-width:40px;border:0;background:#eae6dd}
html[data-layout="m14"]:root #layoutKopf .lay-lupe .lay-icon{width:19px;height:19px}
html[data-layout="m14"]:root #app #conversation:not(.hidden){position:relative;background:linear-gradient(var(--lay-bg),var(--lay-bg)) 0 0/100% 196px no-repeat,repeating-linear-gradient(180deg,transparent 0 25px,var(--lay-zeilen) 25px 26px) 0 196px}
html[data-layout="m14"]:root #app #conversation:not(.hidden)::before{content:"";position:absolute;z-index:0;left:42px;top:118px;bottom:84px;width:1.5px;background:var(--lay-randlinie);pointer-events:none}
html[data-layout="m14"]:root #app #conversation #stage{align-self:flex-end;width:107px;height:107px;margin:4px 20px 0 0;overflow:visible;background:none;box-shadow:none}
html[data-layout="m14"]:root #app #conversation #stage :is(.portrait,.avatar-video){border-radius:50%;box-shadow:0 0 0 3px #ffffff,0 2px 10px rgba(30,38,36,.12)}
html[data-layout="m14"]:root #app #conversation #stage::after{content:"";position:absolute;right:2px;bottom:6px;z-index:3;width:12px;height:12px;border:2px solid #ffffff;border-radius:50%;background:var(--lay-online)}
html[data-layout="m14"]:root #app #conversation #layoutIdentitaet{display:none}
html[data-layout="m14"]:root #app #conversation #layoutPanel[data-art="gruss"]{position:relative;z-index:1;margin-top:-89px}
html[data-layout="m14"]:root .lay-gruss{padding:0 138px 0 22px;text-align:left}
html[data-layout="m14"]:root .lay-gruss-woerter{gap:4px;justify-items:start}
html[data-layout="m14"]:root .lay-gruss-titel{font-family:var(--lay-serif);font-size:33px;font-weight:500;letter-spacing:-.01em;color:#0b0f12}
html[data-layout="m14"]:root .lay-gruss-zeile{width:238px;padding-bottom:14px;border-bottom:1px solid #d3ccbf;font-size:8.5px;letter-spacing:.22em;color:#6f7472;white-space:nowrap}
html[data-layout="m14"]:root .lay-gruss-notiz{margin:12px 0 0 36px;max-width:130px;transform:rotate(-3deg);font-size:15px;color:#8c918f}
/* Einträge wie im Notizbuch: Bild links, Name, Text in Serifenschrift, keine Blasen */
html[data-layout="m14"]:root #app #conversation #messages{position:relative;z-index:1;padding:40px 16px 14px;gap:26px}
html[data-layout="m14"]:root #app #conversation .message{align-self:stretch;width:auto;max-width:none;margin:0 0 0 85px;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
html[data-layout="m14"]:root #app #conversation .message .message-head{display:block;margin:0 0 4px;font-size:12px;font-weight:600;color:#5a6f70}
html[data-layout="m14"]:root #app #conversation .message .message-head time{display:none}
html[data-layout="m14"]:root #app #conversation .message.user .message-head span{display:inline-block;text-transform:lowercase}
html[data-layout="m14"]:root #app #conversation .message.user .message-head span::first-letter{text-transform:uppercase}
html[data-layout="m14"]:root #app #conversation .message:not(.user) .message-head{font-weight:700;color:#0b5560}
html[data-layout="m14"]:root #app #conversation .message p{font-family:var(--lay-serif);font-size:16.5px;line-height:1.45;color:#1e2624}
html[data-layout="m14"]:root #app #conversation .message::before{content:"";position:absolute;left:-45px;top:-1px;width:32px;height:32px;border-radius:50%;transform:none}
html[data-layout="m14"]:root #app #conversation .message:not(.user){margin-left:85px}
html[data-layout="m14"]:root #app #conversation .message:not(.user)::before{left:-45px;top:-1px;width:32px;height:32px;transform:none}
html[data-layout="m14"]:root #app #conversation .message.user::before{background:#d8dfdc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23718685' d='M12 12.2a4.1 4.1 0 1 0 0-8.2 4.1 4.1 0 0 0 0 8.2Zm-7 7.3c0-3 3.1-5.2 7-5.2s7 2.2 7 5.2v.5H5z'/%3E%3C/svg%3E") center/17px no-repeat}
html[data-layout="m14"]:root #app #conversation .message .lay-gedaechtnis{color:#00404a}
html[data-layout="m14"]:root #app #conversation #composer{position:relative;z-index:1;min-height:52px;margin:6px 12px 10px;padding:4px;border-radius:26px;box-shadow:0 1px 4px rgba(30,38,36,.06)}
html[data-layout="m14"]:root #app #conversation #composer #attach{box-shadow:1px 0 0 #e3ddd2;border-radius:50% 0 0 50%}
html[data-layout="m14"]:root #app #conversation #composer textarea{padding-left:12px}
html[data-layout="m14"]:root #app #conversation #composer #mic{margin-left:auto}
html[data-layout="m14"]:root #layoutNav{padding:8px 8px calc(4px + env(safe-area-inset-bottom))}
html[data-layout="m14"]:root #layoutNav .lay-nav-ziel{gap:6px;min-height:58px}

/* ---------- M15 · Sprechraum ------------------------------------------------ */
/* Pflaume/Warmlicht: grosses Portrait unter dem Kopf, „Ich bin für dich da.“, grosse Aufnahmetaste (dasselbe
   Mikrofon), „Zu Text wechseln“ blendet das Eingabefeld ein, „Transkript“ das Gespräch. */
html[data-layout="m15"]:root{--lay-bg:#15050d;--lay-seite:linear-gradient(180deg,#23101b 0%,#1a0912 38%,#15050d 100%);--lay-flaeche:#22131c;--lay-feld:#1c0f18;--lay-erhoben:#2c1924;--lay-linie:#3d2a35;
  --lay-text:#f8eef2;--lay-gedaempft:#aaa09b;--lay-akzent:#f0a868;--lay-akzent-ink:#2a120a;--lay-akzent-text:#f2ad6e;--lay-zweit:#a06d46;
  --lay-blase:#251520;--lay-blase-linie:#3a2833;--lay-blase-user:#3a2026;--lay-blase-user-ink:#fff6f0;
  --lay-nav-bg:#170b13;--lay-nav-linie:#2e1d27;--lay-nav-text:#9a8b8b;--lay-nav-aktiv:#fcbb77;--lay-kopf-bg:transparent;--lay-marke:#f8eef2;--lay-marke-zeichen:#f8eef2;
  --lay-pille-bg:#251620;--lay-pille-linie:#3e2b36;--lay-pille-text:#d8cfd3;--lay-composer-bg:#1c0f18;--lay-composer-linie:#3d2a35;
  --lay-knopf-text:#eadfe3;--lay-platzhalter:#9a8b8b;--lay-nav-strich:30px}
html[data-layout="m15"]:root #layoutKopf{min-height:64px;padding:10px 15px 6px 26px}
html[data-layout="m15"]:root #layoutKopf .lay-marke{align-items:flex-start}
html[data-layout="m15"]:root #layoutKopf .lay-marke-text{font-size:18px;font-weight:600;letter-spacing:.24em}
html[data-layout="m15"]:root #layoutKopf .lay-marke-zeile{margin:4px 0 0 -32px;font-size:9px;letter-spacing:.34em;text-transform:uppercase;color:#8f7f84}
html[data-layout="m15"]:root #layoutKopf .lay-pille.lay-suche{min-width:165px;min-height:40px}
html[data-layout="m15"]:root #app #conversation #stage{height:clamp(220px,39svh,326px);margin:0;border-radius:0;background:#2a1520}
html[data-layout="m15"]:root #app #conversation #stage :is(.portrait,.avatar-video){object-position:center 18%}
html[data-layout="m15"]:root #app #conversation #stage::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(30,14,22,.92) 0%,rgba(30,14,22,.35) 9%,rgba(21,5,13,0) 22%,rgba(21,5,13,0) 62%,#15050d 100%),linear-gradient(90deg,rgba(21,5,13,.55) 0%,rgba(21,5,13,0) 22%,rgba(21,5,13,0) 78%,rgba(21,5,13,.55) 100%)}
html[data-layout="m15"]:root #app #conversation #layoutPanel[data-art="sprechen"]{position:relative;z-index:3;margin-top:-8px}
html[data-layout="m15"]:root .lay-sprechraum .lay-augenbraue{font-size:10px;letter-spacing:.22em;color:#e9a46a}
html[data-layout="m15"]:root .lay-sprech-titel{margin:6px 0 4px;font-size:26px;color:#fbf2f4}
html[data-layout="m15"]:root .lay-sprech-mic{margin-top:12px}
html[data-layout="m15"]:root .lay-sprech-unter{color:#aaa09b}
html[data-layout="m15"]:root .lay-sprech-mic{border-color:#f0a868;background:radial-gradient(circle at 50% 38%,#5a2e27 0%,#3a1c1d 62%,#2a1219 100%);box-shadow:0 0 0 1px rgba(240,168,104,.25),0 0 30px rgba(240,140,80,.5),inset 0 0 22px rgba(240,168,104,.18)}
html[data-layout="m15"]:root .lay-sprech-text{background:#22131c;border-color:#4a3440;color:#f2e9ec}
html[data-layout="m15"]:root .lay-sprech-transkript{background:#1c0f18;border-color:#3a2733;color:#d9cfd3}
/* Gespräch und Eingabe nur auf Wunsch (Transkript / Zu Text wechseln); dann wird die Bühne kleiner */
html[data-layout="m15"]:root #app #conversation:not(:has(.lay-transkript-an)) #messages{display:none}
html[data-layout="m15"]:root #app #conversation:not(:has(.lay-text-an)) :is(#composer,#suggestions,#faehigkeitsVorschlaege){display:none}
html[data-layout="m15"]:root #app #conversation:has(.lay-text-an,.lay-transkript-an) #stage{height:clamp(130px,20svh,180px)}
html[data-layout="m15"]:root #app #conversation:has(.lay-text-an,.lay-transkript-an) .lay-sprech-mic{width:96px;height:96px;margin-top:14px;font-size:11.5px}
html[data-layout="m15"]:root #app #conversation:has(.lay-text-an,.lay-transkript-an) .lay-sprech-mic .lay-icon{width:30px;height:30px}
html[data-layout="m15"]:root #app #conversation:has(.lay-text-an,.lay-transkript-an) :is(.lay-sprech-text,.lay-sprech-transkript){margin-top:12px}
html[data-layout="m15"]:root #app #conversation #messages{padding-top:12px}
html[data-layout="m15"]:root #app #conversation #composer{margin:6px 15px 12px}
html[data-layout="m15"]:root #layoutNav{padding:0 8px calc(14px + env(safe-area-inset-bottom))}
html[data-layout="m15"]:root #layoutNav .lay-nav-ziel{gap:8px;min-height:80px;padding-top:12px}
html[data-layout="m15"]:root #layoutNav .lay-nav-ziel.active::after{top:0;bottom:auto}

/* ---------- M16 · Der nächste Schritt ---------------------------------------- */
/* Hellgrau/Himmelblau: rundes Portrait, „Schön, dass du da bist.“, „Der nächste Schritt“, Eingabefeld sofort nutzbar,
   zwei Einstiegskarten (Datei verstehen, Etwas gestalten); mit Nachrichten normale Gesprächsansicht. */
/* Claude 04.10.2026 (Etappe 66, A-083): Senden-Symbol dunkel (weiss auf Hellblau: 1.9:1) */
html[data-layout="m16"]:root{--lay-bg:#f8fafd;--lay-seite:linear-gradient(180deg,#f2f6fb 0%,#fbfcfe 40%,#ffffff 70%,#f8fafd 100%);--lay-flaeche:#ffffff;--lay-feld:#ffffff;--lay-erhoben:#e9f1fb;--lay-linie:#e4eaf2;
  --lay-text:#06122b;--lay-gedaempft:#4d576e;--lay-akzent:#1a6fd1;--lay-akzent-ink:#ffffff;--lay-akzent-text:#1a6fd1;--lay-zweit:#8fc3f5;
  --lay-blase:#ffffff;--lay-blase-linie:#e6ecf3;--lay-blase-user:#e3effc;--lay-blase-user-ink:#06122b;
  --lay-nav-bg:#ffffff;--lay-nav-linie:#edf1f6;--lay-nav-text:#48546f;--lay-nav-aktiv:#1a6fd1;--lay-kopf-bg:transparent;--lay-marke:#06122b;--lay-marke-zeichen:#06122b;
  --lay-pille-bg:#eef2f7;--lay-pille-linie:transparent;--lay-pille-text:#3a4558;--lay-composer-bg:#ffffff;--lay-composer-linie:#e8edf4;--lay-composer-schatten:0 4px 18px rgba(20,50,90,.07);
  --lay-knopf-text:#2a3448;--lay-senden-bg:#8fc3f5;--lay-senden-text:#06122b;--lay-platzhalter:#4d576e;--lay-ring:#e3eefb;--lay-nav-strich:86px}
html[data-layout="m16"]:root #layoutKopf{min-height:80px;padding:40px 17px 2px 22px}
html[data-layout="m16"]:root #layoutKopf .lay-marke-svg{width:26px;height:26px;stroke-width:3.4}
html[data-layout="m16"]:root #layoutKopf .lay-marke-text{font-size:16px;font-weight:600;letter-spacing:.26em}
html[data-layout="m16"]:root #layoutKopf .lay-pille.lay-suche{min-width:122px;min-height:40px}
html[data-layout="m16"]:root #app #conversation:not(:has(.message)) #stage{width:150px;height:150px;margin:15px auto 0;border-radius:50%;box-shadow:0 0 0 11px var(--lay-ring),0 0 0 12px #d7e7fa,0 8px 40px 14px rgba(120,170,230,.18)}
html[data-layout="m16"]:root #app #conversation:not(:has(.message)) #layoutIdentitaet{display:none}
html[data-layout="m16"]:root #app #conversation:not(:has(.message)) :is(#messages,#suggestions){display:none}
html[data-layout="m16"]:root #app #conversation:not(.hidden):not(:has(.message)){overflow-y:auto;scrollbar-width:none}
html[data-layout="m16"]:root #app #conversation:not(:has(.message)) #faehigkeitsVorschlaege{order:17;margin:15px 17px 12px}
html[data-layout="m16"]:root #app #conversation:has(.message) #layoutPanel[data-art="gruss"]{display:none}
html[data-layout="m16"]:root #app #conversation #layoutPanel[data-art="gruss"],html[data-layout="m16"]:root #layoutPanel .lay-gruss{display:contents}
html[data-layout="m16"]:root .lay-gruss-woerter{order:7;gap:0;padding:39px 24px 0}
html[data-layout="m16"]:root .lay-gruss-vor{font-size:15px;color:#545c76}
html[data-layout="m16"]:root .lay-gruss-titel{margin-top:6px;font-size:28px;font-weight:800;letter-spacing:-.015em;color:#06122b}
html[data-layout="m16"]:root .lay-gruss-unter{max-width:250px;margin-top:9px;font-size:15.5px;line-height:1.45;color:#4d576e}
html[data-layout="m16"]:root .lay-gruss-karten{order:16;gap:15px;margin-top:25px}
html[data-layout="m16"]:root .lay-gruss-karte{min-height:102px;border-color:#e6ecf3}
html[data-layout="m16"]:root .lay-gruss-karte[data-art="datei"]{border-color:#dbe9fa;background:#ebf4fe}
html[data-layout="m16"]:root .lay-gruss-symbol{background:#dceafb;color:#1a6fd1}
html[data-layout="m16"]:root .lay-gruss-karte[data-art="gestalten"] .lay-gruss-symbol{background:#e9f1fb}
html[data-layout="m16"]:root .lay-gruss-symbol .lay-icon{width:27px;height:27px}
html[data-layout="m16"]:root .lay-gruss-karte[data-art="gestalten"] .lay-gruss-symbol .lay-icon{fill:currentColor;stroke-width:1}
html[data-layout="m16"]:root .lay-gruss-karte-woerter small{color:#4d5a76}
html[data-layout="m16"]:root #app #conversation #composer{min-height:60px;margin:24px 17px 0;padding:6px 8px;border-radius:18px}
html[data-layout="m16"]:root #app #conversation:has(.message) #composer{margin:6px 12px 12px}
html[data-layout="m16"]:root #app #conversation #composer textarea{padding-left:12px}
html[data-layout="m16"]:root #app #conversation #composer #mic{margin-left:auto;box-shadow:-1px 0 0 #d4d9e1;border-radius:0}
html[data-layout="m16"]:root #app #conversation #composer .primary-slot{padding-left:6px;border-left:1px solid #d4d9e1}
html[data-layout="m16"]:root #layoutNav{padding:6px 8px calc(16px + env(safe-area-inset-bottom))}
html[data-layout="m16"]:root #layoutNav .lay-nav-ziel{gap:8px;font-size:12px}
html[data-layout="m16"]:root #layoutNav .lay-nav-ziel[data-ziel="meinaiona"] .lay-icon{box-sizing:border-box;width:28px;height:28px;border-radius:50%;background:var(--layout-avatar-foto,none) center 22%/cover no-repeat,#e9f1fb;stroke:none;fill:none}
html[data-layout="m16"]:root #layoutNav .lay-nav-ziel[data-ziel="meinaiona"] .lay-icon path{display:none}

/* Claude 24.10.2026 (Handy-Waechter): Arbeitszeile „Aiona arbeitet an N Auftraegen“ (#parallelStatus) erbt sonst
   --lay-akzent und bleibt auf dem Grund dieser Vorlagen unter 4.5:1 (UI-Pruefung, Kategorie C). Gemessene Werte:
   m09 3.23 (#7f927f auf rgb(251,252,251)), m11 3.33 (#8b7bd8 auf rgb(247,247,251)), m12 4.24 (#209497 auf
   rgb(35,36,38)). Gleicher Farbton, nur Helligkeit verschoben - Muster wie m17 in layouts-c.css. Der Punkt davor
   geht mit, damit Punkt und Text eine Farbe bleiben. Neue Werte: 5.07 / 5.06 / 5.08. */
html[data-layout="m09"]:root #app #parallelStatus{color:#607160}
html[data-layout="m09"]:root #app #parallelStatus::before{background:#607160}
html[data-layout="m11"]:root #app #parallelStatus{color:#6c57cd}
html[data-layout="m11"]:root #app #parallelStatus::before{background:#6c57cd}
/* m12 ist die dunkle Vorlage: derselbe Akzent steht auf drei Gruenden (Flaeche rgb(35,36,38), Blase rgb(49,49,51),
   erhoben rgb(44,45,48)) und blieb ueberall unter 4.5:1 - auch bei einem Link mitten im Antworttext (3.55).
   #27b3b6 haelt auf allen dreien 5.07 : 1 oder mehr. */
html[data-layout="m12"]:root #app #parallelStatus{color:#27b3b6}
html[data-layout="m12"]:root #app #parallelStatus::before{background:#27b3b6}
html[data-layout="m12"]:root #app #conversation .message-content a.message-link{color:#27b3b6}
