/* Fixed sphere: expanded information never changes its position or dock size. */
.eva-widget {
  --eva-size: 96px;
  position: fixed; z-index: 9; left: 50%; --eva-bottom: max(12px, env(safe-area-inset-bottom, 0px)); bottom: var(--eva-bottom);   /* --eva-bottom: Abstand des Docks zum Rand, auch für die Höhe von Gespräch/Hinweis */
  transform: translateX(-50%); width: calc(var(--eva-size) + 112px); height: calc(var(--eva-size) + 30px);
  max-width: calc(100vw - 24px); color: #fff; font: 400 14px/1.5 var(--ci-font-family, sans-serif);
  text-shadow: none; touch-action: pan-y pinch-zoom;
}
.eva-widget [hidden], .eva-widget[hidden] { display: none !important; }
.eva-widget-dock { position: relative; width: 100%; height: 100%; }
.eva-widget button { color: #fff; font: inherit; cursor: pointer; }
.eva-widget-talk {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%); display: flex;
  flex-direction: column; align-items: center; gap: 3px; width: calc(var(--eva-size) + 68px);
  padding: 0; border: 0; border-radius: 0; background: transparent; text-align: center; text-shadow: none;
}
.eva-widget-talk:is(:hover, :active) { background: transparent; box-shadow: none; }
.eva-widget-sphere {
  --eva-voice-glow: rgb(234 3 19 / 0%);
  position: relative; isolation: isolate;
  display: grid; place-items: center; flex: 0 0 var(--eva-size); width: var(--eva-size); height: var(--eva-size); border-radius: 50%;
  background: none; box-shadow: none;
}
.eva-widget-sphere::before {
  content: ''; position: absolute; z-index: -1; inset: 0; pointer-events: none;
  /* The mesh silhouette is smaller than its square canvas. Use its actual
     camera projection, with a half-pixel inset beneath the antialiased rim. */
  clip-path: circle(calc(var(--eva-shell-radius, 43.6275966%) - .5px) at 50% 50%);
  background-color: transparent; background-image: var(--g-reflex), var(--m-glas);
  backdrop-filter: blur(var(--t-blur)) saturate(var(--t-sat)) brightness(var(--t-dim));
  -webkit-backdrop-filter: blur(var(--t-blur)) saturate(var(--t-sat)) brightness(var(--t-dim));
}
/* Communication light lives outside the shell; its smoke-glass mask stays exact.
   No filter on the canvas or parent: the glass and threads keep their colour. */
.eva-widget-sphere::after {
  content: ''; position: absolute; z-index: -2; pointer-events: none;
  left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: calc(var(--eva-shell-radius, 43.6275966%) * 2); aspect-ratio: 1; border-radius: 50%;
  opacity: 0; box-shadow: 0 0 15px 5px var(--eva-voice-glow), 0 0 34px 11px var(--eva-voice-glow);
  transition: opacity 180ms ease-out, box-shadow 180ms ease-out;
}
.eva-widget[data-state="listening"] .eva-widget-sphere { --eva-voice-glow: rgb(234 3 19 / 80%); }
.eva-widget[data-state="speaking"] .eva-widget-sphere { --eva-voice-glow: rgb(255 255 255 / 75%); }
.eva-widget:is([data-state="listening"], [data-state="speaking"]) .eva-widget-sphere::after { opacity: 1; }
/* Owner comparison switch: old backdrop retained, disabled by default. */
.eva-widget[data-dark-backdrop="on"] .eva-widget-sphere::before { background: radial-gradient(circle, rgb(0 0 0 / 96%) 0%, rgb(0 0 0 / 90%) 62%, transparent 72%); }
.eva-widget[data-orb-failed] .eva-widget-sphere::before { display: none; }
.eva-widget-canvas { display: block; width: 100%; height: 100%; pointer-events: none; }
.eva-widget-fallback { font-size: 16px; font-weight: 600; }
.eva-widget-words {
  position: relative; isolation: isolate;
  display: flex; align-items: baseline; justify-content: center; gap: 5px; min-height: 23px;
  padding-bottom: 5px; white-space: nowrap; background: none;
  /* V19.4 (Owner: kein Schattenfleck): enger Konturschatten direkt an den Buchstaben statt eines Verlaufs dahinter */
  text-shadow: 0 0 1px rgb(0 0 0 / 95%), 0 0 2px rgb(0 0 0 / 85%), 0 1px 3px rgb(0 0 0 / 60%);
}
.eva-widget-label { font-size: 12px; font-weight: 600; }
.eva-widget-live { font-size: 11px; }
.eva-widget:not([data-state="listening"]):not([data-state="speaking"]) .eva-widget-talk:focus-visible .eva-widget-sphere { --eva-voice-glow: rgb(234 3 19 / 65%); }
.eva-widget-talk:focus-visible .eva-widget-sphere::after { opacity: 1; }
.eva-widget :is(button, a, [tabindex]):focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.eva-widget button:disabled { cursor: default; opacity: .45; }
.eva-widget-toggle, .eva-widget-info-toggle, .eva-widget-play { position: absolute; top: calc(var(--eva-size) / 2 - 22px); z-index: 2; isolation: isolate; border-radius: 50%; background-image: none; }
.eva-widget :is(.eva-widget-toggle, .eva-widget-info-toggle, .eva-widget-play)::before {
  content: ''; position: absolute; z-index: -1; inset: auto; left: 50%; top: 50%; width: 24px; height: 24px;
  transform: translate(-50%, -50%); border-radius: 0; pointer-events: none;
  /* Original Tabler outlines, in the same 24px coordinate system as each SVG. */
  clip-path: var(--eva-icon-glass-clip);
  background-color: transparent; background-image: var(--g-reflex), var(--m-glas);
  backdrop-filter: blur(var(--t-blur)) saturate(var(--t-sat)) brightness(var(--t-dim));
  -webkit-backdrop-filter: blur(var(--t-blur)) saturate(var(--t-sat)) brightness(var(--t-dim));
  box-shadow: none;
}
.eva-widget :is(.eva-widget-toggle, .eva-widget-info-toggle, .eva-widget-play)::after { content: none; }
.eva-widget-toggle { left: 0; --eva-icon-glass-clip: path('M9 18h-3a3 3 0 0 1 -3 -3v-8a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-3l-3 3l-3 -3'); }
.eva-widget-info-toggle { right: 0; --eva-icon-glass-clip: path('M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0'); }
.eva-widget-play { top: -44px; right: 0; --eva-icon-glass-clip: path('M6 15h-2a1 1 0 0 1 -1 -1v-4a1 1 0 0 1 1 -1h2l3.5 -4.5a.8 .8 0 0 1 1.5 .5v14a.8 .8 0 0 1 -1.5 .5l-3.5 -4.5'); }
:root {
  /* Gespräch als Schrift auf der Bühne (V19.9 „ganz leise“, Owner 23.10.): Farben für Text ohne Kasten, im Hell-Modus dunkel */
  --eva-text: rgb(255 255 255 / 94%); --eva-text-2: rgb(255 255 255 / 84%); --eva-grau: rgb(255 255 255 / 60%); --eva-leise: rgb(255 255 255 / 38%);
  --eva-linie: rgb(255 255 255 / 34%); --eva-schatten: 0 1px 2px rgb(0 0 0 / 70%), 0 0 18px rgb(0 0 0 / 60%); --eva-grund: 3 4 6;
}
html[data-theme="light"] {
  --eva-text: rgb(24 29 36 / 96%); --eva-text-2: rgb(24 29 36 / 82%); --eva-grau: rgb(24 29 36 / 66%); --eva-leise: rgb(24 29 36 / 48%);
  --eva-linie: rgb(24 29 36 / 34%); --eva-schatten: 0 0 12px rgb(238 240 242 / 95%); --eva-grund: 238 240 242;
}
.eva-widget-panel, .eva-widget-notice {
  position: absolute; bottom: calc(100% + 12px); left: 50%; transform: translateX(-50%);
  width: min(380px, calc(100vw - 24px)); max-height: min(44dvh, 360px, calc(100dvh - var(--kopf-unten, 112px) - var(--eva-size) - 50px - var(--eva-bottom, 12px)));
  margin: 0; padding: 0; overflow: auto; overscroll-behavior: contain; touch-action: pan-y pinch-zoom; display: flex; flex-direction: column;
  border: 0; text-shadow: none;
}
.eva-widget-notice { border-radius: var(--glass-radius, 18px); box-shadow: var(--m-glas-schatten), var(--g-kante), var(--glass-contour); }
/* Das Gespräch hat keinen Kasten: Schrift auf dem abgedunkelten Grund (Schleier js/eva-steckbrief.js), dazu eine weiche
   Abdunklung hinter der Schrift – eine Fläche, deren Ränder ringsum ausfedern (zwei Masken, geschnitten), also keine Kastenkante.
   Sie trägt den Text auch über der hellen Arena (gemessen ≥ 4,5:1, tools/cockpit-test.mjs). Die Schrift hält Abstand zum Federrand. */
.eva-widget-panel { isolation: isolate; padding: 0 var(--eva-feder, 56px); color: var(--eva-text); text-shadow: var(--eva-schatten); }
.eva-widget-panel::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: rgb(var(--eva-grund) / 84%);
  -webkit-mask-image: linear-gradient(to right, transparent, #000 var(--eva-feder, 56px), #000 calc(100% - var(--eva-feder, 56px)), transparent), linear-gradient(to bottom, transparent, #000 48px, #000 calc(100% - 48px), transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, #000 var(--eva-feder, 56px), #000 calc(100% - var(--eva-feder, 56px)), transparent), linear-gradient(to bottom, transparent, #000 48px, #000 calc(100% - 48px), transparent);
  mask-composite: intersect;
}
.eva-widget-toolbar { display: flex; gap: 0; align-items: center; padding: 4px 6px 4px 16px; border-bottom: 1px solid rgb(255 255 255 / 25%); flex: none; }
.eva-widget-toolbar h2 { margin: 0 auto 0 0; font-size: 14px; font-weight: 600; }
.eva-widget-toolbar .icon-action .control-icon { width: 18px; height: 18px; }
/* Im Gespräch: keine Titelleiste, nur leise Symbole (Löschen, Schließen); der Titel bleibt für Hilfstechnik */
.eva-widget-panel .eva-widget-toolbar { justify-content: flex-end; min-height: 40px; padding: 0; border: 0; }
.eva-widget-panel .eva-widget-toolbar h2 { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.eva-widget-panel .eva-widget-toolbar .icon-action { width: 40px; height: 40px; min-width: 40px; min-height: 40px; color: var(--eva-grau); transition: color 200ms ease; }
.eva-widget-panel .eva-widget-toolbar .icon-action:is(:hover, :focus-visible) { color: var(--eva-text); }
.eva-widget-panel .eva-widget-toolbar .icon-action .control-icon { width: 16px; height: 16px; }
.eva-widget-transcript {
  min-height: 44px; overflow: auto; padding: 0 4px 18px; overscroll-behavior: contain; touch-action: pan-y pinch-zoom; scrollbar-width: none; overflow-wrap: anywhere;
  font-size: 15px; line-height: 1.62;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 40px, #000 calc(100% - 22px), transparent);
  mask-image: linear-gradient(to bottom, transparent 0, #000 40px, #000 calc(100% - 22px), transparent);
}
.eva-widget-transcript p { margin: 14px 0 0; white-space: pre-wrap; }
.eva-widget-transcript p[data-speaker="user"] { color: var(--eva-text-2); }   /* eigene Zeilen etwas zurück, Kennung „Sie:“/„EVA:“ grau */
.eva-widget-transcript strong { font-weight: 500; color: var(--eva-grau); letter-spacing: .02em; }
.eva-widget-transcript:focus-visible { outline: 1px solid var(--eva-leise); outline-offset: 6px; box-shadow: none; }
.eva-widget-empty { padding: 6px 4px; margin: 0; color: var(--eva-grau); }
.eva-widget-disclosure { margin: 0; padding: 14px 16px 8px; }
.eva-widget-notice > a { align-self: flex-start; display: inline-flex; align-items: center; min-height: 44px; margin: 0 16px 8px; color: #fff; text-underline-offset: 4px; }
.eva-widget-notice { overflow: auto; }
/* Hinweis auf die Verbindung (V19.4). Die Live-Region (role=status) bleibt dauerhaft unsichtbar-klein und trägt allein die Ansage für
   Screenreader – sie wird nie ein- oder ausgeblendet. Gezeigt wird eine eigene Pille daneben (aria-hidden, display statt clip-path):
   Glas und backdrop-filter liegen auf ihrem ::before, der Text in einem inneren Span mit eigener Farbe. Vorher saß der Text im Element
   mit -webkit-backdrop-filter, das vorher per clip-path auf 1 px versteckt war und unter einem per Web Animations bewegten Elternteil
   lag; iOS-Safari malte dann die Pille, aber nicht den Text darin (Stefans iPhone-Foto, 22.10.). */
.eva-widget-status { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); }
.eva-widget-hinweis { display: none; }
.eva-widget[data-status-visible] .eva-widget-hinweis {
  display: block; position: absolute; z-index: 1; isolation: isolate; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%);
  width: min(300px, calc(100vw - 24px)); padding: 10px 14px; border-radius: var(--glass-radius, 18px);
}
.eva-widget-hinweis::before {
  content: ''; position: absolute; z-index: -1; inset: 0; border-radius: inherit; pointer-events: none;
  background-color: transparent; background-image: var(--g-reflex), var(--m-glas);
  backdrop-filter: blur(var(--t-blur)) saturate(var(--t-sat)) brightness(var(--t-dim));
  -webkit-backdrop-filter: blur(var(--t-blur)) saturate(var(--t-sat)) brightness(var(--t-dim));
  box-shadow: var(--m-glas-schatten), var(--g-kante), var(--glass-contour);
}
.eva-widget-hinweis-text { position: relative; display: block; color: #fff; }
.eva-widget:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden])) .eva-widget-hinweis { display: none; }
@media (hover: hover) and (pointer: fine) {
  .eva-widget:not([data-state="listening"]):not([data-state="speaking"]) .eva-widget-talk:hover .eva-widget-sphere { --eva-voice-glow: rgb(234 3 19 / 65%); }
  .eva-widget-talk:hover .eva-widget-sphere::after { opacity: 1; }
}
html[data-eva-visible] .detail-panel-content.detail-shell { padding-bottom: calc(var(--eva-clearance, 156px) + env(safe-area-inset-bottom, 0px)); }
html[data-eva-visible] { scroll-padding-bottom: var(--eva-clearance, 156px); }
/* The scrolling HTML fallback needs real space below its footer for the fixed dock. */
html[data-eva-visible]:not([data-modus="buehne"]) .fuss { margin-bottom: calc(var(--eva-clearance, 156px) + env(safe-area-inset-bottom, 0px)); }
html[data-eva-visible][data-kompakt] .station,
html[data-eva-visible][data-kompakt] .station[data-side] { padding-bottom: calc(var(--eva-clearance, 156px) + env(safe-area-inset-bottom, 0px)); }
html[data-eva-visible][data-kompakt] .station[data-station="7"] { padding-bottom: calc(var(--fuss-h, 0px) + var(--eva-clearance, 156px) + 16px + env(safe-area-inset-bottom, 0px)); }
html[data-eva-visible][data-kompakt] .fuss { bottom: calc(var(--eva-clearance, 156px) + env(safe-area-inset-bottom, 0px)); }
html[data-eva-visible][data-kompakt] .feld[data-offen] { max-height: min(55svh, calc(100svh - var(--kopf-unten, 112px) - var(--eva-clearance, 156px) - 24px)); }
@media (max-width: 760px), (max-height: 500px) {
  .eva-widget { --eva-size: 84px; --eva-bottom: max(8px, env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 700px) {
  .eva-widget { --eva-bottom: calc(44px + max(8px, env(safe-area-inset-bottom, 0px))); }   /* über den Rechtslinks (Telefon hoch) */
}
@media (max-width: 700px) and (max-height: 500px) and (orientation: landscape) {
  .eva-widget { --eva-bottom: max(8px, env(safe-area-inset-bottom, 0px)); }   /* quer stehen die Rechtslinks links, nicht unter dem Dock: kein Anheben */
}
html[data-bewegung="aus"] .eva-widget-words { transition: none; }
html[data-bewegung="aus"] .eva-widget-sphere::after { transition: none; }
html[data-bewegung="aus"] .eva-widget :is(.eva-widget-toggle, .eva-widget-info-toggle, .eva-widget-play)::after { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .eva-widget-words, .eva-widget-sphere::after, .eva-widget :is(.eva-widget-toggle, .eva-widget-info-toggle, .eva-widget-play)::after { transition: none; }
}
@media (forced-colors: active) {
  .eva-widget { color: CanvasText; }
  .eva-widget-panel, .eva-widget-notice { background: Canvas; color: CanvasText; border: 1px solid CanvasText; }
  .eva-widget button { color: ButtonText; }
  .eva-widget[data-status-visible] .eva-widget-hinweis { background: Canvas; border: 1px solid CanvasText; }
  .eva-widget-hinweis::before { display: none; }
  .eva-widget-hinweis-text { color: CanvasText; text-shadow: none; }
  .eva-widget-notice > a { color: LinkText; }
}
/* Conversation composer: fixed dock geometry stays independent of popup content. */
.eva-widget-panel { overflow-x: hidden; overflow-y: auto; max-height: min(56dvh, 480px, calc(100dvh - var(--kopf-unten, 112px) - var(--eva-size) - 50px - var(--eva-bottom, 12px))); }
.eva-widget-transcript { flex: 1 1 auto; min-height: 28px; }
.eva-widget-empty { flex: none; }
/* Eingabe: eine feine Linie; beim Schreiben zieht sich darüber eine helle Linie (kein Rot, das gehört der Hauptaktion) */
.eva-widget-composer { flex: none; position: relative; isolation: isolate; margin: 4px 0 8px; border: 0; border-bottom: 1px solid var(--eva-linie); border-radius: 0; background: none; }
.eva-widget-composer::after { content: ''; position: absolute; inset: auto 0 -1px; border-bottom: 1px solid var(--eva-text); pointer-events: none; opacity: 0; }
.eva-widget-composer:focus-within::after { opacity: 1; animation: button-contour-draw 320ms linear both; }
.eva-widget-input-row { display: flex; align-items: flex-end; gap: 0; padding: 0; }
.eva-widget-composer textarea { display: block; flex: 1 1 auto; min-width: 0; min-height: 24px; max-height: 72px; width: 100%; margin: 10px 0; padding: 0 3px; border: 0; border-radius: 0; resize: none; background: transparent; color: var(--eva-text); text-shadow: none; font: 400 16px/24px var(--ci-font-family, sans-serif); caret-color: var(--eva-text); scrollbar-color: #fff #222; touch-action: pan-y pinch-zoom; }
.eva-widget-composer textarea::placeholder { color: var(--eva-grau); opacity: 1; }
.eva-widget-panel .eva-widget-compose-button { color: var(--eva-grau); }
/* Offenes Gespräch: das Sprechblasen-Symbol am Dock bleibt weiß (base.css färbt aria-expanded rot; Rot gehört der Hauptaktion) */
.eva-widget .eva-widget-toggle[aria-expanded="true"]:not(:focus-visible) .control-icon { color: currentColor; filter: none; }
.eva-widget-composer textarea:focus-visible { outline: 0; box-shadow: none; }
.eva-widget .eva-widget-compose-button { flex: 0 0 44px; width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; display: grid; place-items: center; background-image: none; border: 0; border-radius: 12px; }
.eva-widget-compose-button .control-icon, .eva-widget-attachment .control-icon { width: 18px; height: 18px; }
.eva-widget-compose-button:active { background-color: transparent; }
.eva-widget-composer-status { margin: 0; padding: 0 12px 9px; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.eva-widget-attachments { max-height: 112px; overflow: auto; padding: 7px 8px 0; overscroll-behavior: contain; }
.eva-widget-attachment { display: flex; align-items: center; gap: 6px; min-width: 0; border-bottom: 1px solid rgb(255 255 255 / 18%); }
.eva-widget-attachment > span:first-child { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.eva-widget-attachment .icon-action { flex: 0 0 44px; min-width: 44px; min-height: 44px; }
.eva-widget-attachment progress { width: 40px; height: 4px; accent-color: #ea0313; }
.eva-widget-attachment-error { flex: 1; font-size: 13px; line-height: 1.4; }
.eva-widget-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (hover: hover) and (pointer: fine) { .eva-widget-compose-button:hover { background-color: transparent; } }
html[data-bewegung="aus"] .eva-widget-composer::after { animation: none; }
@media (prefers-reduced-motion: reduce) { .eva-widget-composer::after { animation: none; } }
@media (forced-colors: active) {
  .eva-widget-composer { background: Canvas; border-color: CanvasText; }
  .eva-widget-composer textarea { color: CanvasText; caret-color: CanvasText; }
  .eva-widget-composer textarea::placeholder { color: GrayText; }
  .eva-widget-composer:focus-within { outline: 2px solid Highlight; outline-offset: 2px; }
  .eva-widget-composer::after { display: none; }
}
.eva-widget[data-keyboard] .eva-widget-panel {
  bottom: var(--eva-keyboard-inset); max-height: min(480px, calc(var(--eva-visible-height) - var(--kopf-unten, 112px) - var(--eva-bottom, 12px) - 12px));   /* V19.9: bottom zählt ab dem Dock (--eva-bottom), sonst lag der Kopf des Verlaufs unter der Kopfleiste */
}
/* A single first-use card. Memory is an independent opt-in, never an intro banner. */
.eva-consent {
  position: fixed; inset: 0; width: min(420px, calc(100vw - 24px)); max-width: calc(100vw - 24px);
  max-height: calc(100dvh - 24px); margin: auto; padding: 20px; overflow: auto; overscroll-behavior: contain;
  border: 0; border-radius: var(--glass-radius, 18px); color: #fff;
  box-shadow: var(--m-glas-schatten), var(--g-kante), var(--glass-contour);
  font: 400 14px/1.5 var(--ci-font-family, sans-serif); text-shadow: none;
}
.eva-consent:not([open]) { display: none; }
.eva-consent::before, .eva-consent::after { display: none; }
.eva-consent::backdrop { background: rgb(0 0 0 / 38%); }
.eva-consent h2 { margin: 0 44px 10px 0; font-size: 20px; line-height: 1.3; font-weight: 600; }
.eva-consent h2:focus { outline: none; }
.eva-consent p { margin: 0 0 10px; }
.eva-consent .eva-consent-withdrawal { font-size: 12px; margin-bottom: 8px; }
.eva-consent .eva-consent-links { margin-bottom: 4px; }
.eva-consent a { color: #fff; text-underline-offset: 4px; }
.eva-consent-links a { display: inline-flex; align-items: center; min-height: 44px; }
.eva-memory-options { border-top: 1px solid var(--linie, rgb(255 255 255 / 25%)); }
.eva-memory-options summary { min-height: 44px; padding: 11px 0; cursor: pointer; font-size: 13px; }
.eva-memory-options[open] summary { margin-bottom: 6px; }
.eva-consent .eva-consent-details { border-top: 0; }
.eva-consent .eva-consent-details[open] { border-top: 1px solid var(--linie, rgb(255 255 255 / 25%)); padding-top: 12px; }
.eva-consent-details > .eva-consent-info {
  position: absolute; top: 8px; right: 10px; display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; margin: 0; padding: 10px; list-style: none; border-radius: 50%;
  color: inherit; transition: color 180ms ease, filter 180ms ease;
}
.eva-consent-info::marker { content: ''; }
.eva-consent-info::-webkit-details-marker { display: none; }
.eva-consent-info .control-icon { width: 20px; height: 20px; }
.eva-consent-info:is(:hover,:focus-visible), .eva-consent-details[open] > .eva-consent-info {
  color: var(--ci-interaction-red, #ea0313); filter: drop-shadow(0 0 5px rgb(234 3 19 / 65%));
}
.eva-consent summary:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.eva-memory-choice { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; cursor: pointer; }
.eva-memory-choice input { flex: 0 0 20px; width: 20px; height: 20px; margin: 3px 0; accent-color: #ea0313; }
.eva-memory-hint { font-size: 13px; line-height: 1.5; }
.eva-consent .eva-memory-hint { margin: 2px 0 10px 30px; }
.eva-consent-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.eva-consent .aktion, .eva-widget .eva-privacy-erase {
  position: relative; isolation: isolate; justify-content: center; min-height: 44px; padding: 10px 12px;
  border: 1px solid var(--button-contour); border-radius: var(--button-radius, 10px);
  background: var(--button-surface); color: #fff; font: 700 13px/1.45 var(--ci-font-family, sans-serif);
  text-align: center; cursor: pointer; transition: background-color 180ms ease;
}
.eva-consent .eva-consent-primary::before, .eva-widget .eva-privacy-erase::before {
  content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  box-shadow: 0 10px 16px -7px rgb(234 3 19 / 65%); opacity: .35;
  animation: button-backlight 3.6s ease-in-out infinite;
}
.eva-consent .aktion::after, .eva-widget .eva-privacy-erase::after {
  content: ''; position: absolute; inset: -1px; border: 1px solid #ea0313;
  border-radius: inherit; opacity: 0; pointer-events: none;
}
.eva-consent .aktion:is(:hover, :focus-visible), .eva-widget .eva-privacy-erase:is(:hover, :focus-visible) { background-color: rgb(255 255 255 / 10%); }
.eva-consent .aktion:is(:hover, :focus-visible)::after, .eva-widget .eva-privacy-erase:is(:hover, :focus-visible)::after {
  opacity: 1; animation: button-contour-draw 320ms linear both;
}
.eva-consent .eva-consent-primary::before { display: block; }
.eva-consent .eva-consent-secondary { background: transparent; border-color: var(--button-contour); font-weight: 500; }
.eva-consent .eva-consent-secondary::before { display: none; }
.eva-consent .eva-consent-secondary::after { display: none; }
.eva-consent .eva-consent-secondary:is(:hover, :focus-visible) { background: rgb(255 255 255 / 7%); }
.eva-consent :is(button, input, a):focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.eva-consent button:disabled { opacity: .5; cursor: default; }
.eva-widget .eva-privacy-controls { margin: 0 16px 16px; padding-top: 12px; border-top: 1px solid rgb(255 255 255 / 25%); }
.eva-widget .eva-privacy-controls .eva-memory-hint { margin: 4px 0 12px; }
.eva-widget .eva-privacy-erase { width: 100%; font-size: 13px; }
.eva-privacy-feedback { font-size: 13px; line-height: 1.6; }
.eva-privacy-feedback[hidden] { display: none; }
@media (max-width: 360px) { .eva-consent { padding: 16px; } }
html[data-bewegung="aus"] .eva-consent .aktion::after,
html[data-bewegung="aus"] .eva-widget .eva-privacy-erase::after,
html[data-bewegung="aus"] .eva-consent .aktion::before,
html[data-bewegung="aus"] .eva-widget .eva-privacy-erase::before { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .eva-consent .aktion, .eva-consent-info, .eva-widget .eva-privacy-erase { transition: none; }
  .eva-consent .aktion::after, .eva-widget .eva-privacy-erase::after,
  .eva-consent .eva-consent-primary::before, .eva-widget .eva-privacy-erase::before { animation: none !important; }
}
@media (forced-colors: active) {
  .eva-consent { background: Canvas; color: CanvasText; border: 1px solid CanvasText; }
  .eva-consent a { color: LinkText; }
  .eva-consent .aktion, .eva-widget .eva-privacy-erase { color: ButtonText; border-color: ButtonText; }
  .eva-consent .eva-consent-primary::before { display: none; }
}
/* Optional enquiry action. The sphere and dock retain their existing geometry. */
.eva-widget-enquiry-footer { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex: none; padding: 0 0 4px; }
.eva-widget .eva-widget-enquiry-action { min-height: 36px; padding: 6px 0; color: var(--eva-grau); font-size: 13px; font-weight: 500; line-height: 1.45; text-shadow: none; }
.eva-widget-enquiry-status { margin: 0; align-self: stretch; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.eva-action-dialog { touch-action: pan-y pinch-zoom; }
.eva-action-dialog [hidden] { display: none !important; }
.eva-action-dialog h2 { margin: 0 0 12px; }
.eva-action-dialog :is(input, textarea) { scroll-margin-block: 16px; }
.eva-action-dialog :is(button, input, textarea, a):focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.eva-enquiry { width: min(520px, calc(100vw - 24px)); }
.eva-enquiry-form { display: flex; flex-direction: column; gap: 14px; margin: 0; }
.eva-enquiry .eva-enquiry-note { margin: 0; font-size: 13px; line-height: 1.55; }
.eva-enquiry-privacy { align-self: flex-start; min-height: 24px; }
.eva-enquiry-field { display: flex; flex-direction: column; gap: 6px; }
.eva-enquiry-field label { font-size: 13px; font-weight: 600; }
.eva-enquiry-field :is(input, textarea) {
  box-sizing: border-box; display: block; width: 100%; min-width: 0; min-height: 44px; margin: 0; padding: 10px 12px;
  border: 1px solid var(--button-contour, rgb(255 255 255 / 60%)); border-radius: var(--button-radius, 10px);
  background: rgb(0 0 0 / 24%); color: #fff; caret-color: #fff; font: 400 16px/1.5 var(--ci-font-family, sans-serif);
}
.eva-enquiry-field textarea { min-height: 144px; resize: vertical; overscroll-behavior: contain; }
.eva-enquiry-confirmation { font-size: 13px; line-height: 1.55; }
.eva-enquiry .eva-enquiry-feedback { margin: 0; font-size: 13px; line-height: 1.55; overflow-wrap: anywhere; }
.eva-enquiry .eva-consent-actions { margin-top: 0; }
.eva-enquiry-receipt { overflow-wrap: anywhere; }
.eva-enquiry-receipt > p[data-testid="eva-enquiry-receipt"] { font-weight: 600; }
.eva-enquiry-receipt-actions { display: flex; justify-content: flex-end; margin-top: 14px; }
.eva-enquiry h2 { padding-inline-end: 36px; }
.eva-enquiry .eva-enquiry-close { position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; padding: 10px; }
.eva-enquiry .eva-enquiry-close::before, .eva-enquiry .eva-enquiry-close::after { display: none; }
.eva-enquiry .eva-enquiry-close .control-icon { width: 20px; height: 20px; }
.eva-language-switch .eva-consent-actions { margin-top: 16px; }
@media (forced-colors: active) {
  .eva-enquiry-field :is(input, textarea) { background: Canvas; color: CanvasText; border-color: CanvasText; caret-color: CanvasText; }
  .eva-action-dialog :is(button, input, textarea, a):focus-visible { outline-color: Highlight; }
}

/* ---------- V19: EVA hat zwei Orte (Fremdblick P0-1) ----------
   Unterwegs (Stationen 1–7, Detailpanel am Desktop): klein in der Ecke unten rechts, über der Stadt statt über Text.
   An der Kontakt-Station (data-station 7, kein Panel offen): groß in der Mitte – dort ist EVA der Hauptweg zum Projekt.
   Telefon mit offenem Detailpanel: ausgeblendet, solange kein Gespräch läuft (das Panel führt mit „Projekt besprechen“ zu EVA). */
html:not([data-station="7"]) .eva-widget, html[data-detail-open] .eva-widget {
  --eva-size: 64px;
  left: auto; right: max(16px, env(safe-area-inset-right, 0px)); --eva-bottom: max(14px, env(safe-area-inset-bottom, 0px));
  transform: none; width: calc(var(--eva-size) + 96px);
}
html:not([data-station="7"]) .eva-widget :is(.eva-widget-panel, .eva-widget-notice, .eva-widget-hinweis),
html[data-detail-open] .eva-widget :is(.eva-widget-panel, .eva-widget-notice, .eva-widget-hinweis) { left: auto; right: 0; transform: none; }
html:not([data-station="7"]) .eva-widget-label, html[data-detail-open] .eva-widget-label { font-size: 11px; }
html[data-station="7"]:not([data-detail-open]) .eva-widget {
  --eva-size: 134px;   /* V19.3: so groß wie bei der Vorstellung (64 px × 2,1) */
}
/* V19.3 (Owner 21.10.): an Kontakt ruht EVA dort, wo sie sich nach dem Intro vorstellt – waagrecht mittig, die Kugel knapp über
   der Bildmitte (Vorstellung: Kugelmitte 50 % − 15 px × Maßstab). Nie über der Bildunterschrift (--eva-frei-oben setzt
   js/eva-ort.js aus deren Unterkante), nie unter den Rechtslinks. Öffnet sich Gespräch oder Hinweis, gleitet sie an den
   bisherigen Platz unten mittig (eva-ort.js), dort hat das Panel über ihr die volle Höhe. Nur 3D-Bühne der reinen Ansicht.
   V19.5: ebenso bei gewähltem Thema (data-thema, js/themen.js) – über ihr steht dann das Hologramm der Leistung. */
html[data-modus="buehne"][data-ansicht="pur"][data-station="7"]:not([data-detail-open]):not([data-thema]) .eva-widget:not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]))) {
  top: min(calc(100% - var(--eva-size) - 84px), max(var(--eva-frei-oben, 0px), calc(50% - var(--eva-size) / 2 - 50px))); bottom: auto;   /* 50 statt 30 px: Luft zum Schild ZEUS / CEO darunter; min/max statt clamp: die Untergrenze (Bildunterschrift) darf EVA nie aus dem Bild schieben */
}
/* V19.16 (Owner 24.10.): „Mittig aber so, dass das den freien Raum in der Halle ausfüllt … nach dem goldenen Schnitt nach unten
   gerichtet.“ Ruhe an 08: js/eva-ort.js misst den Freiraum (Kopfzeile/Bildunterschrift/Chips bis Rechtslinks/Safari-Leiste) und setzt
   data-ruhe mit --eva-ruhe-mitte (Kugelmitte = Oberkante + 0,618 · Höhe), --eva-ruhe-wort (Höhe der Beschriftung) und --eva-ruhe-x (waagerechte Mitte: die Bildmitte; nur wenn die
   Gruppe mittig neben und unter der Themenliste nicht im Goldenen Schnitt Platz hat, die Mitte des freien Streifens rechts der Liste). P03 gilt hier nicht. Das Dock umfasst
   genau Kugel, Symbole und Beschriftung: Symbolglyphe 16 px neben der Schale (Kasten 44 px), Beschriftung 8 px unter der Schale
   (Schale = 0,4363 × Canvas, orb.js). Größe wie bisher (Owner 24.10.: „Position passt, Größe wie bisher“): --eva-size an 08
   bleibt 134 px bzw. 106 px (Regeln oben/unten), mit dem Wachstum ab 1920×901 aus V19.14 (P43, unten) – die Ruhe-Lage liest --eva-size nur. Ohne Messung (data-ruhe fehlt) gilt die Regel darüber; niedrige Fenster (≤ 420 px) behalten P19. */
.eva-widget { --eva-safe-unten: env(safe-area-inset-bottom, 0px); }
@media (min-height: 421px) {
  html[data-modus="buehne"][data-ansicht="pur"][data-station="7"]:not([data-detail-open]):not([data-thema]) .eva-widget[data-ruhe]:not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]))) {
    top: calc(var(--eva-ruhe-mitte) - var(--eva-size) / 2); bottom: auto; left: var(--eva-ruhe-x, 50%); right: auto; transform: translateX(-50%);
    width: calc(var(--eva-size) * .8726 + 100px); height: calc(var(--eva-size) * .9363 + 8px + var(--eva-ruhe-wort, 28px));
  }
  html[data-modus="buehne"][data-ansicht="pur"][data-station="7"]:not([data-detail-open]):not([data-thema]) .eva-widget[data-ruhe]:not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]))) .eva-widget-talk { width: 100%; }
  html[data-modus="buehne"][data-ansicht="pur"][data-station="7"]:not([data-detail-open]):not([data-thema]) .eva-widget[data-ruhe]:not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]))) .eva-widget-words { margin-top: calc(5px - var(--eva-size) * .0637); }   /* Canvas-Unterkante + 3 px (gap) → Schale + 8 px */
}
/* V19.16: die Beschriftung steht in Ruhe an 08 tiefer, meist auf dem weißen Rotundenboden – zur Kontur aus P14 eine scharfe 1-px-Kante
   direkt an den Buchstaben (kein Fleck dahinter, V19.4), damit Weiß gegen den hellen Boden trägt (gemessen: tools/cockpit-test.mjs,
   --only kugel). Auch im Rückfall ohne data-ruhe. */
html[data-modus="buehne"][data-ansicht="pur"][data-station="7"]:not([data-detail-open]):not([data-thema]) .eva-widget:not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]))) .eva-widget-words {
  text-shadow: 1px 0 #000, -1px 0 #000, 0 1px #000, 0 -1px #000, 1px 1px #000, -1px 1px #000, 1px -1px #000, -1px -1px #000,
    0 0 2px #000, 0 0 4px rgb(0 0 0 / 92%), 0 0 8px rgb(0 0 0 / 70%), 0 1px 14px rgb(0 0 0 / 50%);
}
/* Ruhiges Atmen (V19.4, Owner 22.10.: EVA soll auffallen, aber ruhig): im Ruhezustand wechselt ein weißer und ein roter Glühring über
   opacity – sie weder zuhört noch spricht, kein Panel/Hinweis offen, kein Hover/Fokus, keine Vorstellung. Nur opacity läuft (Compositor);
   eine box-shadow-Animation würde jedes Bild neu malen. Weiß = ::after der Kugel, Rot = Span .eva-widget-glut; Schatten stehen fest in
   --atem-weiss/--atem-rot (Ecke klein, an Kontakt in der Mitte wie bisher). Aus bei prefers-reduced-motion und data-bewegung="aus". */
.eva-widget {
  --atem-weiss: 0 0 7px 2px rgb(255 255 255 / 30%), 0 0 16px 4px rgb(255 255 255 / 15%);
  --atem-rot: 0 0 8px 3px rgb(234 3 19 / 46%), 0 0 20px 6px rgb(234 3 19 / 24%);
}
html[data-modus="buehne"][data-ansicht="pur"][data-station="7"]:not([data-detail-open]) .eva-widget {
  --atem-weiss: 0 0 12px 3px rgb(255 255 255 / 24%), 0 0 28px 8px rgb(255 255 255 / 12%);
  --atem-rot: 0 0 15px 4px rgb(234 3 19 / 40%), 0 0 34px 11px rgb(234 3 19 / 20%);
}
.eva-widget-glut {
  position: absolute; z-index: -2; pointer-events: none; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: calc(var(--eva-shell-radius, 43.6275966%) * 2); aspect-ratio: 1; border-radius: 50%;
  opacity: 0; box-shadow: var(--atem-rot);
}
@media (prefers-reduced-motion: no-preference) {
  html:not([data-bewegung="aus"]) .eva-widget:not([data-state="listening"]):not([data-state="speaking"]):not([data-vorstellung]):not([data-status-visible]):not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]), .eva-widget-talk:is(:hover, :focus-visible))) .eva-widget-sphere::after {
    box-shadow: var(--atem-weiss); transition: none; animation: eva-atem-weiss 5s ease-in-out infinite;
  }
  html:not([data-bewegung="aus"]) .eva-widget:not([data-state="listening"]):not([data-state="speaking"]):not([data-vorstellung]):not([data-status-visible]):not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]), .eva-widget-talk:is(:hover, :focus-visible))) .eva-widget-glut {
    animation: eva-atem-rot 5s ease-in-out infinite;
  }
}
@keyframes eva-atem-weiss { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
@keyframes eva-atem-rot { 0%, 100% { opacity: 0; } 50% { opacity: 1; } }
html[data-station="7"]:not([data-detail-open]) .eva-widget-label { font-size: 15px; }
html[data-station="7"]:not([data-detail-open]) .eva-widget-live { font-size: 12px; }
/* V19.17 (Owner 24.10., Lesbarkeit): „KI“ an 08 halbfett wie die Beschriftung davor – in 400 waren die dünnen Striche über dem
   hellen Bodenschriftzug grau (Glyphen-Median 148–160 statt 255; ungünstigstes Zehntel 2,2–4,3:1 bei 320/360/393). */
html[data-station="7"]:not([data-detail-open]) .eva-widget-live { font-weight: 600; }
/* V19.17 (Owner 24.10., Lesbarkeit): Symbole neben der Kugel an 08 mit derselben engen Kontur wie die Beschriftung (P14, kein Fleck):
   am Desktop stehen sie auf dem hellen Rotundenboden, ungünstigstes Zehntel des Rands vorher 2,8–3,6:1 (Soll Symbol ≥ 3:1). */
html[data-station="7"]:not([data-detail-open]) .eva-widget :is(.eva-widget-toggle:not([aria-expanded="true"]), .eva-widget-info-toggle) .control-icon {
  filter: drop-shadow(0 0 1px rgb(0 0 0 / 95%)) drop-shadow(0 0 2px rgb(0 0 0 / 75%));
}
/* Ortswechsel und Vorstellung fährt js/eva-ort.js (Web Animations); hier nur das Pulsieren der Vorstellung. */
.eva-widget[data-vorstellung] .eva-widget-sphere::after { opacity: 1; animation: eva-puls 1.6s ease-in-out infinite; }
@keyframes eva-puls {
  0%, 100% { box-shadow: 0 0 15px 5px rgb(255 255 255 / 55%), 0 0 34px 11px rgb(255 255 255 / 30%); }
  50% { box-shadow: 0 0 18px 6px rgb(234 3 19 / 70%), 0 0 40px 13px rgb(234 3 19 / 40%); }
}
@media (max-width: 760px), (max-height: 500px) {
  html:not([data-station="7"]) .eva-widget, html[data-detail-open] .eva-widget { --eva-size: 56px; --eva-bottom: max(10px, env(safe-area-inset-bottom, 0px)); right: max(10px, env(safe-area-inset-right, 0px)); }
  html[data-station="7"]:not([data-detail-open]) .eva-widget { --eva-size: 106px; }   /* Vorstellung: 56 px × 1,9 */
}
/* Telefon quer: an Kontakt hat das Gespräch über der großen Kugel keinen Platz (Eingabefeld unter der Kopfleiste), also so klein wie in der Ecke. */
@media (max-height: 500px) and (orientation: landscape) {
  html[data-station="7"]:not([data-detail-open]) .eva-widget:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden])) { --eva-size: 56px; }
}
@media (max-width: 700px) {
  html:not([data-station="7"]) .eva-widget, html[data-detail-open] .eva-widget { --eva-bottom: calc(8px + env(safe-area-inset-bottom, 0px)); }
  html[data-detail-open] .eva-widget:not([data-state="listening"]):not([data-state="speaking"]):not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]))) { display: none; }
  html[data-detail-open][data-eva-visible] .detail-panel-content.detail-shell { padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
}
/* V19: Scroll-Fassung ohne 3D-Bühne (Standbild) am Telefon: Text ruht unten, oben rechts steht nur das Bild → EVA dort. */
@media (max-width: 700px) {
  html:not([data-modus="buehne"]) .eva-widget, html:not([data-modus="buehne"])[data-station="7"] .eva-widget {
    --eva-size: 56px; left: auto; right: max(10px, env(safe-area-inset-right, 0px)); transform: none; width: calc(var(--eva-size) + 96px);
    top: calc(var(--kopf-unten, 112px) + 10px); bottom: auto; --eva-bottom: 10px;
  }
  /* EVA sitzt hier oben: unter dem Fuß braucht es keinen Platz für ein Dock unten (--eva-clearance zählt vom Dock bis zum unteren Rand). */
  html[data-eva-visible]:not([data-modus="buehne"]) .fuss { margin-bottom: calc(8px + env(safe-area-inset-bottom, 0px)); }
  html[data-eva-visible]:not([data-modus="buehne"]) { scroll-padding-bottom: 16px; }
  html:not([data-modus="buehne"]) .eva-widget :is(.eva-widget-panel, .eva-widget-notice, .eva-widget-hinweis) { top: calc(100% + 12px); bottom: auto; left: auto; right: 0; transform: none; }
}

/* ---------- V19.13 (Rundgang 24.10.) ---------- */
/* P03: an Kontakt nie auf der Liste „Worum geht es?“. Liegt sie der Mitte im Weg, rückt das Dock nach rechts, bis es 16 px Luft
   hält (linke Grenze --eva-frei-links misst js/eva-ort.js; passt es dort nicht, fehlt die Variable und EVA ruht unter der Liste).
   Gilt in Ruhe und nach der Themenwahl; mit offenem Gespräch tritt die Liste zurück (Fokus), mit Thema auch beim Hinweis – dann die Mitte. */
html[data-modus="buehne"][data-ansicht="pur"][data-station="7"]:not([data-detail-open]) .eva-widget:not(:has(.eva-widget-panel:not([hidden]))) {
  left: max(50%, calc(var(--eva-frei-links, 0px) + (var(--eva-size) + 112px) / 2));
}
html[data-modus="buehne"][data-ansicht="pur"][data-station="7"][data-thema]:not([data-detail-open]) .eva-widget:has(.eva-widget-notice:not([hidden])) { left: 50%; }
/* P14: an Kontakt steht das Label oft auf dem hellen Rotundenboden – eine dichtere Kontur an den Buchstaben (kein Fleck dahinter) */
html[data-station="7"]:not([data-detail-open]) .eva-widget-words {
  text-shadow: 0 0 1px #000, 0 0 2px #000, 0 0 4px rgb(0 0 0 / 92%), 0 0 8px rgb(0 0 0 / 70%), 0 1px 14px rgb(0 0 0 / 50%);
}
/* P39: „EVA schreibt …“ als ausstehende Zeile im Verlauf (js/eva-widget.js), ruhiger Puls nur mit Bewegung */
.eva-widget-transcript .eva-widget-schreibt { color: var(--eva-grau); }
@media (prefers-reduced-motion: no-preference) {
  html:not([data-bewegung="aus"]) .eva-widget-schreibt span { animation: eva-schreibt 1.8s ease-in-out infinite; }
}
@keyframes eva-schreibt { 50% { opacity: .4; } }
/* V19.14 (Abnahme 24.10.): während EVA den Ort wechselt (data-gleitet, js/eva-ort.js), bleiben Gespräch und Hinweis unsichtbar und
   blenden am Ziel kurz ein – sonst fuhr der Hinweis an Kontakt aus der Bildmitte mit und stand anfangs über dem oberen Rand.
   Nur opacity (fokussierbar bleibt der Schließen-Knopf); ohne Bewegung gleitet EVA nicht, dort greift nichts davon. */
.eva-widget :is(.eva-widget-panel, .eva-widget-notice) { transition: opacity 200ms ease-out; }
.eva-widget[data-gleitet] :is(.eva-widget-panel, .eva-widget-notice) { opacity: 0; pointer-events: none; transition: none; }
/* P13: im Hinweis „Über EVA“ scrollt nur der Erklärtext (mit weichem Auslauf als Hinweis); Datenschutz-Link, Gerätespeicher und
   Widerruf stehen fest darunter, ohne Suchen. Reicht die Höhe nicht einmal dafür, scrollt der Hinweis als Ganzes (wie bisher). */
.eva-widget-notice { max-height: min(56dvh, 480px, calc(100dvh - var(--kopf-unten, 112px) - var(--eva-size) - 50px - var(--eva-bottom, 12px))); }   /* so hoch wie das Gespräch */
.eva-widget-notice > :is(.eva-widget-toolbar, a, .eva-privacy-controls) { flex: none; }
.eva-widget-notice .eva-widget-disclosure {
  flex: 1 1 auto; min-height: 3.2em; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding-bottom: 18px;
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 26px), transparent); mask-image: linear-gradient(to bottom, #000 calc(100% - 26px), transparent);
}
.eva-widget-notice .eva-widget-disclosure:focus-visible { outline-offset: -2px; }
.eva-widget-notice > a { margin-top: 4px; margin-bottom: 0; }
.eva-widget .eva-widget-notice .eva-privacy-controls { margin-bottom: 14px; }
/* P05/P19: Telefon quer (wie data-kompakt quer). Detailblatt offen: das Dock tritt zurück, solange kein Gespräch läuft (wie hochkant).
   Gespräch oder Hinweis offen: EVA klein in der Ecke rechts unten, das Gespräch links daneben in voller Höhe unter dem Kopf; links
   davon die To-do-Liste als Spalte (css/eva-steckbrief.css). So bleiben Eingabefeld und „Projekt starten“ ganz im Bild. */
:root { --eva-quer-spalte: min(240px, 28vw); }
@media (max-height: 500px) and (orientation: landscape) {
  html[data-detail-open] .eva-widget:not([data-state="listening"]):not([data-state="speaking"]):not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]))) { display: none; }
  html[data-detail-open][data-eva-visible] .detail-panel-content.detail-shell { padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
  html[data-modus="buehne"] .eva-widget:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden])) {
    --eva-size: 56px; top: auto; bottom: var(--eva-bottom); left: auto; right: max(10px, env(safe-area-inset-right, 0px)); transform: none;
    width: calc(var(--eva-size) + 96px);
  }
  html[data-modus="buehne"][data-kompakt] .eva-widget:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden])) :is(.eva-widget-panel, .eva-widget-notice) {
    left: auto; right: calc(100% + 8px); bottom: 0; transform: none;
    width: min(460px, calc(100vw - var(--eva-size) - 96px - max(10px, env(safe-area-inset-right, 0px)) - 8px - 24px - var(--eva-quer-spalte)));
    max-height: calc(100dvh - var(--kopf-unten, 80px) - 8px - var(--eva-bottom, 8px));
  }
  html[data-modus="buehne"][data-ansicht="pur"][data-station="7"]:not([data-detail-open]) .eva-widget:has(.eva-widget-notice:not([hidden])) { left: auto; }   /* nicht nach P03 aus der Ecke rücken */
  /* Hinweis quer (P13): etwas dichter, damit Widerruf und Gerätespeicher auch hier ohne Scrollen im Bild stehen */
  .eva-widget-notice .eva-widget-toolbar { padding-block: 0; }
  .eva-widget-notice .eva-widget-disclosure { min-height: 2.4em; padding-top: 8px; }
  .eva-widget-notice > a { margin-top: 0; }
  .eva-widget .eva-widget-notice .eva-privacy-controls { padding-top: 8px; margin-bottom: 8px; }
  .eva-widget .eva-widget-notice .eva-privacy-controls .eva-memory-hint { margin: 2px 0 6px; }
  html[data-modus="buehne"][data-kompakt] .eva-widget[data-keyboard]:has(.eva-widget-panel:not([hidden])) .eva-widget-panel {
    bottom: var(--eva-keyboard-inset); max-height: calc(var(--eva-visible-height) - var(--kopf-unten, 80px) - var(--eva-bottom, 8px) - 12px);
  }
}
/* P19: niedrige Fenster (Telefon quer, 400 % Zoom): an Kontakt in Ruhe die kleine Ecken-Fassung wie unterwegs statt groß in der
   Mitte (dort läge die Kugel auf Überschrift und Knöpfen). Nach der Themenwahl steht EVA klein unten mittig unter dem Hologramm. */
@media (max-height: 420px) {
  html[data-station="7"]:not([data-detail-open]) .eva-widget { --eva-size: 56px; }
  html[data-station="7"]:not([data-detail-open]) :is(.eva-widget-label, .eva-widget-live) { font-size: 11px; }
  html[data-modus="buehne"][data-ansicht="pur"][data-station="7"]:not([data-detail-open]):not([data-thema]) .eva-widget:not(:has(.eva-widget-panel:not([hidden]), .eva-widget-notice:not([hidden]))) {
    top: auto; bottom: var(--eva-bottom); left: auto; right: max(10px, env(safe-area-inset-right, 0px)); transform: none; width: calc(var(--eva-size) + 96px);
  }
}
/* 400 % Zoom (Höhe bis 300 px): Kugel 40 px, das Label nur für Hilfstechnik (der Knopf behält seinen Namen) */
@media (max-height: 300px) {
  .eva-widget { --eva-size: 40px !important; height: calc(var(--eva-size) + 6px); }
  .eva-widget-words { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; overflow: hidden; clip-path: inset(50%); }
}
/* V19.14 (Abnahme 24.10.): große Monitore (P43, wie site.css/clean-view.css). Ab 1920×901 wächst das Dock mit --gu, sonst stand es
   bei 2560×1440 winzig neben den gewachsenen Rechtslinks. max(bisher, n × --gu): nie kleiner als bisher. Die Breite des Docks
   bleibt Kugel + 96/112 px (Seitensymbole dicht an der Kugel, P03-Rechnung an Kontakt); nur die Labelzeile wächst mit. */
@media (min-width: 1920px) and (min-height: 901px) {
  .eva-widget { height: calc(var(--eva-size) + max(30px, calc(30 * var(--gu)))); }
  html:not([data-station="7"]) .eva-widget, html[data-detail-open] .eva-widget { --eva-size: max(64px, calc(64 * var(--gu))); }
  html:not([data-station="7"]) .eva-widget-label, html[data-detail-open] .eva-widget-label { font-size: max(11px, calc(11 * var(--gu))); }
  html:not([data-station="7"]) .eva-widget-live, html[data-detail-open] .eva-widget-live { font-size: max(11px, calc(11 * var(--gu))); }
  html[data-station="7"]:not([data-detail-open]) .eva-widget { --eva-size: max(134px, calc(134 * var(--gu))); }
  html[data-station="7"]:not([data-detail-open]) .eva-widget-label { font-size: max(15px, calc(15 * var(--gu))); }
  html[data-station="7"]:not([data-detail-open]) .eva-widget-live { font-size: max(12px, calc(12 * var(--gu))); }
  .eva-widget-words { min-height: max(23px, calc(23 * var(--gu))); }
}