/* Presenter-Konsole. Bewusst neutral (nicht im Markendesign), damit klar ist: nicht Teil der Kundenseite. */
#demo-console {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  width: var(--console, 400px);
  overflow-y: auto;
  padding: 18px 18px 40px;
  background: #11161c;
  color: #d7dde4;
  font: 13px/1.45 ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  transform: translateX(100%);
  transition: transform 180ms ease;
}
body.console-open #demo-console { transform: translateX(0); }
#console-toggle {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 50;
  padding: 9px 14px;
  border: 1px solid #2d3742;
  border-radius: 6px;
  background: #11161c;
  color: #fff;
  font: 600 12px/1 ui-sans-serif, system-ui, sans-serif;
  cursor: pointer;
}
body.console-open #console-toggle { right: calc(var(--console, 400px) + 14px); }
.dc-head { display: flex; flex-direction: column; gap: 2px; padding-bottom: 12px; border-bottom: 1px solid #2d3742; }
.dc-head strong { color: #fff; font-size: 15px; }
.dc-head span { color: #8795a3; font-size: 11px; }
.dc-section { padding: 14px 0; border-bottom: 1px solid #2d3742; }
.dc-section h4 { margin: 10px 0 6px; color: #8795a3; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.dc-section h4:first-child { margin-top: 0; }
.dc-seg { display: flex; flex-wrap: wrap; gap: 4px; }
.dc-seg button, .dc-actions button {
  padding: 7px 10px;
  border: 1px solid #2d3742;
  border-radius: 5px;
  background: #1a222b;
  color: #d7dde4;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.dc-seg button:hover, .dc-actions button:hover:not(:disabled) { border-color: #f6821f; }
.dc-seg button[aria-pressed="true"] { border-color: #f6821f; background: #f6821f; color: #11161c; font-weight: 700; }
.dc-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.dc-actions button:disabled { opacity: .4; cursor: default; }
.dc-status { display: grid; grid-template-columns: 82px 1fr; gap: 4px 10px; margin: 0; }
.dc-status dt { color: #8795a3; }
.dc-status dd { margin: 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; word-break: break-all; }
#dc-notes { margin: 10px 0 0; padding-left: 16px; color: #f2b36b; font-size: 12px; }
#dc-notes:empty { display: none; }
.dc-decision { padding: 9px 11px; border-radius: 5px; background: #1a222b; font-weight: 700; }
.dc-decision.ok { background: #143323; color: #7fe0a6; }
.dc-decision.warn { background: #3a2c12; color: #f2c46b; }
.dc-decision.fail { background: #3a1616; color: #ff9b91; }
#dc-checks { margin: 8px 0; padding: 0; list-style: none; font-size: 12px; }
#dc-checks li { padding: 3px 0; }
#dc-checks li.ok { color: #7fe0a6; }
#dc-checks li.fail { color: #ff9b91; }
details summary { color: #8795a3; cursor: pointer; font-size: 12px; }
#dc-raw { max-height: 260px; overflow: auto; margin: 8px 0 0; padding: 10px; border-radius: 5px; background: #0a0e12; color: #b9c6d3; font-size: 11px; white-space: pre-wrap; word-break: break-all; }
#dc-log { max-height: 220px; overflow-y: auto; margin: 0; padding: 0; list-style: none; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; }
#dc-log li { padding: 2px 0; color: #9aa8b6; }
#dc-log li.ok { color: #7fe0a6; }
#dc-log li.fail { color: #ff9b91; }
@media (max-width: 900px) {
  #demo-console { width: 100%; }
  body.console-open #console-toggle { right: 14px; }
}