/* ============================================================================
   9-telefon/22-design-zgodnosc-z-wzorem.css — okno Design na telefonie: zestrojenie z aktualnym wzorem (19.10.2026)
   ----------------------------------------------------------------------------
   Pomiar wzoru: telefon pionowo 390 × 844 i poziomo 844 × 390 (PROJEKT-OKIEN\artefakt\Design.html). Wszystko pod :root[data-ui="mobile"].
   Część wspólna z komputerem i tabletem: 4-widoki/25o-design-zgodnosc-z-wzorem.css.
   ============================================================================ */
/* etykiety pól 12 px, odstęp do pola 4 px (wzór: .ui-f; program dawał 13 px i 6 px) */
:root[data-ui="mobile"] :is(.design-editor-modal, .construction-in-design, .construction-modal) .field { gap: var(--s-1); }
:root[data-ui="mobile"] :is(.design-editor-modal, .construction-in-design, .construction-modal) .field > label,
:root[data-ui="mobile"] .modal.design-editor-modal .dsg-tp label:not(.upload-button, .rich-image-button, .button) { font-size: var(--t-xs); }
/* przełączniki okna (oś „Termin Designu | Dziś”, typ opracowania): napis 13 px */
:root[data-ui="mobile"] .modal.design-editor-modal .segmented > :is(button, .button) { font-size: var(--t-sm); }
:root[data-ui="mobile"] .modal.design-editor-modal .segmented > [aria-pressed="true"] { box-shadow: var(--cien-1); }
:root[data-ui="mobile"] .modal.design-editor-modal .dsg-st > [data-dsg-st][aria-pressed="true"] { box-shadow: none; }
/* pola okna: wysokość celu dotyku 44 px (było 46), róg 8 px, wewnętrzny odstęp 8 px (wzór: .ui-f input / .dpl) — rozmiar pisma 16 px zostaje (iOS nie powiększa wtedy strony po stuknięciu w pole) */
:root[data-ui="mobile"] .modal.design-editor-modal .dsg-tp :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .pl-data-pole) { box-sizing: border-box; min-height: var(--h-control); height: var(--h-control); border-radius: var(--r-sm); }
:root[data-ui="mobile"] .modal.design-editor-modal .dsg-tp input:not([type="checkbox"]):not([type="radio"]):not([type="file"]) { padding-block: 0; padding-left: var(--s-2); }
/* telefon poziomo (844 px): układ jak na komputerze — typ opracowania obok budżetu, projektanci obok terminów (wzór: te same dwie kolumny) */
:root[data-ui="mobile"][data-telefon-poziomo] .modal.design-editor-modal .dsg-wiersz { grid-template-columns: minmax(0, 1fr) minmax(0, 200px); }
:root[data-ui="mobile"][data-telefon-poziomo] .modal.design-editor-modal .dsg-zr { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
:root[data-ui="mobile"][data-telefon-poziomo] .modal.design-editor-modal .dsg-plan2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
/* przycisk „Aa” edytora: ramka 1 px, tło powierzchni, napis przyciszony 700 (wzór: .ui-ed-aa) */
:root[data-ui="mobile"] #modal-root .dsg-opis-ed .rich-toolbar > .rich-aa-toggle { border: 1px solid var(--line); background: var(--surface); color: var(--text-muted); font-weight: var(--w-strong); }
/* plakietka stanu planu: 12 px / 700, kolor stanu (ogólna reguła telefonu zdejmowała jej kolor i wagę) */
:root[data-ui="mobile"] .modal.design-editor-modal .dsg-ost { font-size: var(--t-xs); font-weight: var(--w-bold); }
:root[data-ui="mobile"] .modal.design-editor-modal .dsg-ost.got { background: var(--ok-soft); color: var(--ok); }
:root[data-ui="mobile"] .modal.design-editor-modal .dsg-ost.uw { background: var(--warn-soft); color: var(--warn-strong); }