/* Fraktionssitzungen.

   Die Seite ist ein Arbeitspapier: eine Traktandenliste, in die zwölf Leute
   während der Sitzung schreiben. Entsprechend sieht sie aus wie ein gesetztes
   Sitzungspapier — eine Schrift, weisses Blatt, Nummern am Rand, Linien statt
   Kästen. Farbe trägt Bedeutung: Blattgrün gliedert, Tannengrün ist anklickbar,
   Magenta heisst «hier musst du etwas entscheiden». */

@font-face {
  font-family: "Instrument Sans";
  src: url("/static/schriften/instrument-sans.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --blatt: #ffffff;
  --tinte: #171c14;
  --leise: #5d6657;
  --linie: #d9ded2;
  --linie-stark: #bcc6ae;   /* Zeilenlinien der Tabellen: eine Farbe über weissen und getönten Grund */
  --toenung: #f1f5ea;
  --toenung-stark: #e2ebd3;
  --blattgruen: #84b414;
  --tannengruen: #2a5a0c;
  --magenta: #b8005f;
  --magenta-toenung: #fdeef6;
  --frisch: #eef6c8;
  --rand: 3.75rem;       /* Breite der Nummernspalte */
  --leiste: 2.5rem;      /* Höhe der mitlaufenden Leiste */
  color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
  :root {
    --blatt: #141812;
    --tinte: #e8ecE3;
    --leise: #a2ab9a;
    --linie: #353d2e;
    --linie-stark: #4d5841;
    --toenung: #1d2319;
    --toenung-stark: #2a3323;
    --blattgruen: #84b414;
    --tannengruen: #a9d86f;
    --magenta: #ff7ab8;
    --magenta-toenung: #3a1528;
    --frisch: #33401a;
  }
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--blatt);
  color: var(--tinte);
  font: 1rem/1.5 "Instrument Sans", "Segoe UI", system-ui, sans-serif;
  font-variant-numeric: lining-nums;
}

a { color: var(--tannengruen); text-underline-offset: 0.15em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--tannengruen); outline-offset: 2px; }

/* --- Rahmen -------------------------------------------------------------- */

.navigation {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 2rem;
  padding: 0.9rem 1.5rem 0.75rem;
  border-bottom: 4px solid var(--blattgruen);
}
.marke { font-weight: 700; font-size: 1.05rem; letter-spacing: -0.01em; color: var(--tinte); text-decoration: none; }
.navigation nav { display: flex; gap: 1.5rem; }
.navigation nav a { color: var(--tinte); text-decoration: none; }
.navigation nav a:hover { text-decoration: underline; }
.navigation nav a[aria-current="page"] { font-weight: 700; }
.kopf-rechts { margin-left: auto; display: flex; align-items: baseline; gap: 1rem; }
.angemeldet { color: var(--leise); font-size: 0.9rem; }

main { max-width: 76rem; margin: 0 auto; padding: 2.5rem 1.5rem 4rem; }
.schmal { max-width: 27rem; margin: 3rem 0 0 var(--rand); }

footer {
  max-width: 76rem;
  margin: 0 auto;
  padding: 1rem 1.5rem 2rem;
  color: var(--leise);
  font-size: 0.8rem;
}

h1 {
  margin: 0;
  font-size: clamp(2rem, 1.3rem + 2.6vw, 3.25rem);
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -0.03em;
}
h2 { margin: 0 0 0.5rem; font-size: 1.3rem; line-height: 1.25; font-weight: 700; letter-spacing: -0.015em; }
h3 { margin: 1.1rem 0 0.25rem; font-size: 1rem; font-weight: 600; }
p { max-width: 42rem; }
.untertitel { margin: 0.5rem 0 0; color: var(--leise); font-size: 1.1rem; }
.brotkrumen { margin: 0 0 1rem; font-size: 0.9rem; }
.zusatz { color: var(--leise); font-weight: 400; font-size: 0.85em; letter-spacing: 0; }
.leer, .hilfe { color: var(--leise); }
.hilfe { font-size: 0.9rem; margin: 2.5rem 0 0 var(--rand); }

/* --- Formulare ----------------------------------------------------------- */

button {
  font: inherit;
  font-weight: 600;
  padding: 0.5rem 1rem;
  border: 2px solid var(--tannengruen);
  border-radius: 3px;
  background: var(--tannengruen);
  color: var(--blatt);
  cursor: pointer;
}
button:hover { filter: brightness(1.12); }
button.leise {
  padding: 0.15rem 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--tannengruen);
  font-weight: 400;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
button.warnung { background: var(--magenta); border-color: var(--magenta); }

.formular { display: grid; gap: 0.35rem; max-width: 36rem; }
.formular label { margin-top: 0.75rem; font-weight: 600; }
.formular button { justify-self: start; margin-top: 1.1rem; }
input[type="text"], input[type="email"], input[type="url"], input[type="date"] {
  font: inherit;
  width: 100%;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--leise);
  border-radius: 3px;
  background: var(--blatt);
  color: var(--tinte);
}
input:focus-visible { outline-offset: 0; }
details summary { cursor: pointer; margin-top: 1rem; color: var(--leise); }
details label { display: block; }

/* Abschnitte unter der Hauptsache: eine Linie trennt, kein Kasten rahmt. */
.abschnitt { margin-top: 3.5rem; padding-top: 1.5rem; border-top: 1px solid var(--linie); }

.meldung { margin: 1rem 0; padding: 0.6rem 0.9rem; max-width: 36rem; }
.meldung.fehler { background: var(--magenta-toenung); color: var(--magenta); box-shadow: inset 4px 0 0 var(--magenta); }

/* --- Übersicht ----------------------------------------------------------- */

.naechste { margin: 2rem 0 0; }
.naechste a {
  display: inline-block;
  font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.15;
}
.naechste .zusatz { display: block; margin-top: 0.35rem; font-size: 1rem; }

.sitzungsliste { list-style: none; padding: 0; margin: 0.75rem 0 0; max-width: 42rem; }
.sitzungsliste li {
  display: flex;
  flex-wrap: wrap;
  gap: 0.15rem 1.25rem;
  align-items: baseline;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--linie);
}

/* --- Personen ------------------------------------------------------------ */

table { border-collapse: collapse; width: 100%; }
.personen { max-width: 48rem; margin-top: 1.5rem; }
.personen th { font-size: 0.85rem; color: var(--leise); font-weight: 600; }
.personen th, .personen td {
  text-align: left;
  padding: 0.55rem 1rem 0.55rem 0;
  border-bottom: 1px solid var(--linie);
}
.personen .stillgelegt td { color: var(--leise); }

/* --- Sitzungsseite: Kopf und mitlaufende Leiste -------------------------- */

.sitzungskopf { margin-left: var(--rand); }

.leiste {
  position: sticky;
  top: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  height: var(--leiste);
  margin: 1.5rem 0 0;
  padding-left: var(--rand);
  background: var(--blatt);
  border-bottom: 1px solid var(--tinte);
  font-size: 0.9rem;
}
.status { margin: 0; color: var(--leise); text-align: right; }
.status.fehler { color: var(--magenta); font-weight: 600; }

/* --- Sitzungsseite: Traktanden ------------------------------------------- */

/* Die Nummer steht gross am Rand, der Inhalt in einer Flucht rechts davon —
   so findet man «Traktandum 8» beim Scrollen am Rand, ohne zu lesen. */
.traktanden { list-style: none; margin: 0; padding: 0; counter-reset: traktandum; }
.traktanden > li {
  position: relative;
  counter-increment: traktandum;
  padding: 1.6rem 0 1.6rem var(--rand);
  border-bottom: 1px solid var(--linie);
}
.traktanden > li::before {
  content: counter(traktandum);
  position: absolute;
  left: 0;
  top: 1.2rem;
  font-size: 2rem;
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--blattgruen);
}
.unterlagen { display: flex; flex-wrap: wrap; gap: 0.25rem 1.75rem; margin: 0 0 1rem; }

/* --- Felder -------------------------------------------------------------- */

/* In Ruhe die Anzeige, beim Schreiben das Eingabefeld. Beide gleich gesetzt,
   damit beim Wechsel nichts springt. Der rohe Text im Kasten ist nur zu sehen,
   bis sitzung.js geladen ist. */
.feld { position: relative; max-width: 48rem; white-space: pre-wrap; }
.feld-anzeige, .feld-eingabe {
  display: block;
  width: 100%;
  min-height: 2.5rem;
  padding: 0.45rem 0.7rem;
  border: 0;
  border-radius: 0;
  font: inherit;
  line-height: 1.5;
  color: var(--tinte);
  white-space: normal;
}
/* `display: block` oben überstimmte sonst das hidden-Attribut, und die Anzeige
   bliebe unter dem Eingabefeld stehen. */
.feld-anzeige[hidden] { display: none; }
/* Wo man schreiben kann, ist die Fläche getönt — überall auf der Seite gleich,
   in den freien Feldern wie in den Tabellenspalten. Das ist die eine Regel,
   an der man Schreibfelder erkennt; sonst ist nichts getönt. */
.feld-anzeige {
  cursor: text;
  background: var(--toenung);
  box-shadow: inset 2px 0 0 var(--blattgruen);
}
.feld-anzeige:hover { background: var(--toenung-stark); }
.feld-anzeige:empty::before { content: "Schreiben …"; color: var(--leise); }
.feld-anzeige p { margin: 0; max-width: none; }
.feld-anzeige ul { margin: 0; padding-left: 1.2rem; }
.feld-anzeige li::marker { color: var(--blattgruen); }
.feld-anzeige a { overflow-wrap: anywhere; }
/* Beim Schreiben wird das Feld weiss mit grünem Rahmen: Hier bin ich gerade. */
.feld-eingabe {
  resize: none;
  overflow: hidden;
  white-space: pre-wrap;
  background: var(--blatt);
  box-shadow: inset 0 0 0 2px var(--tannengruen);
  outline: none;
}

/* Was jemand anderes gerade geschrieben hat, leuchtet kurz auf. */
.feld.neu .feld-anzeige { animation: frisch 2.5s ease-out; }
@keyframes frisch { from { background: var(--frisch); } to { background: var(--toenung); } }
@media (prefers-reduced-motion: reduce) { .feld.neu .feld-anzeige { animation: none; } }

.konflikt {
  margin-top: 0.4rem;
  padding: 0.7rem 0.9rem;
  background: var(--magenta-toenung);
  box-shadow: inset 4px 0 0 var(--magenta);
  white-space: normal;
}
.konflikt > p { margin: 0 0 0.4rem; font-weight: 600; color: var(--magenta); }
.konflikt-fassung { margin-bottom: 0.7rem; }
.konflikt-fassung p, .konflikt-fassung ul { margin: 0; }
.konflikt button { margin-right: 1rem; padding: 0.3rem 0.7rem; }
.konflikt button.leise { padding: 0.15rem 0; }

/* --- Geschäftstabelle ---------------------------------------------------- */

/* Ein liniertes Formular: links, was der Grosse Rat traktandiert hat, rechts
   zwei Spalten zum Hineinschreiben. Auf schmalen Bildschirmen rollt die
   Tabelle im eigenen Rahmen seitlich, statt die Seite breiter zu machen. */
.tabellenrahmen { overflow-x: auto; }
@media (min-width: 60rem) { .tabellenrahmen { overflow-x: visible; } }

.geschaefte { min-width: 46rem; table-layout: fixed; }
.geschaefte th, .geschaefte td { vertical-align: top; text-align: left; }
.geschaefte thead th {
  position: sticky;
  top: var(--leiste);
  z-index: 2;
  padding: 0.5rem 0.7rem 0.4rem;
  background: var(--blatt);
  box-shadow: inset 0 -2px 0 var(--tinte);
  font-size: 0.85rem;
  font-weight: 600;
}
.geschaefte td { border-bottom: 1px solid var(--linie-stark); }
.geschaefte .nr { width: 3rem; padding: 0.65rem 0.5rem 0.65rem 0; font-weight: 700; font-variant-numeric: tabular-nums; }
.geschaefte thead .nr { padding-left: 0; }
.geschaefte td.geschaeft { padding: 0.65rem 1.25rem 0.75rem 0.7rem; }
.geschaefte th.votum, .geschaefte td.votum { width: 17%; }
.geschaefte th.haltung, .geschaefte td.haltung { width: 31%; }

.geschaeftsnummer {
  display: block;
  color: var(--leise);
  font-size: 0.85rem;
  font-variant-numeric: tabular-nums;
}
.geschaeftstitel { white-space: pre-line; }

.geschaefte .departement th {
  padding: 1.6rem 0.7rem 0.5rem 0;
  border-bottom: 2px solid var(--blattgruen);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* Die Schreibzellen füllen ihre Zelle ganz aus: Wer irgendwo hineinklickt,
   schreibt. `height: 1px` an der Zelle ist der Kniff, damit `height: 100%`
   der Kinder in einer Tabelle überhaupt etwas bedeutet. */
.geschaefte td.votum, .geschaefte td.haltung { height: 1px; padding: 0; border-left: 1px solid var(--linie); }
.geschaefte .feld { height: 100%; max-width: none; }
.geschaefte .feld-anzeige { height: 100%; min-height: 3.2rem; padding: 0.65rem 0.7rem; box-shadow: none; }
.geschaefte .feld-anzeige:empty::before { content: ""; }
.geschaefte .feld-eingabe { min-height: max(3.2rem, 100%); padding: 0.65rem 0.7rem; }
.geschaefte thead th.votum, .geschaefte thead th.haltung { background: var(--toenung); }
.geschaefte td.votum, .geschaefte td.haltung { border-left-color: var(--blatt); }
.geschaefte td.haltung .feld-anzeige { font-weight: 600; }

/* Die Sprünge in die Sammelmappe: eine ruhige Zeile unter dem Geschäft. */
.spruenge { display: flex; flex-wrap: wrap; gap: 0.1rem 1.1rem; margin-top: 0.35rem; font-size: 0.85rem; }

.verwaltung { margin: 3rem 0 0 var(--rand); color: var(--leise); }
.verwaltung p, .verwaltung .formular { color: var(--tinte); }
.gefahr { margin: 0.5rem 0 0 var(--rand); color: var(--leise); }

/* Sprungziele landen unter der mitlaufenden Leiste, nicht dahinter. */
[id] { scroll-margin-top: calc(var(--leiste) + 0.5rem); }

/* --- Schmale Bildschirme ------------------------------------------------- */

@media (max-width: 40rem) {
  :root { --rand: 2.25rem; }
  main { padding: 1.5rem 1rem 3rem; }
  .navigation { padding: 0.75rem 1rem 0.6rem; }
  .traktanden > li::before { font-size: 1.4rem; top: 1.55rem; }
  .schmal { margin-left: 0; }
}

/* --- Traktanden ein- und ausklappen -------------------------------------- */

/* Der Titel ist der Schalter. Rechts daneben steht in Worten, was ein Klick
   tut — ein Pfeil allein liesse offen, ob er den Zustand oder die Wirkung zeigt. */
.traktanden summary {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 1rem;
  list-style: none;
  cursor: pointer;
  /* Die allgemeine Regel für <summary> (grau, mit Abstand) gilt hier nicht. */
  margin-top: 0;
  color: inherit;
}
.traktanden summary::-webkit-details-marker { display: none; }
.traktanden summary h2 { margin: 0; }
.traktanden summary::after {
  content: "einklappen";
  margin-left: auto;
  color: var(--leise);
  font-size: 0.85rem;
}
.traktanden details:not([open]) > summary::after { content: "ausklappen"; }
.traktanden summary:hover::after { color: var(--tannengruen); text-decoration: underline; }
.traktanden details[open] > summary { margin-bottom: 0.6rem; }

/* Eingeklappt rücken die Traktanden zusammen: Dann ist die Seite die
   Traktandenliste der Fraktionssitzung auf einen Blick. */
.traktanden > li:has(> details:not([open])) { padding-top: 0.7rem; padding-bottom: 0.7rem; }
.traktanden > li:has(> details:not([open]))::before { top: 0.5rem; font-size: 1.6rem; }
.traktanden > li:has(> details:not([open])) h2 { font-weight: 600; }

.leiste-links { display: flex; align-items: baseline; gap: 1.25rem; white-space: nowrap; }
.leiste .leiste-links button { font-weight: 400; font-size: inherit; }
@media (max-width: 40rem) {
  .leiste-links { gap: 0.75rem; }
  .traktanden > li:has(> details:not([open]))::before { font-size: 1.3rem; top: 0.6rem; }
}

/* --- Einladungen und Veranstaltungen ------------------------------------- */

/* Dieselbe Machart wie die Geschäftstabelle: links, was feststeht, rechts die
   zwei Spalten zum Hineinschreiben. */
.anlaesse { min-width: 50rem; table-layout: fixed; }
.anlaesse th, .anlaesse td { vertical-align: top; text-align: left; }
.anlaesse thead th {
  padding: 0.5rem 0.7rem 0.4rem;
  box-shadow: inset 0 -2px 0 var(--tinte);
  font-size: 0.85rem;
  font-weight: 600;
}
.anlaesse td { padding: 0.65rem 0.7rem; border-bottom: 1px solid var(--linie-stark); }
.anlaesse th.wann, .anlaesse td.wann { width: 9.5rem; padding-left: 0; }
.anlaesse td.wann { font-weight: 700; font-variant-numeric: tabular-nums; }
.anlaesse th.ort, .anlaesse td.ort { width: 15%; }
.anlaesse th.zeit, .anlaesse td.zeit { width: 7.5rem; }
.anlaesse th.teilnahme, .anlaesse td.teilnahme { width: 17%; }
.anlaesse th.kommentar, .anlaesse td.kommentar { width: 20%; }
.anlaesse .anlass { display: block; font-weight: 600; }
.anlaesse .info { display: block; margin-top: 0.15rem; color: var(--leise); font-size: 0.9rem; white-space: pre-line; }
.zeilenlinks { display: flex; flex-wrap: wrap; gap: 0.1rem 1.1rem; margin-top: 0.3rem; font-size: 0.85rem; color: var(--leise); }

.anlaesse td.teilnahme, .anlaesse td.kommentar { height: 1px; padding: 0; border-left: 1px solid var(--linie); }
.anlaesse .feld { height: 100%; max-width: none; }
.anlaesse .feld-anzeige { height: 100%; min-height: 3.2rem; padding: 0.65rem 0.7rem; box-shadow: none; }
.anlaesse .feld-anzeige:empty::before { content: ""; }
.anlaesse .feld-eingabe { min-height: max(3.2rem, 100%); padding: 0.65rem 0.7rem; }
.anlaesse thead th.teilnahme, .anlaesse thead th.kommentar { background: var(--toenung); }
.anlaesse td.teilnahme, .anlaesse td.kommentar { border-left-color: var(--blatt); }
.anlaesse .aendern { display: block; margin-top: 0.3rem; font-size: 0.85rem; font-weight: 400; }
.anlaesse td.teilnahme .feld-anzeige { font-weight: 600; }

/* Auf der Unterseite gibt es keine Nummernspalte am Rand. */
.leiste.ohne-rand { padding-left: 0; }
.gefahr.ohne-rand { margin-left: 0; margin-top: 3rem; }
.vergangene > summary { margin-top: 0; font-size: 1.05rem; }
.vergangene[open] > summary { margin-bottom: 1rem; }

textarea {
  font: inherit;
  width: 100%;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--leise);
  border-radius: 3px;
  background: var(--blatt);
  color: var(--tinte);
  resize: vertical;
}
input[type="file"] { font: inherit; }

.veranstaltung { max-width: 44rem; margin-top: 1.5rem; }
.veranstaltung fieldset { display: grid; gap: 0.35rem; margin: 0 0 1.5rem; padding: 0 0 1.5rem; border: 0; border-bottom: 1px solid var(--linie); min-width: 0; }
.veranstaltung legend { padding: 0; font-weight: 600; }
.nebeneinander { display: flex; flex-wrap: wrap; gap: 0 1rem; }
.nebeneinander > div { flex: 1 1 9rem; display: grid; gap: 0.35rem; align-content: start; }
.nebeneinander > .breit { flex: 3 1 16rem; }

/* --- Anhörungen ----------------------------------------------------------- */

.vorgehen { margin: 1.75rem 0 0; max-width: 54rem; }
.vorgehen h2 { font-size: 1.05rem; margin-bottom: 0.3rem; }
.vorgehen ul { margin: 0; padding-left: 1.2rem; }
.vorgehen li::marker { color: var(--blattgruen); }
.leiste form { display: flex; align-items: baseline; gap: 0.75rem; }

.anhoerungen { min-width: 56rem; table-layout: fixed; }
.anhoerungen th, .anhoerungen td { vertical-align: top; text-align: left; }
.anhoerungen thead th {
  padding: 0.5rem 0.7rem 0.4rem;
  box-shadow: inset 0 -2px 0 var(--tinte);
  font-size: 0.85rem;
  font-weight: 600;
}
.anhoerungen td { padding: 0.65rem 0.7rem; border-bottom: 1px solid var(--linie-stark); }
.anhoerungen thead th:first-child, .anhoerungen td.inhalt { padding-left: 0; }
.anhoerungen .anlass { display: block; font-weight: 600; }
.anhoerungen .info { display: block; margin-top: 0.15rem; color: var(--leise); font-size: 0.9rem; }
.anhoerungen .dokument { display: inline-block; margin-top: 0.35rem; font-size: 0.9rem; }
.anhoerungen .dept { width: 4.5rem; }
.anhoerungen td.dept { font-weight: 600; }
.anhoerungen th.verantwortlich, .anhoerungen td.verantwortlich { width: 16%; }
.anhoerungen .datum { width: 10.5rem; }
.anhoerungen .frist { width: 8.5rem; }
.anhoerungen td.frist { font-weight: 700; font-variant-numeric: tabular-nums; }
.anhoerungen .rest { display: block; font-weight: 400; font-size: 0.85rem; color: var(--leise); }
/* Eine nahe Frist ist das, worauf die Liste aufmerksam machen muss. */
.anhoerungen td.frist.bald, .anhoerungen td.frist.bald .rest { color: var(--magenta); }

/* Schreibbar: dieselbe Tönung wie die Textfelder. */
.anhoerungen thead th.verantwortlich, .anhoerungen thead th.schreibbar { background: var(--toenung); }
.anhoerungen td.verantwortlich { height: 1px; padding: 0; background: var(--toenung); border-left: 1px solid var(--blatt); }
.anhoerungen td.schreibbar { background: var(--toenung); border-left: 1px solid var(--blatt); padding: 0.45rem 0.5rem; }
.anhoerungen .feld { height: 100%; max-width: none; }
.anhoerungen .feld-anzeige { height: 100%; min-height: 3.2rem; padding: 0.65rem 0.7rem; box-shadow: none; background: transparent; }
.anhoerungen .feld-anzeige:hover { background: var(--toenung-stark); }
.anhoerungen .feld-anzeige:empty::before { content: ""; }
.anhoerungen .feld-eingabe { min-height: max(3.2rem, 100%); padding: 0.65rem 0.7rem; }
input.termin {
  font: inherit;
  width: 100%;
  padding: 0.3rem 0.4rem;
  border: 1px solid transparent;
  border-radius: 3px;
  background: transparent;
  color: var(--tinte);
  cursor: pointer;
}
input.termin:hover { background: var(--toenung-stark); }
input.termin:focus-visible { background: var(--blatt); border-color: var(--tannengruen); outline: none; }
input.termin.fehler { border-color: var(--magenta); }


/* --- Alles aktualisieren --------------------------------------------------- */

.aktualisieren { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5rem 1rem; margin: 1.5rem 0 0; max-width: 54rem; }
.aktualisieren .zusatz { flex: 1 1 20rem; }
.meldung.bericht { background: var(--toenung); box-shadow: inset 4px 0 0 var(--blattgruen); }
.meldung.bericht p, .meldung.bericht ul { margin: 0; }
.meldung.bericht ul { padding-left: 1.1rem; }
.meldung.bericht .problem { color: var(--magenta); }
.von-hand > summary { margin-top: 0; }

/* Das Notizfeld unter «Heute besprechen» bei den Anhörungen. */
[data-quelle] + .feld { margin: 0.6rem 0 0.4rem; }
.feld[data-key="anhoerungen"] .feld-anzeige:empty::before { content: "Notizen …"; }

/* Die behandlungsreifen Geschäfte haben keine Traktandennummer. */
.geschaefte.ohne-nr td.geschaeft, .geschaefte.ohne-nr thead th:first-child { padding-left: 0; }
.traktanden .tabellenrahmen + .feld { margin-top: 0.8rem; }