/* redAi UI: wspólne klasy portalu (prefiks ui-). Jedno źródło stylu każdej zakładki.
   Wzornik z żywymi przykładami i kodem: Administracja → Dev (tylko super_admin).
   Własny plik zamiast Tailwinda, bo build Tailwinda na instancjach nie jest przebudowywany
   (public/build z czerwca 2026): nowe klasy narzędziowe tam nie działają, te działają wszędzie.
   Ładowany w layouts/app.blade.php. Zmieniasz tu = zmienia się cały portal. */

:root{
  --ui-ink:#0f172a; --ui-text:#334155; --ui-muted:#64748b; --ui-faint:#94a3b8;
  --ui-line:#e2e8f0; --ui-line-2:#cbd5e1; --ui-bg:#f8fafc; --ui-bg-2:#f1f5f9;
  --ui-red:#dc2626; --ui-red-2:#b91c1c; --ui-red-bg:#fef2f2; --ui-red-line:#fecaca;
  --ui-ok:#16a34a; --ui-ok-bg:#ecfdf5; --ui-ok-line:#a7f3d0; --ui-ok-text:#065f46;
  --ui-warn:#d97706; --ui-warn-bg:#fffbeb; --ui-warn-line:#fde68a; --ui-warn-text:#92400e;
  --ui-info:#2563eb; --ui-info-bg:#eff6ff; --ui-info-line:#bfdbfe; --ui-info-text:#1e40af;
  --ui-bok:280px; /* szerokość bocznej kolumny plików: czat, projekt, agent */
  --ui-r:8px; --ui-r-sm:6px; --ui-shadow:0 1px 3px rgba(15,23,42,.06); --ui-shadow-lg:0 12px 32px rgba(15,23,42,.18);
  /* Tryb ciemny przełącza TE tokeny (blok niżej). Nowe kolory pisz tokenem, nie hexem, inaczej nie zmienią się w ciemnym. */
  --ui-card:#fff; --ui-on-ink:#fff; --ui-ink-2:#1e293b; --ui-text-2:#475569; --ui-ink-hover:#334155;
  --ui-overlay:rgba(15,23,42,.45); --ui-code-bg:#0f172a; --ui-code-ink:#e2e8f0;
}

/* ── Strona: szerokość, nagłówek z akcjami ─────────────────────────────── */
/* Od 1.3.10 każda strona idzie na całą szerokość; klasy --waska/--szeroka zostają tylko dla zgodności (nic nie zwężają). */
.ui-page{max-width:none;margin:0 auto;min-width:0}
.ui-page--waska{max-width:none}
.ui-page--szeroka{max-width:none}
.ui-stack{display:flex;flex-direction:column;gap:1rem}
.ui-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap}
.ui-title{font-size:18px;font-weight:600;color:var(--ui-ink);margin:0;line-height:1.3}
.ui-sub{font-size:14px;color:var(--ui-muted);margin:.25rem 0 0}
.ui-actions{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
@media (max-width:767px){
  .ui-head .ui-title,.ui-head .ui-sub{display:none}   /* na telefonie tytuł jest w górnym pasku layoutu */
  .ui-head>.ui-actions{width:100%}
  .ui-head>.ui-actions>.ui-btn{flex:1}
}
/* Nagłówek strony „Sekcja › Okruszek" (partials._naglowek-strony): Administracja, Narzędzia, Projekty… */
.ui-pagehead{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;min-height:28px;min-width:0}
.ui-pagehead h1{font-size:18px;font-weight:600;color:var(--ui-ink);margin:0;line-height:1.3;flex:none}
.ui-pagehead h1 a{color:inherit;text-decoration:none}
.ui-pagehead h1 a:hover{text-decoration:underline}
.ui-okruszek{font-size:15px;font-weight:500;color:var(--ui-text-2);display:flex;align-items:center;gap:.5rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-okruszek::before{content:"›";color:var(--ui-faint);font-weight:400}
.ui-okruszek--srodek{flex:none}   /* trzeci poziom (rekord w narzędziu): środkowy okruszek to link do listy */
.ui-okruszek a{color:inherit;text-decoration:none}
.ui-okruszek a:hover{text-decoration:underline}
@media (max-width:767px){
  .ui-pagehead h1{display:none}   /* na telefonie sekcja jest w górnym pasku layoutu */
  .ui-pagehead:not(:has(.ui-okruszek)){display:none}
  .ui-okruszek::before{display:none}
  .ui-okruszek{font-size:16px;font-weight:600;color:var(--ui-ink)}
  .ui-okruszek--srodek{display:none}
}
.ui-stack>.ui-pagehead{margin-bottom:0}
.ui-head>.ui-pagehead{margin-bottom:0;min-width:0}
/* Strona, której karta powtarza nazwę (narzędzie, projekt, agent): na telefonie pasek okruszków byłby trzecim powtórzeniem */
@media (max-width:767px){.ui-pagehead--karta{display:none}}
/* Kafelek ikony na listach i w kartach (Narzędzia; Moduły mają .km-ic/.md-ic w tej samej formie) */
.ui-ic{width:40px;height:40px;border-radius:var(--ui-r);background:var(--ui-bg-2);color:var(--ui-ink);display:flex;align-items:center;justify-content:center;flex:none;font-size:20px;line-height:1}
.ui-ic--duza{width:44px;height:44px;font-size:22px}
.ui-ic svg{width:20px;height:20px}
.ui-ic[data-kat="dokumenty"]{background:var(--ui-info-bg)}
.ui-ic[data-kat="komunikacja"]{background:var(--ui-ok-bg)}
.ui-ic[data-kat="rejestry"]{background:var(--ui-red-bg)}
/* Znaki marek integracji (App\Support\IkonyMarek::kafelek): logo, ikona liniowa albo litera */
.ig-marka{flex:none;width:28px;height:28px;border-radius:7px;background:#fff;border:1px solid var(--ui-line);display:inline-flex;align-items:center;justify-content:center}
.ig-marka svg{width:16px;height:16px;display:block}
.ig-marka--linia{background:var(--ui-bg-2);border-color:transparent;color:var(--ui-ink)}
.ui-back{display:inline-flex;align-items:center;gap:.35rem;font-size:13px;color:var(--ui-muted);text-decoration:none}
.ui-back:hover{color:var(--ui-ink)}
.ui-back svg{width:14px;height:14px;flex:none}
.ui-stack>.ui-back{align-self:flex-start}

/* ── Zakładki: podkreślane (poziom 1) i pigułki (poziom 2) ─────────────── */
.ui-tabs{display:flex;gap:.25rem;border-bottom:1px solid var(--ui-line);overflow-x:auto;white-space:nowrap;scrollbar-width:none;margin:0;padding:0}
.ui-tabs::-webkit-scrollbar{display:none}
.ui-tab{flex:none;padding:.5rem 1rem;font:inherit;font-size:14px;font-weight:500;color:var(--ui-muted);background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;text-decoration:none;cursor:pointer;transition:.15s}
.ui-tab:hover{color:var(--ui-ink-2)}
.ui-tab.on{color:var(--ui-ink);border-bottom-color:var(--ui-ink)}
.ui-pills{display:flex;gap:.35rem;overflow-x:auto;white-space:nowrap;scrollbar-width:none;margin:0;padding:0}
.ui-pills::-webkit-scrollbar{display:none}
.ui-pill{flex:none;padding:.35rem .85rem;font:inherit;font-size:13px;font-weight:500;color:var(--ui-text-2);border:1px solid var(--ui-line);border-radius:999px;background:var(--ui-card);text-decoration:none;cursor:pointer;transition:.15s}
.ui-pill:hover{background:var(--ui-bg);color:var(--ui-ink)}
.ui-pill.on{background:var(--ui-ink);color:var(--ui-on-ink);border-color:var(--ui-ink)}

/* ── Karty i tekst ─────────────────────────────────────────────────────── */
.ui-card{background:var(--ui-card);border:1px solid var(--ui-line);border-radius:var(--ui-r);box-shadow:var(--ui-shadow);padding:1.25rem;min-width:0}
.ui-card--flat{padding:0;overflow:hidden}
.ui-card-h{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem;flex-wrap:wrap}
.ui-card-t{font-size:16px;font-weight:600;color:var(--ui-ink);margin:0;line-height:1.3}
.ui-card--flat>.ui-card-h{margin:0;padding:.7rem 1.25rem;border-bottom:1px solid var(--ui-line);font-size:12px;color:var(--ui-faint)}
.ui-card--flat>.ui-card-h .ui-card-t{font-size:13px;font-weight:500;color:var(--ui-muted)}
.ui-card--flat>.ui-card-pad{padding:1.25rem}
.ui-eyebrow{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ui-muted);margin:0 0 .5rem}
.ui-lead{font-size:15px;font-weight:600;line-height:1.5;color:var(--ui-ink);margin:0 0 .5rem}
.ui-text{font-size:14px;line-height:1.6;color:var(--ui-text);margin:0}
.ui-text+.ui-text,.ui-lead+.ui-text{margin-top:.5rem}
.ui-text b{color:var(--ui-ink);font-weight:600}
.ui-muted{color:var(--ui-muted);font-size:13px}
.ui-small{font-size:12px;color:var(--ui-faint)}
.ui-hr{border:0;border-top:1px solid var(--ui-line);margin:1rem 0}
.ui-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem}
.ui-grid>*{min-width:0}
@media (min-width:640px){.ui-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.ui-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){.ui-grid--bok{grid-template-columns:minmax(0,2fr) minmax(300px,1fr);align-items:start}}
/* Treść + boczna kolumna plików tej samej szerokości co w czacie i projekcie (--ui-bok). */
@media (min-width:1024px){.ui-grid--pliki{grid-template-columns:minmax(0,1fr) var(--ui-bok);align-items:start}}
a.ui-card{display:block;color:inherit;text-decoration:none;transition:.15s}
a.ui-card:hover{border-color:var(--ui-line-2);box-shadow:0 4px 12px rgba(15,23,42,.08)}

/* ── Przyciski i linki ─────────────────────────────────────────────────── */
.ui-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.55rem 1rem;font:inherit;font-size:14px;font-weight:500;line-height:1.2;border-radius:var(--ui-r);border:1px solid var(--ui-line-2);background:var(--ui-card);color:var(--ui-text);cursor:pointer;text-decoration:none;white-space:nowrap;transition:.15s}
.ui-btn:hover{background:var(--ui-bg);color:var(--ui-ink)}
.ui-btn--primary{background:var(--ui-ink);border-color:var(--ui-ink);color:var(--ui-on-ink)}
.ui-btn--primary:hover{background:var(--ui-ink-hover);border-color:var(--ui-ink-hover);color:var(--ui-on-ink)}
.ui-btn--red{background:var(--ui-red);border-color:var(--ui-red);color:#fff}
.ui-btn--red:hover{background:var(--ui-red-2);border-color:var(--ui-red-2);color:#fff}
.ui-btn--danger{border-color:var(--ui-red-line);color:var(--ui-red)}
.ui-btn--danger:hover{background:var(--ui-red-bg);color:var(--ui-red-2)}
.ui-btn--ghost{border-color:transparent;background:transparent}
.ui-btn--ghost:hover{background:var(--ui-bg-2)}
.ui-btn--sm{padding:.35rem .7rem;font-size:13px;border-radius:var(--ui-r-sm)}
.ui-btn--block{width:100%}
.ui-btn:disabled,.ui-btn[aria-disabled=true]{opacity:.5;cursor:not-allowed;pointer-events:none}
.ui-btn svg{width:16px;height:16px;flex:none}
.ui-btn-row{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.ui-btn-row--end{justify-content:flex-end}
.ui-link{color:var(--ui-ink);text-decoration:underline;text-underline-offset:2px;background:none;border:0;padding:0;font:inherit;cursor:pointer}
.ui-link:hover{color:var(--ui-red)}
.ui-link--danger{color:var(--ui-red)}
.ui-link--muted{color:var(--ui-muted);text-decoration:none}
.ui-link--muted:hover{color:var(--ui-ink);text-decoration:underline}
/* Ikony svg w przyciskach i kartach (kafelek .ui-ic wyżej to div) */
svg.ui-ic{width:16px;height:16px;flex:none}
svg.ui-ic--lg{width:20px;height:20px}

/* ── Formularze ────────────────────────────────────────────────────────── */
.ui-field{display:flex;flex-direction:column;gap:.35rem;min-width:0}
.ui-field+.ui-field,.ui-fields>*+*{margin-top:1rem}
.ui-grid>.ui-field+.ui-field{margin-top:0}   /* pola w siatce rozstawia gap, nie margines */
.ui-option:has(input:disabled){cursor:default;background:var(--ui-bg)}
.ui-option:has(input:disabled) b{color:var(--ui-text)}
.ui-option .ui-badge{vertical-align:middle;margin-left:.35rem}
.ui-label{font-size:14px;font-weight:500;color:var(--ui-text)}
.ui-label .req{color:var(--ui-red)}
.ui-input,.ui-select,.ui-textarea{width:100%;padding:.5rem .75rem;font:inherit;font-size:14px;color:var(--ui-ink);background:var(--ui-card);border:1px solid var(--ui-line-2);border-radius:var(--ui-r-sm);outline:none;transition:.15s;min-width:0;box-sizing:border-box}
.ui-input[type=file]{padding:.3rem .5rem;cursor:pointer;color:var(--ui-text-2)}
.ui-input[type=file]::file-selector-button{font:inherit;font-size:13px;font-weight:500;padding:.3rem .75rem;margin-right:.75rem;border:1px solid var(--ui-line-2);border-radius:var(--ui-r-sm);background:var(--ui-bg);color:var(--ui-ink);cursor:pointer}
.ui-input[type=file]:hover::file-selector-button{background:var(--ui-bg-2)}
.ui-input:focus,.ui-select:focus,.ui-textarea:focus{border-color:var(--ui-ink);box-shadow:0 0 0 3px rgba(15,23,42,.08)}
.ui-input::placeholder,.ui-textarea::placeholder{color:var(--ui-faint)}
.ui-input:disabled,.ui-select:disabled,.ui-textarea:disabled{background:var(--ui-bg-2);color:var(--ui-muted);cursor:not-allowed}
.ui-textarea{min-height:96px;resize:vertical}
.ui-field.err .ui-input,.ui-field.err .ui-select,.ui-field.err .ui-textarea,.ui-input[aria-invalid=true]{border-color:var(--ui-red)}
.ui-hint{font-size:12px;color:var(--ui-muted);margin:0;line-height:1.5}
.ui-err{font-size:12px;color:var(--ui-red);margin:0}
.ui-search{position:relative;min-width:0}
.ui-search svg{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--ui-faint);pointer-events:none}
.ui-search .ui-input{padding-left:2.25rem}
.ui-checks{display:flex;flex-direction:column}
.ui-check{display:flex;gap:.75rem;align-items:flex-start;padding:.75rem 0;border-top:1px solid var(--ui-line);cursor:pointer;font-size:14px;color:var(--ui-text);line-height:1.45}
.ui-checks .ui-check:first-child{border-top:0;padding-top:0}
.ui-checks .ui-check:last-child{padding-bottom:0}
.ui-check input{margin:3px 0 0;width:16px;height:16px;flex:none;accent-color:var(--ui-ink)}
.ui-check b{display:block;color:var(--ui-ink);font-weight:600}
.ui-check span{display:block;font-size:13px;color:var(--ui-muted);margin-top:2px}
.ui-check b .ui-badge{display:inline-flex;margin:0 0 0 .4rem;vertical-align:1px} /* odznaka przy nazwie („z roli") nie rozciąga się na szerokość wiersza */
.ui-options{display:grid;grid-template-columns:minmax(0,1fr);gap:.6rem}
@media (min-width:640px){.ui-options--2{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ui-option{display:flex;gap:.75rem;align-items:flex-start;padding:.85rem 1rem;border:1px solid var(--ui-line);border-radius:var(--ui-r);cursor:pointer;background:var(--ui-card);transition:.15s;font-size:14px;color:var(--ui-text);line-height:1.45;min-width:0}
.ui-option:hover{border-color:var(--ui-line-2);background:var(--ui-bg)}
.ui-option:has(input:checked){border-color:var(--ui-ink);box-shadow:inset 0 0 0 1px var(--ui-ink)}
.ui-option input{margin:3px 0 0;accent-color:var(--ui-ink);flex:none}
.ui-option b{display:block;color:var(--ui-ink);font-weight:600}
.ui-option span{display:block;font-size:13px;color:var(--ui-muted);margin-top:2px}
.ui-switch{position:relative;display:inline-flex;align-items:center;gap:.6rem;cursor:pointer;font-size:14px;color:var(--ui-text)}
.ui-switch input{position:absolute;opacity:0;width:0;height:0}
.ui-switch i{width:36px;height:20px;border-radius:999px;background:var(--ui-line-2);position:relative;transition:.15s;flex:none}
.ui-switch i::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.ui-switch input:checked+i{background:var(--ui-ok)}
.ui-switch input:checked+i::after{left:18px}
.ui-switch input:focus-visible+i{box-shadow:0 0 0 3px rgba(15,23,42,.15)}
.ui-switch:has(input:disabled){cursor:not-allowed}
.ui-switch input:disabled+i{opacity:.55}
/* Jeden przycisk zapisu dla długiej strony ustawień: pasek przyklejony do dołu okna (Firma › Ustawienia, Firma › redAi). */
.ui-zapis-pasek{position:sticky;bottom:0;z-index:20;display:flex;justify-content:flex-end;align-items:center;gap:.75rem;flex-wrap:wrap;margin:0 -.25rem;padding:.75rem 1rem;background:var(--ui-card);border:1px solid var(--ui-line);border-radius:var(--ui-r);box-shadow:0 -6px 18px -12px rgba(15,23,42,.35)}
.ui-zapis-pasek .ui-muted{margin-right:auto;font-size:13px;min-width:0}
@media (max-width:639px){.ui-zapis-pasek{margin:0 -.5rem;border-radius:0;border-left:0;border-right:0}.ui-zapis-pasek .ui-btn{flex:1}}
.ui-form-foot{display:flex;justify-content:flex-end;align-items:center;gap:.5rem;margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--ui-line);flex-wrap:wrap}
.ui-form-foot .ui-muted{margin-right:auto}

/* ── Listy wierszy (projekty, czaty, pliki) ────────────────────────────── */
.ui-rows{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}
.ui-row{display:flex;align-items:center;gap:.75rem;padding:.75rem 1.25rem;border-top:1px solid var(--ui-line);color:inherit;text-decoration:none;min-width:0;transition:.15s}
.ui-rows>.ui-row:first-child{border-top:0}
a.ui-row:hover,button.ui-row:hover,.ui-row--link:hover{background:var(--ui-bg)}
button.ui-row{width:100%;text-align:left;background:none;border:0;border-top:1px solid var(--ui-line);font:inherit;cursor:pointer}   /* wiersz, który otwiera okno zamiast podstrony */
.ui-row-t .ui-badge{vertical-align:middle;margin-left:.25rem;font-weight:500}
.ui-row-main{flex:1;min-width:0}
.ui-row-t{display:block;font-size:14px;font-weight:500;color:var(--ui-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-row-m{display:block;font-size:12px;color:var(--ui-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px}
.ui-row-end{display:flex;align-items:center;gap:.5rem;flex:none}
.ui-row-chev{width:16px;height:16px;color:var(--ui-faint);flex:none;transition:transform .15s}   /* strzałka na końcu klikalnego wiersza */
.ui-row-chev.on{transform:rotate(90deg)}
@media (max-width:767px){ /* telefon: gdy odznaki/przyciski nie mieszczą się obok tytułu, schodzą pod niego zamiast ucinać tytuł do 3 liter */
  .ui-row{flex-wrap:wrap}
  .ui-row-main{flex:1 1 55%;min-width:140px}
  .ui-row-end{flex-wrap:wrap;flex:0 1 auto;max-width:100%}   /* może się kurczyć, więc odznaki zawijają się w wierszu zamiast wypychać strzałkę poza kartę */
}
.ui-avatar{width:36px;height:36px;border-radius:50%;background:var(--ui-bg-2);color:var(--ui-muted);display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:500;flex:none;overflow:hidden}
.ui-avatar--sm{width:28px;height:28px;font-size:12px}
.ui-avatar img{width:100%;height:100%;object-fit:cover}

/* ── Tabele ────────────────────────────────────────────────────────────── */
.ui-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;min-width:0}
.ui-table{width:100%;border-collapse:collapse;font-size:14px;min-width:640px}
.ui-table th{text-align:left;padding:.6rem 1rem;font-size:12px;font-weight:600;color:var(--ui-muted);background:var(--ui-bg);border-bottom:1px solid var(--ui-line);white-space:nowrap}
.ui-table td{padding:.65rem 1rem;border-top:1px solid var(--ui-bg-2);color:var(--ui-text);vertical-align:middle}
.ui-table tbody tr:first-child td{border-top:0}
.ui-table tbody tr:hover{background:var(--ui-bg)}
.ui-table tr.ui-row--link{cursor:pointer}
.ui-table .num{text-align:right;font-variant-numeric:tabular-nums}
.ui-table .akcje{text-align:right;white-space:nowrap}
.ui-table td b{color:var(--ui-ink);font-weight:500}
.ui-table td .ui-small{display:block}

/* ── Odznaki, status, liczby ───────────────────────────────────────────── */
.ui-badge{display:inline-flex;align-items:center;gap:.35rem;padding:.15rem .55rem;font-size:12px;font-weight:500;border-radius:999px;background:var(--ui-bg-2);color:var(--ui-text);white-space:nowrap;line-height:1.5}
.ui-badge--ok{background:var(--ui-ok-bg);color:var(--ui-ok-text)}
.ui-badge--warn{background:var(--ui-warn-bg);color:var(--ui-warn-text)}
.ui-badge--err{background:var(--ui-red-bg);color:var(--ui-red-2)}
.ui-badge--info{background:var(--ui-info-bg);color:var(--ui-info-text)}
.ui-badge--ink{background:var(--ui-ink);color:var(--ui-on-ink)}
.ui-dot{width:8px;height:8px;border-radius:50%;background:currentColor;display:inline-block;flex:none}
.ui-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
@media (min-width:768px){.ui-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ui-kpi{background:var(--ui-card);border:1px solid var(--ui-line);border-radius:var(--ui-r);padding:.9rem 1rem;min-width:0}
.ui-kpi-l{font-size:12px;color:var(--ui-muted);margin:0}
.ui-kpi-v{font-size:22px;font-weight:600;color:var(--ui-ink);margin:.15rem 0 0;line-height:1.2;font-variant-numeric:tabular-nums}
.ui-kpi-d{font-size:12px;color:var(--ui-faint);margin:.2rem 0 0}

/* ── Kroki, klucz-wartość, pusty stan ──────────────────────────────────── */
.ui-steps{list-style:none;margin:0;padding:0;counter-reset:krok;display:flex;flex-direction:column;gap:.75rem}
.ui-steps li{display:flex;gap:.75rem;font-size:14px;color:var(--ui-text);line-height:1.5}
.ui-steps li::before{counter-increment:krok;content:counter(krok);width:24px;height:24px;border-radius:50%;background:var(--ui-ink);color:var(--ui-on-ink);font-size:12px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;flex:none;margin-top:1px}
.ui-steps b{color:var(--ui-ink);font-weight:600}
.ui-kv{display:grid;grid-template-columns:minmax(0,1fr);gap:.35rem 1.25rem;margin:0;font-size:14px}
@media (min-width:640px){.ui-kv{grid-template-columns:max-content minmax(0,1fr);gap:.6rem 1.25rem}}
.ui-kv dt{color:var(--ui-muted);margin:0}
.ui-kv dd{color:var(--ui-ink);margin:0;min-width:0;overflow-wrap:anywhere}
@media (max-width:639px){.ui-kv dd{margin-bottom:.5rem}}
.ui-empty{padding:2.5rem 1rem;text-align:center;color:var(--ui-muted);font-size:14px;line-height:1.5}
.ui-empty b{display:block;color:var(--ui-ink);font-weight:600;font-size:15px;margin-bottom:.25rem}
.ui-empty .ui-btn{margin-top:1rem}

/* ── Komunikaty i akordeon ─────────────────────────────────────────────── */
.ui-alert{display:flex;gap:.6rem;align-items:flex-start;padding:.75rem .9rem;border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);background:var(--ui-bg);color:var(--ui-text);font-size:14px;line-height:1.5}
.ui-alert svg{width:16px;height:16px;flex:none;margin-top:2px}
.ui-alert b{font-weight:600;color:inherit}
.ui-alert--ok{background:var(--ui-ok-bg);border-color:var(--ui-ok-line);color:var(--ui-ok-text)}
.ui-alert--warn{background:var(--ui-warn-bg);border-color:var(--ui-warn-line);color:var(--ui-warn-text)}
.ui-alert--err{background:var(--ui-red-bg);border-color:var(--ui-red-line);color:var(--ui-red-2)}
.ui-alert--info{background:var(--ui-info-bg);border-color:var(--ui-info-line);color:var(--ui-info-text)}
.ui-alert-x{margin-left:auto;background:none;border:0;color:inherit;opacity:.6;cursor:pointer;font-size:18px;line-height:1;padding:0 2px;flex:none}
.ui-alert-x:hover{opacity:1}
/* Pomoc do zakładki: karta na dole strony, wyróżniona paskiem i tłem, żeby nie mieszała się z treścią roboczą */
.ui-card.ui-pomoc{border-left:4px solid var(--ui-info);background:var(--ui-info-bg);border-color:var(--ui-info-line);border-left-color:var(--ui-info)}
.ui-pomoc>.ui-card-h .ui-card-t{color:var(--ui-info-text)}
.ui-pomoc .ui-acc{border-top-color:var(--ui-info-line)}
.ui-accs{display:flex;flex-direction:column}
.ui-acc{border-top:1px solid var(--ui-line)}
.ui-accs>.ui-acc:first-child{border-top:0}
.ui-acc>summary{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.8rem 0;font-size:14px;font-weight:600;color:var(--ui-ink);cursor:pointer;list-style:none}
.ui-acc>summary::-webkit-details-marker{display:none}
.ui-acc>summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--ui-faint);border-bottom:2px solid var(--ui-faint);transform:rotate(45deg);flex:none;margin:0 6px 4px 0;transition:.15s}
.ui-acc[open]>summary::after{transform:rotate(-135deg);margin-bottom:-2px}
.ui-acc-bd{padding:0 0 1rem;font-size:14px;color:var(--ui-text);line-height:1.6}

/* ── Okna i powiadomienia (window.ui w redai-ui.js) ────────────────────── */
.ui-modal{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;padding:1rem;background:var(--ui-overlay)}
.ui-modal.open{display:flex}
.ui-modal-box{background:var(--ui-card);border-radius:12px;width:100%;max-width:480px;padding:1.25rem;box-shadow:0 20px 50px rgba(15,23,42,.25);max-height:calc(100vh - 2rem);overflow:auto;box-sizing:border-box}
.ui-modal-box--szeroki{max-width:720px}
.ui-modal-t{font-size:16px;font-weight:600;color:var(--ui-ink);margin:0 0 .5rem}
.ui-modal-box>.ui-text{margin-bottom:1rem}
.ui-modal-foot{display:flex;justify-content:flex-end;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
@media (max-width:639px){.ui-modal{align-items:flex-end;padding:0}.ui-modal-box{border-radius:12px 12px 0 0;max-height:85vh}}
/* Tło okna sterowanego Alpine (x-show), bez zamykania kliknięciem w tło: ten sam wygląd co .ui-modal. */
.ui-modal-tlo{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:1rem;background:var(--ui-overlay)}
@media (max-width:639px){.ui-modal-tlo{align-items:flex-end;padding:0}.ui-modal-tlo .ui-modal-box{border-radius:12px 12px 0 0;max-height:85vh}}
.ui-toasts{position:fixed;left:50%;bottom:1.25rem;transform:translateX(-50%);z-index:70;display:flex;flex-direction:column;gap:.5rem;pointer-events:none;width:max-content;max-width:calc(100vw - 2rem)}
.ui-toast{background:var(--ui-ink);color:var(--ui-on-ink);padding:.6rem .9rem;border-radius:var(--ui-r);font-size:14px;box-shadow:0 8px 24px rgba(15,23,42,.25);opacity:0;transform:translateY(6px);transition:.25s;max-width:100%;box-sizing:border-box}
.ui-toast.in{opacity:1;transform:none}
.ui-toast--ok{background:#065f46}
.ui-toast--err{background:var(--ui-red-2)}
/* Komunikaty nigdy nie łapią dotyku (poza własnym przyciskiem), a w oknie czatu stoją u góry,
   pod nagłówkiem, bo na dole zasłaniały pole wiadomości i przycisk Wyślij (zgłoszenie ADMIT 27.09). */
.ui-toast{pointer-events:none}
.ui-toast button,.ui-toast a{pointer-events:auto}
body:has(#v3ta) .ui-toasts{top:calc(env(safe-area-inset-top,0px) + 4.5rem);bottom:auto}

/* ── Karta nagłówkowa z ikoną (narzędzie, projekt, agent): .ui-card > .ui-top ── */
.ui-top{display:flex;gap:1rem;align-items:flex-start}
.ui-top-tresc{flex:1;min-width:0}
.ui-top .ui-card-h{margin-bottom:.5rem;flex-wrap:nowrap;align-items:flex-start}
.ui-top-nazwa{min-width:0;font-size:18px;overflow-wrap:anywhere}
.ui-top-kat{margin:.5rem 0 0}
.ui-top-pigulki{margin-top:1rem;padding-top:.85rem;border-top:1px solid var(--ui-line)}
.ui-top-zakladki{margin:1rem -1.25rem -1.25rem;padding:0 .75rem;border-bottom:0} /* zakładki pierwszego poziomu na dolnej krawędzi karty nagłówkowej (karta użytkownika, ekran narzędzia) */
.ui-top-zakladki .ui-tab{margin-bottom:0}
@media (max-width:639px){ /* telefon: odznaki i przyciski schodzą pod nazwę, nazwa nie łamie się w środku słowa */
  .ui-top .ui-card-h{flex-wrap:wrap}
  .ui-top-nazwa{flex:1 1 auto}
}

/* ── Podpowiadacz (sugestbox): pole tekstowe z listą trafień pod spodem, dla długich list osób ──
   <div class="ui-sugest"> <label class="ui-search">…<input class="ui-input"></label> <div class="ui-sugest-lista"> <button class="ui-sugest-poz [on]"> */
.ui-sugest{position:relative;min-width:0}
.ui-sugest-lista{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;background:var(--ui-card);border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);box-shadow:0 12px 32px rgba(15,23,42,.14);max-height:260px;overflow:auto;padding:.25rem}
.ui-sugest-poz{display:block;width:100%;text-align:left;padding:.45rem .65rem;border:0;background:none;font:inherit;font-size:13px;color:var(--ui-text);border-radius:6px;cursor:pointer}
.ui-sugest-poz:hover,.ui-sugest-poz.on{background:var(--ui-bg);color:var(--ui-ink)}

/* ── Przycisk-ikona 32px (pobierz, usuń, ustawienia): <button class="ui-ikb" title aria-label> ── */
.ui-ikb{display:inline-grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);background:var(--ui-card);color:var(--ui-muted);cursor:pointer;flex:none;text-decoration:none;transition:.12s}
.ui-ikb:hover{color:var(--ui-ink);border-color:var(--ui-line-2);background:var(--ui-bg)}
.ui-ikb--x:hover{color:var(--ui-red-2);border-color:var(--ui-red-line);background:var(--ui-red-bg)}
.ui-ikb svg{width:16px;height:16px}
.ui-ikb--duzy{width:36px;height:36px}
.ui-ikb--duzy svg{width:18px;height:18px}
/* Dymek z nazwą na przycisku-ikonce: data-tip="Opcje czatu" (pasek akcji czatu, partials/_czat-akcje).
   ui-tip-l / ui-tip-r: dymek wyrównany do lewej / prawej krawędzi, gdy przycisk stoi przy brzegu kolumny. */
.ui-ikb[data-tip]{position:relative}
.ui-ikb[data-tip]::after{content:attr(data-tip);position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);background:var(--ui-ink);color:var(--ui-on-ink);font-size:11px;font-weight:500;line-height:1.3;padding:5px 8px;border-radius:6px;white-space:normal;width:max-content;max-width:170px;text-align:center;display:none;pointer-events:none;z-index:60}
.ui-ikb[data-tip]::before{content:"";position:absolute;top:calc(100% + 2px);left:50%;transform:translateX(-50%);border:5px solid transparent;border-bottom-color:var(--ui-ink);display:none;pointer-events:none;z-index:60}
.ui-ikb.ui-tip-l[data-tip]::after{left:0;transform:none}
.ui-ikb.ui-tip-r[data-tip]::after{left:auto;right:0;transform:none}
.ui-ikb[data-tip]:hover::after,.ui-ikb[data-tip]:focus-visible::after,.ui-ikb[data-tip]:hover::before,.ui-ikb[data-tip]:focus-visible::before{display:block}
.ui-pasek{display:flex;align-items:center;gap:6px}
.ui-pasek-sp{flex:1}

/* ── Okno ustawień (czat, projekt, konto): nawigacja po lewej, treść po prawej,
      wiersze „etykieta | kontrolka" i auto-zapis zamiast przycisku „Zapisz" ── */
.ui-modal-box.ui-opcje{padding:0;max-width:900px;height:min(640px,calc(100vh - 2rem));display:flex;flex-direction:column;overflow:hidden;text-align:left;color:var(--ui-text)}
.ui-opcje-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.9rem 1.25rem;border-bottom:1px solid var(--ui-line);flex:none}
.ui-opcje-head .ui-modal-t{margin:0}
.ui-opcje-x{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:var(--ui-r-sm);background:transparent;color:var(--ui-muted);cursor:pointer;flex:none}
.ui-opcje-x:hover{background:var(--ui-bg);color:var(--ui-ink)}
.ui-opcje-x svg{width:18px;height:18px}
.ui-opcje-body{display:grid;grid-template-columns:220px minmax(0,1fr);flex:1;min-height:0}
.ui-opcje-nav{background:var(--ui-bg);border-right:1px solid var(--ui-line);padding:.75rem;display:flex;flex-direction:column;gap:2px;overflow:auto}
.ui-opcje-nav-l{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ui-faint);padding:.6rem .7rem .25rem}
.ui-opcje-nav button,.ui-opcje-nav a{display:flex;align-items:center;gap:.6rem;width:100%;text-align:left;padding:.55rem .7rem;border:0;border-radius:8px;background:transparent;color:var(--ui-text);font:inherit;font-size:14px;line-height:1.3;cursor:pointer;text-decoration:none}
.ui-opcje-nav button:hover,.ui-opcje-nav a:hover{background:var(--ui-bg-2);color:var(--ui-ink)}
.ui-opcje-nav .on{background:var(--ui-bg-2);color:var(--ui-ink);font-weight:600}
.ui-opcje-nav svg{width:16px;height:16px;flex:none;color:var(--ui-muted)}
.ui-opcje-nav .on svg{color:var(--ui-ink)}
.ui-opcje-nav-dol{margin-top:auto;padding-top:.5rem}
.ui-opcje-main{overflow:auto;padding:1.25rem 1.5rem 1.5rem;display:flex;flex-direction:column;gap:1.5rem;min-width:0}
.ui-opcje-sek{display:flex;flex-direction:column}
.ui-opcje-sek-t{font-size:16px;font-weight:600;color:var(--ui-ink);margin:0}
.ui-opcje-sek-d{font-size:13px;color:var(--ui-muted);margin:.2rem 0 0;line-height:1.5}
.ui-opcje-rows{display:flex;flex-direction:column;margin-top:.5rem}
.ui-opcje-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 0;border-top:1px solid var(--ui-line)}
.ui-opcje-rows>.ui-opcje-row:first-child{border-top:0}
.ui-opcje-row-l{min-width:0;flex:1}
.ui-opcje-row-l b{display:block;font-size:14px;font-weight:500;color:var(--ui-ink)}
.ui-opcje-row-l span{display:block;font-size:12.5px;color:var(--ui-muted);margin-top:.15rem;line-height:1.45}
.ui-opcje-row-r{flex:none;display:flex;align-items:center;gap:.5rem;max-width:55%}
.ui-opcje-row-r .ui-input,.ui-opcje-row-r .ui-select{width:280px;max-width:100%}
.ui-opcje-row.ui-opcje-row--kol{flex-direction:column;align-items:stretch;gap:.6rem;flex-wrap:nowrap}
.ui-opcje-row--kol .ui-opcje-row-r{max-width:none;display:block;flex:none;width:100%}
.ui-opcje-row--kol .ui-textarea,.ui-opcje-row--kol .ui-input{width:100%}
.ui-opcje-row--danger .ui-opcje-row-l b{color:var(--ui-red-2)}
.ui-opcje-lista{max-height:240px;overflow:auto;border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);padding:.25rem .6rem;background:var(--ui-card)}
.ui-opcje-karta{display:flex;flex-direction:column;gap:1.5rem} /* sekcje .ui-opcje-sek w zwykłej .ui-card (np. karta agenta) */
.ui-opcje-pre{margin:0;padding:.75rem .9rem;background:var(--ui-code-bg);color:var(--ui-code-ink);border-radius:var(--ui-r-sm);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;max-height:320px;overflow:auto}
.ui-opcje-pre-row{display:flex;gap:.75rem;padding:.2rem 0;border-top:1px solid rgba(255,255,255,.08)}
.ui-opcje-pre-row:first-child{border-top:0}
.ui-opcje-pre-row span{flex:none;opacity:.55}
.ui-opcje-pre-row code{font:inherit;overflow-wrap:anywhere}
/* Historia › Techniczne: parametry sesji czatu (folder, tmux, port) i akcje dawnego okna „Info techniczne”. */
.ui-opcje-tech{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}
.ui-opcje-tech .ui-kv{font-size:13px}
.ui-opcje-tech code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
.ui-opcje-tech-akcje{display:flex;flex-wrap:wrap;gap:.5rem}
/* Sekcja na całą wysokość okna (Historia czatu): pasek Komendy / Zapis + jeden przewijany blok, który wypełnia resztę okna. */
.ui-opcje-sek--pelna{flex:1;min-height:0}
.ui-opcje-hist-pasek{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;margin-top:.9rem}
.ui-opcje-hist-pasek .ui-pills{flex:0 1 auto;min-width:0;max-width:100%}
.ui-opcje-hist-pasek .ui-pill span{opacity:.7;font-weight:400}
.ui-opcje-hist-akcje{display:flex;align-items:center;gap:.5rem;flex:1 1 260px;justify-content:flex-end;min-width:0}
@media (max-width:639px){.ui-opcje-hist-akcje{justify-content:flex-start}.ui-opcje-hist-akcje .ui-search{max-width:none}}
.ui-opcje-hist-akcje .ui-search{flex:1;max-width:260px}
.ui-opcje-hist-akcje .ui-search .ui-input{padding-top:.35rem;padding-bottom:.35rem;font-size:13px}
.ui-opcje-pre--pelny{flex:1 1 0;min-height:220px;max-height:none;margin-top:.75rem}
.ui-opcje-pre--lista{white-space:normal}
.ui-opcje-pre--lista code{white-space:pre-wrap}
.ui-opcje-pre-pusto{opacity:.6;padding:.35rem 0}
.ui-opcje-hist-traf{display:inline-flex;align-items:center;gap:.3rem;font-size:12px;color:var(--ui-muted);white-space:nowrap;flex:none}
.ui-opcje-hist-traf .ui-ikb{width:28px;height:28px}
.ui-opcje-hist-traf .ui-ikb:disabled{opacity:.4;cursor:default}
.ui-opcje-pre{position:relative}
.ui-opcje-pre mark.ui-traf{background:rgba(250,204,21,.35);color:inherit;border-radius:2px}
.ui-opcje-pre mark.ui-traf.on{background:#facc15;color:#0f172a}
.ui-kbd{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px;line-height:1.4;color:var(--ui-ink);border:1px solid var(--ui-line-2);border-bottom-width:2px;border-radius:4px;padding:1px 5px;white-space:nowrap}
.ui-tylko-klawiatura{display:none} /* wiersze o skrótach klawiszowych: bez sensu na telefonie */
@media (min-width:768px){.ui-tylko-klawiatura{display:flex}}
@media (max-width:767px){
  .ui-modal-box.ui-opcje{height:auto;max-height:85vh}
  .ui-opcje-body{display:flex;flex-direction:column}
  .ui-opcje-nav{flex:none;flex-direction:row;flex-wrap:wrap;gap:.35rem;border-right:0;border-bottom:1px solid var(--ui-line);padding:.6rem .75rem;overflow:visible}
  .ui-opcje-nav-l,.ui-opcje-nav svg{display:none}
  .ui-opcje-nav-dol{margin-top:0;padding-top:0}
  .ui-opcje-nav button,.ui-opcje-nav a{width:auto;padding:.35rem .7rem;border-radius:999px;font-size:13px;border:1px solid var(--ui-line);background:var(--ui-card)}
  .ui-opcje-nav .on{background:var(--ui-ink);color:var(--ui-on-ink);border-color:var(--ui-ink)}
  .ui-opcje-main{flex:1;min-height:0;padding:1rem}
  .ui-opcje-row{flex-wrap:wrap}
  .ui-opcje-row-r{max-width:100%;flex:1 1 100%}
  .ui-opcje-row-r .ui-input,.ui-opcje-row-r .ui-select{width:100%}
}

/* ── Panel plików (czat, projekt, agent): strefa upuszczania + lista ── */
.ui-pliki{display:flex;flex-direction:column;gap:.6rem}
.ui-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;padding:1.1rem 1rem;border:1.5px dashed var(--ui-line-2);border-radius:var(--ui-r);background:var(--ui-bg);color:var(--ui-muted);text-align:center;cursor:pointer;transition:.15s}
.ui-drop:hover,.ui-drop.over{border-color:var(--ui-ink);background:var(--ui-bg-2);color:var(--ui-ink)}
.ui-drop.busy{pointer-events:none;opacity:.7}
.ui-drop svg{width:22px;height:22px;color:var(--ui-faint);margin-bottom:.2rem}
.ui-drop .t{font-size:13.5px;font-weight:500;color:var(--ui-text)}
.ui-drop .sub{font-size:12px;color:var(--ui-faint)}
.ui-drop input[type=file]{display:none}
.ui-pliki-lista{display:flex;flex-direction:column;gap:.4rem;container-type:inline-size}
.ui-plik{display:flex;align-items:center;gap:.7rem;padding:.55rem .65rem;border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);background:var(--ui-card);min-width:0}
.ui-ext{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:var(--ui-r-sm);background:var(--ui-info-bg);color:var(--ui-info-text);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;overflow:hidden}
.ui-ext img{width:100%;height:100%;object-fit:cover;display:block}
.ui-plik-b{flex:1;min-width:0}
.ui-plik-n{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:13.5px;font-weight:500;line-height:1.35;color:var(--ui-ink);overflow:hidden;overflow-wrap:anywhere}
.ui-plik-n a{color:inherit;text-decoration:none}
.ui-plik-n a:hover{text-decoration:underline}
.ui-plik-m{display:block;font-size:12px;line-height:1.4;color:var(--ui-faint);margin-top:.15rem}
.ui-plik-o{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:12.5px;line-height:1.4;color:var(--ui-muted);margin-top:.2rem;overflow:hidden;overflow-wrap:anywhere}
.ui-plik-akcje{display:flex;gap:.3rem;flex:none}
/* Wąska kolumna (czat, projekt, agent: --ui-bok): nazwa dostaje całą szerokość wiersza, akcje schodzą pod opis. */
@container (max-width:360px){
  .ui-plik{display:grid;grid-template-columns:32px minmax(0,1fr);column-gap:.6rem;row-gap:.4rem;align-items:start;padding:.6rem}
  .ui-plik .ui-ext{width:32px;height:32px;font-size:10px}
  .ui-plik-akcje{grid-column:2}
  .ui-plik-akcje .ui-ikb{width:28px;height:28px}
  .ui-plik-akcje .ui-ikb svg{width:15px;height:15px}
  .ui-plik-img{grid-column:1/-1;margin:-.6rem -.6rem .1rem}
}
.ui-pliki-pusto{padding:1.25rem 1rem;text-align:center;font-size:13px;color:var(--ui-faint)}
.ui-pliki-pusto svg{width:22px;height:22px;display:block;margin:0 auto .35rem;color:var(--ui-faint)}
.ui-pliki-lista .ui-alert{font-size:13px;padding:.6rem .75rem}
/* podgląd obrazka na całą szerokość (czat: zrzuty ekranu) */
.ui-plik--obraz{flex-wrap:wrap}
.ui-plik-img{flex:0 0 100%;order:-1;margin:-.55rem -.65rem .1rem;border-bottom:1px solid var(--ui-line);background:var(--ui-bg)}
.ui-plik-img img{display:block;width:100%;max-height:190px;object-fit:contain}
/* wariant na całą wysokość kolumny (boczny panel czatu): lista przewija się w środku karty */
.ui-pliki-karta--pelna{display:flex;flex-direction:column;min-height:0;flex:1}
.ui-pliki-karta--pelna>.ui-card-pad{flex:1;min-height:0;overflow-y:auto}

/* ── Kod (wzornik, pomoc, klucze do skopiowania) ───────────────────────── */
.ui-code{margin:0;padding:.85rem 1rem;background:var(--ui-code-bg);color:var(--ui-code-ink);border-radius:var(--ui-r-sm);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;line-height:1.55;overflow:auto;max-height:440px;white-space:pre;tab-size:4}
.ui-code--krotki{max-height:none}
.ui-kod{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;background:var(--ui-bg-2);padding:.1rem .35rem;border-radius:4px;color:var(--ui-ink)}

/* ── Pole hasła z przyciskiem pokaż/ukryj (login, ustaw hasło, reset, formularz użytkownika).
   Rodzic: <div class="ui-pass" x-data="{ show: false }"> + input + @include('partials.ui-pass-btn').
   Własny CSS, bo zamrożony build Tailwinda nie ma .inset-y-0/.pr-10 i przycisk lądował pod polem. ── */
.ui-pass{position:relative;display:block}
.ui-pass>input{padding-right:2.75rem}
.ui-pass__btn{position:absolute;top:0;right:0;bottom:0;width:2.75rem;display:flex;align-items:center;justify-content:center;margin:0;padding:0;border:0;background:transparent;color:var(--ui-faint);cursor:pointer;border-radius:0 var(--ui-r-sm) var(--ui-r-sm) 0;transition:color .15s}
.ui-pass__btn:hover{color:var(--ui-ink)}
.ui-pass__btn:focus{outline:none}
.ui-pass__btn:focus-visible{color:var(--ui-ink);box-shadow:inset 0 0 0 2px var(--ui-line-2)}
.ui-pass__btn[aria-pressed="true"]{color:var(--ui-ink)}
.ui-pass__btn svg{width:20px;height:20px;display:block;pointer-events:none}

/* ══ Tryb ciemny ══════════════════════════════════════════════════════════
   <html data-theme="ciemny"> = ciemny, data-theme="jasny" = jasny, bez atrybutu = jak system.
   Atrybut ustawia skrypt w <head> layoutu (localStorage redai-motyw, potem users.motyw z konta),
   przełącza ui.motyw('auto'|'jasny'|'ciemny') z redai-ui.js. Zasada: komponenty i widoki liczą kolory
   z tokenów --ui-*, więc ciemny to podmiana tokenów; niżej tylko wyjątki (pastelowe odznaki Tailwinda). */
:root[data-theme="ciemny"]{
    --ui-ink:#f1f5f9; --ui-ink-2:#e2e8f0; --ui-text:#cbd5e1; --ui-text-2:#b3c0d1; --ui-muted:#94a3b8; --ui-faint:#6b7a90;
    --ui-line:#263244; --ui-line-2:#38465c; --ui-bg:#0b1220; --ui-bg-2:#172032; --ui-card:#111a2b; --ui-on-ink:#0f172a; --ui-ink-hover:#cbd5e1;
    --ui-red:#ef4444; --ui-red-2:#dc2626; --ui-red-bg:#3a1414; --ui-red-line:#7f1d1d;
    --ui-ok:#22c55e; --ui-ok-bg:#0d261b; --ui-ok-line:#14532d; --ui-ok-text:#86efac;
    --ui-warn:#f59e0b; --ui-warn-bg:#2b2110; --ui-warn-line:#78350f; --ui-warn-text:#fcd34d;
    --ui-info:#3b82f6; --ui-info-bg:#101f3d; --ui-info-line:#1e3a8a; --ui-info-text:#93c5fd;
    --ui-shadow:0 1px 3px rgba(0,0,0,.45); --ui-shadow-lg:0 12px 32px rgba(0,0,0,.55); --ui-overlay:rgba(0,0,0,.6);
    --ui-code-bg:#05080f; --ui-code-ink:#e2e8f0;
    color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="jasny"]){
    --ui-ink:#f1f5f9; --ui-ink-2:#e2e8f0; --ui-text:#cbd5e1; --ui-text-2:#b3c0d1; --ui-muted:#94a3b8; --ui-faint:#6b7a90;
    --ui-line:#263244; --ui-line-2:#38465c; --ui-bg:#0b1220; --ui-bg-2:#172032; --ui-card:#111a2b; --ui-on-ink:#0f172a; --ui-ink-hover:#cbd5e1;
    --ui-red:#ef4444; --ui-red-2:#dc2626; --ui-red-bg:#3a1414; --ui-red-line:#7f1d1d;
    --ui-ok:#22c55e; --ui-ok-bg:#0d261b; --ui-ok-line:#14532d; --ui-ok-text:#86efac;
    --ui-warn:#f59e0b; --ui-warn-bg:#2b2110; --ui-warn-line:#78350f; --ui-warn-text:#fcd34d;
    --ui-info:#3b82f6; --ui-info-bg:#101f3d; --ui-info-line:#1e3a8a; --ui-info-text:#93c5fd;
    --ui-shadow:0 1px 3px rgba(0,0,0,.45); --ui-shadow-lg:0 12px 32px rgba(0,0,0,.55); --ui-overlay:rgba(0,0,0,.6);
    --ui-code-bg:#05080f; --ui-code-ink:#e2e8f0;
    color-scheme:dark;
  }
}
  :root[data-theme="ciemny"] .ui-badge--err,:root[data-theme="ciemny"] .ui-alert--err,:root[data-theme="ciemny"] .ui-link--danger,:root[data-theme="ciemny"] .ui-btn--danger,:root[data-theme="ciemny"] .pw-wpis--blad .pw-wpis-t,:root[data-theme="ciemny"] .pw-row--blad .ui-row-t{color:#fca5a5}
  :root[data-theme="ciemny"] .ui-btn--danger:hover{color:#fecaca}
  :root[data-theme="ciemny"] .text-rose-700,:root[data-theme="ciemny"] .text-rose-600,:root[data-theme="ciemny"] .text-rose-500,:root[data-theme="ciemny"] .hover\:text-rose-700:hover{color:#fca5a5}
  :root[data-theme="ciemny"] .text-amber-700,:root[data-theme="ciemny"] .text-amber-800,:root[data-theme="ciemny"] .text-amber-900{color:#fcd34d}
  :root[data-theme="ciemny"] .text-cyan-600,:root[data-theme="ciemny"] .text-cyan-700{color:#67e8f9}
  :root[data-theme="ciemny"] .text-emerald-700,:root[data-theme="ciemny"] .text-emerald-600{color:#86efac}
  :root[data-theme="ciemny"] .bg-rose-50,:root[data-theme="ciemny"] .bg-rose-100{background-color:#3a1414}
  :root[data-theme="ciemny"] .bg-amber-50,:root[data-theme="ciemny"] .bg-amber-100{background-color:#2b2110}
  :root[data-theme="ciemny"] .bg-emerald-50,:root[data-theme="ciemny"] .bg-emerald-100{background-color:#0d261b}
  :root[data-theme="ciemny"] .border-rose-200{border-color:#7f1d1d}
  :root[data-theme="ciemny"] .border-amber-200{border-color:#78350f}
  :root[data-theme="ciemny"] .border-emerald-200{border-color:#14532d}
  :root[data-theme="ciemny"] .bg-slate-900.hover\:bg-black:hover,:root[data-theme="ciemny"] button.bg-slate-900:hover,:root[data-theme="ciemny"] a.bg-slate-900:hover{background-color:var(--ui-ink-hover)}
  :root[data-theme="ciemny"] .shadow-xl,:root[data-theme="ciemny"] .shadow-lg,:root[data-theme="ciemny"] .shadow-md,:root[data-theme="ciemny"] .shadow-sm,:root[data-theme="ciemny"] .shadow{box-shadow:0 8px 24px rgba(0,0,0,.5)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="jasny"]) .ui-badge--err,:root:not([data-theme="jasny"]) .ui-alert--err,:root:not([data-theme="jasny"]) .ui-link--danger,:root:not([data-theme="jasny"]) .ui-btn--danger,:root:not([data-theme="jasny"]) .pw-wpis--blad .pw-wpis-t,:root:not([data-theme="jasny"]) .pw-row--blad .ui-row-t{color:#fca5a5}
  :root:not([data-theme="jasny"]) .ui-btn--danger:hover{color:#fecaca}
  :root:not([data-theme="jasny"]) .text-rose-700,:root:not([data-theme="jasny"]) .text-rose-600,:root:not([data-theme="jasny"]) .text-rose-500,:root:not([data-theme="jasny"]) .hover\:text-rose-700:hover{color:#fca5a5}
  :root:not([data-theme="jasny"]) .text-amber-700,:root:not([data-theme="jasny"]) .text-amber-800,:root:not([data-theme="jasny"]) .text-amber-900{color:#fcd34d}
  :root:not([data-theme="jasny"]) .text-cyan-600,:root:not([data-theme="jasny"]) .text-cyan-700{color:#67e8f9}
  :root:not([data-theme="jasny"]) .text-emerald-700,:root:not([data-theme="jasny"]) .text-emerald-600{color:#86efac}
  :root:not([data-theme="jasny"]) .bg-rose-50,:root:not([data-theme="jasny"]) .bg-rose-100{background-color:#3a1414}
  :root:not([data-theme="jasny"]) .bg-amber-50,:root:not([data-theme="jasny"]) .bg-amber-100{background-color:#2b2110}
  :root:not([data-theme="jasny"]) .bg-emerald-50,:root:not([data-theme="jasny"]) .bg-emerald-100{background-color:#0d261b}
  :root:not([data-theme="jasny"]) .border-rose-200{border-color:#7f1d1d}
  :root:not([data-theme="jasny"]) .border-amber-200{border-color:#78350f}
  :root:not([data-theme="jasny"]) .border-emerald-200{border-color:#14532d}
  :root:not([data-theme="jasny"]) .bg-slate-900.hover\:bg-black:hover,:root:not([data-theme="jasny"]) button.bg-slate-900:hover,:root:not([data-theme="jasny"]) a.bg-slate-900:hover{background-color:var(--ui-ink-hover)}
  :root:not([data-theme="jasny"]) .shadow-xl,:root:not([data-theme="jasny"]) .shadow-lg,:root:not([data-theme="jasny"]) .shadow-md,:root:not([data-theme="jasny"]) .shadow-sm,:root:not([data-theme="jasny"]) .shadow{box-shadow:0 8px 24px rgba(0,0,0,.5)}
}

/* ── Klasy Tailwinda z widoków → tokeny. W jasnym wartości są identyczne z Tailwindem (zero zmiany),
   w ciemnym idą za tokenami. Plik ładuje się PO buildzie Tailwinda, więc przy równej specyficzności wygrywa. ── */
.bg-white{background-color:var(--ui-card)}
.bg-slate-50{background-color:var(--ui-bg)}
.bg-slate-100{background-color:var(--ui-bg-2)}
.bg-slate-200{background-color:var(--ui-line)}
.bg-slate-900{background-color:var(--ui-ink)}
.bg-slate-900.text-white,.bg-slate-900 .text-white{color:var(--ui-on-ink)}
.hover\:bg-slate-50:hover{background-color:var(--ui-bg)}
.hover\:bg-slate-100:hover{background-color:var(--ui-bg-2)}
.hover\:bg-slate-200:hover{background-color:var(--ui-line)}
.text-slate-900{color:var(--ui-ink)}
.text-slate-800{color:var(--ui-ink-2)}
.text-slate-700{color:var(--ui-text)}
.text-slate-600{color:var(--ui-text-2)}
.text-slate-500{color:var(--ui-muted)}
.text-slate-400{color:var(--ui-faint)}
.text-slate-300{color:var(--ui-line-2)}
.hover\:text-slate-900:hover{color:var(--ui-ink)}
.hover\:text-slate-800:hover{color:var(--ui-ink-2)}
.hover\:text-slate-700:hover{color:var(--ui-text)}
.border-slate-100{border-color:var(--ui-bg-2)}
.border-slate-200{border-color:var(--ui-line)}
.border-slate-300{border-color:var(--ui-line-2)}
.focus\:border-slate-400:focus{border-color:var(--ui-faint)}
.divide-slate-100>:not([hidden])~:not([hidden]){border-color:var(--ui-bg-2)}
.divide-slate-200>:not([hidden])~:not([hidden]){border-color:var(--ui-line)}
.placeholder-slate-400::placeholder{color:var(--ui-faint)}

/* ── Własne style zakładek z hexami (administracja/_css) → tokeny; :root podbija specyficzność,
   bo tamte <style> siedzą w treści strony, czyli za tym plikiem. ── */
:root .fp-name{color:var(--ui-ink)}
:root .fp-note{color:var(--ui-muted)}
:root .adm-taby{border-bottom-color:var(--ui-line)}
:root .adm-tab{color:var(--ui-muted)}
:root .adm-tab:hover{color:var(--ui-ink-2)}
:root .adm-tab.on{color:var(--ui-ink);border-color:var(--ui-ink)}
:root .adm-podtab{color:var(--ui-text-2);border-color:var(--ui-line);background:var(--ui-card)}
:root .adm-podtab:hover{background:var(--ui-bg);color:var(--ui-ink)}
:root .adm-podtab.on{background:var(--ui-ink);color:var(--ui-on-ink);border-color:var(--ui-ink)}
/* Moduł Firma (firma/*, bezpieczenstwo/*) używa słownika ui-* i tokenów bezpośrednio w widokach, bez nadpisań tutaj. */

/* ── Powiadomienia: dzwonek z licznikiem i panel (partials/powiadomienia-dzwonek). Własne klasy,
   bo zamrożony build Tailwinda nie ma min-w-[16px] ani -top-1.5. ── */
.pw-btn{cursor:pointer;text-align:left}
.pw-ikona{position:relative;display:inline-flex;flex:none}
.pw-licznik{position:absolute;top:-7px;right:-9px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--ui-red);color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center;box-sizing:border-box}
.pw-licznik--wiersz{position:static;flex:none;min-width:18px;height:18px;line-height:18px;font-size:11px}
.pw-tlo{position:fixed;inset:0;z-index:50}
.pw-panel{position:fixed;display:flex;flex-direction:column;background:var(--ui-card);border:1px solid var(--ui-line);border-radius:var(--ui-r);box-shadow:var(--ui-shadow-lg);overflow:auto;box-sizing:border-box}
.pw-naglowek{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.6rem .9rem;border-bottom:1px solid var(--ui-line);font-size:13px;color:var(--ui-ink);flex:none}
.pw-naglowek-akcje{display:flex;gap:.75rem;font-size:12px}
.pw-wpis{display:block;width:100%;text-align:left;padding:.6rem .9rem;border:0;border-top:1px solid var(--ui-line);background:none;font:inherit;color:var(--ui-text);cursor:pointer}
.pw-wpis:first-child{border-top:0}
.pw-wpis:hover{background:var(--ui-bg)}
.pw-wpis--blad{background:var(--ui-red-bg)}
.pw-wpis--blad .pw-wpis-t{color:var(--ui-red-2)}
.pw-wpis-t{display:block;font-size:13px;font-weight:600;color:var(--ui-ink)}
.pw-wpis-b{display:block;font-size:12px;color:var(--ui-muted);margin-top:2px;line-height:1.45}
.pw-wpis-k{display:block;font-size:11px;color:var(--ui-faint);margin-top:3px}
.pw-pusto{padding:1.25rem .9rem;text-align:center;font-size:13px;color:var(--ui-muted)}
.pw-stopka{margin-top:auto;padding:.6rem .9rem;border-top:1px solid var(--ui-line);display:flex;flex-direction:column;gap:.4rem;flex:none}
.pw-row--blad .ui-row-t{color:var(--ui-red-2)}

/* Stronicowanie (resources/views/pagination/ui.blade.php, Paginator::defaultView) */
.ui-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.35rem}
.ui-pager-info{width:100%;text-align:center;font-size:12px;color:var(--ui-muted);margin-bottom:.35rem}
.ui-pager .ui-btn--sm{min-width:34px;padding-left:.5rem;padding-right:.5rem}
.ui-pager .ui-btn[aria-disabled]{opacity:.45;pointer-events:none}
.ui-pager-kropki{padding:0 .25rem;color:var(--ui-muted)}

/* Postęp wgrywania plików (panel plików, formularze data-postep): nazwa, Anuluj, pasek, „45% · 120 MB z 260 MB · 3,4 MB/s · zostało…" */
.ui-wgr{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .75rem;padding:.55rem .7rem;border:1px solid var(--ui-line-2);border-radius:var(--ui-r);background:var(--ui-bg-2)}
.ui-wgr-n{flex:1 1 8rem;min-width:0;overflow-wrap:anywhere;font-size:13px;font-weight:600;color:var(--ui-ink)}
.ui-wgr-pas{flex:1 1 100%;height:6px;border-radius:3px;background:var(--ui-line);overflow:hidden}
.ui-wgr-pas i{display:block;height:100%;width:0;background:var(--ui-ink);border-radius:3px;transition:width .2s}
.ui-wgr-o{flex:1 1 100%;font-size:12.5px;color:var(--ui-muted);font-variant-numeric:tabular-nums}
.ui-wgr--dol{position:fixed;left:0;right:0;bottom:0;z-index:80;border-radius:0;border-width:1px 0 0;background:var(--ui-card);padding:.6rem max(1rem,calc((100vw - 1100px)/2)) calc(.6rem + env(safe-area-inset-bottom));box-shadow:var(--ui-shadow-lg)}

/* ===== Plan Dev 09.10.2026 (zaakceptowane): pusty stan z ikoną, szkielet, chipy, segment, form2, zużycie, wykres, szuflada, menu ⋮, kafelki, kod z zakładkami, siatka opcji, lista kroków, paleta, odznaki menu ===== */

/* Pusty stan z ikoną */
.ui-empty-ik{width:44px;height:44px;border-radius:50%;background:var(--ui-bg-2);color:var(--ui-muted);display:flex;align-items:center;justify-content:center;margin:0 auto .75rem}
.ui-empty-ik svg{width:20px;height:20px}

/* Szkielet ładowania */
.ui-skel{display:block;height:12px;border-radius:4px;background:linear-gradient(90deg,var(--ui-bg-2) 25%,var(--ui-line) 37%,var(--ui-bg-2) 63%);background-size:400% 100%;animation:ui-skel 1.4s ease infinite}
.ui-skel--t{height:14px;width:40%}
.ui-skel--o{width:36px;height:36px;border-radius:50%;flex:none}
@keyframes ui-skel{0%{background-position:100% 50%}100%{background-position:0 50%}}

/* Filtry jako chipy */
.ui-chips{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.ui-chip{display:inline-flex;align-items:center;gap:.35rem;height:32px;padding:0 .7rem;font:inherit;font-size:13px;color:var(--ui-text);background:var(--ui-card);border:1px solid var(--ui-line-2);border-radius:999px;cursor:pointer;white-space:nowrap}
.ui-chip b{font-weight:500;color:var(--ui-ink)}
.ui-chip svg{width:14px;height:14px;color:var(--ui-faint)}
.ui-chip:hover{background:var(--ui-bg)}
.ui-chip--on{border-color:var(--ui-ink);background:var(--ui-bg-2)}
.ui-chips .ui-search{flex:1;min-width:200px}
.ui-chips .ui-search .ui-input{height:32px;padding-top:0;padding-bottom:0;border-radius:999px;font-size:13px}
.ui-chips .ui-link{font-size:13px;padding:0 .25rem}

/* Przełącznik segmentowy */
.ui-seg{display:inline-flex;align-self:flex-start;width:max-content;max-width:100%;padding:3px;gap:2px;background:var(--ui-bg-2);border-radius:var(--ui-r);border:1px solid var(--ui-line)}
.ui-seg label{position:relative}
.ui-seg input{position:absolute;opacity:0;width:0;height:0}
.ui-seg span{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .8rem;font-size:13px;font-weight:500;color:var(--ui-muted);border-radius:var(--ui-r-sm);cursor:pointer;white-space:nowrap}
.ui-seg span svg{width:14px;height:14px}
.ui-seg input:checked+span{background:var(--ui-card);color:var(--ui-ink);box-shadow:0 1px 2px rgba(15,23,42,.12)}

/* Formularz dwukolumnowy: opis z lewej, pola z prawej */
.ui-form2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:2rem;padding:1.5rem 0;border-top:1px solid var(--ui-line)}
.ui-form2:first-child{border-top:0;padding-top:0}
.ui-form2-t{font-size:14px;font-weight:600;color:var(--ui-ink);margin:0}
.ui-form2-d{font-size:13px;color:var(--ui-muted);margin:.3rem 0 0;line-height:1.5}
.ui-form2-p{display:flex;flex-direction:column;gap:1rem;min-width:0}
@media (max-width:767px){.ui-form2{grid-template-columns:1fr;gap:.75rem}}

/* Paski zużycia */
.ui-usage{display:flex;flex-direction:column;gap:1rem}
.ui-usage-r{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35rem .75rem;align-items:baseline}
.ui-usage-l{font-size:14px;color:var(--ui-ink);font-weight:500}
.ui-usage-v{font-size:13px;color:var(--ui-muted);font-variant-numeric:tabular-nums}
.ui-usage-bar{grid-column:1/-1;height:6px;border-radius:999px;background:var(--ui-bg-2);overflow:hidden}
.ui-usage-bar i{display:block;height:100%;border-radius:inherit;background:var(--ui-ink)}
.ui-usage-bar--warn i{background:var(--ui-warn)}
.ui-usage-bar--err i{background:var(--ui-red)}

/* Karta wykresu */
.ui-chart{display:flex;flex-direction:column;gap:.75rem}
.ui-chart-v{font-size:22px;font-weight:600;color:var(--ui-ink);font-variant-numeric:tabular-nums}
.ui-chart-plot{height:160px;display:flex;align-items:flex-end;gap:6px;padding:0 0 .25rem;border-bottom:1px solid var(--ui-line);background:repeating-linear-gradient(to top,transparent 0 39px,var(--ui-line) 39px 40px)}
.ui-chart-plot i{flex:1;background:var(--ui-ink);border-radius:3px 3px 0 0;min-height:2px}
.ui-chart-plot i.dzis{background:var(--ui-red)}
.ui-chart-os{display:flex;justify-content:space-between;font-size:11px;color:var(--ui-faint)}
.ui-chart-pusto{height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;color:var(--ui-muted);font-size:13px;border:1px dashed var(--ui-line-2);border-radius:var(--ui-r-sm)}
.ui-chart-pusto svg{width:20px;height:20px;color:var(--ui-faint)}

/* Szuflada boczna */
.ui-drawer{position:fixed;top:0;right:0;bottom:0;width:min(480px,100vw);background:var(--ui-card);box-shadow:var(--ui-shadow-lg);border-left:1px solid var(--ui-line);display:flex;flex-direction:column;z-index:61}
.ui-drawer-h{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;border-bottom:1px solid var(--ui-line)}
.ui-drawer-h .ui-card-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-drawer-b{flex:1;overflow:auto;padding:1.25rem;display:flex;flex-direction:column;gap:1.25rem}
.ui-drawer .ui-table{min-width:0}
.ui-drawer-f{padding:.85rem 1.25rem;border-top:1px solid var(--ui-line);display:flex;gap:.5rem;justify-content:flex-end}

/* Menu ⋮ */
.ui-menu{position:absolute;z-index:50;min-width:200px;background:var(--ui-card);border:1px solid var(--ui-line);border-radius:var(--ui-r);box-shadow:var(--ui-shadow-lg);padding:4px}
.ui-menu button,.ui-menu a{display:flex;width:100%;align-items:center;gap:.6rem;padding:.45rem .65rem;font:inherit;font-size:13px;color:var(--ui-text);background:none;border:0;border-radius:var(--ui-r-sm);text-align:left;text-decoration:none;cursor:pointer}
.ui-menu button:hover,.ui-menu a:hover,.ui-menu .akt{background:var(--ui-bg-2);color:var(--ui-ink)}
.ui-menu svg{width:15px;height:15px;color:var(--ui-muted)}
.ui-menu hr{border:0;border-top:1px solid var(--ui-line);margin:4px 0}
.ui-menu .ui-menu-red,.ui-menu .ui-menu-red svg{color:var(--ui-red)}

/* Kafelki szablonów / wyboru */
.ui-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(var(--ui-tiles-min,220px),100%),1fr));gap:.75rem}
.ui-tile{display:flex;flex-direction:column;gap:.5rem;padding:1rem;background:var(--ui-card);border:1px solid var(--ui-line);border-radius:var(--ui-r);text-align:left;font:inherit;color:inherit;cursor:pointer;transition:.15s;min-width:0}
.ui-tile:hover{border-color:var(--ui-line-2);box-shadow:var(--ui-shadow)}
.ui-tile--on{border-color:var(--ui-ink);box-shadow:0 0 0 1px var(--ui-ink)}
.ui-tile-t{font-size:14px;font-weight:600;color:var(--ui-ink)}
.ui-tile-d{font-size:13px;color:var(--ui-muted);line-height:1.45}
.ui-tile-f{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:auto;padding-top:.25rem}
.ui-tile-pod{height:96px;border-radius:var(--ui-r-sm);background:var(--ui-bg);border:1px solid var(--ui-line);padding:8px;display:flex;flex-direction:column;gap:5px;overflow:hidden}
.ui-tile-pod i{display:block;height:7px;border-radius:2px;background:var(--ui-line-2)}

/* Blok kodu z zakładkami */
.ui-codebox{border-radius:var(--ui-r);overflow:hidden;background:var(--ui-code-bg)}
.ui-codebox-h{display:flex;align-items:center;gap:.25rem;padding:.35rem .5rem;border-bottom:1px solid rgba(255,255,255,.08)}
.ui-codebox-h button{font:inherit;font-size:12px;padding:.3rem .65rem;border:0;border-radius:var(--ui-r-sm);background:none;color:#94a3b8;cursor:pointer;display:inline-flex;align-items:center;gap:.35rem}
.ui-codebox-h button.on{background:rgba(255,255,255,.08);color:#fff}
.ui-codebox-h .sp{flex:1}
.ui-codebox .ui-code{border-radius:0;max-height:none}

/* Siatka opcji w oknie (wybór z wielu) */
.ui-wybor{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;max-height:300px;overflow:auto;margin-top:.75rem}
.ui-wybor button{display:flex;align-items:center;gap:.6rem;padding:.55rem .65rem;font:inherit;font-size:13px;color:var(--ui-text);background:none;border:0;border-radius:var(--ui-r-sm);text-align:left;cursor:pointer}
.ui-wybor button:hover{background:var(--ui-bg-2)}
.ui-wybor button.on{background:var(--ui-bg-2);color:var(--ui-ink);font-weight:500}
.ui-wybor button.on::after{content:"";margin-left:auto;width:14px;height:14px;background:var(--ui-ink);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}
.ui-wybor svg{width:16px;height:16px;color:var(--ui-muted);flex:none}
.ui-wybor small{display:block;font-size:12px;color:var(--ui-faint)}

/* Okno „najpierw to”: lista kroków z odhaczeniem */
.ui-todo{list-style:none;margin:.75rem 0 0;padding:0;display:flex;flex-direction:column;gap:.6rem}
.ui-todo li{display:flex;gap:.6rem;font-size:14px;color:var(--ui-text);line-height:1.45}
.ui-todo li::before{content:"";flex:none;width:18px;height:18px;margin-top:1px;border-radius:50%;border:1.5px solid var(--ui-line-2)}
.ui-todo li.ok::before{border-color:var(--ui-ok);background:var(--ui-ok) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat}
.ui-todo li.ok{color:var(--ui-muted)}

/* Paleta Ctrl K */
.ui-paleta{width:100%;max-width:620px;background:var(--ui-card);border-radius:12px;box-shadow:0 20px 50px rgba(15,23,42,.25);overflow:hidden;align-self:flex-start;margin-top:10vh}
.ui-paleta-in{display:flex;align-items:center;gap:.6rem;padding:.85rem 1rem;border-bottom:1px solid var(--ui-line)}
.ui-paleta-in svg{width:18px;height:18px;color:var(--ui-faint)}
.ui-paleta-in input{flex:1;border:0;outline:0;font:inherit;font-size:15px;color:var(--ui-ink);background:none}
.ui-paleta-lista{max-height:360px;overflow:auto;padding:6px}
.ui-paleta-g{font-size:11px;font-weight:600;color:var(--ui-faint);text-transform:uppercase;letter-spacing:.04em;padding:.6rem .65rem .3rem}
.ui-paleta-lista button{display:flex;width:100%;align-items:center;gap:.65rem;padding:.5rem .65rem;font:inherit;font-size:14px;color:var(--ui-text);background:none;border:0;border-radius:var(--ui-r-sm);text-align:left;cursor:pointer}
.ui-paleta-lista button svg{width:16px;height:16px;color:var(--ui-muted)}
.ui-paleta-lista button small{margin-left:auto;font-size:12px;color:var(--ui-faint)}
.ui-paleta-lista button.akt{background:var(--ui-bg-2);color:var(--ui-ink)}
.ui-paleta-stopka{display:flex;gap:1rem;padding:.55rem 1rem;border-top:1px solid var(--ui-line);font-size:12px;color:var(--ui-muted);background:var(--ui-bg)}

/* Odznaka w menu bocznym */
.ui-nowe{margin-left:auto;font-size:10.5px;font-weight:600;padding:.05rem .45rem;border-radius:999px;background:var(--ui-red-bg);color:var(--ui-red-2);line-height:1.6}
.ui-nowe--beta{background:var(--ui-info-bg);color:var(--ui-info-text)}

/* Ikona-kafelek w kolorze kategorii (rozszerzenie .ui-ic) */
.ui-ic[data-kat="sprzedaz"]{background:var(--ui-warn-bg);color:var(--ui-warn-text)}
.ui-ic[data-kat="dokumenty"]{color:var(--ui-info-text)}
.ui-ic[data-kat="komunikacja"]{color:var(--ui-ok-text)}
.ui-ic[data-kat="rejestry"]{color:var(--ui-red-2)}

/* Stany i drobiazgi */
.ui-chip .x{display:inline-flex;margin-right:-.25rem;padding:2px;border-radius:50%}
.ui-chip .x:hover{background:var(--ui-line)}
.ui-chip .x:hover svg{color:var(--ui-ink)}
.ui-chip:focus-visible,.ui-tile:focus-visible,.ui-menu button:focus-visible,.ui-wybor button:focus-visible{outline:2px solid var(--ui-ink);outline-offset:1px}
.ui-menu button:focus{background:var(--ui-bg-2);color:var(--ui-ink);outline:0}
.ui-chart-plot i{position:relative;cursor:default}
.ui-chart-plot i.brak{background:none;border:1px dashed var(--ui-line-2);border-bottom:0;height:100%!important;opacity:.7}
.ui-chart-plot i:hover{opacity:.8}
.ui-chart-tip{position:absolute;z-index:5;pointer-events:none;background:var(--ui-ink);color:var(--ui-card);font-size:12px;padding:4px 8px;border-radius:4px;white-space:nowrap;transform:translate(-50%,-100%);margin-top:-6px}
.ui-chart-leg{display:flex;flex-wrap:wrap;gap:.25rem 1rem;font-size:12px;color:var(--ui-muted);margin-top:.5rem}
.ui-chart-leg i{display:inline-block;width:10px;height:10px;border-radius:2px;background:var(--ui-ink);margin-right:.35rem;vertical-align:-1px}
.ui-chart-leg i.brak{background:none;border:1px dashed var(--ui-line-2)}
.ui-drawer-tlo{position:fixed;inset:0;background:var(--ui-overlay);z-index:60}
.ui-drawer{transition:transform .2s ease}
.ui-drawer[hidden]{display:flex;transform:translateX(105%);visibility:hidden}
.ui-row--akt{background:var(--ui-bg-2)}
.ui-paleta-lista mark{background:none;color:var(--ui-ink);font-weight:600}
.ui-paleta-pusto{padding:1.5rem;text-align:center;color:var(--ui-muted);font-size:14px}
.ui-wybor-pusto{grid-column:1/-1;padding:1.5rem;text-align:center;color:var(--ui-muted);font-size:13px}
.ui-todo li{cursor:default}
.ui-todo--klik li{cursor:pointer}
.ui-tile-pod i{flex:none}
.ui-seg input:focus-visible+span{outline:2px solid var(--ui-ink);outline-offset:1px}
.ui-rows mark,.ui-table mark{background:rgba(250,204,21,.35);color:inherit;border-radius:2px}
.ui-usage-bar--brak{background:repeating-linear-gradient(45deg,var(--ui-bg-2) 0 6px,var(--ui-line) 6px 12px)}
.ui-usage-bar--brak i{display:none}
.ui-usage-v.brak{color:var(--ui-faint);font-style:italic}
/* Szukajka w menu chipa (długie listy, np. wybór osoby) */
.ui-menu-szukaj{padding:4px 4px 6px;border-bottom:1px solid var(--ui-line);margin-bottom:4px}
.ui-menu-szukaj input{width:100%;box-sizing:border-box;height:30px;padding:0 .6rem;font:inherit;font-size:13px;color:var(--ui-ink);background:var(--ui-bg);border:1px solid var(--ui-line-2);border-radius:var(--ui-r-sm);outline:0}
.ui-menu-szukaj input:focus{border-color:var(--ui-ink)}
.ui-menu-lista{max-height:280px;overflow:auto}
.ui-menu-pusto{padding:.6rem .65rem;font-size:13px;color:var(--ui-muted)}
.ui-menu-wiecej{padding:.35rem .65rem;font-size:12px;color:var(--ui-faint)}
.ui-menu button[aria-checked="true"]{font-weight:600;color:var(--ui-ink)}
.ui-menu button[aria-checked="true"]::after{content:"";margin-left:auto;width:14px;height:14px;flex:none;background:var(--ui-ink);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}
@media (max-width:640px){
  .ui-wybor{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ui-drawer-f{flex-wrap:wrap}
  .ui-paleta{margin-top:0;border-radius:0;max-width:none;min-height:100%}
  .ui-chips .ui-search{min-width:100%}
}
/* Wybór pliku po polsku: <label class="ui-plik"><input type="file"><span class="ui-btn ui-btn--sm">Wybierzcie plik</span><span class="ui-plik-n">Nie wybrano pliku</span></label>
   Nazwę wybranego pliku wpisuje redai-ui.js. Upuszczenie pliku na pole też działa (input leży pod spodem na całej powierzchni). */
.ui-plik{position:relative;display:flex;align-items:center;gap:.6rem;min-width:0;padding:.45rem .55rem;border:1px dashed var(--ui-line-2);border-radius:var(--ui-r-sm);background:var(--ui-card);cursor:pointer}
.ui-plik input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.ui-plik .ui-btn{pointer-events:none;flex:none}
.ui-plik-n{min-width:0;font-size:13px;color:var(--ui-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-plik.ma .ui-plik-n{color:var(--ui-text)}
.ui-plik:hover,.ui-plik.nad{border-color:var(--ui-ink)}
.ui-plik:focus-within{outline:2px solid var(--ui-ink);outline-offset:2px}