:root {
  --schwarz: #111111; --orange: #b5581f; --aussen: #eee7db; --innen: #fdfbf7;
  --text: #3b4753; --hell: #a8a29b; --linie: #ddd3c4; --gruen: #2f6b3a; --rot: #a3261b;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--aussen); color: var(--text);
  font-family: Arial, Helvetica, sans-serif; font-size: 15px; line-height: 1.6; }
a { color: var(--orange); }
.kopf { background: var(--schwarz); color: #fff; padding: 18px 24px; display: flex;
  align-items: center; gap: 22px; flex-wrap: wrap; }
.kopf img { width: 64px; height: auto; display: block; }
.kopf .titel { font-family: Georgia, "Times New Roman", serif; font-size: 22px; font-weight: bold; }
.kopf .unter { font-size: 11px; letter-spacing: 3px; text-transform: uppercase; color: var(--hell); }
.kopf nav { margin-left: auto; display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.kopf nav a { color: #fff; text-decoration: none; }
.kopf nav form { margin: 0; }
.balken { height: 6px; background: var(--orange); }
main { max-width: 980px; margin: 24px auto; background: var(--innen); padding: 28px 32px; }
.fuss { max-width: 980px; margin: 0 auto 30px; font-size: 12px; color: #6b6259; padding: 0 8px; }
h1 { font-family: Georgia, "Times New Roman", serif; font-size: 26px; margin: 0 0 16px; }
h2 { font-size: 18px; margin: 26px 0 10px; }
.meldung { background: #fff4e5; border-left: 4px solid var(--orange); padding: 10px 14px; margin: 0 0 16px; }
.hinweis { background: #f3efe8; padding: 10px 14px; margin: 12px 0; font-size: 14px; }
.warnung { background: #fbeaea; border-left: 4px solid var(--rot); padding: 10px 14px; margin: 12px 0; }
table { width: 100%; border-collapse: collapse; margin: 8px 0 16px; font-size: 14px; }
th, td { text-align: left; padding: 7px 8px; border-bottom: 1px solid var(--linie); vertical-align: top; }
th { background: #f0e9dd; }
.rechts { text-align: right; }
label { display: block; font-weight: bold; margin: 14px 0 4px; }
input[type=text], input[type=email], input[type=password], input[type=date], textarea {
  width: 100%; padding: 9px 10px; border: 1px solid #c9bda9; font: inherit; background: #fff; }
textarea { min-height: 110px; }
.wahl label { display: inline; font-weight: normal; margin-right: 18px; }
button, .knopf { background: var(--orange); color: #fff; border: 0; padding: 10px 18px;
  font: inherit; font-weight: bold; cursor: pointer; text-decoration: none; display: inline-block; }
button.leise { background: #6b6259; }
button.gefahr { background: var(--rot); }
.kopf nav button { background: transparent; padding: 0; font-weight: normal; text-decoration: underline; }
.zeile { display: flex; gap: 10px; flex-wrap: wrap; align-items: end; }
.zeile form { margin: 0; }
.schmal { max-width: 420px; }
.status-sauber { color: var(--gruen); font-weight: bold; }
.status-infiziert, .status-verworfen { color: var(--rot); font-weight: bold; }
.status-nicht_pruefbar { color: var(--orange); font-weight: bold; }
.ablage { border: 2px dashed #c9bda9; padding: 18px; margin: 12px 0; background: #fff; }
.fortschritt { height: 8px; background: #eee; margin: 6px 0; }
.fortschritt div { height: 8px; background: var(--orange); width: 0; }
.klein { font-size: 12px; color: #6b6259; }
.code { font-family: Consolas, monospace; }
@media (max-width: 640px) { main { padding: 18px 16px; margin: 0; } }