body { display: flex; flex-direction: column; height: 100vh; }

.leiste { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 8px 14px; }
body.embed .leiste { padding: 6px 4px; }
.schalter { margin-left: auto; font-size: 0.85em; color: var(--grau); display: flex; gap: 6px; align-items: center; }

.roentgen {
  flex: 1; min-height: 0; display: grid; grid-template-columns: 1fr 1.15fr; gap: 10px; padding: 0 14px 14px;
}
body.embed .roentgen { padding: 0 4px 4px; }

.formularflaeche { padding: 12px 16px; overflow: auto; }
.formtag { margin: 0 0 12px; font-size: 0.8em; color: var(--blau); background: var(--blau-hell); border-radius: 6px; padding: 6px 10px; }
#formular { display: grid; grid-template-columns: auto 1fr; gap: 10px 14px; align-items: center; }
#formular label { font-weight: 600; }
#formular input { font: inherit; padding: 5px 8px; border: 2px solid #bbb; border-radius: 6px; }
#formular button { grid-column: 2; justify-self: start; }

.request {
  flex: 1; margin: 0; padding: 14px 16px; font-size: 0.9em; line-height: 1.55; overflow: auto;
  white-space: pre-wrap; word-break: break-all; background: #1e2a33; color: #e8eef2;
}
.request .start { color: #fff; font-weight: 700; }
.request .kopf { color: #9fc3d8; }
.request .leer { color: #6d8797; font-style: italic; }

/* Farben verbinden Feld und Wert über die Leitung. */
[data-farbe="1"], .wert1 { --f: #ffb84d; }
[data-farbe="2"], .wert2 { --f: #7fe0a8; }
[data-farbe="3"], .wert3 { --f: #ff8fb1; }
#formular input[data-farbe] { border-color: var(--f); box-shadow: inset 4px 0 0 var(--f); }
.request .wert1, .request .wert2, .request .wert3 { color: var(--f); font-weight: 700; }

.blitz { animation: blitz .6s ease-out; }
@keyframes blitz { from { background: #3d5566; } to { background: #1e2a33; } }

.merke { margin: 0; padding: 10px 14px; font-size: 0.85em; border-top: 1px solid var(--linie); background: var(--flaeche); }

@media (max-width: 860px) {
  body { height: auto; }
  .roentgen { grid-template-columns: 1fr; }
  .request { min-height: 220px; }
}
