@import url("https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700;800&display=swap");

:root{
  --orange:#F54200;
  --orange-2:#ff6a3d;
  --ink:#0F0E0C;
  --ink-2:#1a1815;
  --ink-3:#27241f;
  --paper:#ECEAE4;
  --paper-2:#f5f3ee;
  --white:#ffffff;
  --mut:#8c867c;
  --linia:#3a352e;
  --serif:"Libre Baskerville", Georgia, serif;
  --ui:"Hanken Grotesk", "Space Grotesk", system-ui, sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--ui);-webkit-font-smoothing:antialiased}
a{color:inherit}
.star{color:var(--orange);margin-left:.05em}

/* ============================================================
   BRAMKA – logowanie / rejestracja / reset (jasny motyw)
   ============================================================ */
body.bramka{
  background:var(--paper);
  color:var(--ink);
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:32px 18px;
  background-image:radial-gradient(circle at 50% -10%, rgba(242,57,0,.07), transparent 55%);
}
.karta-bramka{
  background:var(--white);
  width:100%;
  max-width:420px;
  border-radius:0;
  padding:38px 34px 30px;
  box-shadow:0 24px 60px -28px rgba(15,14,12,.4);
  border:1px solid rgba(15,14,12,.06);
}
.logo-bramka{
  font-family:var(--serif);
  font-size:22px;
  letter-spacing:.01em;
  margin-bottom:22px;
}
.karta-bramka h1{
  font-family:var(--serif);
  font-size:30px;
  line-height:1.1;
  margin:0 0 6px;
}
.podtytul-bramka{color:var(--mut);margin:0 0 22px;font-size:14.5px}
.karta-bramka form{display:flex;flex-direction:column;gap:14px;margin-top:4px}
.karta-bramka label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:500;color:#5b554c}
.karta-bramka label .opc{color:var(--mut);font-weight:400}
.karta-bramka input{
  font-family:var(--ui);
  font-size:15px;
  padding:12px 13px;
  border:1.5px solid #ddd8cf;
  border-radius:0;
  background:var(--paper-2);
  color:var(--ink);
  transition:border-color .15s, background .15s;
}
.karta-bramka input:focus{outline:none;border-color:var(--orange);background:var(--white)}

.btn-pelny{
  font-family:var(--ui);font-weight:600;font-size:15px;
  background:var(--orange);color:var(--white);
  border:none;border-radius:0;padding:13px 16px;cursor:pointer;
  transition:background .15s, transform .05s;
}
.btn-pelny:hover{background:var(--orange-2)}
.btn-pelny:active{transform:translateY(1px)}
.btn-linia{
  font-family:var(--ui);font-weight:600;font-size:14px;
  background:transparent;color:var(--ink);
  border:1.5px solid #d8d2c8;border-radius:0;padding:11px 16px;cursor:pointer;
}
.btn-linia:hover{border-color:var(--ink)}

.btn-google{
  display:flex;align-items:center;justify-content:center;gap:10px;
  text-decoration:none;font-weight:600;font-size:14.5px;color:var(--ink);
  background:var(--white);border:1.5px solid #ddd8cf;border-radius:0;
  padding:12px 16px;margin-bottom:4px;transition:border-color .15s,box-shadow .15s;
}
.btn-google:hover{border-color:#bdb6a9;box-shadow:0 3px 10px -6px rgba(0,0,0,.3)}
.btn-google .g{
  font-family:var(--serif);font-weight:700;color:var(--orange);
  width:22px;height:22px;display:grid;place-items:center;
  border:1.5px solid var(--orange);border-radius:50%;font-size:13px;
}
.albo{display:flex;align-items:center;gap:12px;color:var(--mut);font-size:12px;margin:16px 0}
.albo::before,.albo::after{content:"";flex:1;height:1px;background:#e2ddd3}

.linki-bramka{display:flex;justify-content:space-between;gap:12px;margin-top:20px;font-size:13.5px}
.linki-bramka a{color:var(--orange);text-decoration:none}
.linki-bramka a:hover{text-decoration:underline}
.stopka-bramka{margin-top:22px;color:var(--mut);font-size:12.5px}

.link-resetu{margin-top:18px;padding:14px;background:var(--paper-2);border-radius:0;font-size:13px;word-break:break-all}
.link-resetu p{margin:0 0 8px;color:var(--mut)}
.link-resetu a{color:var(--orange)}

.flash-strefa{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.flash{padding:11px 14px;border-radius:0;font-size:13.5px;line-height:1.4}
.flash-blad{background:#fdece7;color:#a3260a;border:1px solid #f6c9bb}
.flash-ok{background:#e9f5ec;color:#1d6b34;border:1px solid #bfe3c9}

/* ============================================================
   SHELL – ciemny workspace
   ============================================================ */
body.shell{
  background:var(--ink);
  color:var(--paper);
  height:100vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.topbar{
  display:flex;align-items:center;gap:10px;
  height:54px;padding:0 14px;
  background:var(--ink-2);
  border-bottom:1px solid var(--linia);
  flex:0 0 auto;
}
.brand{
  font-family:var(--serif);font-size:18px;color:var(--paper);
  background:none;border:none;cursor:pointer;padding:6px 8px;border-radius:0;
  text-decoration:none;white-space:nowrap;
}
.brand:hover{background:var(--ink-3)}

.taby{display:flex;align-items:center;gap:6px;flex:1;overflow-x:auto;min-width:0;padding:0 4px;scrollbar-width:thin}
.taby::-webkit-scrollbar{height:0}
.tab{
  display:flex;align-items:center;gap:8px;
  background:var(--ink-3);border:1px solid transparent;
  color:#cfc9bf;font-family:var(--ui);font-size:13px;font-weight:500;
  padding:7px 10px 7px 12px;border-radius:0;cursor:pointer;white-space:nowrap;
  max-width:200px;
}
.tab:hover{color:var(--paper)}
.tab.akt{background:var(--paper);color:var(--ink);font-weight:600}
.tab .tab-x{
  display:grid;place-items:center;width:17px;height:17px;border-radius:0;
  font-size:11px;opacity:.6;
}
.tab .tab-x:hover{opacity:1;background:rgba(0,0,0,.12)}
.tab.akt .tab-x:hover{background:rgba(0,0,0,.1)}

.topbar-right{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.t-akcja{
  display:flex;align-items:center;gap:7px;
  background:var(--ink-3);border:1px solid var(--linia);color:var(--paper);
  font-family:var(--ui);font-size:13px;font-weight:500;
  padding:8px 12px;border-radius:0;cursor:pointer;
}
.t-akcja:hover{border-color:var(--orange)}
.t-akcja.on{background:var(--orange);border-color:var(--orange);color:#fff}
.t-akcja .kropka{width:7px;height:7px;border-radius:50%;background:var(--orange)}
.t-akcja.on .kropka{background:#fff}

.plan-badge{
  font-size:12px;font-weight:600;text-decoration:none;
  padding:6px 10px;border-radius:0;border:1px solid var(--linia);color:#cfc9bf;
}
.plan-badge.plan-pro{background:var(--orange);color:#fff;border-color:var(--orange)}
.plan-badge:hover{border-color:var(--orange)}

.user-box{display:flex;align-items:center;gap:8px}
.user-mail{font-size:12.5px;color:var(--mut);max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none}
a.user-mail:hover{color:var(--paper)}
.profil-form{display:flex;flex-direction:column;gap:14px;background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:26px}
.profil-form label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:500;color:#b9b2a7}
.profil-form .pf-rzad{display:flex;gap:14px}
.profil-form .pf-rzad label{flex:1}
.profil-form input{font-family:var(--ui);font-size:15px;padding:11px 12px;border:1.5px solid var(--linia);border-radius:0;background:var(--ink-3);color:var(--paper)}
.profil-form input:focus{outline:none;border-color:var(--orange)}
.profil-form input:disabled{opacity:.55}
.profil-form .btn-pelny{margin-top:6px}
.logout-form{margin:0}
.pf-naglowek{margin:34px 0 4px;font-family:var(--serif);font-size:20px;color:var(--paper)}
.wyloguj{
  background:none;border:none;color:var(--mut);font-family:var(--ui);font-size:12.5px;
  cursor:pointer;padding:6px 8px;border-radius:0;
}
.wyloguj:hover{color:var(--paper);background:var(--ink-3)}

/* menu użytkownika (rozwijane) */
.user-menu{position:relative}
.user-trigger{
  display:flex;align-items:center;gap:8px;
  background:var(--ink-3);border:1px solid var(--linia);color:var(--paper);
  font-family:var(--ui);font-size:13px;font-weight:500;
  padding:5px 10px 5px 5px;border-radius:0;cursor:pointer;
}
.user-trigger:hover{border-color:var(--orange)}
.user-awatar{
  width:26px;height:26px;border-radius:50%;background:var(--orange);color:#fff;
  display:grid;place-items:center;font-size:13px;font-weight:700;flex:0 0 auto;overflow:hidden;
}
.user-awatar img{ width:100%;height:100%;object-fit:cover;border-radius:50% }
.user-imie{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-strzalka{font-size:10px;color:var(--mut)}
.user-drop{
  position:absolute;top:calc(100% + 8px);right:0;min-width:230px;
  background:var(--ink-2);border:1px solid var(--linia);border-radius:0;
  padding:6px;z-index:62;box-shadow:0 20px 54px -26px rgba(0,0,0,.85);
}
.user-drop[hidden]{display:none}
.user-drop-poz{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;text-align:left;background:none;border:none;cursor:pointer;
  font-family:var(--ui);font-size:13.5px;color:var(--paper);
  padding:10px 12px;border-radius:0;text-decoration:none;
}
.user-drop-poz:hover{background:var(--ink-3)}
.user-wyloguj{color:#e7b6a7}
.user-wyloguj:hover{background:#3a1a12;color:#ffd0c2}
.user-plan-tag{
  font-size:11px;font-weight:600;color:var(--mut);
  border:1px solid var(--linia);border-radius:0;padding:2px 8px;
}
.user-plan-tag.plan-pro{background:var(--orange);color:#fff;border-color:var(--orange)}
.user-drop .logout-form{margin:0}

/* sekcja „Ciągi narzędzi" na pulpicie */
.etap-nr-ciagi{background:var(--ink-3);color:var(--orange);font-size:15px}
.kafel-ciag{cursor:pointer}

/* --- stage: pulpit + panele --- */
.stage{position:relative;flex:1;min-height:0;overflow:hidden}

.pulpit{
  position:absolute;inset:0;overflow-y:auto;
  padding:46px 40px 60px;
  background:
    radial-gradient(circle at 12% 0%, rgba(242,57,0,.1), transparent 42%),
    var(--ink);
}
.pulpit.ukryty{display:none}
.powitanie{max-width:980px;margin:0 auto 34px}
.powitanie h1{font-family:var(--serif);font-size:clamp(30px,4vw,46px);margin:0 0 10px;line-height:1.05}
.powitanie p{color:#b9b2a7;font-size:15.5px;max-width:560px;margin:0;line-height:1.5}

.etap{max-width:980px;margin:0 auto 40px}
.etap-nag{display:flex;align-items:center;gap:13px;margin:0 0 16px}
.etap-nr{width:27px;height:27px;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700;flex:0 0 auto}
.etap-nag h2{font-family:var(--serif);font-size:22px;margin:0;line-height:1.1}
.etap-opis{font-size:13px;color:#a8a196}
.kafle{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px;max-width:980px;margin:0 auto}
.kafel{
  position:relative;display:flex;flex-direction:column;gap:16px;
  background:linear-gradient(160deg, var(--ink-2), var(--ink-3));
  border:1px solid var(--linia);border-radius:0;padding:24px 22px;
  cursor:pointer;transition:border-color .15s, transform .12s, box-shadow .15s;
  min-height:210px;
}
.kafel:hover{border-color:var(--orange);transform:translateY(-3px);box-shadow:0 22px 44px -26px rgba(0,0,0,.7)}
.kafel:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.kafel-ikona{
  font-size:26px;width:50px;height:50px;display:grid;place-items:center;
  background:var(--ink);border-radius:0;color:var(--orange);
}
.kafel-tekst h2{font-family:var(--serif);font-size:23px;margin:0 0 2px}
.kafel-pod{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--orange);margin-bottom:9px;font-weight:600}
.kafel-tekst p{margin:0;font-size:13.5px;line-height:1.5;color:#a8a196}
.kafel-cta{font-size:13.5px;font-weight:600;color:var(--paper);margin-top:auto}
.kafel:hover .kafel-cta{color:var(--orange)}
.kafel.zablokowany{cursor:default;opacity:.62}
.kafel.zablokowany:hover{transform:none;border-color:var(--linia);box-shadow:none}
.kafel-lock{font-size:12.5px;color:var(--mut);margin-top:auto}

.panele{position:absolute;inset:0;display:none}
.panele.akt{display:block}
.panel{position:absolute;inset:0;border:none;width:100%;height:100%;background:var(--paper);display:none}
.panel.akt{display:block}

/* --- agent drawer --- */
.agent{
  position:fixed;right:20px;bottom:88px;width:380px;max-width:calc(100vw - 40px);
  height:min(72vh,580px);
  background:var(--ink-2);border:1px solid var(--linia);border-radius:0;
  display:flex;flex-direction:column;overflow:hidden;
  transform:translateY(12px) scale(.98);opacity:0;pointer-events:none;
  transition:transform .18s ease,opacity .18s ease;z-index:60;
  box-shadow:0 26px 64px -26px rgba(0,0,0,.85);
}
.agent.on{transform:translateY(0) scale(1);opacity:1;pointer-events:auto}

/* pływający przycisk asystenta */
.agent-fab{
  position:fixed;right:20px;bottom:20px;z-index:61;
  width:54px;height:54px;border-radius:50%;
  background:var(--orange);color:#fff;border:none;cursor:pointer;
  display:grid;place-items:center;font-size:22px;line-height:1;
  box-shadow:0 12px 30px -8px rgba(242,57,0,.6);
  transition:transform .15s ease,box-shadow .15s ease;
}
.agent-fab:hover{transform:translateY(-2px)}
.agent-fab.on{transform:rotate(45deg)}
.agent-fab .agent-fab-ik{pointer-events:none}
.agent-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;border-bottom:1px solid var(--linia);font-size:14px;
}
.agent-head b{color:var(--orange);font-weight:600}
.agent-zamknij{background:none;border:none;color:var(--mut);font-size:15px;cursor:pointer;padding:4px 8px;border-radius:0}
.agent-zamknij:hover{color:var(--paper);background:var(--ink-3)}
.agent-rozmowa{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px}
.msg{padding:11px 13px;border-radius:0;font-size:13.5px;line-height:1.5;max-width:88%;white-space:pre-wrap;word-wrap:break-word}
.msg.bot{background:var(--ink-3);color:var(--paper);align-self:flex-start;border-bottom-left-radius:5px}
.msg.ja{background:var(--orange);color:#fff;align-self:flex-end;border-bottom-right-radius:5px}
.msg.blad{background:#3a1a12;color:#ffb59c;align-self:flex-start;font-size:13px}
.msg.czeka{color:var(--mut);font-style:italic;background:transparent;padding-left:4px}
.agent-wejscie{display:flex;gap:8px;padding:12px;border-top:1px solid var(--linia)}
.agent-wejscie textarea{
  flex:1;resize:none;font-family:var(--ui);font-size:14px;
  background:var(--ink-3);border:1px solid var(--linia);border-radius:0;
  color:var(--paper);padding:11px 12px;max-height:140px;
}
.agent-wejscie textarea:focus{outline:none;border-color:var(--orange)}
#agent-wyslij{
  align-self:flex-end;width:42px;height:42px;border:none;border-radius:0;
  background:var(--orange);color:#fff;font-size:18px;cursor:pointer;
}
#agent-wyslij:hover{background:var(--orange-2)}
#agent-wyslij:disabled{opacity:.5;cursor:default}

/* ============================================================
   STRONA PLANU
   ============================================================ */
body.plan-strona{overflow:auto;height:auto;min-height:100vh;
  background-image:radial-gradient(circle at 12% 0%, rgba(242,57,0,.10), transparent 42%);
  background-color:var(--ink);background-attachment:fixed;background-repeat:no-repeat}
.plan-wrap{max-width:900px;margin:0 auto;padding:46px 26px 70px;width:100%}
.plan-wrap h1{font-family:var(--serif);font-size:40px;margin:0 0 6px}
.plan-info{color:#b9b2a7;margin:0 0 30px}
.plan-karty{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.plan-karta{background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:26px 24px;display:flex;flex-direction:column}
.plan-karta.aktywny{border-color:var(--orange);box-shadow:0 0 0 1px var(--orange) inset}
.plan-naglowek{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:6px}
.plan-naglowek h2{font-family:var(--serif);font-size:26px;margin:0}
.plan-cena{font-size:24px;font-weight:600}
.plan-cena span{font-size:13px;color:var(--mut);font-weight:400}
.plan-opis{color:#a8a196;font-size:14px;margin:0 0 16px;line-height:1.5}
.plan-punkty{list-style:none;padding:0;margin:0 0 22px;display:flex;flex-direction:column;gap:9px}
.plan-punkty li{position:relative;padding-left:22px;font-size:14px;color:#cfc9bf}
.plan-punkty li::before{content:"✳";position:absolute;left:0;color:var(--orange)}
.plan-akcja{margin-top:auto}
.plan-akcja form{margin:0}
.plan-aktualny{display:inline-block;font-weight:600;color:var(--orange);font-size:14px}
.plan-strona .btn-pelny,.plan-strona .btn-linia{width:100%}
.plan-strona .btn-linia{color:var(--paper);border-color:var(--linia)}
.plan-strona .btn-linia:hover{border-color:var(--paper)}
.plan-stopka{color:var(--mut);font-size:13px;margin-top:26px;line-height:1.5}
.plan-strona .flash{margin-bottom:18px}

@media (max-width:680px){
  .plan-karty{grid-template-columns:1fr}
  .user-mail{display:none}
  .pulpit{padding:30px 18px 50px}
  .topbar{gap:6px;padding:0 8px}
  .brand{font-size:16px}
}

/* ============================================================
   CENTRUM REDAKTORA
   ============================================================ */
a.t-akcja{text-decoration:none}
.centrum-wrap{max-width:1000px;margin:0 auto;padding:40px 26px 80px;width:100%}
.centrum-wrap h1{font-family:var(--serif);font-size:38px;margin:0 0 4px}
.c-nag{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap;margin-bottom:26px}
.c-nag .btn-pelny{width:auto;white-space:nowrap}
.c-stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:32px}
.c-kafel{background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:18px 20px;display:flex;flex-direction:column;gap:3px}
.c-kafel .c-l{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut)}
.c-kafel .c-v{font-family:var(--serif);font-size:30px;line-height:1.1;margin-top:2px}
.c-kafel .c-v small{font-size:15px;color:var(--mut);font-family:var(--ui)}
.c-kafel .c-v.ok{color:#5fc27e}
.c-kafel .c-pod{font-size:12px;color:var(--mut)}
.c-sekcja{margin-bottom:34px}
.c-sekcja h2{font-family:var(--serif);font-size:22px;margin:0 0 14px}
.c-terminy{display:flex;flex-direction:column;gap:8px}
.c-termin{display:flex;align-items:center;gap:14px;background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:12px 16px;text-decoration:none;color:var(--paper);border-left:4px solid var(--mut)}
.c-termin:hover{border-color:var(--orange);border-left-color:var(--orange)}
.c-termin.pilne{border-left-color:var(--orange)}
.c-termin .c-dni{flex:0 0 130px;font-weight:600;font-size:13.5px}
.c-termin.pilne .c-dni{color:var(--orange)}
.c-termin .c-tt{flex:1;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-termin .c-meta{font-size:12.5px;color:var(--mut)}
.c-lista{display:flex;flex-direction:column;gap:10px}
.c-zlec{display:flex;align-items:center;gap:16px;background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:15px 18px;text-decoration:none;color:var(--paper);border-left:4px solid var(--mut);transition:border-color .12s}
.c-zlec:hover{border-color:var(--orange)}
.c-zlec.etap-nowe{border-left-color:#8c867c}
.c-zlec.etap-wtoku{border-left-color:#E06A1F}
.c-zlec.etap-uautora{border-left-color:#d8a200}
.c-zlec.etap-pokorekcie{border-left-color:#3a7fd0}
.c-zlec.etap-zakonczone{border-left-color:#1d6b34;opacity:.7}
.c-zlec-main{flex:1;min-width:0}
.c-zlec-tt{font-size:15.5px;font-weight:500}
.c-zlec-sub{font-size:12.5px;color:var(--mut);margin-top:1px}
.c-zlec-info{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.c-zlec-info span{font-size:12.5px;white-space:nowrap}
.c-todo{color:#5fc27e}.c-dl{color:#cfc9bf}.c-kw{font-weight:600;color:var(--paper)}
.c-etap{background:var(--ink-3);border-radius:0;padding:3px 10px;color:#cfc9bf;text-transform:capitalize}
.c-fakt{border-radius:0;padding:3px 10px}
.fakt-nie{background:#2a2622;color:#8c867c}
.fakt-wystawiona{background:#3a2a12;color:#e0a050}
.fakt-oplacona{background:#13301c;color:#5fc27e}

/* formularz zlecenia */
.zl-form{background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:24px}
.zl-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.zl-grid label,.zl-form > label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:500;color:#b9b2a7;margin-bottom:0}
.zl-grid label.szer,.zl-form > label.szer{grid-column:1/-1}
.zl-form input,.zl-form select,.zl-form textarea{font-family:var(--ui);font-size:15px;padding:10px 12px;border:1.5px solid var(--linia);border-radius:0;background:var(--ink-3);color:var(--paper)}
.zl-form input:focus,.zl-form select:focus,.zl-form textarea:focus{outline:none;border-color:var(--orange)}
.zl-pasek{grid-column:1/-1;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--orange);font-weight:600;margin:18px 0 2px}
.zl-akcje{display:flex;align-items:center;gap:16px;margin-top:20px}
.zl-akcje .btn-pelny{width:auto}
.zl-usun{background:none;border:1px solid #5a2a22;color:#d08070;font-family:var(--ui);font-size:13px;border-radius:0;padding:9px 16px;cursor:pointer}
.zl-usun:hover{background:#2a1512;border-color:#d08070}
.zl-todo{background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:22px 24px;margin-top:16px}
.zl-todo h2{font-family:var(--serif);font-size:19px;margin:0 0 14px}
.todo-row{display:flex;align-items:center;gap:11px;padding:8px 0;border-bottom:1px solid var(--linia)}
.todo-row.zrob .todo-tre{text-decoration:line-through;color:var(--mut)}
.todo-chk{width:22px;height:22px;border-radius:0;border:1.5px solid var(--linia);background:var(--ink-3);color:#5fc27e;cursor:pointer;font-size:13px;flex:0 0 auto}
.todo-row.zrob .todo-chk{background:#13301c;border-color:#1d6b34}
.todo-tre{flex:1;font-size:14.5px}
.todo-x{background:none;border:none;color:var(--mut);cursor:pointer;font-size:13px}
.todo-x:hover{color:#d08070}
.ti{margin:0;display:flex}
.todo-add{display:flex;gap:8px;margin-top:14px}
.todo-add input{flex:1;font-family:var(--ui);font-size:14px;padding:10px 12px;border:1.5px solid var(--linia);border-radius:0;background:var(--ink-3);color:var(--paper)}
.todo-add input:focus{outline:none;border-color:var(--orange)}
/* input szeroki, przycisk wąski (nadpisuje globalne .plan-strona .btn-linia{width:100%}) */
.todo-add .btn-linia{width:auto;flex:0 0 auto;white-space:nowrap;padding-left:22px;padding-right:22px}
@media(max-width:640px){.zl-grid{grid-template-columns:1fr}.c-zlec{flex-direction:column;align-items:flex-start;gap:8px}.c-zlec-info{justify-content:flex-start}}

/* pulpit – rozwijane zadania zlecenia */
.c-zlec-wrap{display:flex;flex-direction:column}
.c-zlec-link{flex:1;min-width:0;text-decoration:none;color:var(--paper)}
.c-zlec-link:hover .c-zlec-tt{color:var(--orange)}
.c-strz{display:flex;align-items:center;gap:6px;background:var(--ink-3);border:1px solid var(--linia);
  border-radius:0;padding:3px 9px;cursor:pointer;color:#5fc27e;font-size:12.5px;font-family:var(--ui)}
.c-strz:hover{border-color:var(--orange)}
.c-strz .c-arr{color:var(--mut);font-size:11px}
.c-zad{background:var(--ink-2);border:1px solid var(--linia);border-top:none;
  border-radius:0;padding:6px 18px 12px;margin-top:-1px}
.c-zad .todo-row{padding:7px 0}
.c-zad .todo-row:last-child{border-bottom:none}
.c-zad .todo-chk{width:20px;height:20px;font-size:12px}

/* powiązanie z briefem */
.c-brief{background:#13252e;color:#7fc8e0;border-radius:0;padding:3px 10px;font-size:12px}
.brief-stat{margin-top:8px;font-size:13.5px;color:#b9b2a7}
.brief-stat b{color:#7fc8e0}
.btn-zlec{background:var(--ink-3)!important}

/* przełącznik widoku */
.c-nag-akcje{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.widok-przel{display:inline-flex;background:var(--ink-2);border:1px solid var(--linia);border-radius:0;overflow:hidden}
.widok-przel a{padding:8px 15px;font-size:13.5px;color:#cfc9bf;text-decoration:none}
.widok-przel a.akt{background:var(--orange);color:#fff;font-weight:600}
.widok-przel a:not(.akt):hover{color:var(--paper)}

/* kalendarz */
.kal-nav{display:flex;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.kal-strz{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--linia);border-radius:0;color:var(--paper);text-decoration:none;font-size:16px}
.kal-strz:hover{border-color:var(--orange)}
.kal-mc{font-family:var(--serif);font-size:22px;text-transform:capitalize;min-width:170px;text-align:center}
.kal-dzis{font-size:13px;color:var(--orange);text-decoration:none;border:1px solid var(--linia);border-radius:0;padding:7px 12px}
.kal-dzis:hover{border-color:var(--orange)}
.kal-legenda{margin-left:auto;display:flex;gap:12px;font-size:12px;color:var(--mut)}
.lg{display:inline-flex;align-items:center;gap:5px}
.lg::before{content:"";width:9px;height:9px;border-radius:0}
.lg-oddanie::before{background:var(--orange)}
.lg-faktura::before{background:#5fc27e}
.kal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.kal-dow{text-align:center;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);padding:4px 0}
.kal-dzien{min-height:96px;background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:6px 7px;display:flex;flex-direction:column;gap:3px}
.kal-dzien.pusty{background:transparent;border-color:transparent}
.kal-dzien.dzis{border-color:var(--orange)}
.kal-num{font-size:12.5px;color:var(--mut);font-weight:600}
.kal-dzien.dzis .kal-num{color:var(--orange)}
.kal-ev{font-size:11px;line-height:1.3;border-radius:0;padding:3px 6px;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.kal-ev.ev-oddanie{background:#3a1c10;color:#ffb088;border-left:3px solid var(--orange)}
.kal-ev.ev-faktura{background:#13301c;color:#8fdca8;border-left:3px solid #5fc27e}
.kal-ev:hover{filter:brightness(1.2)}
@media(max-width:680px){.kal-dzien{min-height:64px}.kal-ev{font-size:10px}.kal-mc{min-width:120px;font-size:18px}}

/* strona platformy otwarta jako karta (w iframe) – chowamy jej własny topbar */
.embed .topbar{display:none}
.embed .centrum-wrap,.embed .plan-wrap{padding-top:30px}

/* workflow – kreator etapów */
.wf-kroki{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.wf-krok{background:var(--ink-3);border:1px solid var(--linia);border-radius:0;padding:12px 14px}
.wf-glowny{display:flex;align-items:flex-start;gap:11px;cursor:pointer;margin:0;font-weight:400}
.wf-glowny input{margin-top:3px;width:17px;height:17px;accent-color:var(--orange);flex:0 0 auto}
.wf-num{width:22px;height:22px;border-radius:50%;background:var(--ink);color:var(--mut);display:grid;place-items:center;font-size:12px;flex:0 0 auto;margin-top:1px}
.wf-tt b{font-size:15px;color:var(--paper)}
.wf-tt span{display:block;font-size:12.5px;color:var(--mut);margin-top:1px}
.wf-opc{display:flex;align-items:center;gap:7px;margin:9px 0 0 50px;font-size:12.5px;color:#b9b2a7;font-weight:400}
.wf-opc input{accent-color:var(--orange)}
.wf-presety{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.wf-presety>span{font-size:12.5px;color:var(--mut)}
.wf-preset{font-family:var(--ui);font-size:12.5px;background:var(--ink-3);border:1px solid var(--linia);color:#cfc9bf;border-radius:0;padding:5px 12px;cursor:pointer}
.wf-preset:hover{border-color:var(--orange);color:var(--paper)}
.wf-log{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--linia);font-size:14px}
.wf-log:last-child{border-bottom:none}
.wf-log-nr{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;flex:0 0 auto;background:#13301c;color:#5fc27e}
.wf-log.err .wf-log-nr{background:#3a1a12;color:#ffb59c}
.wf-log.err{color:#ffb59c}

/* workflow – nowy UX + postęp */
.wf-krok-tyt{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:18px;margin:0 0 14px}
.wf-cyfra{width:26px;height:26px;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700;font-family:var(--ui)}
.wf-presety-karty{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:14px}
.wf-preset-karta{text-align:left;background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:16px;cursor:pointer;color:var(--paper);font-family:var(--ui);transition:border-color .12s,transform .1s}
.wf-preset-karta:hover{border-color:var(--orange);transform:translateY(-2px)}
.wf-preset-karta b{display:block;font-size:15px;margin-bottom:6px}
.wf-preset-karta span{font-size:12.5px;color:var(--mut)}
.wf-wlasny{margin-bottom:14px}
.wf-wlasny summary{cursor:pointer;color:var(--orange);font-size:13.5px;padding:6px 0;list-style:none}
.wf-wlasny summary::-webkit-details-marker{display:none}
.wf-wlasny summary::before{content:"+ ";font-weight:700}
.wf-wlasny[open] summary::before{content:"– "}
.wf-wlasny .wf-kroki{margin-top:12px}
.wf-podglad{background:var(--ink-3);border:1px solid var(--linia);border-radius:0;padding:12px 15px;display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:6px}
.wf-pod-label{font-size:12.5px;color:var(--mut)}
.wf-pigulka{background:var(--ink);border:1px solid var(--orange);color:var(--paper);border-radius:0;padding:4px 12px;font-size:13px;font-weight:500}
.wf-arr{color:var(--mut)}
.wf-bar{height:8px;background:var(--ink-3);border-radius:0;overflow:hidden;margin:4px 0 16px}
.wf-bar-fill{height:100%;background:var(--orange);width:0;transition:width .35s ease;border-radius:0}
.wf-etap-row{display:flex;align-items:center;gap:11px;padding:8px 0;font-size:14.5px;color:var(--mut)}
.wf-etap-row.akt{color:var(--paper)}
.wf-etap-row.ok{color:var(--paper)}
.wf-etap-row.err{color:#ffb59c}
.wf-etap-ik{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:13px;flex:0 0 auto;background:var(--ink-3);color:var(--mut)}
.wf-etap-row.akt .wf-etap-ik{background:#3a2a12;color:var(--orange);animation:wfspin 1s linear infinite}
.wf-etap-row.ok .wf-etap-ik{background:#13301c;color:#5fc27e}
.wf-etap-row.err .wf-etap-ik{background:#3a1a12;color:#ffb59c}
@keyframes wfspin{to{transform:rotate(360deg)}}

/* workflow – panel pełnych opcji narzędzia (np. Kamerton) */
.wf-panel{margin:10px 0 2px 50px;padding:12px 14px;background:var(--ink-2);border:1px solid var(--linia);border-radius:0}
.wf-panel[hidden]{display:none}
.wf-panel-grp{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--mut);font-weight:600;margin:0 0 8px}
.wf-panel-grp:not(:first-child){margin-top:14px;padding-top:12px;border-top:1px solid var(--linia)}
.wf-grp-pod{text-transform:none;letter-spacing:0;font-weight:400;color:#8c867c}
.wf-panel-row{display:flex;flex-wrap:wrap;gap:8px 16px;margin-bottom:2px}
.wf-panel-row label{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#cfc9bf;font-weight:400;margin:0}
.wf-fmt-row{display:flex;align-items:center;gap:7px;font-size:12.5px;color:#cfc9bf;font-weight:400;margin:6px 0}
.wf-panel input[type=checkbox]{width:15px;height:15px;accent-color:var(--orange);flex:0 0 auto}
.wf-fmt-val{font-family:var(--ui);font-size:12.5px;background:var(--ink);border:1px solid var(--linia);color:var(--paper);border-radius:0;padding:5px 8px}
.wf-fmt-val:focus{outline:none;border-color:var(--orange)}
.wf-inp-s{width:170px}
.wf-inp-xs{width:64px}

/* kalendarz – pusty miesiąc (dopisek QA) */
.kal-pusto{margin:14px 2px 0;font-size:13.5px;color:var(--mut)}

/* „Utwórz brief do tego zlecenia" (zlecenie.html) */
.brief-nowy{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.brief-nowy .btn-linia{align-self:flex-start;width:auto}
.brief-nowy-pod{font-size:12.5px;color:var(--mut)}
.brief-nowy-blad{font-size:12.5px;color:#ffb59c}

/* ===== MOTYWY: jasny / ciemny / auto ====================================
   Aplikacja (.shell/.plan-strona) jest domyślnie ciemna; bramka jasna.
   Motyw przełączamy atrybutem data-theme na <html>. „auto" = systemowy.
   Konflikt ról --ink/--paper między shell a bramką rozwiązany scoped-remapem. */

/* JASNY motyw dla ciemnej aplikacji */
html[data-theme="light"] body.shell,
html[data-theme="light"] body.plan-strona{
  --ink:#F4F6F8; --ink-2:#ffffff; --ink-3:#eceff3;
  --paper:#181a1d; --paper-2:#33363b; --mut:#6b6f76; --linia:#e2e6ec;
}
/* CIEMNY motyw dla jasnej bramki */
html[data-theme="dark"] body.bramka{
  --paper:#14120f; --paper-2:#1a1815; --white:#1f1c18; --ink:#ECEAE4; --mut:#9a948a;
}
html[data-theme="dark"] body.bramka .karta-bramka{ border-color:var(--linia); box-shadow:0 24px 60px -28px rgba(0,0,0,.6); }
html[data-theme="dark"] body.bramka input{ border-color:#3a352e; }
html[data-theme="dark"] body.bramka .btn-linia{ color:var(--ink); }

/* AUTO = za systemem */
@media (prefers-color-scheme: light){
  html[data-theme="auto"] body.shell,
  html[data-theme="auto"] body.plan-strona{
    --ink:#F4F6F8; --ink-2:#ffffff; --ink-3:#eceff3;
    --paper:#181a1d; --paper-2:#33363b; --mut:#6b6f76; --linia:#e2e6ec;
  }
}
@media (prefers-color-scheme: dark){
  html[data-theme="auto"] body.bramka{
    --paper:#14120f; --paper-2:#1a1815; --white:#1f1c18; --ink:#ECEAE4; --mut:#9a948a;
  }
  html[data-theme="auto"] body.bramka .karta-bramka{ border-color:var(--linia); }
}

/* pływający przełącznik motywu (wstrzykiwany przez motyw.js) */
.motyw-fab{position:fixed;right:14px;bottom:14px;z-index:9999;display:inline-flex;align-items:center;gap:4px;
  background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:4px 6px 4px 10px;
  box-shadow:0 8px 24px -12px rgba(0,0,0,.5);font-family:var(--ui)}
.motyw-fab-l{font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.06em;margin-right:2px}
.motyw-fab button{background:none;border:0;cursor:pointer;color:var(--mut);font-size:14px;line-height:1;
  width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;transition:background .12s,color .12s}
.motyw-fab button:hover{color:var(--paper)}
.motyw-fab button.akt{background:var(--orange);color:#fff}
body.bramka .motyw-fab{background:var(--white)}
@media (max-width:560px){ .motyw-fab-l{display:none} .motyw-fab{right:10px;bottom:10px} }

/* ===== Master kanban (tablica tytułów) ================================== */
.kanban{display:flex;gap:14px;overflow-x:auto;padding:6px 2px 20px;align-items:flex-start}
.kanban-kol{flex:0 0 260px;background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:10px;display:flex;flex-direction:column;gap:8px}
.kanban-kol-nag{display:flex;align-items:center;gap:8px;padding:2px 4px 8px;border-bottom:1px solid var(--linia)}
.kanban-nazwa{font-weight:600;font-size:13.5px;flex:1}
.kanban-licznik{background:var(--ink-3);color:var(--mut);border-radius:0;font-size:12px;padding:1px 8px;min-width:22px;text-align:center}
.kanban-kropka{width:9px;height:9px;border-radius:50%;background:var(--mut);flex:0 0 auto}
.kkolor-szary    .kanban-kropka{background:#8c867c}
.kkolor-zolty    .kanban-kropka{background:#e0b341}
.kkolor-pomarancz .kanban-kropka{background:var(--orange)}
.kkolor-niebieski .kanban-kropka{background:#4a86c7}
.kkolor-zielony  .kanban-kropka{background:#5fc27e}
.kkolor-czerwony .kanban-kropka{background:#d0603f}
.kanban-karty{display:flex;flex-direction:column;gap:8px;min-height:24px}
.kanban-karta{display:block;background:var(--ink-3);border:1px solid var(--linia);border-radius:0;padding:10px 12px;text-decoration:none;color:var(--paper);transition:border-color .12s,transform .05s}
.kanban-karta:hover{border-color:var(--orange);transform:translateY(-1px)}
.kanban-karta-tt{font-family:var(--serif);font-size:14.5px;line-height:1.25;margin-bottom:3px}
.kanban-karta-meta{font-size:11.5px;color:var(--mut)}
.kanban-karta-sub{font-size:12.5px;color:var(--mut);margin-top:2px}
.kanban-flaga{display:inline-block;margin-top:8px;font-size:11px;padding:2px 8px;border-radius:0;background:var(--ink-2);color:var(--mut);border:1px solid var(--linia)}
.kanban-flaga.pilne{color:var(--orange);border-color:var(--orange)}
.kanban-flaga.praca{color:#5fc27e;border-color:#2f5c3c}
.kanban-pusto{color:var(--mut);text-align:center;font-size:13px;margin:6px 0;opacity:.5}

/* pasek postępu zlecenia (kanban + lista) */
.postep{display:block;height:6px;border-radius:0;background:var(--ink-3);overflow:hidden;margin-top:8px}
.postep>span{display:block;height:100%;background:var(--orange);border-radius:0}
.postep-mini{width:80px;height:5px;margin:0}

/* ============================================================================
   OFICYNA — aplikacja wydawnictwa (B2B): osobny layout z sidebarem.
   Spokojny, uporządkowany UI inspirowany Notion. ========================== */
/* UWAGA: body ma też klasę .shell (flex-direction:column) – tu jawnie wymuszamy ROW,
   inaczej sidebar nie stoi obok treści. */
body.wyd-app{display:flex;flex-direction:row;min-height:100vh;height:auto;overflow:auto}
.wyd-side{position:sticky;top:0;align-self:flex-start;height:100vh;flex:0 0 230px;width:230px;
  box-sizing:border-box;background:var(--ink-2);border-right:1px solid var(--linia);
  display:flex;flex-direction:column;padding:18px 14px;gap:4px;
  transition:flex-basis .16s ease,width .16s ease,padding .16s ease}
/* --- zwijanie sidebaru (jak w MailerLite) --- */
.wyd-zwij{align-self:flex-end;background:none;border:0;color:var(--mut);cursor:pointer;
  font-size:18px;line-height:1;padding:2px 6px;border-radius:0;margin-bottom:2px}
.wyd-zwij:hover{background:var(--ink-3);color:var(--paper)}
html.wyd-zwiniety .wyd-side{flex-basis:64px;width:64px;padding:18px 8px;align-items:center}
html.wyd-zwiniety .wyd-side .etk,
html.wyd-zwiniety .wyd-org,
html.wyd-zwiniety .wyd-org-przel,
html.wyd-zwiniety .wyd-brand-txt{display:none}
html.wyd-zwiniety .wyd-brand{padding:4px 0;text-align:center}
html.wyd-zwiniety .wyd-nav a{justify-content:center;padding:9px 0}
html.wyd-zwiniety .wyd-nav a .ikona{width:auto;font-size:16px}
html.wyd-zwiniety .wyd-side-stopka{align-items:center}
html.wyd-zwiniety .wyd-side-stopka button,
html.wyd-zwiniety .wyd-side-stopka a{font-size:0;padding:8px}
html.wyd-zwiniety .wyd-zwij{align-self:center;transform:rotate(180deg)}
.wyd-brand{font-family:var(--serif);font-size:20px;color:var(--paper);text-decoration:none;padding:4px 8px}
.wyd-org{font-size:12px;color:var(--mut);padding:0 8px 14px;border-bottom:1px solid var(--linia);
  margin-bottom:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wyd-nav{display:flex;flex-direction:column;gap:2px;flex:1}
.wyd-nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:0;
  text-decoration:none;color:var(--mut);font-size:15.5px;font-weight:500}
.wyd-nav a:hover{background:var(--ink-3);color:var(--paper)}
.wyd-nav a.akt{background:var(--ink-3);color:var(--paper)}
.wyd-nav a .ikona{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;opacity:.9;flex:0 0 auto}
.wyd-nav a .ikona svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.wyd-nav a.akt .ikona{opacity:1}
.wyd-nav a.wyd-nav-dol{margin-top:auto;border-top:1px solid var(--linia);padding-top:12px}
.wyd-side-stopka{border-top:1px solid var(--linia);padding-top:10px;display:flex;flex-direction:column;gap:6px}
.wyd-side-stopka a{color:var(--paper);text-decoration:none;font-size:13.5px;padding:6px 10px;border-radius:0}
.wyd-side-stopka a:hover{background:var(--ink-3)}
.wyd-side-stopka button{background:none;border:0;color:var(--mut);text-align:left;font:inherit;
  font-size:13.5px;cursor:pointer;padding:6px 10px;border-radius:0}
.wyd-side-stopka button:hover{background:var(--ink-3);color:var(--paper)}
/* dashboard/listy wypełniają szerokość okna; widoki z własnym max-width (detal/ustawienia)
   środkują się (margin-inline:auto) zamiast dosuwać w lewo – działa w obie strony */
.wyd-main{flex:1;min-width:0;padding:30px 38px 70px;margin-inline:auto}

.wyd-naglowek{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin:14px 0 26px}
.wyd-naglowek h1{font-family:var(--serif);font-size:30px;margin:0}
/* pairing: część groteskiem (Hanken), część serifem-italikiem (Libre Baskerville) – jak „Dołącz do nas" */
.h-para{font-size:32px;line-height:1.04;margin:0}
.h-para .h-sans{font-family:var(--ui);font-weight:700;letter-spacing:-.02em;font-style:normal}
.h-para em{font-family:var(--serif);font-style:italic;font-weight:400}
.wyd-naglowek p{color:var(--mut);margin:4px 0 0;font-size:14px}

/* kafle statystyk – lekkie, nie ciężkie karty */
.wyd-stat{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
.wyd-stat .kf{flex:1;min-width:130px;background:var(--ink-2);border:1px solid var(--linia);
  border-radius:0;padding:12px 14px}
.wyd-stat .kf b{display:block;font-size:24px;font-family:var(--serif);font-weight:700}
.wyd-stat .kf span{font-size:12px;color:var(--mut)}
.wyd-stat .kf.akcent b{color:var(--orange)}

/* przełącznik widoków */
.wyd-widoki{display:inline-flex;background:var(--ink-2);border:1px solid var(--linia);border-radius:0;padding:2px}
.wyd-widoki button{background:none;border:0;color:var(--mut);font:inherit;font-size:13.5px;font-weight:500;
  cursor:pointer;padding:6px 14px;border-radius:0}
.wyd-widoki button.akt{background:var(--ink-3);color:var(--paper)}
.wyd-pasek{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:16px 0 12px}

/* status jako kolorowa właściwość (chip) */
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;padding:3px 10px;border-radius:0;
  background:var(--ink-3);color:var(--paper);white-space:nowrap}
.chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mut)}
.chip.k-szary::before{background:#8c867c}.chip.k-zolty::before{background:#e0b341}
.chip.k-pomarancz::before{background:var(--orange)}.chip.k-niebieski::before{background:#4a86c7}
.chip.k-zielony::before{background:#5fc27e}.chip.k-czerwony::before{background:#d0603f}

/* tabela tytułów (Notion-like) */
.wyd-tabela{width:100%;border-collapse:collapse;font-size:14px}
.wyd-tabela th{text-align:left;color:var(--mut);font-weight:500;font-size:12.5px;padding:8px 10px;
  border-bottom:1px solid var(--linia);cursor:pointer;user-select:none;white-space:nowrap}
.wyd-tabela th:hover{color:var(--paper)}
.wyd-tabela th .s{opacity:.4;font-size:10px}
.wyd-tabela td{padding:13px 12px;border-bottom:1px solid var(--linia);vertical-align:middle}
.wyd-tabela tr:hover td{background:var(--ink-2)}
.wyd-tabela a.tt{color:var(--paper);text-decoration:none;font-weight:600}
.wyd-tabela a.tt:hover{color:var(--orange)}
.wyd-tabela .num{color:var(--mut);font-size:12px}
.wyd-dzial{font-size:12.5px}
.wiad-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;
  padding:0 5px;margin-left:6px;border-radius:0;background:var(--orange);color:#fff;
  font-size:11px;font-weight:700;vertical-align:middle;line-height:1}
.wyd-dzial.pilne{color:var(--orange);font-weight:600}

/* widok Etapy – stepper per tytuł */
.etap-rzad{display:flex;align-items:center;gap:14px;padding:14px 4px;border-bottom:1px solid var(--linia)}
.etap-rzad .info{flex:0 0 230px;min-width:0}
.etap-rzad .info a{color:var(--paper);text-decoration:none;font-weight:600;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.etap-rzad .info a:hover{color:var(--orange)}
.etap-rzad .info span{font-size:12px;color:var(--mut)}
.stepper{display:flex;align-items:center;flex:1;min-width:0;overflow-x:auto}
.stepper .krok{display:flex;align-items:center;gap:0;flex:1;min-width:64px}
.stepper .kropka{width:14px;height:14px;border-radius:50%;border:2px solid var(--linia);background:var(--ink-2);flex:0 0 auto;z-index:1}
.stepper .krok.done .kropka{background:var(--orange);border-color:var(--orange)}
.stepper .krok.teraz .kropka{background:var(--orange);border-color:var(--orange);box-shadow:0 0 0 4px rgba(242,57,0,.22)}
.stepper .linia{height:2px;flex:1;background:var(--linia)}
.stepper .krok.done .linia{background:var(--orange)}
.stepper .et{font-size:10.5px;color:var(--mut);margin-top:5px;text-align:center;white-space:nowrap}
.stepper .krok.teraz .et,.stepper .krok.done .et{color:var(--paper)}
.etap-rzad.anul{opacity:.55}
.etap-rzad .anul-tag{color:#d0603f;font-size:12px}

.wyd-pusto{text-align:center;color:var(--mut);padding:50px 20px;border:1px dashed var(--linia);border-radius:0}
.wyd-pusto h3{font-family:var(--serif);margin:0 0 6px;color:var(--paper)}

@media (max-width:760px){
  body.wyd-app{flex-direction:column}
  .wyd-side{position:static;height:auto;flex-basis:auto;flex-direction:row;flex-wrap:wrap;align-items:center;border-right:0;border-bottom:1px solid var(--linia)}
  .wyd-org{display:none}.wyd-nav{flex-direction:row;flex:1}.wyd-side-stopka{border-top:0;flex-direction:row}
  .wyd-main{padding:20px 16px 70px}
}

/* przełącznik organizacji w sidebarze */
.wyd-org-przel{padding:0 4px 14px;border-bottom:1px solid var(--linia);margin-bottom:10px}
.wyd-org-przel select{width:100%;background:var(--ink-3);color:var(--paper);border:1px solid var(--linia);
  border-radius:0;padding:7px 9px;font:inherit;font-size:13px;cursor:pointer}

/* baner trybu podglądu admina */
.admin-baner{position:sticky;top:0;z-index:10000;background:var(--orange);color:#fff;
  text-align:center;padding:7px 14px;font-size:13.5px;font-family:var(--ui)}
.admin-baner strong{font-weight:700}
.admin-baner button{background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.5);
  color:#fff;border-radius:0;padding:2px 10px;font:inherit;font-size:12.5px;cursor:pointer}
.admin-baner button:hover{background:rgba(255,255,255,.32)}

/* ============================================================================
   POLA FORMULARZY — globalny, wyraźny styl w całej aplikacji (B2B + panele).
   Wcześniej pola w wydawnictwie/adminie były nieostylowane = niewidoczne. ==== */
.plan-strona input:not([type=checkbox]):not([type=radio]):not([type=file]),
.plan-strona select,
.plan-strona textarea,
.wyd-app input:not([type=checkbox]):not([type=radio]):not([type=file]),
.wyd-app select,
.wyd-app textarea{
  font-family:var(--ui);
  font-size:15px;
  padding:12px 14px;
  min-height:46px;
  width:100%;
  border:1.5px solid var(--linia);
  border-radius:0;
  background:var(--ink-3);
  color:var(--paper);
  transition:border-color .12s, box-shadow .12s, background .12s;
}
.plan-strona textarea,
.wyd-app textarea{ min-height:auto; line-height:1.45 }
.plan-strona input:focus,.plan-strona select:focus,.plan-strona textarea:focus,
.wyd-app input:focus,.wyd-app select:focus,.wyd-app textarea:focus{
  outline:none; border-color:var(--orange);
  box-shadow:0 0 0 3px rgba(242,57,0,.16);
  background:var(--ink-2);
}
.plan-strona input::placeholder,.plan-strona textarea::placeholder,
.wyd-app input::placeholder,.wyd-app textarea::placeholder{ color:var(--mut); opacity:1 }
.plan-strona select,.wyd-app select{ cursor:pointer }
/* etykiety nad polami – żeby formularze były czytelne */
.plan-strona label,.wyd-app label{ font-size:14px }
/* input pliku – żeby też był widoczny i klikalny */
.plan-strona input[type=file],.wyd-app input[type=file]{
  font-family:var(--ui);font-size:14px;padding:10px 12px;border:1.5px dashed var(--linia);
  border-radius:0;background:var(--ink-3);color:var(--paper);width:100%;cursor:pointer}
.plan-strona input[type=file]::file-selector-button,
.wyd-app input[type=file]::file-selector-button{
  font:inherit;font-size:13px;margin-right:10px;padding:7px 12px;border-radius:0;border:0;
  background:var(--orange);color:#fff;cursor:pointer}

/* ============================================================================
   ODŚWIEŻENIE WIZUALNE WYDAWNICTWA (czerwiec 2026)
   Lżej, nowocześniej, przyjazne kształty; jaśniejszy motyw mniej „generyczny";
   terracota oszczędnie (tylko realne akcenty). Blok na końcu = nadpisuje wyżej.
   ============================================================================ */

/* --- jasny motyw: złamana biel (neutralna, bez beżu) --- */
html[data-theme="light"] body.plan-strona,
html[data-theme="light"] body.shell,
html[data-theme="auto"] body.plan-strona,
html[data-theme="auto"] body.shell{
  --ink:#F4F6F8;        /* tło strony – złamana biel */
  --ink-2:#ffffff;      /* karty */
  --ink-3:#eceff3;      /* pola / subtelne tła */
  --paper:#181a1d; --paper-2:#33363b; --mut:#6b6f76; --linia:#e2e6ec;
}
@media (prefers-color-scheme: light){
  html[data-theme="auto"] body.plan-strona,
  html[data-theme="auto"] body.shell{
    --ink:#F4F6F8; --ink-2:#ffffff; --ink-3:#eceff3;
    --paper:#181a1d; --paper-2:#33363b; --mut:#6b6f76; --linia:#e2e6ec;
  }
}
/* jasny motyw: miękki gradient tła zamiast płaskiej barwy (ciepły akcent + chłodny refleks) */
html[data-theme="light"] body.plan-strona{
  background-image:
    radial-gradient(circle at 0% -8%, rgba(242,57,0,.055), transparent 42%),
    radial-gradient(circle at 100% 0%, rgba(110,130,165,.05), transparent 40%),
    linear-gradient(180deg, #FBFCFD, var(--ink) 55%);
}
@media (prefers-color-scheme: light){
  html[data-theme="auto"] body.plan-strona{
    background-image:
      radial-gradient(circle at 0% -8%, rgba(242,57,0,.055), transparent 42%),
      radial-gradient(circle at 100% 0%, rgba(110,130,165,.05), transparent 40%),
      linear-gradient(180deg, #FBFCFD, var(--ink) 55%);
  }
}

/* --- karty: większy promień, miękki cień, lekka ramka --- */
.wyd-app .plan-karta, .plan-strona .plan-karta{
  border-radius:0;
  border:1px solid var(--linia);
  background:var(--ink-2);
  box-shadow:0 1px 2px rgba(25,23,20,.04), 0 8px 24px -18px rgba(25,23,20,.18);
}
html[data-theme="light"] .wyd-app .plan-karta,
html[data-theme="light"] .plan-strona .plan-karta{
  box-shadow:0 1px 2px rgba(25,23,20,.05), 0 10px 30px -20px rgba(25,23,20,.22);
}

/* --- nagłówki wydawnictwa: lekko luźniej --- */
.wyd-naglowek h1{ letter-spacing:-.01em }
.wyd-main{ padding-top:26px }

/* --- przyciski: primary jako „pigułka", subtelniejszy hover (mniej blokowo) --- */
.btn-pelny{
  border-radius:0; padding:11px 20px; font-weight:600;
  box-shadow:0 6px 18px -10px rgba(242,57,0,.5);
  transition:transform .12s ease, box-shadow .15s ease, background .15s ease;
}
.btn-pelny:hover{ box-shadow:0 10px 24px -10px rgba(242,57,0,.55); transform:translateY(-1px) }
.btn-pelny:active{ transform:translateY(0) }
/* wariant wtórny (neutralny – bez terracoty) */
.btn-druga{
  font-family:var(--ui); font-weight:600; font-size:14px; cursor:pointer;
  background:var(--ink-3); color:var(--paper); border:1px solid var(--linia);
  border-radius:0; padding:10px 18px; transition:background .15s, border-color .15s;
}
.btn-druga:hover{ background:var(--ink-2); border-color:var(--mut) }

/* --- chipy „c-etap": stonowane, neutralne (nie terracota) --- */
.c-etap{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12.5px; padding:5px 11px; border-radius:0;
  background:var(--ink-3); color:var(--paper-2); border:1px solid var(--linia);
  text-decoration:none;
}
a.c-etap:hover{ border-color:var(--mut) }

/* --- kafelki statystyk: lżejsze, zaokrąglone --- */
.wyd-stat .kf{
  border-radius:0; border:1px solid var(--linia); background:var(--ink-2);
  box-shadow:0 8px 22px -20px rgba(25,23,20,.25);
}
.wyd-stat .kf.akcent{ border-color:rgba(242,57,0,.35) }
.wyd-stat .kf.akcent b{ color:var(--orange) }

/* --- tabele: lekkie, hover wiersza, zaokrąglony kontener --- */
.wyd-tabela{ border-collapse:separate; border-spacing:0 }
.wyd-tabela tbody tr{ transition:background .12s }
.wyd-tabela tbody tr:hover{ background:var(--ink-3) }

/* --- checkbox/radio: akcent w naszym kolorze, ale subtelnie --- */
.wyd-app input[type=checkbox], .wyd-app input[type=radio],
.plan-strona input[type=checkbox], .plan-strona input[type=radio]{ accent-color:var(--orange) }

/* === MODAL — nowoczesny, lekki popup === */
.modal-tlo{
  position:fixed; inset:0; z-index:80; display:none;
  background:rgba(20,18,15,.46); backdrop-filter:blur(3px);
  align-items:flex-start; justify-content:center; padding:6vh 16px 16px; overflow:auto;
}
.modal-tlo.otwarty{ display:flex }
.modal{
  background:var(--ink-2); color:var(--paper); width:100%; max-width:560px;
  border-radius:0; border:1px solid var(--linia);
  box-shadow:0 30px 80px -30px rgba(20,18,15,.55);
  padding:28px 30px; animation:modal-in .18s ease;
}
@keyframes modal-in{ from{ opacity:0; transform:translateY(10px) scale(.99) } to{ opacity:1; transform:none } }
.modal-glowa{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px }
.modal-glowa h2{ font-family:var(--serif); font-size:23px; margin:0 }
.modal-x{ background:none; border:0; cursor:pointer; color:var(--mut); font-size:22px; line-height:1; padding:4px 8px; border-radius:0}
.modal-x:hover{ background:var(--ink-3); color:var(--paper) }
/* opis pod tytułem modala (jak na wzorcu) */
.modal-opis{ margin:0 0 18px; color:var(--mut); font-size:14px; line-height:1.55 }
.modal-sekcja{ font-size:12px; text-transform:uppercase; letter-spacing:.07em; color:var(--mut); margin:16px 0 8px }
.modal-stopka{ display:flex; justify-content:flex-end; gap:10px; margin-top:26px }
/* więcej powietrza: odstępy między polami + etykieta nad polem */
.modal-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px 16px }
.modal-grid label{ display:flex; flex-direction:column; gap:7px; font-size:13.5px; font-weight:500; color:var(--paper) }
.modal-grid .pelny{ grid-column:1 / -1 }
/* wybór typu nowego tytułu: dwa buttony-karty (Zlecenie / Wycena) */
.typ-wybor{ display:grid; grid-template-columns:1fr 1fr; gap:12px }
@media (max-width:560px){ .typ-wybor{ grid-template-columns:1fr } }
.typ-opt{ display:flex; flex-direction:column; gap:6px; text-align:left; cursor:pointer;
  border:2px solid var(--linia); border-radius:12px; background:var(--ink-2); color:var(--paper); padding:15px 17px }
.typ-opt:hover{ border-color:color-mix(in srgb, var(--orange) 45%, var(--linia)) }
.typ-opt.active{ border-color:var(--orange); background:color-mix(in srgb, var(--orange) 7%, var(--ink-2)) }
.typ-opt-t{ display:flex; align-items:center; gap:9px; font-weight:700; font-size:16px }
.typ-opt-nr{ font-size:11px; font-weight:700; letter-spacing:.04em; color:var(--orange);
  border:1px solid color-mix(in srgb, var(--orange) 45%, transparent); border-radius:999px;
  padding:1px 9px; background:color-mix(in srgb, var(--orange) 9%, transparent) }
.typ-opt-o{ font-size:13px; color:var(--mut); line-height:1.45 }
@media (max-width:520px){ .modal-grid{ grid-template-columns:1fr } }

/* --- sidebar wydawnictwa: góra (motyw + zwijanie), przełącznik poziomów --- */
.wyd-gora{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:6px }
.wyd-motyw{ display:inline-flex; gap:2px; background:var(--ink-3); border-radius:0; padding:3px }
.wyd-motyw button{ background:none; border:0; cursor:pointer; color:var(--mut); font-size:13px;
  width:26px; height:24px; border-radius:0; line-height:1 }
.wyd-motyw button.akt{ background:var(--ink-2); color:var(--paper); box-shadow:0 1px 4px -1px rgba(0,0,0,.25) }
.wyd-poziom{ margin:6px 0 12px; display:flex; flex-direction:column; gap:6px }
.wyd-poziom select{ width:100%; font-size:13.5px; padding:8px 10px; border-radius:0;
  border:1px solid var(--linia); background:var(--ink-3); color:var(--paper) }
.wyd-superadmin{ font-size:12.5px; color:var(--mut); text-decoration:none; padding:6px 8px;
  border-radius:0; border:1px dashed var(--linia) }
.wyd-superadmin:hover{ color:var(--paper); border-color:var(--mut) }
/* w wydawnictwie nie pokazujemy pływającego FAB motywu (jest u góry sidebaru) */
body.wyd-app .motyw-fab{ display:none !important }
/* zwinięty sidebar: tylko ikony nav (motyw jest teraz w górnym pasku, nie w sidebarze) */
html.wyd-zwiniety .wyd-side .wyd-poziom,
html.wyd-zwiniety .wyd-side .wyd-superadmin{ display:none }
html.wyd-zwiniety .wyd-gora{ justify-content:center }

/* === DOSTĘPNOŚĆ: widoczny focus klawiatury (nie zabieramy myszy hovera) === */
.wyd-app a:focus-visible, .wyd-app button:focus-visible,
.wyd-app [tabindex]:focus-visible, .wyd-app summary:focus-visible,
.plan-strona a:focus-visible, .plan-strona button:focus-visible,
.plan-strona [tabindex]:focus-visible, .plan-strona summary:focus-visible{
  outline:2px solid var(--orange); outline-offset:2px; border-radius:0;
}
/* pola formularzy mają już własny focus (ramka+glow) – nie dublujemy obrysu */
.wyd-app input:focus-visible, .wyd-app select:focus-visible, .wyd-app textarea:focus-visible,
.plan-strona input:focus-visible, .plan-strona select:focus-visible, .plan-strona textarea:focus-visible{
  outline:none;
}

/* --- górny pasek wydawnictwa: konto + powrót do Centrum (prawy górny róg, jak w Redaktorze) --- */
.wyd-topbar{ position:fixed; top:0; left:230px; right:0; height:52px; z-index:60;
  display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 24px;
  background:var(--ink); border-bottom:1px solid var(--linia); transition:left .16s ease }
html.wyd-zwiniety .wyd-topbar{ left:64px }
.wyd-topbar-prawa{ display:flex; align-items:center; gap:10px; margin-left:auto }
.wyd-topbar-logo-link{ display:inline-flex; align-items:center; min-width:0; text-decoration:none }
.wyd-topbar-logo{ max-height:30px; max-width:210px; object-fit:contain; display:block }
.wyd-topbar-nazwa{ font-family:var(--serif); font-size:17px; color:var(--paper);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:210px }
/* dwa warianty logo wydawnictwa: jasne na jasny topbar, ciemne na ciemny (bg = var(--ink)) */
.wyd-topbar-logo.logo-ciemne{ display:none }
html[data-theme="dark"] .wyd-topbar-logo.logo-jasne{ display:none }
html[data-theme="dark"] .wyd-topbar-logo.logo-ciemne{ display:block }
html[data-theme="light"] .wyd-topbar-logo.logo-ciemne{ display:none }
html[data-theme="light"] .wyd-topbar-logo.logo-jasne{ display:block }
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]):not([data-theme="dark"]) .wyd-topbar-logo.logo-jasne{ display:none }
  html:not([data-theme="light"]):not([data-theme="dark"]) .wyd-topbar-logo.logo-ciemne{ display:block }
}
body.wyd-app .wyd-main{ padding-top:64px }
@media (max-width:760px){ .wyd-topbar{ left:0 } body.wyd-app .wyd-main{ padding-top:20px } }
/* asystent wydawnictwa korzysta teraz z tych samych klas co Redaktor (.agent / .agent-fab) */

/* duży napis „Admin platformy" w sidebarze panelu platformy */
.admin-tytul{ font-family:var(--serif); font-size:19px; font-weight:700; color:var(--paper);
  padding:4px 8px 14px; border-bottom:1px solid var(--linia); margin-bottom:10px }

/* Zespół: karty profili (avatar/stanowisko/kontakt/menu) */
.zesp-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(218px,1fr)); gap:14px; margin-top:8px }
.zesp-karta{ position:relative; background:var(--ink-2); border:1px solid var(--linia); border-radius:0; padding:20px 18px; text-align:center }
.zesp-menu{ position:absolute; top:10px; right:10px }
.zesp-kropki{ background:none; border:0; cursor:pointer; color:var(--mut); font-size:18px; line-height:1; padding:4px 9px; border-radius:0}
.zesp-kropki:hover{ background:var(--ink-3); color:var(--paper) }
.zesp-drop{ position:absolute; right:0; top:32px; background:var(--ink-2); border:1px solid var(--linia); border-radius:0;
  box-shadow:0 18px 50px -22px rgba(0,0,0,.7); padding:6px; min-width:184px; z-index:5; display:flex; flex-direction:column }
.zesp-drop[hidden]{ display:none }
.zesp-drop button{ background:none; border:0; cursor:pointer; text-align:left; font:inherit; font-size:13.5px; color:var(--paper); padding:9px 12px; border-radius:0; width:100% }
.zesp-drop button:hover{ background:var(--ink-3) }
.zesp-drop .zesp-usun{ color:#e7b6a7 }
.zesp-awatar{ width:64px; height:64px; border-radius:50%; margin:6px auto 12px; background:var(--orange); color:#fff; display:grid; place-items:center; font-size:23px; font-weight:700 }
.zesp-imie{ font-size:17px; font-weight:600 }
.zesp-badge{ display:inline-block; margin-top:8px; font-size:11px; font-weight:700; letter-spacing:.03em; color:var(--orange); background:rgba(242,57,0,.12); border-radius:0; padding:3px 12px; text-transform:uppercase }
.zesp-dzial{ color:var(--mut); font-size:12.5px; margin-top:6px }
.zesp-linia{ border-top:1px solid var(--linia); margin:14px 0 12px }
.zesp-kontakt{ display:flex; gap:8px; align-items:center; justify-content:center; color:var(--paper-2); font-size:13px; margin-top:4px }
.zesp-projekty{ display:block; margin-top:12px; color:var(--mut); font-size:12.5px }
.zesp-zobacz{ color:var(--orange) }
.zesp-klik{ cursor:pointer; transition:border-color .15s, transform .05s }
.zesp-klik:hover{ border-color:var(--mut) }
.zesp-klik:active{ transform:scale(.997) }
.zesp-awatar img{ width:100%; height:100%; object-fit:cover; border-radius:50% }
.zesp-awatar-lg{ width:80px; height:80px; font-size:28px; margin:0 }
/* nagłówek grupy działu (struktura zespołu) */
.zesp-dzial-h{ font-size:14px; font-family:var(--ui); font-weight:600; color:var(--paper-2);
  margin:22px 0 10px; padding-bottom:6px; border-bottom:1px solid var(--linia); display:flex; align-items:center; gap:8px }
.zesp-dzial-h span{ font-size:12px; color:var(--mut); background:var(--ink-3); border-radius:0; padding:1px 9px }
/* profil osoby (okienko) */
.profil-glowa{ display:flex; gap:14px; align-items:center; margin-bottom:14px }
.profil-imie{ font-size:18px; font-weight:600; font-family:var(--serif) }
.profil-stan{ color:var(--paper-2); font-size:14px }
.profil-dzial{ color:var(--mut); font-size:13px }
.profil-meta{ display:flex; flex-direction:column; gap:4px; font-size:13.5px; color:var(--paper-2);
  border-top:1px solid var(--linia); border-bottom:1px solid var(--linia); padding:12px 0; margin-bottom:12px }
.profil-tytuly h4{ margin:0 0 8px; font-size:13px; color:var(--mut); text-transform:uppercase; letter-spacing:.04em }
.profil-tyt{ display:flex; align-items:baseline; gap:8px; padding:8px 0; border-top:1px solid var(--linia);
  text-decoration:none; color:var(--paper); font-size:13.5px }
.profil-tyt:first-of-type{ border-top:0 }
.profil-tyt:hover .profil-tyt-t{ color:var(--orange) }
.profil-tyt-nr{ color:var(--mut); font-variant-numeric:tabular-nums; flex:0 0 auto }
.profil-tyt-t{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.profil-tyt-meta{ color:var(--mut); font-size:11.5px; white-space:nowrap; flex:0 0 auto }
.profil-akcje{ margin-top:14px; text-align:right }
/* sekcja zdjęcia w modalu edycji */
.e-foto-row{ display:flex; gap:14px; align-items:flex-start; margin-top:14px; padding-top:14px; border-top:1px solid var(--linia) }
.e-foto-akcje{ flex:1; min-width:0 }
.e-foto-row input[type=file]{ font-size:12.5px; color:var(--mut); max-width:100% }

/* edytor wyceny (wolne pozycje – pusto, dodajesz ręcznie) */
.wyc-scroll{ overflow-x:auto }
.wyc-tab{ width:100%; border-collapse:collapse; font-size:13.5px; min-width:780px }
.wyc-tab th{ text-align:left; color:var(--mut); font-weight:500; font-size:12px; padding:8px; border-bottom:1px solid var(--linia); white-space:nowrap }
.wyc-tab td{ padding:6px 8px; border-bottom:1px solid var(--linia); vertical-align:middle }
.wyc-tab td.lp{ color:var(--mut); text-align:center }
.wyc-tab input, .wyc-tab select{ width:100%; min-height:38px; padding:8px 10px }
.wyc-tab .netto, .wyc-tab .kvat, .wyc-tab .brutto{ font-variant-numeric:tabular-nums; color:var(--paper-2) }
.wyc-ik{ background:none; border:0; cursor:pointer; color:var(--mut); font-size:15px; padding:4px 6px; border-radius:0}
.wyc-ik:hover{ background:var(--ink-3); color:var(--paper) }
.wyc-dodaj{ background:none; border:0; cursor:pointer; color:var(--orange); font:inherit; font-weight:600; font-size:14px; padding:10px 2px; margin-top:2px }
.wyc-sumy{ margin-top:16px; max-width:520px; margin-left:auto }

/* Harmonogram prac (etapy + zadania na osi czasu) */
/* === interaktywny harmonogram (oś dzienna) === */
.hg-karta .hg-top{ display:flex; justify-content:flex-start; align-items:center; gap:10px; flex-wrap:wrap }
.hg-top-akcje{ display:flex; gap:8px; flex-wrap:wrap; margin-left:auto }
.hg-legenda{ display:flex; gap:18px; align-items:center; flex-wrap:wrap; font-size:12px; color:var(--mut); margin:6px 0 12px }
.hg-legenda i.hg-sw{ display:inline-block; width:12px; height:12px; border-radius:3px; vertical-align:-2px; margin-right:6px }
.hg-sw.wd{ background:rgba(34,160,86,.5) }
.hg-sw.we{ background:rgba(229,66,0,.5) }
.hg-sw.dzis{ width:3px; height:13px; border-radius:0; background:#2b2f38; margin-right:7px }
.hg-legenda-hint{ margin-left:auto }
.hg{ display:flex; align-items:flex-start; border:1px solid var(--linia); border-radius:0; background:var(--ink-2) }
/* lewy panel: info + edycja */
.hg-info{ flex:0 0 auto; width:760px; border-right:1px solid var(--linia); background:var(--ink-2); position:relative; z-index:2 }
.hg-info-head, .hg-info-row{ display:flex; align-items:center; gap:8px; height:48px; padding:0 14px; border-top:1px solid var(--linia); font-size:13px }
.hg-grp .c-zad{ gap:5px }
.hg-info-head{ height:46px; border-top:0; color:var(--paper-2); font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.06em; background:var(--ink-3); border-bottom:2px solid var(--linia) }
.hg-info-head .c-zad{ font-weight:700 }
.hg-grp{ background:var(--ink-3); font-weight:600 }
.hg-tag{ font-size:8.5px; color:var(--orange); font-weight:700; letter-spacing:.05em;
  border:1px solid color-mix(in srgb, var(--orange) 45%, transparent); border-radius:999px;
  padding:1px 6px; background:color-mix(in srgb, var(--orange) 9%, transparent); flex:0 0 auto }
/* ikony liniowe zamiast emoji: folder (produkt) neutralny, kalendarz (zadanie) indygo */
.hg-fold{ flex:0 0 auto; display:inline-flex; align-items:center; color:var(--paper-2) }
.hg-fold svg{ display:block }
.hg-zad-ikona{ flex:0 0 auto; display:inline-flex; align-items:center; color:#6366f1 }
.hg-zad-ikona svg{ display:block }
.hg-grp-nazwa{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.hg-licz{ flex:0 0 auto; font-size:11px; font-weight:600; color:var(--mut);
  background:var(--ink-2); border:1px solid var(--linia); border-radius:999px; padding:0 7px; line-height:17px; min-width:17px; text-align:center }
.hg-info .c-zad{ flex:1 1 auto; min-width:0; display:flex; align-items:center; gap:6px; overflow:visible; white-space:nowrap;
  background:transparent; border:0; padding:0; margin:0 }
/* wiersz produktu nie może przycinać menu „⋮" (popover wychodzi poza komórkę);
   nazwa i tytuł mają własny ellipsis, więc brak overflow:hidden ich nie psuje */
.hg-grp .c-zad{ overflow:visible }
.hg-info .c-zad strong{ overflow:hidden; text-overflow:ellipsis }
.hg-info-row.hg-sub{ background:var(--ink-2) }
.hg-sub .c-zad{ padding-left:30px; color:var(--paper-2); font-weight:400 }
.hg-zad-tyt{ flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.hg-info .c-st{ flex:0 0 92px }
/* status: bez boxa – sama kropka + tekst w tym samym kolorze co kropka (produkt i zadanie) */
.hg-info .c-st .chip{ background:transparent; border:0; padding:0; font-size:13px; font-weight:600; gap:8px }
.hg-info .c-st .chip::before{ width:9px; height:9px }
.hg-info .c-st .chip.k-niebieski{ color:#4a5bd0 }  .hg-info .c-st .chip.k-niebieski::before{ background:#4a5bd0 }
.hg-info .c-st .chip.k-zolty{ color:#a07512 }      .hg-info .c-st .chip.k-zolty::before{ background:#a07512 }
.hg-info .c-st .chip.k-zielony{ color:#2f9e6f }    .hg-info .c-st .chip.k-zielony::before{ background:#2f9e6f }
.hg-info .c-st .chip.k-szary{ color:#8c867c }      .hg-info .c-st .chip.k-szary::before{ background:#8c867c }
.hg-info .c-st .chip.k-czerwony{ color:#d0603f }   .hg-info .c-st .chip.k-czerwony::before{ background:#d0603f }
.hg-info .c-st .chip.k-pomarancz{ color:#d2691e }  .hg-info .c-st .chip.k-pomarancz::before{ background:#d2691e }
/* przycisk-toggle statusu zadania ręcznego – pełny reset UA, by zaczynał się w tym samym
   miejscu w pionie co status produktu (span) */
.hg-info .c-st .hg-chip-btn{ border:0; background:transparent; padding:0; margin:0; font:inherit; text-align:left; cursor:pointer }
.hg-info .c-st .hg-st-form{ display:inline; margin:0; padding:0 }
/* daty: jednolite okienka tej samej wielkości i ten sam zapis (kropki, tabular-nums) */
.c-dat2{ flex:0 0 104px }
.c-dat{ display:flex; gap:8px; flex:0 0 216px; margin:0 }
/* edytowalne daty produktu wyglądają jak tekst (bez ramki/ikony), ale zostają klikalne */
/* podwojona klasa .c-dat.c-dat → wyższa specyficzność (0,5,1) niż globalny styl pól
   .wyd-app input:not(...) (0,4,1); wygrywa wagą, nie kolejnością w pliku (tło/ramka/min-height) */
.wyd-app .hg .c-dat.c-dat input[type=date], .plan-strona .hg .c-dat.c-dat input[type=date]{
  flex:1 1 0; min-width:0; width:auto; min-height:0; appearance:none; -webkit-appearance:none;
  font-family:inherit; font-weight:inherit; font-size:12.5px; font-variant-numeric:tabular-nums;
  padding:2px 0; background:transparent; border:0; border-radius:5px; box-shadow:none;
  color:var(--paper); color-scheme:light; cursor:pointer }
.wyd-app .hg .c-dat.c-dat input[type=date]:hover, .wyd-app .hg .c-dat.c-dat input[type=date]:focus,
.plan-strona .hg .c-dat.c-dat input[type=date]:hover, .plan-strona .hg .c-dat.c-dat input[type=date]:focus{
  background:color-mix(in srgb, var(--paper) 8%, transparent); border:0; box-shadow:none; outline:0 }
/* daty produktu (input) i zadania (tekst) muszą zaczynać się w tym samym miejscu w pionie */
.hg .c-dat input[type=date]::-webkit-datetime-edit{ padding:0 }
.c-dat input[type=date]::-webkit-calendar-picker-indicator{ opacity:0; width:10px; margin:0; cursor:pointer }
.c-dat2.hg-ro{ color:var(--paper); font-variant-numeric:tabular-nums; font-size:12.5px; white-space:nowrap }
.hg-x{ display:inline; margin:0 }
.hg-x button{ border:0; background:transparent; color:var(--mut); cursor:pointer; font-size:11px; padding:0 3px; line-height:1 }
.hg-x button:hover{ color:var(--orange) }
/* nagłówek produktu: + (dodaj zadanie) i ⋮ (menu) */
.hg-plus{ flex:0 0 auto; width:22px; height:22px; border:1px solid var(--linia); border-radius:6px;
  background:var(--ink-2); color:var(--orange); font-size:15px; font-weight:600; line-height:1; cursor:pointer; padding:0 }
.hg-plus:hover{ border-color:var(--orange); background:color-mix(in srgb, var(--orange) 10%, transparent) }
.hg-menu{ flex:0 0 auto; position:relative; display:inline-block }
/* menu „⋮" zadania wyrównane do prawej krawędzi komórki – w jednej kolumnie z „⋮" produktu */
.hg-menu-zad{ margin-left:auto }
.hg-menu summary{ list-style:none; cursor:pointer; width:22px; height:22px; line-height:20px; text-align:center;
  border:1px solid transparent; border-radius:6px; color:var(--mut); font-size:16px; user-select:none }
.hg-menu summary::-webkit-details-marker{ display:none }
.hg-menu summary:hover{ border-color:var(--linia); color:var(--paper) }
.hg-menu[open] summary{ border-color:var(--linia); background:var(--ink-2) }
.hg-menu-pop{ position:absolute; right:0; top:26px; z-index:20; min-width:180px;
  background:var(--ink-2); border:1px solid var(--linia); border-radius:8px; box-shadow:0 6px 22px rgba(0,0,0,.18); padding:5px }
.hg-menu-pop form{ margin:0 }
.hg-menu-pop button{ display:flex; align-items:center; gap:11px; width:100%; text-align:left; border:0;
  background:transparent; cursor:pointer; font:inherit; font-size:14px; padding:9px 11px; border-radius:7px; color:var(--paper) }
.hg-menu-pop button:hover{ background:var(--ink-3) }
.hg-menu-pop button svg{ width:16px; height:16px; flex:0 0 auto; color:var(--mut) }
.hg-menu-pop button.hg-del{ color:#d92d20 }
.hg-menu-pop button.hg-del svg{ color:#d92d20 }
.hg-osoba{ flex:0 0 auto; width:22px; height:22px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center;
  font-size:9.5px; font-weight:700; letter-spacing:.02em; background:color-mix(in srgb, var(--orange) 16%, var(--ink-2));
  color:var(--orange); border:1px solid color-mix(in srgb, var(--orange) 35%, transparent) }
/* prawy panel: oś czasu */
.hg-time{ flex:1 1 auto; min-width:0; overflow-x:auto; -webkit-overflow-scrolling:touch }
.hg-time-inner{ position:relative }
.hg-bg{ position:absolute; left:0; right:0; top:46px; bottom:0; z-index:0;
  background-image:repeating-linear-gradient(90deg, transparent 0, transparent calc(var(--hg-col) - 1px),
    var(--linia) calc(var(--hg-col) - 1px), var(--linia) var(--hg-col)) }
/* pionowe pasy dni: robocze (pn–pt) zielono, weekend (sb/nd) czerwono */
.hg-col{ position:absolute; top:0; bottom:0 }
.hg-col.wd{ background:rgba(34,160,86,.09) }
.hg-col.we{ background:rgba(229,66,0,.11) }
/* znacznik „dziś": cienka neutralna linia + flaga z napisem (nie czerwona) */
.hg-today{ position:absolute; top:46px; bottom:0; width:2px; margin-left:-1px;
  background:color-mix(in srgb, var(--paper-2) 55%, transparent); z-index:6; pointer-events:none }
/* pill ma STAŁY ciemny kolor (nie var(--paper-2), bo ten flipuje jasność między motywami
   → biały tekst na prawie-białym tle w motywie ciemnym). Czytelny w jasnym i ciemnym. */
.hg-today b{ position:absolute; top:0; left:50%; transform:translateX(-50%); font-size:9px; font-weight:700;
  letter-spacing:.04em; color:#fff; background:#2b2f38; padding:1px 7px; border-radius:0 0 6px 6px;
  white-space:nowrap; box-shadow:0 1px 3px rgba(0,0,0,.22) }
.hg-axis{ position:relative; z-index:1; height:46px; border-bottom:1px solid var(--linia) }
.hg-msc{ position:relative; height:18px }
.hg-msc span{ position:absolute; top:3px; font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--mut); padding-left:4px }
.hg-dni{ position:relative; height:28px }
.hg-dni span{ position:absolute; top:0; height:28px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-size:9px; color:var(--mut); border-left:1px solid var(--linia); line-height:1.1 }
.hg-dni span b{ font-size:11px; color:var(--paper); font-weight:600 }
.hg-dni span.we{ background:rgba(229,66,0,.11) }
.hg-dni span.dzis b{ color:var(--paper) }
.hg-rows{ position:relative; z-index:1 }
.hg-track{ position:relative; height:48px; border-top:1px solid var(--linia) }
.hg-track-grp{ background:rgba(127,127,127,.05) }
/* odstęp między produktami (po obu stronach – musi być równy, by wiersze były zsynchronizowane) */
.hg-grp-sep{ height:14px }
.hg-track-sep{ height:14px }
/* pasek akcji pod ostatnim zadaniem: Dodaj zadanie / Dodaj produkt */
.hg-dod-bar{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px }
.hg-pas{ position:absolute; top:50%; transform:translateY(-50%); height:26px; border-radius:8px; min-width:8px; box-shadow:0 1px 3px rgba(0,0,0,.2) }
.hg-pas-etap{ height:28px; background:#6f76b0 }
.hg-drag{ cursor:grab; touch-action:none }
.hg-drag.ciagne{ cursor:grabbing; opacity:.85; box-shadow:0 2px 8px rgba(0,0,0,.35) }
.hg-st-form{ display:inline; margin:0 }
.hg-chip-btn{ border:0; cursor:pointer; font:inherit; padding:2px 8px }
.hg-pas.k-zielony{ background:#2f9e6f } .hg-pas.k-zolty{ background:#d8a23a }
.hg-pas.k-niebieski{ background:#5566c9 } .hg-pas.k-szary{ background:#9aa0a8 }
/* pasek narzędzi: dodaj etap / zadanie */
@media (max-width:760px){ .hg-info{ width:220px } .c-dat, .hg-info .c-dat2{ display:none } }
@media print{
  .hg-time{ overflow:visible }
  .hg-x, .hg-plus, .hg-menu, .hg-top-akcje, .hg-legenda-hint{ display:none }
  /* oddaj tła/kolory na wydruku (flaga „dziś", pasy dni, paski Gantta) */
  .hg, .hg *{ -webkit-print-color-adjust:exact; print-color-adjust:exact }
}

/* tabela tytułów: szeroka, przewijalna w prawo, kolumna Numer zakotwiczona (sticky-left) */
.wyd-tab-scroll{ overflow-x:auto; border:1px solid var(--linia); border-radius:0; background:var(--ink-2);
  -webkit-overflow-scrolling:touch }
.wyd-tabela-szer{ min-width:1180px; margin:0 }
.wyd-tabela-szer th, .wyd-tabela-szer td{ white-space:nowrap; padding-left:14px; padding-right:14px }
.wyd-tabela-szer .kol-nr{ position:sticky; left:0; z-index:3; background:var(--ink-2);
  box-shadow:1px 0 0 var(--linia); font-variant-numeric:tabular-nums }
.wyd-tabela-szer thead .kol-nr{ z-index:4 }
.wyd-tabela-szer tbody tr:hover .kol-nr{ background:var(--ink-3) }
.wyd-tabela-szer .kol-prod{ text-align:center }
.wyd-tabela-szer .kol-prod .pr-ok{ color:#3aa55d; font-weight:700; font-size:15px }
.wyd-tabela-szer .kol-prod .pr-no{ color:var(--orange); font-weight:700; font-size:15px }
.wyd-tabela-szer .kol-prod .pr-brak{ color:var(--mut) }

/* zwijalne sekcje szczegółów zlecenia (toggle) */
.plan-karta > .karta-naglowek{ cursor:pointer; user-select:none }
.plan-karta > .karta-naglowek::after{ content:'⌄'; float:right; color:var(--mut); margin-left:10px;
  font-size:15px; line-height:1.4; transition:transform .15s ease }
.plan-karta.zwin > .karta-naglowek::after{ transform:rotate(-90deg) }
.plan-karta.zwin > .karta-naglowek{ margin-bottom:0 }
.plan-karta.zwin > .karta-naglowek h2{ margin-bottom:0 }
.plan-karta.zwin > .karta-body{ display:none }

/* numer zlecenia w widoku Tablica (nad tytułem) i Etapy (lewa kolumna) */
.kanban-karta-nr{ font-size:11.5px; color:var(--mut); font-weight:600; font-variant-numeric:tabular-nums; margin-bottom:3px }
.etap-rzad .etap-nr-zlec{ flex:0 0 62px; font-size:13px; font-weight:600; color:var(--paper-2);
  font-variant-numeric:tabular-nums; white-space:nowrap }

/* === dashboard wydawnictwa === */
.dash-seg{ display:inline-flex; border:1px solid var(--linia); border-radius:0; overflow:hidden }
.dash-seg a{ padding:7px 16px; font-size:13px; color:var(--mut); text-decoration:none }
.dash-seg a.on{ background:var(--orange); color:#fff; font-weight:600 }
.dash-moje-tag{ font-size:12px; color:var(--mut); border:1px solid var(--linia); border-radius:0; padding:6px 14px }
.dash-kpi{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; margin-bottom:14px }
.dash-card{ display:flex; flex-direction:column; gap:2px; background:var(--ink-2); border:1px solid var(--linia);
  border-radius:0; padding:14px 16px; text-decoration:none; color:var(--paper); transition:border-color .15s }
a.dash-card:hover{ border-color:var(--mut) }
.dash-l{ font-size:12.5px; color:var(--mut) }
.dash-n{ font-size:27px; font-weight:700; font-family:var(--serif); line-height:1.1; font-variant-numeric:tabular-nums }
.dash-s{ font-size:12px; color:var(--mut) }
.dash-s.pilne{ color:var(--orange); font-weight:600 }
.dash-finanse{ font-size:13px; color:var(--mut); margin:2px 0 18px }
.dash-finanse b{ color:var(--paper); font-variant-numeric:tabular-nums }
.dash-2kol{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px }
.dash-h{ font-size:15px; margin:0 0 8px; display:flex; align-items:baseline; gap:8px }
.dash-h-sub{ font-size:11px; color:var(--mut); font-weight:400; text-transform:uppercase; letter-spacing:.04em }
.dash-poz{ display:flex; align-items:center; gap:9px; padding:8px 0; border-top:1px solid var(--linia);
  text-decoration:none; color:var(--paper); font-size:13.5px }
.dash-poz:first-of-type{ border-top:0 }
.dash-poz:hover .dash-poz-t{ color:var(--orange) }
.dash-poz-t{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.dash-poz-nr{ font-size:11px; color:var(--mut); font-variant-numeric:tabular-nums }
.dash-kropka{ width:8px; height:8px; border-radius:50%; flex:0 0 8px; background:var(--mut) }
.dash-kropka.p3{ background:var(--orange) } .dash-kropka.p2{ background:#d8a23a } .dash-kropka.p1{ background:var(--mut) }
.dash-mut{ color:var(--mut) }
.dash-termin{ font-size:12px; color:var(--mut); white-space:nowrap; font-variant-numeric:tabular-nums }
.dash-termin.po{ color:var(--orange); font-weight:600 } .dash-termin.dzis{ color:#d8a23a; font-weight:600 }
.dash-pusto{ color:var(--mut); font-size:13px; margin:6px 0 0 }
.dash-lejek{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; text-align:center }
.dash-lejek-seg{ text-decoration:none; color:var(--paper); display:flex; flex-direction:column; align-items:center; gap:4px }
.dash-lejek-bar{ height:6px; width:100%; background:var(--linia); border-radius:0}
.dash-lejek-seg:hover .dash-lejek-bar{ background:var(--orange) }
.dash-lejek-n{ font-size:22px; font-weight:700; font-variant-numeric:tabular-nums }
.dash-lejek-l{ font-size:12px; color:var(--mut) }
.dash-obc{ margin:8px 0 }
.dash-obc-top{ display:flex; justify-content:space-between; font-size:13px }
.dash-obc-tor{ height:6px; background:var(--ink-3); border-radius:0; margin-top:4px; overflow:hidden }
.dash-obc-fill{ height:6px; background:var(--orange); border-radius:0; min-width:4px }
.dash-akt{ display:flex; flex-direction:column; gap:1px; padding:7px 0; border-top:1px solid var(--linia);
  text-decoration:none; color:var(--paper) }
.dash-akt:first-of-type{ border-top:0 }
.dash-akt-t{ font-size:13px } .dash-akt:hover .dash-akt-t{ color:var(--orange) }
.dash-akt-m{ font-size:11px; color:var(--mut) }
@media (max-width:820px){ .dash-2kol{ grid-template-columns:1fr } .dash-lejek{ grid-template-columns:repeat(2,1fr); gap:14px } }

/* ocena pracy recenzenta (gwiazdki) */
.rec-ocena{ display:flex; align-items:center; gap:2px; margin:10px 0 0; flex-wrap:wrap }
.rec-ocena-l{ font-size:12.5px; color:var(--mut); margin-right:6px }
.rec-gwiazda{ background:0; border:0; cursor:pointer; font-size:18px; line-height:1; color:var(--linia); padding:0 1px }
.rec-gwiazda.on{ color:#d8a23a }
.rec-gwiazda:hover{ color:#d8a23a }
.rec-ocena-x{ background:0; border:0; cursor:pointer; color:var(--mut); font-size:11.5px; margin-left:8px; text-decoration:underline }

/* ============================================================
   RESPONSYWNOŚĆ – dociągnięcie do szerokości okna (audyt 16.06)
   ============================================================ */
/* lokalne przewijanie szerokich tabel (klienci itp.) zamiast scrolla całej strony */
.tab-przewij{ overflow-x:auto; -webkit-overflow-scrolling:touch }
@media (max-width:760px){ .tab-przewij .wyd-tabela{ min-width:680px } }
/* menu „⋮" w wierszu tabeli – pozycjonowane fixed JS-em, by nie ciąć w kontenerze .tab-przewij */
.wyd-tabela td.c-akcje{ width:44px; text-align:right; padding-right:8px }
.wier-tog{ width:28px; height:28px; line-height:26px; text-align:center; border:1px solid transparent;
  border-radius:8px; background:transparent; color:var(--mut); cursor:pointer; font-size:18px }
.wier-tog:hover{ border-color:var(--linia); color:var(--paper); background:var(--ink-2) }
.wier-menu{ position:fixed; z-index:60; min-width:190px; background:var(--ink-2); border:1px solid var(--linia);
  border-radius:12px; box-shadow:0 12px 32px rgba(0,0,0,.18); padding:6px; display:none }
.wier-menu form{ margin:0 }
.wier-menu button{ display:flex; align-items:center; gap:11px; width:100%; text-align:left; border:0;
  background:transparent; padding:9px 11px; border-radius:8px; cursor:pointer; font:inherit; font-size:14px; color:var(--paper) }
.wier-menu button:hover{ background:var(--ink-3) }
.wier-menu button svg{ width:16px; height:16px; flex:0 0 auto; color:var(--mut) }
.wier-menu button.wm-del{ color:#d92d20 }
.wier-menu button.wm-del svg{ color:#d92d20 }
/* obieg umowy — klocki etapów (stepper): wyszarzone / aktywny / podpisany */
.umowa-kroki{ display:flex; gap:10px; flex-wrap:wrap }
.umowa-kroki .kr{ flex:1 1 0; min-width:128px; border:1px solid var(--linia); border-radius:0;
  padding:14px; background:var(--ink-3); text-align:center }
.umowa-kroki .kr-nr{ width:26px; height:26px; line-height:24px; margin:0 auto 7px; border-radius:999px;
  border:1px solid var(--linia); font-weight:700; font-size:13px; color:var(--mut); background:var(--ink-2) }
.umowa-kroki .kr-etk{ font-weight:600; font-size:14px; color:var(--paper) }
.umowa-kroki .kr-opis{ font-size:12px; color:var(--mut); margin-top:2px }
.umowa-kroki .kr-szary{ opacity:.55 }
.umowa-kroki .kr-akt{ border-color:var(--orange); background:rgba(242,57,0,.08) }
.umowa-kroki .kr-akt .kr-nr{ background:var(--orange); color:#fff; border-color:var(--orange) }
.umowa-kroki .kr-done{ border-color:#16a34a; background:rgba(22,163,74,.09) }
.umowa-kroki .kr-done .kr-nr{ background:#16a34a; color:#fff; border-color:#16a34a }
.umowa-kroki .kr-done .kr-etk{ color:#16a34a }
/* pola wyboru pliku — przycisk „Wybierz plik" w stylu UI (zamiast natywnego) */
.wyd-app input[type=file]{ font-size:13px; color:var(--mut); max-width:100% }
.wyd-app input[type=file]::file-selector-button{ font-family:inherit; font-size:13px; font-weight:600;
  border:1px solid var(--linia); background:var(--ink-3); color:var(--paper); padding:8px 14px;
  border-radius:9px; margin-right:11px; cursor:pointer }
.wyd-app input[type=file]::file-selector-button:hover{ background:var(--ink-2); border-color:var(--paper-2) }

/* tablet / wąski desktop: mniejszy padding treści, węższy panel harmonogramu */
@media (max-width:1100px) and (min-width:761px){ .wyd-main{ padding:26px 22px 60px } }
@media (max-width:1024px){ .hg-info{ width:460px } }
@media (max-width:900px){ .hg-info{ width:360px } .hg-info .c-dat{ flex-basis:150px } .hg-info .c-dat2{ flex-basis:71px } .hg-info .c-st{ flex-basis:84px } }

/* topbar: nie zawijaj długiego linku w dwie linie; karty kanban łam długie ciągi */
.wyd-topbar .t-akcja{ white-space:nowrap; flex:0 0 auto }
.kanban-karta-tt, .kanban-karta-sub, .kanban-karta-meta{ overflow-wrap:anywhere; word-break:break-word }

/* mobile: topbar wchodzi w flow (koniec nachodzenia na treść), nav się zawija */
@media (max-width:760px){
  .wyd-topbar{ position:static; left:0; height:auto; min-height:52px; flex-wrap:wrap; padding:8px 16px }
  body.wyd-app .wyd-main{ padding-top:20px }
  .wyd-nav{ flex-wrap:wrap }
  .wyd-nav a.wyd-nav-dol{ border-top:0; padding-top:8px; margin-top:0 }
  .hg-info .c-st{ flex:0 0 auto }
}

/* telefon: zwarty topbar (bez długiego linku „Centrum”), ciaśniejsze karty/kontenery */
@media (max-width:560px){
  .wyd-topbar{ padding:8px 12px; gap:6px }
  .wyd-topbar-prawa{ gap:6px; flex-wrap:wrap; row-gap:6px }
  .wyd-topbar .t-akcja{ display:none }
  .wyd-topbar-logo{ max-width:140px }
  .user-imie{ max-width:90px }
  .centrum-wrap, .plan-wrap{ padding-left:16px; padding-right:16px }
  .centrum-wrap h1{ font-size:30px }
  .plan-wrap h1{ font-size:32px }
  .plan-strona .plan-karta{ padding:18px 16px }
  .km-msg{ max-width:92% }
}
@media (max-width:380px){
  .karta-bramka{ padding:30px 22px 26px }
  body.bramka{ padding:24px 12px }
}

/* --- kod rabatowy na stronie planu + panel admina kodów --- */
.plan-kod{max-width:520px;margin:26px auto 0;text-align:center}
.plan-kod label{display:block;font-weight:600;margin-bottom:8px;font-size:14px}
.plan-kod-row{display:flex;gap:10px;align-items:center}
.plan-kod-row input{flex:1;padding:15px 16px;font-size:16px;border:1.5px solid var(--linia);border-radius:11px;font-family:inherit;background:var(--pole,#fff);color:inherit}
.plan-kod-row input:focus{outline:none;border-color:var(--terra,#F23900)}
.plan-kod-row button,.plan-strona .plan-kod-row .btn-linia{width:auto;flex:0 0 auto;padding:9px 16px;font-size:13.5px;white-space:nowrap}
.kod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px}
.kod-form label{display:block;font-size:13px;font-weight:600;margin-bottom:10px;color:var(--mut)}
.kod-form input{width:100%;padding:9px 11px;border:1.5px solid var(--linia);border-radius:8px;font:inherit;margin-top:4px;background:var(--pole,#fff);color:inherit}
.btn-maly{padding:5px 12px;font-size:13px}
@media(max-width:640px){.kod-grid{grid-template-columns:1fr 1fr}}

/* --- brief w zleceniu: link autora + wysyłka e-mailem --- */
.brief-box .brief-box-pod{margin:2px 0 12px;color:var(--mut);font-size:13.5px}
.brief-link-row{display:flex;gap:8px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.brief-link-row input{flex:1;min-width:220px;padding:9px 11px;border:1.5px solid var(--linia);
  border-radius:9px;font:inherit;font-size:13px;background:var(--pole,#fff);color:var(--mut)}
.brief-mail-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.brief-mail-row input[type=email]{flex:1;min-width:220px;padding:11px 12px;border:1.5px solid var(--linia);
  border-radius:9px;font:inherit;background:var(--pole,#fff);color:inherit}
.brief-mail-row input[type=email]:focus{outline:none;border-color:var(--terra,#F23900)}
.brief-mail-row .btn-pelny{flex:0 0 auto}
.brief-wyslano{margin:10px 0 0;font-size:13px;color:var(--mut)}
/* nadpisanie globalnych .plan-strona … {width:100%} – rzędy mają zostać rzędami */
.brief-link-row input,.brief-mail-row input[type=email]{width:auto}
.brief-link-row .btn-linia,.brief-mail-row .btn-pelny{width:auto;flex:0 0 auto;white-space:nowrap}
.brief-link-row a.btn-linia{display:inline-flex;align-items:center;text-decoration:none}

/* topbar na wąskich ekranach: bez poziomego scrolla, najpierw znikają linki i imię */
@media (max-width:680px){
  .topbar{gap:8px}
  .topbar .t-akcja{display:none}
  .topbar .user-imie{display:none}
  .topbar .wyd-motyw button{padding:4px 7px}
}