/* TELEFON — OKNO DESIGN wg artefaktu v99 (M4, 18.10.2026). Wszystko pod :root[data-ui="mobile"] (pionowo: :not([data-telefon-poziomo]),
   poziomo: [data-telefon-poziomo]). Komputer i tablet: 4-widoki/25c-design-okno.css; boczne menu konstrukcji (rząd chipów u góry): 2-okna.css.
   Oś projektantów: wiersze to same kółka z inicjałami (kolumna 44 px, kółka 32 px) — imię i rola w `title` + komunikat po stuknięciu. */
:root[data-ui="mobile"] .dsg-wiersz, :root[data-ui="mobile"] .dsg-zr, :root[data-ui="mobile"] .dsg-plan2 { grid-template-columns: minmax(0, 1fr); }
:root[data-ui="mobile"] .dsg-typ > button { flex: 1 1 30%; }
/* nagłówek: tytuł, „?”, ✕ w jednym wierszu; status W toku | Gotowy pod spodem na całą szerokość (pionowo) */
:root[data-ui="mobile"]:not([data-telefon-poziomo]) #modal-root .design-modal > header:has(.dsg-st) { flex-wrap: wrap; }
:root[data-ui="mobile"]:not([data-telefon-poziomo]) #modal-root .design-modal > header:has(.dsg-st) > p { display: none; }
:root[data-ui="mobile"]:not([data-telefon-poziomo]) #modal-root .design-modal > header > .dsg-st { order: 3; flex: 1 0 100%; display: grid; grid-auto-columns: 1fr; grid-auto-flow: column; }
:root[data-ui="mobile"] .dsg-tab { min-height: var(--h-control); font-size: var(--t-base); }
/* status „W toku | Gotowy”: aktywny przycisk w kolorze (akcent / zieleń) jak we wzorze; ogólna reguła telefonu dla .segmented
   (1-podstawa.css: aktywny = biały kafelek) jest silniejsza od reguły z 25c-design-okno.css — tu to samo z wyższą wagą (jak w Planach, 2d-plany-okno-zakladki.css) */
:root[data-ui="mobile"] .dsg-st > [data-dsg-st="W toku"][aria-pressed="true"] { background: var(--accent-soft); color: var(--accent-strong); box-shadow: none; }
:root[data-ui="mobile"] .dsg-st > [data-dsg-st="Gotowy"][aria-pressed="true"] { background: var(--ok-soft); color: var(--ok); box-shadow: none; }
/* oś: same kółka z inicjałami */
:root[data-ui="mobile"] .dsg-har .pos { grid-template-columns: 44px minmax(0, 1fr); }
:root[data-ui="mobile"] .dsg-har .pos-lo { grid-template-columns: minmax(0, 1fr); justify-items: center; justify-content: center; padding: 0; cursor: pointer; }
:root[data-ui="mobile"] .dsg-har .pos-lo > span:not(.avatar) { display: none; }
:root[data-ui="mobile"] .dsg-har .pos-lh { visibility: hidden; }
:root[data-ui="mobile"] .dsg-har .pos-uch { width: 16px; }
:root[data-ui="mobile"] .dsg-os-info { flex-basis: 100%; order: 3; }
:root[data-ui="mobile"] .dsg-os-zoom { margin-left: auto; }
/* przydział konstrukcji: kółka w wierszu pod nazwą */
:root[data-ui="mobile"] .dsg-prw { flex-wrap: wrap; }
:root[data-ui="mobile"] .dsg-prw .dsg-pr-a { width: 100%; justify-content: flex-start; }
:root[data-ui="mobile"] .dsg-pl-q { width: 100%; }
/* „Pliki n” + „Dodaj pliki” + „Pobierz ZIP” w JEDNYM wierszu (jak we wzorze); szukajka (gdy jest >6 plików) w osobnym wierszu pod spodem */
:root[data-ui="mobile"] .dsg-pl-g { gap: var(--s-2); }
:root[data-ui="mobile"] .dsg-pl-g > .dsg-sp, :root[data-ui="mobile"] .dsg-pl-g > [data-dsg-pliki-szukaj]:empty { display: none; }
:root[data-ui="mobile"] .dsg-pl-g > [data-dsg-pliki-szukaj] { order: 5; flex: 1 0 100%; }
:root[data-ui="mobile"] .dsg-pl-g > .dsg-pl-dodaj { margin-left: auto; }
:root[data-ui="mobile"] .dsg-pl-g > :is(.button, .upload-button) { flex: 0 1 auto; min-width: 0; padding-inline: var(--s-3); }
/* „Pobierz ZIP” na telefonie z napisem (pomiar wzoru 18.10: 125 px, napis widoczny; wcześniej sama ikona 44 px) — „Pliki n | Dodaj pliki | Pobierz ZIP” mieszczą się w wierszu od ~360 px, węższe zawijają się */
:root[data-ui="mobile"] .dsg-pl-zip { padding-inline: var(--s-3); }
:root[data-ui="mobile"]:not([data-telefon-poziomo]) .dsg-opis > .form-panel-head > small { display: none; }
:root[data-ui="mobile"] .dsg-dane > .form-panel-head { flex-wrap: wrap; }
:root[data-ui="mobile"] .dsg-dane > .form-panel-head > h3 { white-space: nowrap; }
:root[data-ui="mobile"] .dsg-wer { flex-basis: 100%; margin-left: 0; }
/* GUI-DESIGN-FIX1 (18.10.2026) — dopasowanie do wzoru zmierzonego na żywo: nagłówek pionowo 12/8/8/16, status 13 px z odstępem 3 px i tłem --surface-3,
   typ opracowania 13 px z wybranym w kolorze akcentu, przycisk „Aa” z odstępem 12 px i rogiem 8 px, stopka 44 px / 14 px / odstęp 12 px */
:root[data-ui="mobile"]:not([data-telefon-poziomo]) #modal-root .modal.design-editor-modal > header { padding-top: var(--s-3); }
:root[data-ui="mobile"]:not([data-telefon-poziomo]) #modal-root .modal.design-editor-modal > header h2 { font-size: var(--t-lg); }   /* wzór (pion): tytuł 19 px (poziomo 16 px) */
:root[data-ui="mobile"]:not([data-telefon-poziomo]) #modal-root .modal.design-editor-modal > header p { display: none; }   /* wzór (pion): podtytuł ukryty — wcześniejsza reguła celowała w `> p`, a podtytuł leży w <div> */
:root[data-ui="mobile"] .dsg-st > [data-dsg-st] { font-size: var(--t-sm); padding: 0 var(--s-3); }
:root[data-ui="mobile"] .dsg-os-zoom .button.mini { padding: 0 var(--s-3); }
:root[data-ui="mobile"] .dsg-st:has(> [data-dsg-st]) { gap: 3px; background: var(--surface-3); }
:root[data-ui="mobile"] .segmented.dsg-typ { background: var(--surface-3); }
:root[data-ui="mobile"] .segmented.dsg-typ > :is(button, .button) { font-size: var(--t-sm); }
:root[data-ui="mobile"] .segmented.dsg-typ > [aria-pressed="true"] { color: var(--accent-strong); }
:root[data-ui="mobile"] .dsg-opis-ed > .rich-editor { border-radius: var(--r-sm); }
:root[data-ui="mobile"] .dsg-opis-ed .rich-toolbar > .rich-aa-toggle { border-radius: var(--r-sm); padding-inline: var(--s-3); }
:root[data-ui="mobile"] #modal-root .design-editor-modal > footer > .inline-actions { width: 100%; flex-wrap: wrap; }
:root[data-ui="mobile"] #modal-root .design-editor-modal > footer > .inline-actions > [data-action="close-modal"] { flex: 0 0 auto; margin-right: auto; }
:root[data-ui="mobile"] #modal-root .design-editor-modal > footer > .inline-actions :is(.button, .stopka-wiecej-przycisk) { flex: 0 0 auto; min-height: var(--h-control); height: var(--h-control); padding-inline: var(--s-3); font-size: var(--t-base); }
/* „?” i ✕ po prawej, status pod spodem (pionowo) albo przed „?” (poziomo) */
:root[data-ui="mobile"]:not([data-telefon-poziomo]) .modal > header:has(.dsg-st) > .modal-help-btn { margin-left: auto; }
