/* Ops-Cockpit — SEDS-Farben (Skeena #1BA5D4, SemiNet #0959EF), mobil zuerst, kein Build-Schritt */
:root {
  --skeena: #1BA5D4;
  --seminet: #0959EF;
  --text: #14202b;
  --grund: #f4f7fa;
  --karte: #ffffff;
  --linie: #d5dde5;
}

@media (prefers-color-scheme: dark) {
  :root {
    --text: #e6edf3;
    --grund: #0f161d;
    --karte: #17212b;
    --linie: #2a3846;
  }
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  line-height: 1.5;
  color: var(--text);
  background: var(--grund);
}

.kopf {
  padding: 0.75rem 1rem;
  font-weight: 600;
  color: #fff;
  background: var(--seminet);
}

.kopf .marke { color: var(--skeena); background: #fff; padding: 0 0.4rem; border-radius: 0.25rem; margin-right: 0.4rem; }

.inhalt { padding: 1rem; max-width: 60rem; margin: 0 auto; }

.karte {
  padding: 1rem;
  background: var(--karte);
  border: 1px solid var(--linie);
  border-left: 4px solid var(--skeena);
  border-radius: 0.5rem;
}

h1 { margin-top: 0; font-size: 1.25rem; }

.kopf { display: flex; align-items: center; gap: 0.4rem; }
.kopf .abmelden { margin-left: auto; font-weight: 400; }
label { display: block; }
input { display: block; width: 100%; max-width: 22rem; padding: 0.5rem; font: inherit; }
button { padding: 0.5rem 1rem; font: inherit; }
.fehler { color: #b00020; font-weight: 600; }
.qr svg { max-width: 14rem; height: auto; background: #fff; }
.codes { columns: 2; max-width: 22rem; }

@media (min-width: 40rem) {
  .inhalt { padding: 2rem; }
  h1 { font-size: 1.5rem; }
}