/* =====================================================================
   EKRANY PRACOWNIKA OD 768 px - rysunek wlasciciela 19.10
   (`BLOK-2-PROFIL/BLOK-2-LAPTOP-PLANSZET-2026-10-19.html`, spis "Работник":
   laptop 1440, planszet 820). Telefon (<768) tego nie widzi - klasy `el-*`
   ponizej 768 nic nie zmieniaja, a nowe kawalki (`.el-ph`, `.el-podgl`,
   `.el-bok`) sa schowane.

   Jedna kompozycja na kazdym laptopie: kazdy wymiar to calc(var(--u) * N),
   N = piksele rysunku / 16; --u = clamp(11.4px, 100vw/90, 26px) od 1024
   (1440 -> 16 px), na planszecie clamp(15px, 100vw/51.25, 20px). Boki jak
   na rysunku: 56 px przy 1440 (3.5u), tresc najwyzej 83u na srodku.

   Wzory z rysunku: naglowek strony (nadpis + duzy tytul, guzik z prawej),
   formularz = karta z polami w dwoch kolumnach + z boku "Dobrze wiedziec"
   albo zywy podglad; listy = szerokie rzedy albo siatka; male zadanie =
   okno na srodku. Przedrostek `el-`; arkusz stoi tylko na tych ekranach
   (@pushOnce 'arkusze', partial parts.el._arkusz).
===================================================================== */

.el-ph,.el-podgl,.el-bok,.el-nav,.el-anuluj,.dp-lista{display:none}
/* Owijki kolumn na telefonie nie istnieja - kolejnosc i wyglad jak dotad. */
@media (max-width:767px){.el-sp,.el-l,.el-r,.el-karta,.nz-kol1,.nz-kol2{display:contents}}

@media (min-width:768px){
  .el{
    --u:clamp(15px,calc(100vw / 51.25),20px);
    --el-bok:calc(var(--u) * 2);
    --el-k:#121214;--el-k2:#17171B;--el-l:#26252A;--el-t:#F2EEE6;--el-t2:#CFCAC0;--el-m:#8F897E;--el-zt:#E0B84C;
    --el-zie:#6FCF8E;--el-zieb:rgba(111,207,142,.12);
    max-width:none !important;width:100%;margin:0 !important;
    padding:calc(var(--u) * 1.75) var(--el-bok) calc(var(--u) * 2.5) !important;
    box-sizing:border-box;
  }
  :root[data-theme="light"] .el{--el-k:#FFFFFF;--el-k2:#F9F7F2;--el-l:#E2DCCF;--el-t:#1E1B16;--el-t2:#3F3A33;--el-m:#6F695F;--el-zt:#9A7616;
    --el-zie:#23663F;--el-zieb:rgba(46,139,87,.10)}

  /* ---- naglowek strony: nadpis + tytul, guziki z prawej (rysunek .ph) ---- */
  .el .e2-pasek,.el .ne-pasek,.el .el-dol{display:none}
  .el-ph{display:flex;align-items:flex-end;justify-content:space-between;gap:calc(var(--u) * 1.25);margin:0 0 calc(var(--u) * 1.625)}
  .el-ph>div:first-child{min-width:0}
  .el-nad{margin:0;font-size:max(11px,calc(var(--u) * .72));letter-spacing:.2em;text-transform:uppercase;font-weight:800;color:var(--el-m);white-space:nowrap}
  .el .el-h1{margin:calc(var(--u) * .375) 0 0;font-size:calc(var(--u) * 2);line-height:1.05;font-weight:800;letter-spacing:-.03em;color:var(--el-t);
    overflow-wrap:anywhere}
  .el-ph-a{flex:none;display:flex;gap:calc(var(--u) * .625);align-items:center}

  /* ---- dwie kolumny: tresc + bok (rysunek .sp) ---- */
  /* Kolumny strony na OPLYWANIU (float), nie na siatce: dwie kolumny strony
     maja rozna wysokosc (jak na rysunku), a pomiar wygladu #7 czyta kazda
     siatke/flex jako rzad i kaze jej dzieciom miec rowna wysokosc - to regula
     dla rzedu guzikow, nie dla kolumn strony. Proporcje: --el-a : --el-b. */
  .el-sp{display:flow-root;--el-a:1.4;--el-b:1;--el-g:calc(var(--u) * 1.5)}
  .el-sp.rowno{--el-a:1;--el-b:1}
  .el-sp>.el-l{float:left;width:calc((100% - var(--el-g)) * var(--el-a) / (var(--el-a) + var(--el-b)))}
  .el-sp>.el-r{float:right;width:calc((100% - var(--el-g)) * var(--el-b) / (var(--el-a) + var(--el-b)))}
  .el-sp>.el-l,.el-sp>.el-r{box-sizing:border-box;min-width:0}

  /* ---- guziki naglowka (rysunek .b / .b.z) ---- */
  .el-b{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 calc(var(--u) * 1.125);border-radius:12px;
    border:1px solid var(--el-l);background:var(--el-k);color:var(--el-t);font:800 14px/1 Manrope,system-ui,sans-serif;white-space:nowrap;text-decoration:none;cursor:pointer}
  .el-b.z{border:0;background:linear-gradient(135deg,#F6E39A,#D2AA42 55%,#A8801C);color:#1A1306;box-shadow:0 8px 22px rgba(217,182,74,.2)}
  .el-b:focus-visible{outline:2px solid var(--el-zt);outline-offset:2px}

  /* ---- spis dzialow z lewej (rysunek w_cv_edycja, w_powiad) ---- */
  .el-sp-nav>.el-nav{float:left;width:calc(var(--u) * 11.25);margin-right:var(--el-g)}
  .el-sp-nav>.el-nav+*{display:flow-root}
  .el-nav{display:flex;flex-direction:column;gap:4px}
  .el-nav a{display:block;padding:calc(var(--u) * .6) calc(var(--u) * .75);border-radius:10px;border:1px solid transparent;
    font-size:max(13px,calc(var(--u) * .875));font-weight:800;color:var(--el-t2);text-decoration:none;overflow-wrap:anywhere}
  .el-nav a:hover,.el-nav a.on{background:var(--el-k);border-color:var(--el-l);color:var(--el-t)}
  .el-nav a:focus-visible{outline:2px solid var(--el-zt);outline-offset:2px}

  /* Prawa kolumna pierwsza w kodzie (telefon czyta ja pierwsza), na laptopie z prawej. */

  /* ---- "Dobrze wiedziec" z boku ---- */
  .el-bok{display:block;background:var(--el-k);border:1px solid var(--el-l);border-radius:16px;padding:calc(var(--u) * 1.375)}
  .el-bok h2{margin:0 0 calc(var(--u) * .5);font-size:calc(var(--u) * 1);font-weight:800;color:var(--el-t)}
  .el-bok p{margin:0;font-size:max(13px,calc(var(--u) * .84));line-height:1.55;font-weight:600;color:var(--el-m)}
  .el-bok p+p{margin-top:calc(var(--u) * .625)}

  /* ---- karta podgladu (okladka, kwadratowy awatar, imie, zawod, chip, o mnie) ---- */
  .el-karta{background:var(--el-k);border:1px solid var(--el-l);border-radius:16px;overflow:hidden}
  .el-podgl{display:block;padding:calc(var(--u) * .75) calc(var(--u) * 1.375) calc(var(--u) * 1.375)}
  .el-podgl-i{margin:0;font-size:calc(var(--u) * 1.375);font-weight:800;letter-spacing:-.02em;line-height:1.2;color:var(--el-t);overflow-wrap:anywhere}
  .el-podgl-p{margin:calc(var(--u) * .375) 0 0;font-size:max(13px,calc(var(--u) * .875));font-weight:700;color:var(--el-t2);overflow-wrap:anywhere}
  .el-podgl-p b{color:var(--el-zt);font-weight:800}
  .el-podgl-c{display:flex;flex-wrap:wrap;gap:calc(var(--u) * .5);margin-top:calc(var(--u) * .75)}
  .el-ch{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 11px;border-radius:999px;font-size:12.5px;font-weight:700;white-space:nowrap;
    color:var(--el-zie);background:var(--el-zieb)}
  .el-ch::before{content:"";width:7px;height:7px;border-radius:4px;background:currentColor}
  .el-podgl-o{margin:calc(var(--u) * .75) 0 0;font-size:max(13px,calc(var(--u) * .84));line-height:1.55;font-weight:600;color:var(--el-m);
    white-space:pre-line;overflow-wrap:anywhere}
  .el-pod-karta{margin:calc(var(--u) * .625) 0 0;font-size:max(12px,calc(var(--u) * .78));font-weight:700;color:var(--el-m)}

  /* =================== EDYTUJ PROFIL (rysunek w_edycja) =================== */
  /* Lewa kolumna: formularz, pola dwojkami; prawa: zywy podglad karty -
     okladka i awatar z guzikami zmiany (te same formularze, co na telefonie). */
  .el-edycja .el-sp{--el-a:1.5}
  .el-edycja .e2-pola{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:calc(var(--u) * 1);padding:0}
  .el-edycja .e2-pola>*{min-width:0}
  .el-edycja .e2-pola>#zawod,.el-edycja .e2-pola>#o-mnie,.el-edycja .e2-pola>[data-miasto-woj-pole]{grid-column:1 / -1}
  .el-edycja .e2-sek,.el-edycja .e2-guziki{padding-left:0;padding-right:0}
  .el-edycja .e2-guziki{flex-direction:row;gap:calc(var(--u) * .625)}
  .el-edycja .e2-guziki>*{width:auto;min-width:calc(var(--u) * 9);padding-left:calc(var(--u) * 1.25);padding-right:calc(var(--u) * 1.25)}
  .el-edycja .el-karta .e2-okl,.el-edycja .el-karta .e2-okl img,.el-edycja .el-karta .e2-okl video{height:calc(var(--u) * 7.5)}
  .el-edycja .el-karta .e2-ja{padding:0 calc(var(--u) * 1.375);margin-top:calc(var(--u) * -3.5)}
  .el-edycja .el-karta .e2-ava,.el-edycja .el-karta .e2-ava-o{width:calc(var(--u) * 5);height:calc(var(--u) * 5)}
  .el-edycja .el-karta .e2-ava-o{border:2px solid var(--el-zt);border-radius:16px}
  .el-edycja .el-r>.e2-sek{padding:calc(var(--u) * .75) 0 0}
  .el-edycja .el-l>.e2-sek:last-child{padding-top:calc(var(--u) * 1.75)}
  .el-edycja .e2-bloki{padding-left:0;padding-right:0;margin-top:calc(var(--u) * 1.5)}

  /* =================== CZEGO SZUKAM (rysunek w_czego) =================== */
  .el-czego .e2-arkusz{margin:0;border:1px solid var(--el-l);border-radius:16px;padding:calc(var(--u) * 1.375)}
  /* =================== WYGLAD CV (rysunek w_cv_wyglad) =================== */
  .el-cvw .ne-lead{margin:0 0 calc(var(--u) * 1.25)}
  .el-cvw .ne-wzory{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:calc(var(--u) * 1)}
  .el-cvw .ne-wzor{flex-direction:column;align-items:stretch;margin:0;padding:calc(var(--u) * .625);border-radius:16px}
  .el-cvw .ne-wzor-kart{width:230px;height:325px;align-self:center;border-radius:8px}
  .el-cvw .ne-wzor-kart iframe{transform:scale(.28967)}
  .el-cvw .ne-wzor-ok{position:absolute;right:calc(var(--u) * .875);bottom:calc(var(--u) * .875)}
  .el-cvw .ne-wzor-t{padding:0 calc(var(--u) * 2) calc(var(--u) * .25) calc(var(--u) * .25)}

  /* =================== CV OCZAMI FIRMY /p/{slug}/cv (rysunek w_cv_firma) =================== */
  .el-cvwid .el-sp{--el-a:1.6}
  .el-cvwid .e2-cvw-g>*{flex:none;min-height:44px}
  .el-cvwid .e2-cvw-uw,.el-cvwid .e2-cvw-h,.el-cvwid .e2-cvw-sh,.el-cvwid .e2-cvw-k,.el-cvwid .e2-cvw-chipy2,.el-cvwid .e2-cvw-zdj{margin-left:0;margin-right:0}
  .el-cvwid .e2-cvw-chipy2{padding:0}
  .el-cvwid .el-r>:first-child,.el-cvwid .el-l>.e2-cvw-sh:first-child{margin-top:0}
  .el-cvwid .e2-cvw-g{flex-direction:column}

  /* =================== EDYCJA CV (rysunek w_cv_edycja) =================== */
  .el-cvedycja .e2-cvk{padding:0}
  .el-cvedycja .e2-cvk>.e2-cvk-nad:first-of-type{margin-top:0}
  .el-cvedycja .e2-cvk-nad{scroll-margin-top:calc(var(--u) * 6)}
  .el-czego .e2-uchwyt,.el-czego .e2-cz-info{display:none}
}

/* Planszet: pola zostaja dwojkami, podglad w wezszej kolumnie. */
@media (min-width:768px) and (max-width:1023px){
  .el-edycja .el-sp{--el-g:calc(var(--u) * 1.25)}
}

/* ---- LAPTOP od 1024: liczby wprost z rysunku 1440 ---- */
@media (min-width:1024px){
  .el{--u:clamp(11.4px,calc(100vw / 90),26px);--el-bok:max(calc(var(--u) * 3.5),calc((100% - var(--u) * 83) / 2));
    padding-top:calc(var(--u) * 2.5) !important;padding-bottom:calc(var(--u) * 3) !important}
  .el .el-h1{font-size:calc(var(--u) * 2.5)}
}

/* =================== WIZYTOWKA /konto/wizytowka (rysunek w_wiz) =================== */
@media (min-width:768px){
  .el-wiz .e2-sek,.el-wiz .e2-wz-guziki{padding-left:0;padding-right:0}
  .el-wiz .el-l>.e2-sek:first-child,.el-wiz .el-r>.e2-wz-guziki{padding-top:0}
}

/* =================== KARTA CZLOWIEKA (parts/el/_karta) =================== */
.el-kc-tylko{display:none}
@media (min-width:768px){
  .el-kc-tylko{display:block}
  .el-kc{position:relative}
  .el-kc-okl{position:relative;height:calc(var(--u) * 7.5);overflow:hidden;background:linear-gradient(165deg,#2A2318 0%,#100E0B 55%,#08080A 100%)}
  .el-kc-okl img{display:block;width:100%;height:100%;object-fit:cover}
  .el-kc-ava{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:calc(var(--u) * 5);height:calc(var(--u) * 5);
    margin:calc(var(--u) * -3.5) calc(var(--u) * 1.375) 0;border-radius:16px;border:2px solid var(--el-zt);overflow:hidden;
    background:linear-gradient(150deg,#2A2416 0%,#14130F 100%);color:var(--el-zt);font-weight:800;font-size:calc(var(--u) * 1.5)}
  .el-kc-ava img{width:100%;height:100%;object-fit:cover;display:block}
}

/* =================== UZUPELNIJ WIZYTOWKE (rysunek w_wiz_uzup) =================== */
@media (min-width:768px){
  .el .el-tel{display:none}
  .el-wized>.el-sp>.el-l>.sub{margin-top:0}
}

/* =================== WIZYTOWKA PUBLICZNA /w/{kod} (rysunek w_wiz_pub) =================== */
/* Karta na srodku (560 px przy 1440 = 35u), okladka na gorze, tresc do lewej. */
@media (min-width:768px){
  .el-wpub{--u:clamp(15px,calc(100vw / 51.25),20px);--el-zt:#E0B84C;max-width:calc(var(--u) * 30);padding-top:calc(var(--u) * 1.5)}
  :root[data-theme="light"] .el-wpub{--el-zt:#9A7616}
  .el-wpub .ne-wiz{padding:0 0 calc(var(--u) * 1.375);text-align:left;overflow:hidden;border-radius:16px}
  .el-wpub .ne-wiz>:not(.el-kc-okl){margin-left:calc(var(--u) * 1.375);margin-right:calc(var(--u) * 1.375)}
  .el-wpub .ne-wiz-aw{position:relative;z-index:1;width:calc(var(--u) * 5);height:calc(var(--u) * 5);margin-top:calc(var(--u) * -3.5);border-radius:16px;border:2px solid var(--el-zt)}
  .el-wpub .ne-wiz-imie{font-size:calc(var(--u) * 1.375)}
}
@media (min-width:1024px){
  .el-wpub{--u:clamp(11.4px,calc(100vw / 90),26px);max-width:calc(var(--u) * 35)}
}

/* =================== KTO OGLADAL (rysunek w_kto) =================== */
@media (min-width:768px){
  .el-kto .e2-kt-g{display:none}
  .el-kto .el-sp-kto{--el-a:1;--el-b:1.4}
  .el-kto .e2-kt-h,.el-kto .e2-kt-f,.el-kto .e2-kt-lu,.el-kto .e2-kt-info,.el-kto .e2-kt-pusto,.el-kto .e2-kt-pusty{margin-left:0;margin-right:0}
  .el-kto .e2-kt-nad{margin-left:4px;margin-right:4px}
  .el-kto .el-l>.e2-kt-h,.el-kto .el-r>.e2-kt-nad:first-child{margin-top:0}
  .el-kto>.e2-kt-gz{margin:0 0 calc(var(--u) * 1)}
}

/* =================== WPISY OSOBY /p/{slug}/wpisy (rysunek w_wpisy) =================== */
@media (min-width:768px){
  .el-ph-ja{display:flex;align-items:center;gap:calc(var(--u) * 1);min-width:0}
  .el-ph-ja>div{min-width:0}
  .el-ph-ava{flex:none;display:flex;align-items:center;justify-content:center;width:calc(var(--u) * 3.5);height:calc(var(--u) * 3.5);border-radius:12px;overflow:hidden;
    background:var(--el-k);border:1px solid var(--el-l);color:var(--el-zt);font-weight:800}
  .el-ph-ava img{width:100%;height:100%;object-fit:cover;display:block}
  .el-wpisy .el-nad{white-space:normal;overflow-wrap:anywhere}
  .el-wpisy .ne-chipy{margin:0 0 calc(var(--u) * 1)}
  .el-wpisy .ne-wpisy-siatka{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--u) * .875);align-items:stretch;margin-top:0}
  .el-wpisy .ne-wpisy-siatka .ne-wpis{margin-top:0;display:flex;flex-direction:column}
  .el-wpisy .ne-wpisy-siatka .ne-wpis-obr{height:auto;aspect-ratio:16 / 10}
  .el-wpisy .ne-wpis-b{display:block;flex:1}
}
@media (min-width:1024px){
  .el-wpisy .ne-wpisy-siatka{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* =================== ZNAJOMI /konto/znajomi (rysunek w_znajomi) =================== */
/* Telefon: okno jak w wiadomosciach (decyzja wlasciciela). Od 768 px strona
   przewija sie cala, a ludzie stoja kartami: zdjecie, imie, fach, dzialanie.
   Prosby DO MNIE - szerokie rzedy na cala szerokosc, na gorze (kolejnosc
   liczy ZnajomosciController). */
@media (min-width:768px){
  body.tryb-okno:has(.el-znaj){height:auto;min-height:100vh;overflow:visible}
  .el-znaj{--u:clamp(15px,calc(100vw / 51.25),20px);--el-bok:calc(var(--u) * 2);
    --el-k:#121214;--el-l:#26252A;--el-t:#F2EEE6;--el-m:#8F897E;--el-zt:#E0B84C;
    flex:1 0 auto;padding:calc(var(--u) * 1.75) var(--el-bok) calc(var(--u) * 2.5);box-sizing:border-box}
  :root[data-theme="light"] .el-znaj{--el-k:#FFFFFF;--el-l:#E2DCCF;--el-t:#1E1B16;--el-m:#6F695F;--el-zt:#9A7616}
  .el-znaj .wm-pas,.el-znaj .wm-ramka{max-width:none;padding-left:0;padding-right:0}
  .el-znaj .wm-tyt{display:none}
  .el-znaj .el-ph{margin-bottom:calc(var(--u) * 1)}
  .el-znaj .el-h1{margin:calc(var(--u) * .375) 0 0;font-size:calc(var(--u) * 2);line-height:1.05;font-weight:800;letter-spacing:-.03em;color:var(--el-t)}
  .el-znaj .wm-szuk{max-width:calc(var(--u) * 26);border-radius:12px}
  .el-znaj .wm-sito{border-radius:10px}
  .el-znaj .wm-ramka{border:0;background:none;overflow:visible;margin-top:calc(var(--u) * .5)}
  .el-znaj .wm-lista{overflow:visible;display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(var(--u) * 12.5),1fr));gap:calc(var(--u) * .875);align-content:start}
  .el-znaj .wr{flex-direction:column;align-items:center;text-align:center;gap:calc(var(--u) * .5);padding:calc(var(--u) * 1.125);
    border:1px solid var(--el-l);border-radius:14px;background:var(--el-k)}
  .el-znaj .wr:last-of-type{border-bottom:1px solid var(--el-l)}
  .el-znaj .wr[hidden]{display:none}
  .el-znaj .wr .wr-av{flex:none;width:calc(var(--u) * 4);height:calc(var(--u) * 4)}
  .el-znaj .wr .wr-t{width:100%;align-items:center}
  .el-znaj .wr .wr-gora{flex-direction:column;align-items:center;gap:2px;max-width:100%}
  .el-znaj .wr .wr-kto{max-width:100%}
  .el-znaj .wr.znaj-prosba{grid-column:1 / -1;flex-direction:row;text-align:left;align-items:center}
  .el-znaj .wr.znaj-prosba .wr-av{width:calc(var(--u) * 3);height:calc(var(--u) * 3)}
  .el-znaj .wr.znaj-prosba .wr-t,.el-znaj .wr.znaj-prosba .wr-gora{align-items:flex-start}
  .el-znaj .wr.znaj-prosba .wr-gora{flex-direction:row;align-items:baseline}
  .el-znaj .wm-pusto,.el-znaj .wm-nic{grid-column:1 / -1}
}
@media (min-width:1024px){
  .el-znaj{--u:clamp(11.4px,calc(100vw / 90),26px);--el-bok:max(calc(var(--u) * 3.5),calc((100% - var(--u) * 83) / 2));padding-top:calc(var(--u) * 2.5)}
  .el-znaj .el-h1{font-size:calc(var(--u) * 2.5)}
  .el-znaj .wm-lista{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:768px){
  .el-znaj .wr .wr-co,.el-znaj .wr .znaj-skad{max-width:100%;white-space:normal;overflow-wrap:anywhere;display:block}
}

/* =================== ZAPROS I ZYSKAJ /konto/zaproszenia (rysunek w_zapr) =================== */
/* Karty nagrod i "Wyslij link" z lewej, odnosnik i lista zaproszonych z prawej. */
@media (min-width:768px){
  .nz.el-zapr{--u:clamp(15px,calc(100vw / 51.25),20px);max-width:none;width:100%;margin:0;box-sizing:border-box}
  .el-zapr .nz-gora{display:none}
  .el-zapr .nz-w{display:flow-root;padding:calc(var(--u) * 1.75) calc(var(--u) * 2) calc(var(--u) * 2.5)}
  .el-zapr .nz-h1{font-size:calc(var(--u) * 2);line-height:1.05;letter-spacing:-.03em}
  .el-zapr .nz-lead{max-width:calc(var(--u) * 40);margin-bottom:calc(var(--u) * .75)}
  .el-zapr .nz-kol1{float:left;width:calc((100% - var(--u) * 1.5) * 1 / 2.4)}
  .el-zapr .nz-kol2{float:right;width:calc((100% - var(--u) * 1.5) * 1.4 / 2.4)}
  .el-zapr .nz-kol2>.nz-link:first-child{margin-top:12px}
}
@media (min-width:1024px){
  .nz.el-zapr{--u:clamp(11.4px,calc(100vw / 90),26px)}
  .el-zapr .nz-w{padding:calc(var(--u) * 2.5) max(calc(var(--u) * 3.5),calc((100% - var(--u) * 83) / 2)) calc(var(--u) * 3)}
  .el-zapr .nz-h1{font-size:calc(var(--u) * 2.5)}
}

/* =================== POWIADOMIENIA - pracownik (rysunek w_powiad) =================== */
@media (min-width:768px){
  .el-pow .el-sp{--el-a:1.6}
  .el-pow .el-r{background:var(--el-k);border:1px solid var(--el-l);border-radius:16px;padding:calc(var(--u) * 1.375)}
  .el-pow .el-r>h2#ustawienia{margin-top:0 !important}
  .el-pow .el-l>:first-child{margin-top:0}
}

/* =================== OBSERWUJA MNIE (rysunek w_obserw) =================== */
@media (min-width:768px){
  .el-obs .b2s-pasek{display:none}
  .el-obs .b2o-lead{margin:0 0 calc(var(--u) * 1.25);max-width:calc(var(--u) * 27);font-size:max(13px,calc(var(--u) * .875))}
  .el-obs .b2o-lista{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--u) * .75);background:none;border:0;border-radius:0}
  .el-obs .b2o-w{border:1px solid var(--el-l);border-radius:14px;background:var(--el-k)}
  .el-obs .b2o-w + .b2o-w{border-top:1px solid var(--el-l)}
  .el-obs .b2f-pusto{margin-left:0;margin-right:0}
}
@media (min-width:1024px){
  .el-obs .b2o-lista{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* =================== ZAPISANE OFERTY (rysunek w_zapisane) =================== */
/* Karta oferty jest ta sama co na lencie (`parts._karta-oferty`): jedna kolumna na
   telefonie, dwie od 768, trzy od 1024 (rysunek: siatka 3 kolumny). */
.ko-karty{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:12px}
.ko-karty .kof{border-radius:14px}
@media (min-width:768px){
  .el-zap .ko-karty{grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--u) * .75);margin-top:0}
  .el-zap .ko-karty .kof{background:var(--el-k);border-color:var(--el-l)}
  .el-zap .ko-rama{max-width:calc(var(--u) * 30);border-radius:14px}
}
@media (min-width:1024px){
  .el-zap .ko-karty{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* =================== MOJE ZGLOSZENIA (rysunek w_zgl) =================== */
@media (min-width:768px){
  .el-zgl .aplista{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--u) * .75);align-items:stretch}
  .el-zgl .aplista>.apl{margin:0;flex-direction:column}
  .el-zgl .zpl{margin-bottom:calc(var(--u) * 1.25)}
}

/* =================== ZDJECIA Z PRACY (rysunek w_zdjecia) =================== */
@media (min-width:768px){
  .el-zdj .el-sp{--el-a:1.9}
  .el-zdj .el-r{background:var(--el-k);border:1px solid var(--el-l);border-radius:16px;padding:calc(var(--u) * 1.375)}
  .el-zdj .el-r>p:first-child{margin-top:0 !important}
  .el-zdj .gal{grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--u) * .75)}
}
@media (min-width:1024px){
  .el-zdj .gal{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* =================== DOSWIADCZENIE /konto/doswiadczenie (rysunek w_dosw) =================== */
@media (min-width:768px){
  .el-dosw>.sub{margin:0 0 calc(var(--u) * 1.25)}
  .el-dosw .el-r{background:var(--el-k);border:1px solid var(--el-l);border-radius:16px;padding:calc(var(--u) * 1.375)}
  .el-dosw .el-r>h2{margin-top:0 !important}
  .el-dosw .el-r .formbox{margin:0;padding:0;border:0;background:none}
}

/* =================== MIEJSCE PRACY - okno na srodku (rysunek w_dosw_nowe) =================== */
@media (min-width:768px){
  .el-mp .e2-cvk{max-width:calc(var(--u) * 34);margin:0 auto;padding:calc(var(--u) * 1.75);background:var(--el-k);border:1px solid var(--el-l);
    border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
  .el-mp .el-ph{margin-bottom:calc(var(--u) * .5)}
  .el-mp .el-h1{font-size:calc(var(--u) * 1.375) !important;letter-spacing:-.02em}
  .el-f2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:calc(var(--u) * 1)}
  .el-f2>*{min-width:0}
  .el-mp .e2-mp-zapisz{display:flex;justify-content:space-between;align-items:center;gap:calc(var(--u) * .75)}
  .el-mp .e2-mp-zapisz .e2-zloty{width:auto;min-width:calc(var(--u) * 8);padding-left:calc(var(--u) * 1.25);padding-right:calc(var(--u) * 1.25)}
  .el-mp .el-anuluj{display:inline-flex;border:0;background:none;padding:0 calc(var(--u) * .25)}
}

/* Zaproszenia do pracy na /konto/zgloszenia - na kazdej szerokosci: kolumna siatki
   nie rosnie ponad ekran przy dlugiej nazwie firmy bez spacji (pomiar szerokosci
   390 px, +7 px - usterka byla juz na main). */
.el-zgl .zpl{grid-template-columns:minmax(0,1fr)}
.el-zgl .zpl-w small{overflow-wrap:anywhere}

/* =================== DWA OKNA OD 1024 (decyzja wlasciciela 20.10) ===================
   Doswiadczenie i Zgloszenia: lista z lewej, wybrany wpis z prawej (rysunek
   w_dosw, w_zgl). Wybor odnosnikiem `?wpis=` / `?zgl=` - bez JS. Telefon
   i 768-1023 bez zmian (`.dp-lista` schowana, wszystkie wpisy pod soba). */
@media (min-width:1024px){
  .el-dosw .dw-ma,.el-zgl .zg-ma{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);column-gap:calc(var(--u) * 3);align-items:start}
  .el-dosw .dw-ma>.el-l,.el-dosw .dw-ma>.el-r{float:none;width:auto}
  .el-dosw .dw-ma>.el-r{display:none}
  .el-dosw .dw-ma>.dp-lista,.el-zgl .zg-ma>.dp-lista{grid-column:1;grid-row:1}
  .el-dosw .dw-ma>.el-l{grid-column:2;grid-row:1}
  .dp-lista{display:flex;flex-direction:column;gap:calc(var(--u) * .5);min-width:0}
  .dp-poz{display:flex;flex-direction:column;gap:calc(var(--u) * .25);min-height:44px;padding:calc(var(--u) * .875) calc(var(--u) * 1.125);
    border:1px solid var(--el-l);border-radius:14px;background:var(--el-k);color:var(--el-t);text-decoration:none;min-width:0}
  .dp-poz:hover{border-color:var(--el-m)}
  .dp-poz.dp-wybrany{border-color:var(--el-zt)}
  .dp-poz:focus-visible{outline:2px solid var(--el-zt);outline-offset:2px}
  .dp-poz b{font-size:max(14px,calc(var(--u) * .94));font-weight:800;overflow-wrap:anywhere}
  .dp-poz small{font-size:max(12px,calc(var(--u) * .8));font-weight:700;color:var(--el-m);overflow-wrap:anywhere}
  .dp-poz .dp-st{align-self:flex-start;margin-top:calc(var(--u) * .25)}
  /* wybrany wpis - karta po prawej */
  .el-dosw .dosw:not(.dosw-wyb){display:none}
  .el-dosw .dosw-lista{background:var(--el-k);border:1px solid var(--el-l);border-radius:16px;padding:calc(var(--u) * 1.375)}
  .el-dosw .dosw-wyb{padding:0;border-top:0}
  .el-dosw .dosw-wyb .dosw-lata{color:var(--el-zt)}
  .el-dosw .dosw-popraw summary{display:inline-flex;min-height:44px;padding:0 calc(var(--u) * 1.125);border:1px solid var(--el-l);border-radius:12px;color:var(--el-t);white-space:nowrap}
}
@media (min-width:1024px){
  .el-zgl .zg-ma>.aplista{grid-column:2;grid-row:1;display:block;margin:0}
  .el-zgl .zg-ma .apl:not(.apl-wyb){display:none}
  .el-zgl .zg-ma .apl-wyb{flex-direction:column;gap:calc(var(--u) * 1);padding:calc(var(--u) * 1.375);margin:0;
    background:var(--el-k);border:1px solid var(--el-l);border-radius:16px;color:var(--el-t)}
  .el-zgl .zg-ma .apr{align-items:flex-start;width:100%;flex-direction:row;flex-wrap:wrap;gap:calc(var(--u) * .625)}
  .el-zgl .zg-ma .apr .btn{min-height:44px}
}
