/* Bauprotokoll — Standhinweis, Karten, Zeile mit Aufklappen, zwei Spalten
   Teil der Kaskade (AK 60: `urteilsmarken.css` stand bei 194 Zeilen — geteilt, nicht
   verdichtet). Schnitt H (16.09.2026, docs/OFFEN-optik-software.md §2.6): eine erfasste
   Messung ist EINE ZEILE (`<details>` zu), der Entwurf steht offen; die Felder einer
   Karte stehen ab 640 px Kartenbreite in zwei Spalten (`@container`, nicht der Schirm —
   neben dem Seitenrand bleiben bei 900 px nur 620 px). */

/* Die Werkzeuge eines Eintrags — auf dem Handy untereinander statt abgeschnitten. */
.eintrag-werkzeuge {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ab-2);
    margin-top: var(--ab-3);
}

/* Der Standhinweis der Maske — sagt, ob eine Erfassung FORTGESETZT oder neu begonnen wird. */
.bp-stand {
    font-size: var(--gr-alt-15);
    color: var(--text-secondary);
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-left: 4px solid var(--accent);
    padding: var(--ab-alt-10) var(--ab-alt-14);
    border-radius: var(--radius-sm);
    margin-bottom: var(--ab-3);
}
.bp-stand-neu { border-left-color: var(--border-feld); color: var(--text-muted); }

/* Die Karten: Entwurf (nur im Klienten), erfasst (Server-id, Urteil), gestrichen (lesbar, R52). */
.bp-hinweis { font-size: var(--gr-klein); color: var(--text-secondary); margin: 0 0 var(--ab-alt-10); }
.bp-messung.card, .bp-reihe.card { padding: 0; overflow: hidden; }
.bp-entwurf.card { border-left: 4px dashed var(--border-feld); }
.bp-erfasst.card { border-left: 4px solid var(--text-primary); }
.bp-gestrichen.card { border-left: 4px solid var(--border); }
.bp-gestrichen .bp-zeile-titel, .bp-gestrichen .bp-zeile-wert { text-decoration: line-through; color: var(--text-muted); }
.bp-hinweis.bp-gestrichen { text-decoration: line-through; }
.bp-fehler {
    font-size: var(--gr-klein);
    font-weight: 600;
    color: var(--danger-text);
    background: var(--bg-card);
    border: 1px solid var(--danger);
    border-left-width: 4px;
    padding: var(--ab-alt-10) var(--ab-alt-14);
    border-radius: var(--radius-sm);
    margin-bottom: var(--ab-3);
}

/* R20: jede Eingabestelle und jeder Knopf der Maske ist mit Handschuh treffbar. */
.bp-feld { min-height: 44px; }
/* L-5 (Nr. 126): eine Auswahl ist so breit wie ihre längste Option (die Vorgangsauswahl 409 px) — nie breiter als ihr Kasten, sonst rollt die Seite bei 390 px quer. */
select.bp-feld { max-width: 100%; }
.bp-vorgangswahl { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ab-2); }
.bp-vorgangswahl > select.bp-feld { flex: 1 1 12rem; min-width: 0; }

/* Die Zeile (`<summary>`): Urteil (Punkt + Wort), Messpunkt, Position, Wert in Mono. */
.bp-zeile {
    display: flex;
    align-items: center;
    gap: var(--ab-3);
    flex-wrap: wrap;
    padding: var(--ab-alt-10) var(--ab-4);
    cursor: pointer;
    list-style: none;
    font-size: var(--gr-alt-15);
    color: var(--text-primary);
}
.bp-zeile::-webkit-details-marker { display: none; }
.bp-zeile::before {
    content: '';
    flex: 0 0 auto;
    width: 0; height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 7px solid var(--text-muted);
    transform: rotate(-90deg);
    transition: transform var(--transition);
}
details[open] > .bp-zeile::before { transform: none; }
.bp-zeile:hover { background: var(--bg-page); }
.bp-zeile:focus-visible { outline-offset: -3px; }
.bp-zeile-urteil { display: inline-flex; align-items: center; gap: var(--ab-alt-6); font-weight: 600; font-size: var(--gr-klein); white-space: nowrap; }
.bp-zeile-urteil::before { content: ''; width: 12px; height: 12px; border-radius: 50%; background: var(--text-dim); }
.bp-zeile-urteil.urteil-gefahr { color: var(--danger-text); }
.bp-zeile-urteil.urteil-gefahr::before { background: var(--danger); }
.bp-zeile-urteil.urteil-befund { color: var(--warning-text); }
.bp-zeile-urteil.urteil-befund::before { background: var(--warning); }
.bp-zeile-urteil.urteil-offen { color: var(--text-muted); }
.bp-zeile-urteil.urteil-offen::before { background: var(--urteil-offen); }
.bp-zeile-urteil.urteil-gut { color: var(--success-text); }
.bp-zeile-urteil.urteil-gut::before { background: var(--success); }
.bp-zeile-urteil.urteil-leer { color: var(--text-muted); }
.bp-zeile-urteil:empty { display: none; }
.bp-zeile-titel { font-weight: 600; flex: 1 1 200px; min-width: 0; }
.bp-zeile-position { color: var(--text-muted); font-size: var(--gr-klein); }
.bp-zeile-wert { font-size: var(--gr-alt-17); margin-left: auto; white-space: nowrap; }

/* Der Kartenrumpf unter der Zeile */
.bp-messung > .card-header, .bp-reihe > .card-header { margin: 0 var(--ab-4) var(--ab-3); padding-top: var(--ab-1); }
.bp-messung > .bp-hinweis, .bp-reihe > .bp-hinweis { margin-left: var(--ab-4); margin-right: var(--ab-4); }
.bp-messung > .bp-felder, .bp-reihe > .bp-felder { padding: 0 var(--ab-4) var(--ab-2); }

/* Zwei Spalten ab 640 px Kartenbreite — gemessen an der Karte, nicht am Schirm */
.bp-messung, .bp-reihe { container-type: inline-size; }
@container (min-width: 640px) {
    .bp-felder { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--ab-4); }
}

@media (max-width: 720px) {
    .bp-zeile { padding: var(--ab-2) var(--ab-3); gap: var(--ab-2); }
    .bp-zeile-wert { font-size: var(--gr-text); }
}

/* Schnitt M-0: Aufnahmen unter dem Kopf — Liste mit Vorschau, eine Eingabestelle (R20: 44 px) */
.bp-aufnahmen { list-style: none; margin: 0 0 var(--ab-3); padding: 0; display: flex; flex-wrap: wrap; gap: var(--ab-3); }
.bp-aufnahme { display: flex; flex-direction: column; gap: var(--ab-1); max-width: 160px; font-size: 0.875rem; }
.bp-aufnahme-bild { width: 160px; height: 120px; object-fit: cover; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-surface); }
.bp-aufnahme-eingabe { display: flex; flex-wrap: wrap; gap: var(--ab-3); align-items: center; }
.bp-aufnahme-eingabe > * { min-height: 44px; }
.bp-aufnahmen-titel { margin: var(--ab-3) 0 var(--ab-alt-6); font-size: var(--gr-alt-1rem); }
/* Schnitt M: der Bildpfad in der Maske — Band, Karten je Zustand (Urteilsfarben aus den Tokens) */
.ba-band { border: 2px solid var(--danger); color: var(--danger-text); padding: var(--ab-2) var(--ab-3); margin: 0 0 var(--ab-3); font-weight: 600; }
.ba-karten { display: flex; flex-direction: column; gap: var(--ab-3); }
.ba-karte { border-left: 4px solid var(--border); padding: var(--ab-2) var(--ab-3); }
.ba-karte-gefahr { border-left-color: var(--danger); }
.ba-karte-belegt { border-left-color: var(--warning); }
.ba-karte-strittig { border-left-color: var(--urteil-offen); }
.ba-karte-unbelegt { border-left-color: var(--border); }
.ba-karte-zustand { font-weight: 700; letter-spacing: 0.04em; }
.ba-klaeren { display: flex; flex-wrap: wrap; gap: var(--ab-2); align-items: center; }
.ba-klaeren > * { min-height: 44px; }
/* Schnitt K: der gefuehrte Modus — die Handlung gross und lesbar in der Sonne (R20) */
.fuehrung { border: 2px solid var(--border-focus); padding: var(--ab-3); margin: 0 0 var(--ab-3); background: var(--bg-card); }
.fuehrung-schalter { display: flex; flex-wrap: wrap; gap: var(--ab-2); margin: 0 0 var(--ab-2); }
.fuehrung-schalter > * { min-height: 44px; }
.fuehrung-zaehler { font-weight: 700; margin: var(--ab-2) 0 var(--ab-1); }
.fuehrung-handlung { font-size: 1.15rem; line-height: 1.45; margin: 0 0 var(--ab-2); }
.fuehrung-urteil { font-weight: 600; }
.fuehrung-knoepfe { display: flex; flex-wrap: wrap; gap: var(--ab-2); align-items: center; margin: var(--ab-2) 0; }
.fuehrung-knoepfe > * { min-height: 44px; }
.fuehrung-frage { display: flex; flex-wrap: wrap; gap: var(--ab-2); align-items: center; margin: var(--ab-2) 0 var(--ab-1); }
.fuehrung-frage > * { min-height: 44px; }
.fuehrung-antwort { margin: var(--ab-1) 0 0; padding-left: var(--ab-alt-20); }

/* Strangtabelle am Ende des Durchgangs (24.09.2026, Entscheidung des Inhabers).
   ⛔ Die Farbe folgt dem URTEIL des Servers, nie der Abweichung — diese Ansicht
   bewertet nichts (R10/R16). Deshalb gibt es keine Schwellwert-Klasse. */
.fuehrung-strangtabelle { margin: var(--ab-3) 0 0; }
.fuehrung-strangtabelle > summary { min-height: 44px; display: flex; align-items: center; font-weight: 600; }
.st-tabelle { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.st-tabelle caption { text-align: left; color: var(--text-muted); padding: 0 0 var(--ab-alt-6); }
.st-tabelle th, .st-tabelle td { border: 1px solid var(--border); padding: var(--ab-alt-6) var(--ab-2); text-align: left; vertical-align: top; }
.st-tabelle thead th { background: var(--bg-card); font-weight: 600; }
.st-einheit, .st-nurhinweis { font-weight: 400; color: var(--text-muted); }
.st-nurhinweis { display: block; font-size: 0.85em; }
.st-nurhinweis::before { content: '— '; }
.st-abw { display: block; font-size: 0.9em; color: var(--text-secondary); }
.st-leer { color: var(--text-muted); }
.st-median th, .st-median td { border-top: 2px solid var(--border-focus); font-weight: 600; }
.st-befund { border-left: 4px solid var(--warning); }
.st-gefahr { border-left: 4px solid var(--danger); }
.st-offen { border-left: 4px solid var(--border-feld); }

@media (max-width: 640px) {
    .st-tabelle, .st-tabelle thead, .st-tabelle tbody, .st-tabelle tr, .st-tabelle th, .st-tabelle td { display: block; }
    .st-tabelle thead { display: none; }
    .st-tabelle tbody tr { margin: 0 0 var(--ab-alt-10); border: 1px solid var(--border); }
    .st-tabelle td, .st-tabelle th { border: 0; border-bottom: 1px solid var(--border); }
}
/* A10b H-3: das Urteil des Servers nach dem Stempel — Farbe am Rand (Wort steht im Satz, Farbenblindheit) */
.bp-urteil-satz { border-left: 4px solid var(--text-dim); padding: var(--ab-1) var(--ab-2); margin: var(--ab-alt-6) 0; font-weight: 600; }
.bp-urteil-satz.urteil-gefahr { border-left-color: var(--danger); color: var(--danger-text); }
.bp-urteil-satz.urteil-befund { border-left-color: var(--warning); }
.bp-urteil-satz.urteil-gut { border-left-color: var(--success); }
.bp-urteil-satz.urteil-offen { border-left-color: var(--urteil-offen); }
.fuehrung-letzte { margin: var(--ab-2) 0; } .fuehrung-letzte-kopf { margin: 0; font-size: var(--gr-klein); color: var(--text-muted); }
.fuehrung-rueckfrage { display: flex; flex-wrap: wrap; gap: var(--ab-2); align-items: center; }