/* Telefon 390×844 (runda „po Solu”): osobna kompozycja, ładowana na końcu, po wysoki.css.
   Reguły tylko dla wąskich okien (do 760 px) albo wąskich kartek (zapytania kontenerowe). Komputer nie jest tu ruszany.
   Zasady rundy: nic przyklejonego nie zasłania więcej niż ok. 30% ekranu; druki pokazują 3–4 najważniejsze pozycje i wynik (tekst ≥ 14 px, kwoty ≥ 16 px);
   odpowiedź na pytanie stoi tuż pod pytaniem; cała strona krótsza o 20–30%. */

/* księgowanie: wiersz z przyciskiem wstawia ksiegowanie.js (tylko gdy działa JavaScript); poza telefonem tego wiersza nie widać */
.ksg-wiecej-wiersz { display: none; }

@media (max-width: 760px) {
  /* odstępy między sekcjami: 84 → 44 px (po obu stronach granicy 88 px zamiast 168 px; runda „po Solu”: było 56 px) */
  :root { --sekcja-g: 44px; --sekcja: 56px; }
  section.cen { padding-top: var(--sekcja-g); padding-bottom: var(--sekcja-g); }

  /* księgowanie: zwinięta lista pokazuje dwa pierwsze dokumenty, reszta (sześć) jest pod przyciskiem. Bez JavaScriptu i bez klasy widać wszystkie osiem. */
  .ksiega.ksg-zwiniete tbody tr.ksg-dalej { display: none; }
  /* MIKS-10: zwinięta lista pokazuje sumy dwóch widocznych dokumentów (ksiegowanie.js), więc dopisek „z ośmiu dokumentów” odpada */
  .ksiega tbody tr.ksg-wiecej-wiersz { display: block; padding: 14px 0 12px; border-top: 1px solid var(--papier-2); }
  .ksg-wiecej { all: unset; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 48px; padding: 0 16px;
    border: 1.5px solid var(--tusz); border-radius: 2px; color: var(--tusz); font: 650 16px/1.2 var(--sans); cursor: pointer; -webkit-tap-highlight-color: transparent;
    transition: transform .16s var(--ease), background-color .18s var(--ease); }
  .ksg-wiecej::after { content: ""; flex: none; width: 10px; height: 10px; margin-right: 3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translate(-2px, -2px); transition: transform .2s var(--ease); }
  .ksg-wiecej[aria-expanded="true"]::after { transform: rotate(-135deg) translate(-2px, -2px); }
  .ksg-wiecej:active { transform: scale(.98); background-color: var(--papier-2); }
  .ksg-wiecej:focus-visible { outline: 2px solid var(--tusz); outline-offset: 3px; }
}
/* MIKS-8: krótkie „Księgowanie” na komputerze także poza sceną przypiętą (761–1180 px szerokości i okna niższe niż 760 px): dwa dokumenty, sześć pod przyciskiem, jak na telefonie
   (decyzja Dominika 17.10: „może być krótkie”); `?ksiegowanie=pelne` zostawia osiem. Przycisk ma szerokość treści, nie całej kartki. */
@media ((min-width: 761px) and (max-width: 1180px)), ((min-width: 1181px) and (max-height: 759px)) {
  .ksiega.ksg-zwiniete tbody tr.ksg-dalej { display: none; }
  .ksiega tbody tr.ksg-wiecej-wiersz { display: table-row; }
  .ksiega tbody tr.ksg-wiecej-wiersz > td { padding: 16px 0 10px; }
  .ksg-wiecej { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 14px; min-height: 48px; padding: 0 20px; border: 1.5px solid var(--tusz); border-radius: 2px; color: var(--tusz);
    font: 650 16px/1.2 var(--sans); cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform .16s var(--ease), background-color .18s var(--ease); }
  .ksg-wiecej::after { content: ""; flex: none; width: 10px; height: 10px; margin-right: 3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translate(-2px, -2px); transition: transform .2s var(--ease); }
  .ksg-wiecej[aria-expanded="true"]::after { transform: rotate(-135deg) translate(-2px, -2px); }
  .ksg-wiecej:active { transform: scale(.98); background-color: var(--papier-2); }
  .ksg-wiecej:focus-visible { outline: 2px solid var(--tusz); outline-offset: 3px; }
}

/* miesiąc bez przypinania (do 1000 px szerokości): trzy plansze jedna pod drugą (dokumenty, księga, wyniki dla urzędu i ZUS), każda jak plansza przypiętej sceny:
   siatka na granacie między liniami, karty papieru na niej; podpis aktu stoi tuż pod planszą. Odstępy zastępują dawny margines nad aktem, więc długość strony prawie się nie zmienia. */
@media (max-width: 1000px) {
  .mies-scena { position: relative; }
  .mies:not(.mies-ruch) .mies-akt { margin: 12px calc(var(--m) * -1) 0; padding: 12px var(--m); border-block: 1px solid var(--linia);
    background-image: linear-gradient(90deg, rgba(38, 64, 90, .5) 1px, transparent 1px), linear-gradient(rgba(38, 64, 90, .5) 1px, transparent 1px); background-size: 56px 56px; background-position: -1px -1px; }
}