/* Publikacja — LISTA nowego wyglądu (etap E1, plan SAAS/PLAN_PUBLIKACJA_BUDOWA.md §6; makieta 2 v5:
 * SAAS/makiety/publikacja.html + publikacja.css, przyjęta przez operatora 2026-10-04).
 * Kolory WYŁĄCZNIE z tokenów shared/wyglad.css (oba motywy) — żadnych wpisanych barw.
 * Szczegół ogłoszenia (#detail-panel): ten plik daje mu miejsce w układzie (obok listy ≥ 1024, pełny ekran < 1024);
 * wnętrze szczegółu (E2) ma własny arkusz szczegol.css.
 * Klasy wiersza (`.listing-card[data-id]`, `.listing-chk`, `.thumb-wrapper`, `.listing-info`, `.listing-title`)
 * i id (`#listing-area`, `#floating-bar`, `#sel-count`, `#btn-prev`, `#btn-next`, `#page-info`) ZOSTAJĄ: czyta je
 * wspólny moduł stref `shared/zaznaczanie-dotyk.js`, DragSelect i przyrządy (łowca, sceny tyłu).
 * Progi: < 1024 jedna kolumna (szczegół na pełnym ekranie, filtry i akcje w arkuszu z dołu, JEDEN pasek na dole);
 * 1024–1279 lista + szczegół, filtry w oknie; ≥ 1280 filtry | lista | szczegół. Cel dotyku 44 px pod `pointer: coarse`. */

.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tylko-palec { display: none; }
html[data-wskaznik="palec"] .tylko-palec { display: inline; }
html[data-wskaznik="palec"] .tylko-mysz { display: none; }
.tylko-waski { display: none !important; }
.ikona { width: 18px; height: 18px; flex: none; }

/* ── przyciski nowego wyglądu (uzupełniają `.btn` strony) ── */
.btn-maly { min-height: 32px; padding: 0 12px; font-size: 13px; }
.btn-primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); font-weight: 600; }
.btn-primary:hover { background: var(--accent-hover); color: var(--on-accent); }
.btn-quiet { background: transparent; border-color: transparent; color: var(--text); }
.btn-quiet:hover { background: var(--surface-2); }
.btn-usun { background: var(--danger); border-color: var(--danger); color: var(--on-danger); }
.btn-tekst { background: none; border: 0; padding: 0 4px; font: inherit; font-weight: 600; color: var(--accent-text); cursor: pointer; min-height: 28px; text-align: left; }
.btn-tekst:hover { text-decoration: underline; }
.btn-ikona { width: 36px; height: 36px; padding: 0; display: inline-grid; place-items: center; }
.pub-filtry :focus-visible, #list-pane :focus-visible, #floating-bar :focus-visible, .nakladka :focus-visible,
#menu-wiersza :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ═══════════ FILTRY: lewa kolumna ≥ 1280 · okno 1024–1279 · arkusz z dołu < 1024 ═══════════ */
.pub-filtry { width: 220px; min-width: 220px; background: var(--surface-1); border-right: 1px solid var(--border);
  display: flex; flex-direction: column; overflow-y: auto; padding: 16px 12px; }
.filtry-glowa { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 6px 8px; }
.filtry-glowa h2 { font-size: 16px; }
.filtry-glowa h2:focus { outline: none; }
.filtry-tresc { display: grid; gap: 4px; }
.filtry-grupa { border: 0; margin: 6px 0 0; padding: 0; }
.filtry-grupa legend, .filtry-tresc .eyebrow { display: block; margin: 6px; font-size: 11px; font-weight: 600; letter-spacing: .14em;
  text-transform: uppercase; color: var(--muted); }
.filtr-opcja { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 9px; font-size: 14px; color: var(--muted);
  cursor: pointer; min-height: 32px; position: relative; }
.filtr-opcja:hover { background: var(--surface-2); color: var(--text); }
.filtr-opcja input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.filtr-opcja input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--accent); margin: 0; }
.filtr-opcja:has(input[type="radio"]:checked) { background: var(--accent-soft); color: var(--text); font-weight: 600; }
.filtr-opcja:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 1px; }
.filtr-opcja em { margin-left: auto; font-style: normal; font-variant-numeric: tabular-nums; font-size: 12px; color: var(--muted); font-weight: 400; }
.filtr-pole { display: grid; gap: 5px; margin: 6px; font-size: 13px; }
.filtr-pole > span { font-weight: 600; }
.pub-filtry select, #list-pane select, .pub-szukaj input { font: inherit; font-size: 14px; color: var(--text); background: var(--surface-2);
  border: 1px solid var(--border-2); border-radius: 10px; padding: 7px 10px; min-height: 36px; width: 100%; }
.pub-filtry select:focus, .pub-szukaj input:focus { border-color: var(--accent); outline: 2px solid var(--accent-soft); }
/* Odbiór E1 (P113, 2026-10-11): WebKit przy natywnym wyglądzie pola wyboru zdejmuje min-height i padding — `#filtr-partia`
 * i `#na-stronie` miały na dotyku 23 px. Własny wygląd + strzałka z dwóch gradientów w kolorze tokenu `--muted`. */
.pub-filtry select, #list-pane select { -webkit-appearance: none; appearance: none; padding-right: 30px;
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 16px) 50%, calc(100% - 11px) 50%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
.maszynownia-filtrow { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--border-2); }
.maszynownia-filtrow:empty { display: none; }
.statystyka { display: flex; justify-content: space-between; padding: 6px 10px; font-size: 13px; color: var(--muted); }
.statystyka b { color: var(--text); font-variant-numeric: tabular-nums; }
.filtry-stopka, .filtry-zamknij { display: none; }

/* ═══════════ KOLUMNA LISTY ═══════════ */
#list-pane { display: block; overflow-y: auto; padding: 16px 20px 32px; scroll-padding-top: 12px; }
.pub-naglowek { margin-bottom: 12px; }
.pub-naglowek h1 { font-size: 24px; font-weight: 700; letter-spacing: -.02em; }
.pub-naglowek p { color: var(--muted); font-size: 14px; max-width: 70ch; margin-top: 2px; }
.narzedzia-listy { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.zaznacz-strone { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 12px 0 10px; border: 1px solid var(--border-2);
  border-radius: 10px; background: var(--surface-1); font-size: 13.5px; font-weight: 600; cursor: pointer; color: var(--text); }
.zaznacz-strone input, .listing-chk { width: 18px; height: 18px; accent-color: var(--accent); margin: 0; flex: none; cursor: pointer; }
.pub-szukaj { flex: 1 1 220px; position: relative; }
.pub-szukaj input { padding-left: 34px; }
.pub-szukaj svg { position: absolute; left: 10px; top: 50%; margin-top: -8px; width: 16px; height: 16px; color: var(--muted); }
.przycisk-filtry { display: none; }

/* ── pasek akcji zaznaczonych: NAD listą na komputerze (D4), JEDEN pasek na dole telefonu (Z2) ── */
#floating-bar { display: none; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 10px; margin-bottom: 10px; border-radius: 12px;
  background: var(--surface-1); border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); box-shadow: var(--shadow);
  position: sticky; top: 0; z-index: 30; }
#floating-bar.visible { display: flex; }
#floating-bar .sel-count { font-weight: 700; font-size: 14px; margin-right: 4px; font-variant-numeric: tabular-nums; color: var(--text); }
#floating-bar .sel-cost { font-size: 12px; color: var(--muted); }
.limit-partii { flex-basis: 100%; font-size: 13px; color: var(--warn-text); }
.rozwijane { position: relative; }
.rozwijane > summary { list-style: none; }
.rozwijane > summary::-webkit-details-marker { display: none; }
.rozwijane-lista, #menu-wiersza { min-width: 240px; padding: 6px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--border);
  box-shadow: var(--shadow); display: grid; gap: 2px; z-index: 70; }
.rozwijane-lista { position: absolute; top: calc(100% + 6px); left: 0; }
.rozwijane-lista button, #menu-wiersza button { font: inherit; font-size: 14px; text-align: left; padding: 9px 10px; border-radius: 9px; border: 0;
  background: none; color: var(--text); cursor: pointer; min-height: 36px; }
.rozwijane-lista button:hover, #menu-wiersza button:hover { background: var(--surface-3); }
.rozwijane-lista .niszczaca, #menu-wiersza .niszczaca { color: var(--danger-text); border-top: 1px solid var(--border); border-radius: 0 0 9px 9px; }
.rozwijane-lista button:disabled, #menu-wiersza button:disabled { color: var(--muted); cursor: not-allowed; }
#menu-wiersza { position: fixed; }
#menu-wiersza[hidden] { display: none; }

/* ── wiersze listy (D2: wiersz z miniaturą; D5: ≤ 1 akcja + „Więcej”; strefy karty G-18) ── */
#listing-area { border: 1px solid var(--border); border-radius: 14px; background: var(--surface-1); -webkit-user-select: none; user-select: none; }
#listing-area[hidden] { display: none; }
.listing-card { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; align-items: center; column-gap: 12px;
  padding: 7px 8px 7px 14px; border-top: 1px solid var(--border); position: relative; cursor: default; }
.listing-card:first-child { border-top: 0; border-radius: 13px 13px 0 0; }
.listing-card:last-child { border-radius: 0 0 13px 13px; }
.listing-card:only-child { border-radius: 13px; }
.listing-card.selected { background: color-mix(in srgb, var(--accent) 6%, var(--surface-1)); }
.listing-card.active-detail::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--accent); }
.listing-card.active-detail .listing-title { color: var(--accent-text); }
/* etykieta TYLKO wokół pola wyboru (cel dotyku liczony po etykiecie); miniatura poza nią — inaczej stuknięcie
   w zdjęcie przełączałoby pole natywnie zamiast otworzyć ogłoszenie (Z5; pułapka z raportu giełdy G-18) */
.chk-pole { display: grid; place-items: center; align-self: stretch; min-width: 32px; margin: -7px 0 -7px -14px; padding-left: 14px; cursor: pointer; }
.thumb-wrapper { width: 44px; height: 44px; border-radius: 9px; overflow: hidden; border: 1px solid var(--border); background: var(--surface-3);
  display: grid; place-items: center; flex: none; }
.listing-thumb { width: 100%; height: 100%; object-fit: cover; display: block; -webkit-user-drag: none; }
.thumb-brak { color: var(--muted); }
.thumb-brak svg { width: 20px; height: 20px; }
.listing-info { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 4px 0; background: none; border: 0; font: inherit;
  color: inherit; text-align: left; cursor: pointer; border-radius: 8px; }
.listing-info:hover .listing-title { color: var(--accent-text); text-decoration: underline; }
.opis-wiersza { flex: 1; min-width: 0; display: grid; gap: 1px; }
.listing-title { font-size: 14.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text); }
.listing-meta { font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.listing-meta .ostrzezenie { color: var(--warn-text); font-weight: 600; }
.card-statusy { display: flex; gap: 5px; flex: none; flex-wrap: wrap; }
.st { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 600; padding: 3px 8px; border-radius: 20px;
  color: var(--muted); border: 1px dashed var(--border-2); white-space: nowrap; }
.st.tak { color: var(--green-text); background: color-mix(in srgb, var(--green) 12%, transparent); border: 1px solid transparent; }
.st svg { width: 13px; height: 13px; }
.wiersz-wiecej { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; border: 1px solid transparent; background: none;
  color: var(--muted); cursor: pointer; position: relative; }
.wiersz-wiecej:hover { border-color: var(--border-2); color: var(--text); background: var(--surface-2); }
.wiersz-wiecej svg { width: 18px; height: 18px; }

/* stany ekranu: ładowanie (szkielet), pusty magazyn, filtr bez wyników, błąd wczytania (G-07: awaria ≠ pusto) */
.szkielet { border: 1px solid var(--border); border-radius: 14px; background: var(--surface-1); }
.wiersz-szk { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-top: 1px solid var(--border); }
.wiersz-szk:first-child { border-top: 0; }
.szk { border-radius: 8px; background: linear-gradient(90deg, var(--surface-3), var(--surface-2), var(--surface-3)); background-size: 200% 100%;
  animation: szk 1.2s ease-in-out infinite; }
.szk-mini { width: 44px; height: 44px; }
.szk-tekst { flex: 1; height: 14px; }
@keyframes szk { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .szk { animation: none; } }
.stan-ekranu { padding: 32px 28px; text-align: center; max-width: 560px; margin: 24px auto; background: var(--surface-1);
  border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); }
.stan-ekranu[hidden], .szkielet[hidden] { display: none; }
.stan-ekranu h2 { font-size: 20px; margin-bottom: 6px; }
.stan-ekranu p { color: var(--muted); font-size: 14.5px; margin-bottom: 18px; }
.stan-ekranu .akcje { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.stan-ekranu .duza-ikona { width: 60px; height: 60px; margin: 0 auto 14px; border-radius: 16px; display: grid; place-items: center;
  background: var(--accent-soft); color: var(--accent-text); }
.stan-ekranu .duza-ikona svg { width: 28px; height: 28px; }
#stan-blad .duza-ikona { background: color-mix(in srgb, var(--danger) 12%, transparent); color: var(--danger-text); }
#stan-blad .powod { color: var(--danger-text); }

/* ── stopka listy: strony (D1) ── */
.stopka-listy { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 12px; font-size: 13.5px; }
.stopka-listy[hidden] { display: none; }
#page-info { color: var(--muted); font-variant-numeric: tabular-nums; }
.strony { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.strony button { display: inline-grid; place-items: center; min-width: 32px; height: 32px; padding: 0 8px; border-radius: 9px; font: inherit;
  font-size: 13.5px; border: 1px solid var(--border-2); background: var(--surface-1); color: var(--text); cursor: pointer; }
.strony button:disabled { opacity: .45; cursor: not-allowed; }
.strony [aria-current="page"] { background: var(--accent); border-color: var(--accent); color: var(--on-accent); font-weight: 700; }
.strony .kropki { color: var(--muted); padding: 0 4px; }
.na-stronie { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); }
#list-pane .na-stronie select { width: auto; min-width: 76px; }
.wiecej-pozycji { display: none; }

/* ═══════════ SZCZEGÓŁ w układzie (wnętrze: szczegol.css) ═══════════ */
/* domyślna szerokość szczegółu jak w makiecie (440 px; 1024–1279: 420 px) — zapisana szerokość z dzielnika dalej wygrywa */
#detail-panel { width: var(--detail-panel-width, 440px); }

/* ═══════════ NAKŁADKI: arkusz z dołu (< 1024) · okno na środku — jedna odmiana (D14) ═══════════ */
.tlo-nakladki { display: none; position: fixed; inset: 0; z-index: 90; background: color-mix(in srgb, var(--bg) 60%, transparent); }
body[data-otwarte="filtry"] .tlo-nakladki, body[data-otwarte="akcje"] .tlo-nakladki { display: block; }
.nakladka { display: none; position: fixed; z-index: 95; flex-direction: column; background: var(--surface-1); box-shadow: var(--shadow);
  top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(520px, calc(100% - 32px)); max-height: 86%; border-radius: 16px; }
body[data-otwarte="akcje"] #o-akcje { display: flex; }
.nakladka-glowa { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--border); position: relative; }
.nakladka-glowa h2 { font-size: 17px; }
.nakladka-glowa h2:focus { outline: none; }
.nakladka-tresc { overflow-y: auto; padding: 14px 18px; display: grid; gap: 10px; align-content: start; }
.nakladka-tresc .eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.rzad-przyciskow { display: flex; flex-wrap: wrap; gap: 8px; }

/* ═══════════ ≥ 1280: filtry | lista | szczegół ═══════════ */
@media (max-width: 1279.98px) {
  .pub-filtry { display: none; }
  .przycisk-filtry { display: inline-flex; }
  body[data-otwarte="filtry"] .pub-filtry { display: flex; position: fixed; z-index: 95; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: min(420px, calc(100% - 32px)); max-height: 86%; border: 0; border-radius: 16px; padding: 0; box-shadow: var(--shadow); }
  body[data-otwarte="filtry"] .filtry-glowa { margin: 0; padding: 14px 18px; border-bottom: 1px solid var(--border); position: relative; }
  body[data-otwarte="filtry"] .filtry-tresc { padding: 6px 12px 12px; overflow-y: auto; }
  body[data-otwarte="filtry"] .filtry-zamknij { display: inline-grid; }
  body[data-otwarte="filtry"] .filtry-stopka { display: flex; justify-content: flex-end; gap: 8px;
    padding: 12px 18px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--border); }
  .listing-info { flex-direction: column; align-items: stretch; gap: 5px; }
  #detail-panel { width: var(--detail-panel-width, 420px); min-width: 360px; }
}

/* ═══════════ TELEFON i TABLET PIONOWO (< 1024): jedna kolumna ═══════════ */
@media (max-width: 1023.98px) {
  .tylko-szeroki { display: none !important; }
  .tylko-waski { display: inline-flex !important; }
  #list-pane { padding: 12px 16px calc(96px + env(safe-area-inset-bottom)); border-right: 0; }
  .pub-naglowek h1 { font-size: 22px; }
  .pub-naglowek p { font-size: 13px; }
  .narzedzia-listy .pub-szukaj { order: -1; flex-basis: 100%; }
  /* filtry i akcje: arkusz z dołu */
  body[data-otwarte="filtry"] .pub-filtry, .nakladka { top: auto; left: 0; right: 0; bottom: 0; transform: none; width: auto; max-height: 92%;
    border-radius: 18px 18px 0 0; }
  body[data-otwarte="filtry"] .filtry-glowa::before, .nakladka-glowa::before { content: ""; position: absolute; top: 6px; left: 50%; width: 36px;
    height: 4px; margin-left: -18px; border-radius: 4px; background: var(--border-2); }
  body[data-otwarte="filtry"] .filtry-glowa, .nakladka-glowa { padding-top: 18px; }
  /* pasek zaznaczonych = JEDEN pasek na dole; w szczególe i pod nakładką schowany */
  #floating-bar { position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 40; margin: 0; border-radius: 16px 16px 0 0; border: 0;
    border-top: 1px solid var(--border); padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); flex-wrap: wrap; }
  #floating-bar .sel-count { flex: 1; }
  #floating-bar .limit-partii { display: none; }
  /* E125 (F-2, zmierzone WebKit 320/375/390 px): baner „Zaznacz wszystkie N z listy” w jednym rzędzie z „Odznacz” i „Akcje”
     ściskał przyciski — napisy wylewały się na sąsiadów (190 px treści w 78–120 px pola). Baner = własny rząd nad licznikiem
     (pasek wyżej: `flex-wrap: wrap` w regule paska wyżej). */
  #floating-bar #zaznacz-wszystkie { order: -1; flex: 1 0 100%; white-space: normal; justify-content: center; }
  body:has(#zaznacz-wszystkie:not([hidden])) #list-pane { padding-bottom: calc(150px + env(safe-area-inset-bottom)); }
  body[data-szczegol="1"] #floating-bar, body[data-otwarte="akcje"] #floating-bar, body[data-otwarte="filtry"] #floating-bar { display: none !important; }
  body[data-zaznaczone="1"] #lf-pipeline-bar { display: none !important; }
  /* wiersz: dwa rzędy, bez „Więcej” (akcje: szczegół albo arkusz akcji) */
  .listing-card { grid-template-columns: auto auto minmax(0, 1fr); padding: 10px 10px 10px 12px; }
  .chk-pole { margin: -10px 0 -10px -12px; padding-left: 12px; }
  .wiersz-wiecej { display: none; }
  .thumb-wrapper { width: 56px; height: 56px; }
  .listing-title { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .stopka-listy { justify-content: center; text-align: center; }
  .strony, .na-stronie { display: none; }
  .wiecej-pozycji { display: inline-flex; width: 100%; justify-content: center; }
  .wiecej-pozycji[hidden] { display: none; }   /* E125 (C2-8): koniec listy — bez „Pokaż następne 0” */
  #page-info { width: 100%; }
  /* szczegół = pełny ekran pod menu; lista pod spodem nie przewija się razem z nim */
  #detail-resize-handle { display: none; }
  /* `#detail-panel.empty` ze starego arkusza strony (display:flex) jest silniejszy niż samo id — chowamy oba */
  #detail-panel, #detail-panel.empty { display: none; }
  body[data-szczegol="1"] #detail-panel { display: flex; position: fixed; left: 0; right: 0; bottom: 0; top: var(--menu-h); z-index: 80;
    width: auto; min-width: 0; max-width: none; background: var(--bg); }
  body[data-szczegol="1"] #list-pane { visibility: hidden; }
  .stan-ekranu { margin: 12px auto; padding: 24px 18px; }
  .stan-ekranu .btn { width: 100%; justify-content: center; }
}

/* ═══════════ DOTYK: cel ≥ 44 px (Z3, G-01) — także iPad poziomo w układzie dwukolumnowym ═══════════ */
@media (pointer: coarse) {
  .pub-filtry .btn, #list-pane .btn, #floating-bar .btn, .nakladka .btn, .btn-tekst, .filtr-opcja, .zaznacz-strone,
  .rozwijane-lista button, #menu-wiersza button { min-height: 44px; }
  #floating-bar .btn, #list-pane .btn, .nakladka .btn { min-width: 44px; }
  .btn-ikona, .wiersz-wiecej { width: 44px; height: 44px; }
  .pub-filtry select, #list-pane select, .pub-szukaj input { min-height: 44px; font-size: 16px; }
  .strony button { min-width: 44px; height: 44px; }
  .listing-card { min-height: 64px; }
  .chk-pole { min-width: 44px; min-height: 44px; }
  .listing-info { min-height: 56px; }
  .zaznacz-strone input, .listing-chk { width: 22px; height: 22px; }
}

/* E5: wynik partii bezpłatnej (makieta 2 v5 „wynik partii”, G-05) — karta nad listą, stan każdej sztuki słowem i kolorem z tokenów */
.wynik-partii { padding: 14px 16px; margin-bottom: 12px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-1); }
.wynik-partii[hidden] { display: none; }
.wynik-partii h2 { font-size: 16px; margin: 0 0 6px; color: var(--text); }
.wp-zdanie { font-size: 13.5px; color: var(--warn-text); margin: 0 0 8px; }
.wp-suma { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.wp-lista { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 6px; max-height: 280px; overflow-y: auto; font-size: 14px; }
.wp-lista li { display: flex; gap: 8px 10px; align-items: baseline; flex-wrap: wrap; }
.wp-lista .st { flex: none; }
.wp-tytul { color: var(--text); }
.wp-powod { flex-basis: 100%; font-size: 12.5px; color: var(--muted); }
.st.wp-ok { color: var(--green-text); background: color-mix(in srgb, var(--green) 12%, transparent); border: 1px solid transparent; }
.st.wp-blad { color: var(--danger-text); border: 1px solid color-mix(in srgb, var(--danger-text) 45%, transparent); }
.st.wp-niepewna, .st.wp-nieruszona { color: var(--warn-text); border: 1px solid color-mix(in srgb, var(--warn-text) 45%, transparent); }
.st.wp-pominieta, .st.wp-w_toku { color: var(--muted); }
.wp-akcje { display: flex; flex-wrap: wrap; gap: 8px; }
@media (pointer: coarse), (hover: none) {
  .wp-akcje .btn { min-height: 44px; }
}
@media (max-width: 599.98px) {
  .wp-akcje .btn { flex: 1 1 100%; }
}