/* Chats — District-Modul.
   Bewusst sparsam: Der District-Rahmen (Karte, Kopf, Typografie) kommt aus
   district-shell.css. Hier steht nur, was diese Seite zusaetzlich braucht. */

.chats-modul { max-width: 72ch; margin: 0 auto; padding: 0 clamp(16px, 4vw, 32px) 64px; }

.chats-kennung {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: .78rem; letter-spacing: .12em;
  color: var(--akzent, #47b6ff); margin: 0 0 8px;
}

.chats-modul h1 { font-size: clamp(1.8rem, 5vw, 2.6rem); line-height: 1.1; margin: 0 0 12px; }
.chats-lead { color: var(--text-leise, #9fb0c8); margin: 0 0 28px; }

.chats-zustand {
  border: 1px solid var(--linie, #1e2c44);
  border-radius: 12px;
  padding: clamp(20px, 4vw, 32px);
  background: var(--flaeche, #0a1526);
}

.chats-hinweis { margin: 0 0 16px; }
.chats-fussnote { margin: 14px 0 0; font-size: .88rem; color: var(--text-leise, #9fb0c8); }

.chats-knopf {
  display: inline-block; padding: 10px 20px;
  border: 1px solid var(--akzent, #47b6ff); border-radius: 8px;
  color: var(--akzent, #47b6ff); text-decoration: none;
  /* Fingerfreundlich: 44 px sind das Mindestmass fuer Beruehrung. */
  min-height: 44px; line-height: 24px;
}
.chats-knopf:hover, .chats-knopf:focus-visible { background: rgba(71, 182, 255, .12); }

.chats-weiter { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.chats-weiter__link {
  color: var(--text-leise, #9fb0c8); text-decoration: none;
  border-bottom: 1px solid currentColor; padding-bottom: 2px;
}
.chats-weiter__link:hover, .chats-weiter__link:focus-visible { color: var(--akzent, #47b6ff); }