/* Wysokie ekrany (runda „Wysokie ekrany”): warstwa ładowana po style.css i dol.css, tylko komputer (od 1001 px szerokości).
   Zasada: każda scena wypełnia wysokość okna (svh), a nagłówki, druki i pola cyfr rosną z min(szerokość, wysokość), nie tylko z szerokością.
   Telefon i tablet (do 1000 px) nie są tu ruszane. Koncepcja, kroje, teksty i ruch zostają bez zmian: zmienia się tylko skala i rozłożenie w pionie.
   Jednostka skali --u: 1 u = 14,4 px w oknie 1440×900 (jak wcześniej 1 vw). W oknach wysokich rośnie z oknem do 23 px (2560×1440), ale nie więcej niż 1,6% wysokości okna;
   w oknach szerokich i niskich zostaje taka, jaka była (1 vw do 17,1 px). --p to „stary piksel”: dawny rozmiar w px razy skala, nigdy mniej niż 1 px.
   Rozmiary zależne od samej wysokości mają górny limit od szerokości (vw, u, cqw), żeby w oknach wąskich i wysokich nic nie wystawało poza kolumnę. */
@media (min-width: 1001px) {
  :root {
    --u: max(min(1vw, 17.1px), min(1vw, 1.6svh, 23px));       /* nie mniej niż dotąd (1 vw do 17,1 px) w oknach szerokich i niskich; w wysokich rośnie z wysokością */
    --p: max(1px, calc(var(--u) / 14.4));                   /* „stary piksel”: 1 px w oknie 1440×900 i mniejszych, w większych proporcjonalnie więcej */
    --okno: calc(100svh - var(--gora));                     /* wysokość okna pod paskiem u góry */
    --m: max(clamp(20px, 4vw, 64px), calc((100vw - 100 * var(--u)) / 2));   /* kontener: do 100 u, czyli 1440 px przy 1440×900 i 2300 px przy 2560×1440 */
    --g: clamp(16px, calc(1.8 * var(--u)), 40px);
    --sekcja-g: clamp(48px, 5.5svh, 96px);                  /* runda „po Solu”: było 7svh; dwa sąsiednie odstępy razem nie przekraczają 11% wysokości okna */
  }

  /* ------------------------------------------------------------ pierwszy ekran */
  .start h1 { font-size: clamp(46px, calc(7.6 * var(--u)), calc(130 * var(--p))); }
  .start-tekst { gap: clamp(20px, 3svh, 56px); justify-content: space-between; }   /* w wysokim oknie wolne miejsce rozkłada się między akapit, listę i notkę zamiast tworzyć jedną dziurę */
  .lead { font-size: clamp(18px, calc(1.35 * var(--u)), calc(22 * var(--p))); }
  .skrot li a { min-height: calc(54 * var(--p)); font-size: clamp(18px, calc(1.35 * var(--u)), calc(23 * var(--p))); }
  .skrot svg { width: calc(16 * var(--p)); height: calc(16 * var(--p)); }
  .skrot-zmiana { font-size: calc(17 * var(--p)); }
  .opis { font-size: calc(15.5 * var(--p)); margin-top: 0; }
  .zrodla span { font-size: calc(14 * var(--p)); }
  .odbiorcy { height: calc(20 * var(--p)); }
  .odbiorcy span { font-size: calc(15 * var(--p)); }
  .przyklad { font-size: calc(12.5 * var(--p)); }

  /* druki (kartki w scenie pierwszego ekranu i w usługach): ten sam układ i te same proporcje, tylko górne limity rozmiaru rosną ze skalą okna
     (limit to dawny limit w px razy --p), więc większa kartka ma proporcjonalnie większy tekst, a nie pustą ramkę wokół drobnego druku */
  .kartka { padding: clamp(12px, 3.2cqw, calc(26 * var(--p))) clamp(12px, 3.4cqw, calc(28 * var(--p))) clamp(14px, 3.4cqw, calc(28 * var(--p))); font-size: clamp(9.5px, 1.95cqw, calc(13.5 * var(--p))); }
  .kartka .kw { font-size: clamp(10.5px, 2.2cqw, calc(15 * var(--p))); }
  .kartka .kw-tekst { font-size: clamp(9.5px, 1.95cqw, calc(13.5 * var(--p))); }
  .kartka .kw-kratki { font-size: clamp(10.5px, 2.05cqw, calc(14 * var(--p))); }
  .scena .kartka .kw { font-size: clamp(11px, 2.35cqw, calc(15 * var(--p))); }
  .scena .kartka .kw-kratki { font-size: clamp(10.5px, 2.15cqw, calc(14 * var(--p))); }
  .k-wynik .kw { font-size: clamp(14px, 3.4cqw, calc(22 * var(--p))); }
  .k-bilans-w .kw { font-size: clamp(12px, 2.7cqw, calc(18 * var(--p))); }
  .k-x .kw { font-size: clamp(14px, 3.4cqw, calc(22 * var(--p))); }
  .usl-druk .kartka { max-width: calc(780 * var(--p)); }   /* także w układzie statycznym (ograniczony ruch): szerokość druku rośnie razem z limitem czcionki */

  /* ------------------------------------------------------------ 2. „Jedna faktura, dwa zapisy.” (przypięte, od 1181 px szerokości i 760 px wysokości)
     Scena ma wysokość okna pod paskiem (24 px zapasu u góry i u dołu: przypięcie liczy start z wysokości ramki, więc ramka stoi dokładnie w oknie).
     Lewa kolumna: nagłówek rośnie z wysokością sceny i układa się w stos słów, dokument na dole; kartka z księgą ma wyższe wiersze i większe wyniki. */
  .ksg-ruch .ksg-ramka { min-height: calc(100svh - var(--gora) - 48px); }
  .ksg-ruch .ksg-scena h2 { font-size: clamp(46px, min(calc(var(--okno) * .107), calc(9.6 * var(--u))), 160px); max-width: 4.4em; margin-bottom: clamp(22px, 2.6svh, 40px); }
  .ksg-ruch .ksg-lead { font-size: calc(18 * var(--p)); }
  .ksg-ruch .ksg-slip { height: clamp(240px, 34svh, 760px); }
  .ksg-ruch .ksg-dok { padding-top: clamp(10px, 2svh, 40px); gap: calc(4 * var(--p)); }
  .ksg-ruch .ksg-dok-nazwa { font-size: clamp(16px, calc(1.3 * var(--u)), calc(19 * var(--p))); margin-bottom: clamp(4px, 1svh, 20px); }
  .ksg-ruch .ksg-czesci { gap: clamp(2px, .6svh, 12px); padding-bottom: clamp(8px, 1.6svh, 30px); margin-bottom: clamp(8px, 1.4svh, 26px); }
  .ksg-ruch .ksg-znak { font-size: clamp(22px, calc(2.3 * var(--u)), calc(34 * var(--p))); }
  .ksg-ruch .ksg-czesc-kw { font-size: clamp(26px, calc(2.7 * var(--u)), calc(40 * var(--p))); }
  .ksg-ruch .ksg-czesc small { font-size: clamp(14px, calc(1.1 * var(--u)), calc(16 * var(--p))); }
  .ksg-ruch .ksg-dok-kwota { font-size: clamp(32px, calc((100cqw - 12px) / 6.1), calc(78 * var(--p))); }
  .ksg-ruch .ksg-dok-kwota.ksg-bez { font-size: clamp(26px, calc(2.4 * var(--u)), calc(38 * var(--p))); }
  .ksg-ruch .ksg-papier { align-self: center; padding: clamp(18px, calc(2 * var(--u)), calc(30 * var(--p))) clamp(18px, calc(2.2 * var(--u)), calc(34 * var(--p))); }
  .ksg-ruch .ksiega { font-size: clamp(13px, 1.62cqw, calc(17 * var(--p))); }
  .ksg-ruch .ksiega th, .ksg-ruch .ksiega td { padding-block: clamp(.82em, 1.85svh, 1.4em); }
  .ksg-ruch .ksiega thead th { padding-top: 0; }
  .ksg-ruch .ksg-wynik { font-size: clamp(14px, 1.6cqw, calc(17 * var(--p))); }
  .ksg-ruch .ksg-wynik .kw { font-size: clamp(26px, min(max(4cqw, 3.6svh), 7cqw), calc(60 * var(--p))); }
  .ksg-ruch .ksg-wyniki { margin-top: clamp(1.1em, 3svh, 2.2em); padding-top: clamp(1em, 2.4svh, 2em); }
  .ksg-krotkie .ksiega:not(.ksg-zwiniete) tbody tr:not(.ksg-wiecej-wiersz) > *, .ksg-krotkie .ksiega:not(.ksg-zwiniete) tfoot > tr > * { padding-block: max(0px, calc(clamp(.82em, 1.85svh, 1.4em) - var(--ksg-red, 0px))); }   /* rozwinięty wariant: wiersz przycisku „kosztuje” odstępy wierszy (ksiegowanie.js, dopasuj) */
  .ksg-krotkie .ksg-wiecej { min-height: calc(48 * var(--p)); font-size: calc(16 * var(--p)); padding-inline: calc(20 * var(--p)); }   /* wariant krótki: przycisk rośnie jak reszta księgi */
  /* wariant krótki, kompozycja (MIKS-7): scena ma wysokość rozwiniętego papieru (rezerwuje ją ksiegowanie.js), nie całego okna; zwinięty papier stoi na dole sceny (nie pływa w jej środku),
     dwie pozycje mają ok. 77 p wysokości (96–112 px na 2000×1420), dane ok. 15,5 p (20–22 px), a rachunek po lewej leży na wysokości aktywnej pozycji (top i height taśmy ustawia ksiegowanie.js) */
  .ksg-krotkie.ksg-ruch .ksg-ramka { min-height: var(--ksg-pelna, 0px); }
  .ksg-krotkie.ksg-ruch .ksg-scena { position: relative; container-type: inline-size; }
  .ksg-krotkie.ksg-ruch .ksg-scena h2 { font-size: min(clamp(46px, min(calc(var(--okno) * .107), calc(9.6 * var(--u))), 160px), 22cqw); }   /* scena jest niższa niż okno, więc nagłówek stoi obok papieru, nie nad nim: na 2000×1420 mieści się w swojej kolumnie (było 3 px na papier) */
  .ksg-krotkie.ksg-ruch .ksg-slip { position: absolute; left: 0; right: 0; top: 0; margin-top: 0; border-top: 0; }
  .ksg-krotkie .ksg-papier.ksg-p-zwiniety { align-self: end; margin-bottom: max(0px, calc(var(--ksg-pelna, 0px) + var(--gora) + 46px - 100svh)); }   /* w oknie niższym niż scena (1181×760) papier nie wychodzi pod dolną krawędź: przypięcie zaczyna się 22 px pod paskiem, 24 px zapasu u dołu */
  .ksg-krotkie .ksiega.ksg-zwiniete tbody { font-size: clamp(13px, 1.76cqw, calc(20.4 * var(--p))); }
  .ksg-krotkie .ksiega.ksg-zwiniete tbody tr:not(.ksg-wiecej-wiersz) { height: calc(77 * var(--p)); }
  .ksg-krotkie .ksiega.ksg-zwiniete tbody tr:not(.ksg-wiecej-wiersz) > * { padding-block: 0; }
  .ksg-krotkie .ksiega.ksg-zwiniete thead th { padding-bottom: calc(24 * var(--p)); }
  .ksg-krotkie .ksiega.ksg-zwiniete tfoot > tr > * { padding-top: calc(38 * var(--p)); padding-bottom: calc(14 * var(--p)); }
  /* MIKS-8: krótkie „Księgowanie” w oknach wysokich (od 820 px; klasę .ksg-stos nadaje ksiegowanie.js) to jedna grupa. Nagłówek i opis stoją nad tabelą (lewa kolumna), rachunek po lewej na wysokości aktywnej pozycji,
     papier po prawej zaczyna się 40 p pod opisem. Ramka ma stałą wysokość ZWINIĘTEJ grupy (--ksg-pelna), więc przed przypięciem i po nim nic nie wisi pusto; rozwinięta grupa jest wyższa i wychodzi poza ramkę po równo u góry i u dołu
     (align-content: center, najwyżej 40 px na stronę: ksiegowanie.js, PRZELEW), a rozwinięcie i zwinięcie rosną płynnie (ksiegowanie.js tweenuje wysokość papieru i --ksg-wiersz). Wysokość wiersza i odstępy liczone w --p: ta sama proporcja w każdym oknie.
     Prefiks .ksg-stos.ksg-ruch daje tę samą specyficzność co reguły wariantu krótkiego z r9 (.ksg-krotkie .ksiega…), które są wyżej w pliku, więc reguły .ksg-stos wygrywają kolejnością. */
  .ksg-stos.ksg-ruch .ksg-ramka { height: var(--ksg-pelna, auto); min-height: 0; align-content: start; overflow-anchor: none; }   /* MIKS-10: grupa jest przyczepiona do GÓRY ramki (było: środek), więc rozwinięty papier rośnie tylko w dół, a jego górna krawędź stoi */   /* overflow-anchor: grupa przesuwa się w ramce przy rozwinięciu, a przeglądarka nie może „kotwiczyć” przewijania do jej elementów (przesuwałoby stronę o pół różnicy wysokości) */
  .ksg-stos .ksg-przyp { margin-top: calc(56px + var(--ksg-prze, 0px)); }   /* 16 px + 40 px zapasu jak dotąd; --ksg-prze = o ile rozwinięty papier jest wyższy od zwiniętego (ksiegowanie.js): przypis i dalsza strona odjeżdżają w dół razem z rozwijanym papierem */
  .ksg-stos.ksg-ruch .ksg-scena { position: relative; }
  .ksg-stos.ksg-ruch .ksg-slip { position: absolute; left: 0; right: 0; top: 0; margin-top: 0; border-top: 0; }   /* taśma z rachunkami leży na całej kolumnie; rachunek stoi na wysokości aktywnego wiersza (ksiegowanie.js) */
  .ksg-stos .ksg-papier, .ksg-stos .ksg-papier.ksg-p-zwiniety { align-self: start; margin-top: var(--ksg-mt, calc(var(--ksg-gora-p, 0px) + 40 * var(--p))); margin-bottom: 0; }
  .ksg-stos.ksg-ruch .ksiega tbody { font-size: clamp(13px, 1.76cqw, calc(20.4 * var(--p))); }
  .ksg-stos.ksg-ruch .ksiega tbody tr:not(.ksg-wiecej-wiersz) { height: var(--ksg-wiersz, calc(80 * var(--p))); }
  .ksg-stos.ksg-ruch .ksiega tbody tr:not(.ksg-wiecej-wiersz) > * { padding-block: 0; }
  .ksg-stos.ksg-ruch .ksiega thead th { padding-bottom: calc(30 * var(--p)); }
  .ksg-stos.ksg-ruch .ksiega tbody tr.ksg-wiecej-wiersz > td { padding: calc(34 * var(--p)) 0 calc(14 * var(--p)); }
  .ksg-stos.ksg-ruch .ksiega tfoot > tr > * { padding-top: calc(49 * var(--p)); padding-bottom: calc(26 * var(--p)); }
  .ksg-stos.ksg-pelne.ksg-ruch .ksiega thead th { padding-bottom: calc(16 * var(--p)); }                                     /* pełny wariant: osiem wierszy musi mieścić się w oknie, więc odstępy nagłówka i sumy są mniejsze (wiersze dostają więcej) */
  .ksg-stos.ksg-pelne.ksg-ruch .ksiega tfoot > tr > * { padding-top: calc(28 * var(--p)); padding-bottom: calc(14 * var(--p)); }
  /* MIKS-9, poprawka 3 Sola (tylko krótkie): wspólny pas u góry. „Księgowanie” z lewej, istniejący opis z prawej, od lewej krawędzi papieru (kolumna 5), dolną linią tekstu na linii pisma nagłówka;
     pod pasem rachunek (lewo) i papier (prawo) w jednej grupie. Góra tabeli ok. 275 px od początku sceny na 2000×1420 (92 p pod pasem + wcięcie papieru), zapas pod papierem 52 p (72 px).
     Pas liczy ksiegowanie.js jako --ksg-gora-p (dół nagłówka i opisu); wysokość pasa = wysokość nagłówka, więc scena jest tak niska, jak grupa (nie ma miejsca na osiem wierszy). Pełny wariant bez zmian. */
  .ksg-krotkie.ksg-stos.ksg-ruch .ksg-scena { --ksg-h2: min(clamp(46px, min(calc(var(--okno) * .107), calc(9.6 * var(--u))), 160px), 22cqw); }
  .ksg-krotkie.ksg-stos.ksg-ruch .ksg-scena h2 { font-size: var(--ksg-h2); margin-bottom: 0; }
  .ksg-krotkie.ksg-stos.ksg-ruch .ksg-lead { position: absolute; left: calc(100% + var(--g)); top: 0; width: 25.5em; max-width: calc(200% + var(--g)); height: calc(var(--ksg-h2) * .92); margin: 0; padding-bottom: calc(var(--ksg-h2) * .04); display: flex; flex-direction: column; justify-content: flex-end; }
  .ksg-stos.ksg-ruch .ksg-czesci, .ksg-krotkie.ksg-ruch .ksg-czesci { gap: calc(16 * var(--p)); }   /* MIKS-9: odstęp zapisów w rachunku ≥ 12 px nawet między polem startującej kwoty a następnym zapisem (było 3–8 px: kwota odrywała się 3–8 px od sąsiedniego zapisu) */
  .ksg-krotkie.ksg-stos .ksg-papier, .ksg-krotkie.ksg-stos .ksg-papier.ksg-p-zwiniety { margin-top: var(--ksg-mt, calc(var(--ksg-gora-p, 0px) + 92 * var(--p))); margin-bottom: calc(52 * var(--p)); }
  /* Krzyż po MIKS-10: krótka scena (dwa przykłady) ma skalę kwot, które do niej lecą, i wypełnia okno. Dane w papierze ×1,2, ale tylko przy pięciu kolumnach (zwinięta i zwijana: .ksg-zwiniete, .ksg-kol5);
     siedem kolumn stanu rozwiniętego zostaje przy dotychczasowym piśmie (przy ×1,2 nazwy dokumentów łamią się na dwa wiersze), a zmiana rozmiaru przy kliknięciu chowa się w masce 0,2 s, która odsłania liczby wierszy 1–2 w nowych kolumnach (ksiegowanie.js, klikStos);
     margines kartki (góra i dół, waga 0,6), wiersze dwóch przykładów (0,5: wiersz zostaje ok. 5,4 em pisma, jak przed powiększeniem), odstęp pod nagłówkiem tabeli (0,3) i nad „Razem” (0,4) rosną o --ksg-luz
     (ksiegowanie.js, rezerwujStos: wolne miejsce okna ponad 11% u góry i u dołu; suma wag 2,9); sześć wierszy pod przyciskiem ma wysokość bazową (rozwinięty papier nie rośnie o luz). */
  .ksg-krotkie.ksg-stos.ksg-ruch .ksiega:is(.ksg-zwiniete, .ksg-kol5) tbody { font-size: clamp(13px, 2.11cqw, calc(24.5 * var(--p))); }
  .ksg-krotkie.ksg-stos.ksg-ruch .ksiega:is(.ksg-zwiniete, .ksg-kol5) tfoot { font-size: clamp(13px, 1.94cqw, calc(20.4 * var(--p))); }
  .ksg-krotkie.ksg-stos.ksg-ruch .ksiega tbody tr:not(.ksg-wiecej-wiersz):not(.ksg-dalej) { height: var(--ksg-wiersz, calc(80 * var(--p) + var(--ksg-luz, 0px) * .5)); }
  .ksg-krotkie.ksg-stos.ksg-ruch .ksiega tbody tr.ksg-dalej { height: calc(80 * var(--p)); }
  .ksg-krotkie.ksg-stos.ksg-ruch .ksiega thead th { padding-bottom: calc(30 * var(--p) + var(--ksg-luz, 0px) * .3); }
  .ksg-krotkie.ksg-stos.ksg-ruch .ksiega tfoot > tr > * { padding-top: calc(49 * var(--p) + var(--ksg-luz, 0px) * .4); }
  .ksg-krotkie.ksg-stos.ksg-ruch .ksg-papier { padding-block: calc(clamp(18px, calc(2 * var(--u)), calc(30 * var(--p))) + var(--ksg-luz, 0px) * .6); }
}

/* ---------------------------------------------------------------- 3. usługi: stos czterech druków (przyklejanie robi CSS; tylko wtedy, gdy stos jest włączony, czyli jak w dol.css)
   Stos i blok tekstu są wycentrowane w oknie: druk jest szerszy razem ze skalą, odstęp między wystającymi paskami starszych druków rośnie z wysokością okna,
   a blok tekstu ma stałą wysokość i środkuje treść, więc nie zostaje pusta połowa kolumny. */
@media (min-width: 1001px) and (min-height: 640px) and (prefers-reduced-motion: no-preference) {
  .usl {
    --stos: calc((7 * (100vw - 2 * var(--m)) - 5 * var(--g)) / 12);                    /* szerokość kolumny druków (kolumny 6–12) */
    --dw: min(var(--stos), calc(780 * var(--p)));                                        /* szerokość druku */
    --ph: calc(440 * var(--p));                                                          /* wysokość widocznej części druku (jak dotąd 440 px, razy skala) */
    --hd: max(calc(var(--dw) * .67), var(--ph));
    --skok: 8.5svh;
    --krok: calc(var(--ph) + var(--okno) * .08);                                         /* odstęp między slotami: kolejny druk przyjeżdża, zanim pod poprzednim zrobi się pusto (runda „po Solu”: .08 zamiast .2 okna; każdy druk jest cały widoczny, gdy się układa, a jego wypełnienie gra czasowo) */
    --pad: max(20px, calc((var(--okno) - 3 * var(--skok) - var(--ph)) / 2));             /* odstęp stosu od góry okna pod paskiem */
    --bh: max(calc(var(--okno) * .4), 420px);                                            /* najmniejsza wysokość bloku tekstu (było 380 px): blok rośnie do treści (min-height), bo dwa wiersze linków po 44 px + 8 px dają najdłuższej usłudze 416 px treści przy 1440×900, 450 przy 1600×900, 478 przy 1920×1080; stała większa wysokość wystawałaby poza ostatni slot w wysokich oknach (2000×1420) */
  }
  .usl-blok { top: calc(var(--gora) + (var(--okno) - var(--bh)) / 2); height: auto; min-height: var(--bh); align-content: center; gap: calc(22 * var(--p)); }
  .usl-blok h3 { font-size: clamp(50px, calc(5.6 * var(--u)), calc(96 * var(--p))); }
  .usl-blok p { font-size: clamp(18px, calc(1.4 * var(--u)), calc(22 * var(--p))); }
  .usl-link, .usl-wiecej { font-size: clamp(17px, calc(12.5 * var(--p)), 18px); }   /* 17–18 px w każdym oknie komputera (skala --p dochodzi tylko do 18 px) */
  .usl-blok .usl-przyp { font-size: calc(14 * var(--p)); }
  .usl-druk { top: calc(var(--gora) + var(--pad) + var(--i) * var(--skok)); }
  .usl-slot:last-child { height: calc(var(--krok) - var(--okno) * .1); }                               /* ogon po ostatnim druku krótszy o 0,1 okna w obu kolumnach naraz (stos i lewy blok kończą się razem), żeby odstęp usługi → miesiąc mieścił się w ok. 15% okna */
  .usl-druk:last-child { margin-bottom: max(0px, calc(var(--krok) - var(--hd) - var(--okno) * .1)); }
  .usl-druk .kartka { max-width: var(--dw); min-height: var(--ph); transform-origin: calc(var(--dw) - var(--stos) / 2) 0; }   /* obraca się kartka (uslugi.js); dawny punkt obrotu: środek kolumny druków przy górnej krawędzi */
}

@media (min-width: 1001px) {
  /* ------------------------------------------------------------ 4. „Ty przysyłasz dokumenty…” (miesiąc; plansza wypełnia scenę, karty rosną z planszy)
     Szerokość karty to mniejsza z dwóch wartości: część szerokości planszy i część jej wysokości, więc w wysokim oknie karta jest duża, a w szerokim i niskim
     nie wystaje poza planszę. Cały tekst w karcie jest liczony od jej szerokości (--q = 1 px przy dawnych 374 / 504 / 403 px, nie mniej), więc proporcje zostają. */
  .mies-gora h2 { font-size: clamp(40px, calc(4.7 * var(--u)), calc(80 * var(--p))); }
  .mies-cyfry { font-size: clamp(34px, calc(4.2 * var(--u)), calc(72 * var(--p))); }
  .mies-okres small { margin-top: calc(10 * var(--p)); font-size: calc(14 * var(--p)); }
  .mies-ruch .mies-plansza { container-type: size; }
  /* runda „wersja łączona”: karty aktu 1 i 3 większe (42 / 88 i 45 / 88 zamiast 35 / 69 i 38 / 74), żeby nad i pod kartą zostawało najwyżej ok. 13% wysokości okna zamiast 15–17% */
  .mies-ruch .mies-ksef, .mies-ruch .mies-mail { --w: clamp(290px, min(42cqw, 88cqh), 1100px); --q: max(1px, calc(var(--w) / 374)); }
  .mies-ruch .mies-ksiega { --w: clamp(360px, min(46cqw, 93cqh), 1400px); --q: max(1px, calc(var(--w) / 504)); }
  .mies-ruch .mies-wyj { --w: clamp(310px, min(45cqw, 88cqh), 1300px); --q: max(1px, calc(var(--w) / 403)); }
  .mies-ruch .mies-karta { --qv: min(calc(var(--q) * 1.35), max(var(--q), calc(100cqh / 311 - .77px))); padding: calc(24 * var(--qv)) calc(26 * var(--q)) calc(26 * var(--qv)); }   /* pionowe odstępy (--qv) rosną z wysokością planszy (do 35% ponad poziome, przy planszy 550 px i niższej wcale): karta jest wyższa, tekst ma te same proporcje */
  .mies-ruch .mies-kod { font-size: calc(43 * var(--q)); }
  .mies-ruch .mies-opis { margin: calc(6 * var(--qv)) 0 calc(14 * var(--qv)); font-size: calc(14.5 * var(--q)); }
  .mies-ruch .mies-wiersze li { gap: calc(14 * var(--q)); padding: calc(7 * var(--qv)) 0; font-size: calc(14.5 * var(--q)); }
  .mies-ruch .mies-wiersze b, .mies-ruch .mies-suma b { font-size: calc(15.5 * var(--q)); }
  .mies-ruch .mies-suma { gap: calc(14 * var(--q)); padding-top: calc(12 * var(--qv)); }
  .mies-ruch .mies-suma b { font-size: calc(30 * var(--q)); }
  .mies-ruch .mies-wynik b { font-size: calc(42 * var(--q)); }
  .mies-ruch .mies-kwota-opis { padding-top: calc(12 * var(--qv)); font-size: calc(13.5 * var(--q)); }
  .mies-ruch .mies-kwota { margin: calc(4 * var(--qv)) 0 calc(18 * var(--qv)); font-size: calc(63 * var(--q)); }
  .mies-ruch .mies-odb { margin: 0 calc(-26 * var(--q)) calc(-26 * var(--qv)); padding: calc(12 * var(--qv)) calc(26 * var(--q)); }
  .mies-ruch .mies-mail-do { --q: var(--p); bottom: calc(16 * var(--q)); width: min(calc(560 * var(--q)), 80%); padding: calc(14 * var(--q)) calc(22 * var(--q)); gap: calc(20 * var(--q)); font-size: calc(15 * var(--q)); }
  .mies-ruch .mies-podpis { font-size: clamp(17px, calc(1.4 * var(--u)), calc(21 * var(--p))); }
  .mies-ruch .mies-kroki { gap: calc(22 * var(--p)); }
  .mies-ruch .mies-kroki li { padding: calc(8 * var(--p)) 0 calc(10 * var(--p)); font-size: calc(15 * var(--p)); }
  .mies-ruch .mies-nota { margin-top: calc(12 * var(--p)); font-size: calc(14 * var(--p)); }

  /* ------------------------------------------------------------ 5. ceny */
  section.cen { padding: var(--sekcja-g) var(--m); }
  .cen-gora h2 { font-size: clamp(44px, calc(5.6 * var(--u)), calc(96 * var(--p))); }
  .cen-gora p { font-size: clamp(16px, calc(1.3 * var(--u)), calc(20 * var(--p))); }
  .cen-wiersz { gap: clamp(14px, calc(2 * var(--u)), calc(32 * var(--p))); }
  .cen-wiersz dt { gap: clamp(14px, calc(2 * var(--u)), calc(32 * var(--p))); font-size: clamp(26px, calc(2.8 * var(--u)), calc(46 * var(--p))); }
  .cen-wiersz dt small { font-size: clamp(15px, calc(1.2 * var(--u)), calc(19 * var(--p))); }
  .cen-od { font-size: clamp(20px, calc(2 * var(--u)), calc(30 * var(--p))); }
  .cen-zl { font-size: clamp(34px, calc(4.4 * var(--u)), calc(70 * var(--p))); }
  .cen-pole { --k: clamp(104px, calc(16 * var(--u)), calc(244 * var(--p))); }
  .cen-nota { font-size: clamp(20px, calc(2.1 * var(--u)), calc(32 * var(--p))); }

  /* ------------------------------------------------------------ 6. pytania */
  .pyt h2 { font-size: clamp(48px, calc(6 * var(--u)), calc(100 * var(--p))); }
  .pyt-pytanie { padding: clamp(18px, 3svh, calc(36 * var(--p))) 0; font-size: clamp(24px, calc(2.7 * var(--u)), calc(44 * var(--p))); }
  .pyt-szczelina { height: calc(16 * var(--p)); }
  .pyt-paragon { padding: calc(22 * var(--p)) calc(22 * var(--p)) calc(40 * var(--p)); font-size: calc(15 * var(--p)); }
  .pyt-q { font-size: calc(22 * var(--p)); }
  /* MIKS-11 (poprawka 2 Sola): w oknach od 1400 px papier z odpowiedzią ma wagę pytań po lewej. Drukarka wyrównana do prawej krawędzi kontenera i szersza: papier 514 p − 54 px
     (660 px w 2000×1420 zamiast 580, 460 w 1440×900 zamiast 404: to samo +14%; liniowo od --p, bo szerokość dawnych czterech kolumn nie rośnie dokładnie z --p), okno papieru ma po 10 px marginesu, stąd −34 px w szerokości drukarki.
     Lista pytań (7 kolumn) bez zmian, więc pytania się nie łamią; przerwa między listą a papierem ok. 125 px (2000×1420) zamiast 205; pismo odpowiedzi 16,5 p (23 px w 2000×1420), pytanie na papierze 24 p.
     Wysokość sekcji bez zmian (lista jest wyższa niż drukarka). Poniżej 1400 px układ jak dotąd (przerwa przy większym papierze byłaby < 40 px). */
  @media (min-width: 1400px) {
    .pyt-drukarka { grid-column: 8 / -1; justify-self: end; width: min(calc(514 * var(--p) - 34px), 100%); }
    .pyt-paragon { padding: calc(24 * var(--p)) calc(24 * var(--p)) calc(44 * var(--p)); font-size: calc(16.5 * var(--p)); }
    .pyt-q { font-size: calc(24 * var(--p)); }
  }

  /* ------------------------------------------------------------ 7. historia (przypięta taśma): taśma ma 58% wysokości okna pod paskiem (w oknie 1440×900 to dokładnie dotychczasowe 480 px)
     Lata, opisy i znaczniki są liczone z wysokości taśmy, jak dotąd; rok i opis mają górny limit od szerokości (19 vw), bo wpis ma w kadrze ok. 45 vw szerokości (taśma ma --T = 264 vw, wpisy stoją co 80 vw). */
  .hist-gora h2 { font-size: clamp(44px, calc(5.4 * var(--u)), calc(92 * var(--p))); }
  .hist-klienci { font-size: clamp(17px, calc(1.4 * var(--u)), calc(21 * var(--p))); }
  .hist-ruch .hist-tasma { --hd: clamp(340px, calc(var(--okno) * .58), 1040px); }
  .hist.hist-ruch { padding-bottom: 0; }                    /* przypięta scena kończy się razem z sekcją: luz pod taśmą wystarcza za odstęp */
  .hist.hist-ruch + .zmb { padding-top: 0; }                /* po scenie przypiętej taśma ma pod sobą granatowy luz, który za odstęp wystarcza */
  .usl + .mies { padding-top: calc(var(--sekcja-g) * .5); } /* po stosie usług, który kończy się wolnym ogonem slotu, odstęp następnej sekcji jest o połowę mniejszy */
  section.kontakt { padding-bottom: calc(var(--sekcja-g) * .6) !important; }   /* ostatnia sekcja przed stopką: stopka ma własny górny luz, więc odstęp pod formularzem jest krótszy; pusty pas na styku formularz–stopka ≤ 15% okna */
  .hist-ruch .hist-rok span { font-size: min(calc(var(--hd) * .44), 19vw); }
  .hist-ruch .hist-rok { width: max-content; }               /* rok szerszy niż wpis (40 vw) w wysokim oknie: clip-path animacji obcinał ostatnią cyfrę „1992” (zgłosił Dominik 15.10) */
  .hist-ruch .hist-tekst { font-size: clamp(18px, min(calc(var(--hd) * .045), calc(1.9 * var(--u))), calc(30 * var(--p))); }
  .hist-ruch .hist-rok small { font-size: calc(var(--hd) * .042); }
  .hist-ruch .hist-znak .hist-rok-m { font-size: calc(var(--hd) * .029); }
  .hist-ruch .hist-znak .hist-nazwa { font-size: calc(var(--hd) * .031); }
  .hist-ruch .hist-skala { font-size: calc(var(--hd) * .024); }
  /* Krzyż po MIKS-11: wysokie okno poziome (szerokość od 1 do 1,5 wysokości, od 1000 px wysokości, np. 2000×1420, 1600×1200; okna pionowe bez zmian, bo tam rok ogranicza szerokość): taśma ma 67% wysokości okna pod paskiem, rok skalę taśmy
     (górny limit 23 vw: 1992 ma ok. 52 vw szerokości, a wpisy stoją co 80 vw), linijka lat stoi na 0,745 wysokości druku zamiast 0,78, czyli przy wpisie, a znaczniki pod nią są o ok. 15% większe.
     Granat nad taśmą, pustka między opisem a linijką, między znacznikami a perforacją i granat pod taśmą mają po ok. 150 px (było 205 / 198 / 93 / 211 px przy 2000×1420). Oś kamery i druk lat bez zmian. */
  @media (min-aspect-ratio: 1/1) and (max-aspect-ratio: 3/2) and (min-height: 1000px), (min-aspect-ratio: 1/1) and (max-aspect-ratio: 8/5) and (min-height: 1150px), (min-aspect-ratio: 1/1) and (max-aspect-ratio: 16/9) and (min-height: 1300px) {   /* też okna 16:10 od 1150 px i 16:9 od 1300 px wysokości, np. 1920×1200, 2560×1440 */
    .hist-ruch .hist-tasma { --hd: clamp(340px, calc(var(--okno) * .67), 1040px); }
    .hist-ruch .hist-rok span { font-size: min(calc(var(--hd) * .51), 23vw); }
    .hist-ruch .hist-linia, .hist-ruch .hist-znak { top: calc(var(--hd) * .745); }
    .hist-ruch .hist-linijka { top: calc(var(--hd) * .745 - 10px); }
    .hist-ruch .hist-skala { top: calc(var(--hd) * .745 - 30px); }
    .hist-ruch .hist-znak .hist-rok-m { font-size: calc(var(--hd) * .033); }
    .hist-ruch .hist-znak .hist-nazwa { font-size: calc(var(--hd) * .036); }
  }

  /* ------------------------------------------------------------ 8. zmiana biura */
  .zmb-gora h2 { font-size: clamp(44px, calc(5.4 * var(--u)), calc(92 * var(--p))); }
  .zmb-gora p { font-size: clamp(18px, calc(1.5 * var(--u)), calc(23 * var(--p))); }
  .zmb-dol p { font-size: calc(18 * var(--p)); }
  .zmb-dol .przycisk-duzy { height: calc(56 * var(--p)); padding: 0 calc(30 * var(--p)); font-size: calc(17 * var(--p)); }

  /* ------------------------------------------------------------ 9. formularz i stopka */
  .kontakt-tekst h2 { font-size: clamp(48px, calc(5.7 * var(--u)), calc(94 * var(--p))); }
  .kontakt-tekst > p { font-size: clamp(18px, calc(1.3 * var(--u)), calc(21 * var(--p))); }
  .adres { font-size: calc(17 * var(--p)); }
  .adres-tel { font-size: calc(22 * var(--p)); }
  .form-register { font-size: calc(15 * var(--p)); }
  .formularz, .wplynelo { padding: clamp(22px, calc(2.6 * var(--u)), calc(40 * var(--p))); }
  .f-kod { font-size: calc(30 * var(--p)); }
  .f-instr { font-size: calc(14 * var(--p)); }
  .f-pole label, .f-pole legend { font-size: calc(15.5 * var(--p)); }
  .f-pole input[type="text"], .f-pole input[type="email"], .f-pole input[type="tel"] { height: calc(48 * var(--p)); font-size: calc(17 * var(--p)); }
  .f-pole textarea { min-height: calc(150 * var(--p)); font-size: calc(17 * var(--p)); }
  .f-wyslij { height: calc(56 * var(--p)); padding: 0 calc(34 * var(--p)); font-size: calc(17 * var(--p)); }
  .f-demo { font-size: calc(14 * var(--p)); }
  .footer-date { font-size: clamp(104px, calc(17 * var(--u)), calc(300 * var(--p))); }
  /* formularz: reszta pól i komunikatów w tej samej skali; linie w polu wiadomości mają rytm 30 px × skala, więc tekst zostaje równo na liniach */
  .formularz { gap: calc(22 * var(--p)); }
  .f-gora { gap: calc(6 * var(--p)) calc(14 * var(--p)); padding-bottom: calc(16 * var(--p)); }
  .f-adresat { font-size: calc(17 * var(--p)); }
  .f-nr { font-size: calc(14 * var(--p)); margin-right: calc(10 * var(--p)); }
  .f-pole { gap: calc(8 * var(--p)); }
  .f-pole textarea { padding: calc(10 * var(--p)) calc(12 * var(--p)); line-height: calc(30 * var(--p));
    background: #fff repeating-linear-gradient(to bottom, transparent 0 calc(29 * var(--p)), rgba(210, 74, 54, .35) calc(29 * var(--p)) calc(30 * var(--p))) 0 calc(10 * var(--p)) / 100% calc(100% - 10 * var(--p)) no-repeat; }
  .f-blad { font-size: calc(14.5 * var(--p)); }
  .f-blad-ogolny { padding: calc(12 * var(--p)) calc(14 * var(--p)); font-size: calc(15 * var(--p)); }
  .f-opcje { gap: calc(10 * var(--p)) calc(22 * var(--p)); }
  .f-opcje label { gap: calc(10 * var(--p)); min-height: calc(44 * var(--p)); font-size: calc(15.5 * var(--p)); }
  .f-opcje input { width: calc(28 * var(--p)); height: calc(28 * var(--p)); }
  .f-kratka { width: calc(28 * var(--p)); height: calc(28 * var(--p)); font-size: calc(20 * var(--p)); }
  .f-zgoda { font-size: calc(14 * var(--p)); }
  .pieczatka { padding: calc(16 * var(--p)) calc(26 * var(--p)) calc(14 * var(--p)); gap: calc(6 * var(--p)); }
  .piecz-t { font-size: calc(44 * var(--p)); }
  .piecz-data { font-size: calc(28 * var(--p)); }
  .piecz-f { font-size: calc(13 * var(--p)); }
  .wpl-t { font-size: calc(32 * var(--p)); }
  .wplynelo p { font-size: calc(17 * var(--p)); }
  .wpl-nowa { height: calc(48 * var(--p)); padding: 0 calc(22 * var(--p)); font-size: calc(15.5 * var(--p)); }
  /* stopka */
  .stopka-gora img { height: calc(24 * var(--p)); }
  .stopka-adres, .stopka-tel a, .stopka-polityka, .stopka-menu a { font-size: calc(15.5 * var(--p)); }
  .stopka-rej, .stopka-dol { font-size: calc(14 * var(--p)); }
  .hg-logo { height: calc(17 * var(--p)); }
  .footer-date small { font-size: calc(15 * var(--p)); }
}