/* Wariant „Lista" — gęste wiersze, etykiety stanu, nawigacja u góry.
   Wariant domyślny: najbliżej anatomii Bulmy, najlepiej znosi wiele osób. */
:root[data-wariant="lista"] {
  --gestosc-wiersza: 3.25rem;
  --promien: .375rem;
}
:root[data-wariant="lista"] .lista-wiersz {
  display: flex; align-items: center; gap: .75rem;
  min-height: var(--gestosc-wiersza);
  padding: .5rem .75rem;
  border-bottom: 1px solid var(--linia);
}
:root[data-wariant="lista"] .lista-wiersz:last-child { border-bottom: 0; }

/* Wąski ekran: wiersz ZAWIJA (zgłoszenie #55, pozycja 60 w ROZBIEZNOSCI).
   Bez tego flex ściska trzecią kolumnę poniżej szerokości słowa i metryczka
   („Kuchnia", imię, termin) łamie się PO LITERZE — z wiersza robi się słup
   kilkunastu linii. Zerowe przewijanie poziome i zielone testy struktury tego
   nie pokazują: elementy istnieją, tekst jest w środku swojego pudełka. Widać
   to wyłącznie na zrzucie ekranu (design/README.md — wygląd oglądamy obrazem).

   Reguła stoi TUTAJ, bo tutaj powstaje problem: `flex` bez zawijania jest
   własnością tego wariantu, a nie karty zadania. Wcześniej łatka siedziała
   w app.css i celowała w `.zadanie.lista-wiersz` — czyli naprawiała jeden
   z wierszy, dorzucona przy okazji ocen (REQ-032). Każdy następny wiersz
   o tej samej konstrukcji potrzebowałby własnej kopii, a dwie reguły na jedno
   zachowanie rozjeżdżają się przy pierwszej zmianie próg. Łatka usunięta.

   Próg 34rem jest ten sam, na którym blok ocen schodzi do własnej linii
   (app.css, sekcja 16) — dwa różne progi dałyby ekran, na którym wiersz już
   zawija, ale kciuki jeszcze walczą o trzecią kolumnę. */
@media (max-width: 34rem) {
  :root[data-wariant="lista"] .lista-wiersz { flex-wrap: wrap; }
}