/* ── Arkusz: dolna szuflada-arkusz ── */
.drawer { flex:0 0 var(--drawer-h); min-height:96px; position:relative; background:var(--surface); border-top:1px solid var(--border);
  display:flex; flex-direction:column; min-width:0; }
/* wrap: przy wąskim oknie legenda listy schodzi do drugiej linii zamiast wyjechać poza ekran */
.drawer-inner { flex:1; min-height:0; display:flex; flex-direction:column; }
/* uchwyty zmiany rozmiaru — wzorzec z APS (.panel-resize / .addpanel-resize) */
.drawer-resize { position:absolute; top:-3px; left:0; right:0; height:7px; cursor:ns-resize; z-index:8; }
.drawer-resize:hover::after, body.resizing-y .drawer-resize::after { content:""; position:absolute;
  left:0; right:0; top:3px; height:2px; background:var(--accent); }
.dt-resize { position:absolute; left:-3px; top:0; bottom:0; width:7px; cursor:ew-resize; z-index:8; }
.dt-resize:hover::after, body.resizing-x .dt-resize::after { content:""; position:absolute;
  top:0; bottom:0; left:3px; width:2px; background:var(--accent); }
body.resizing-x, body.resizing-y { user-select:none; }
body.resizing-x * { cursor:ew-resize !important; }
body.resizing-y * { cursor:ns-resize !important; }
.dtabs { display:flex; align-items:center; flex-wrap:wrap; gap:2px; row-gap:0;
  padding:6px 10px 0; border-bottom:1px solid var(--border); }
.dtab { display:flex; align-items:center; gap:6px; padding:6px 11px 8px; color:var(--ink2);
  font-weight:700; font-size:12px; border-bottom:2px solid transparent; white-space:nowrap; }
.dtab:hover { color:var(--ink); }
.dtab.on { color:var(--ink); border-bottom-color:var(--accent); }
/* fokus na osi: aktywna zakładka zostaje, ale jej podkreślenie gaśnie z niebieskiego na szare */
.dtab.on.nofocus { border-bottom-color:rgba(255,255,255,.28); }
.dtab .cnt { background:var(--track); border:1px solid var(--border); color:var(--muted);
  border-radius:999px; font-size:10px; padding:0 6px; font-weight:700; }
.dtab .load { color:var(--muted); font-size:10px; font-weight:700; }
.dtab .load.warn { color:var(--warn); } .dtab .load.crit { color:var(--crit-hi); }
.dtabs .dhint { margin-left:auto; color:var(--muted); font-size:10.5px; padding-bottom:6px; white-space:nowrap; }
.dbody { flex:1; min-height:0; overflow:auto; padding:0 0 12px; }
table.sheet { width:100%; min-width:1140px; border-collapse:separate; border-spacing:0; font-size:12px; }
/* # i TERMIN zostają na miejscu przy przewijaniu w bok; tło musi być NIEprzezroczyste,
   inaczej treść przejeżdżałaby pod spodem */
.sheet th:nth-child(1), .sheet td:nth-child(1) { position:sticky; left:0; z-index:2; background:var(--surface); }
.sheet th:nth-child(2), .sheet td:nth-child(2) { position:sticky; left:66px; z-index:2; background:var(--surface);
  min-width:78px; }
.sheet th:nth-child(1), .sheet th:nth-child(2) { z-index:4; }
.sheet tr:hover td:nth-child(-n+2) { background:#20201f; }
.sheet tr.sel td:nth-child(-n+2) { background:#1e2936; }
.sheet th { text-align:left; color:var(--muted); font-size:10px; letter-spacing:.06em; font-weight:800;
  padding:8px 10px 6px 0; border-bottom:1px solid var(--border); position:sticky; top:0;
  background:var(--surface); z-index:2; white-space:nowrap; }
.sheet th:last-child, .sheet td:last-child { padding-right:14px; }
.sheet td { padding:4px 10px 4px 0; border-bottom:1px solid rgba(255,255,255,.05); white-space:nowrap;
  color:var(--ink2); }
.sheet th { border-bottom:1px solid var(--border); }
.sheet td.strong { color:var(--ink); font-weight:700; }
.sheet td.num { font-variant-numeric:tabular-nums; }
.sheet td.prod { width:99%; max-width:0; overflow:hidden; text-overflow:ellipsis; }
.sheet tr { cursor:pointer; scroll-margin:34px 0 6px; }
.sheet tr:hover td { background:rgba(255,255,255,.03); }
.sheet tr.sel td { background:rgba(57,135,229,.14); }
.sheet tr.sel td:first-child { box-shadow:inset 3px 0 0 var(--accent); }
/* w planie = sprawa załatwiona: wiersz schodzi mocno w tło, ale zostaje (pozycja + kontrola) */
.sheet tr.used td { opacity:.2; }
.sheet tr.used:hover td { opacity:.45; }
.sheet tr.used.sel td { opacity:.5; }
/* przyklejone kolumny NIE mogą być półprzezroczyste — przez opacity przebijałaby
   treść przewijana pod spodem. Wygaszamy więc zawartość, nie komórkę. */
.sheet tr.used td:nth-child(-n+2) { opacity:1; }
.sheet tr.used td:nth-child(1) > *, .sheet tr.used td:nth-child(2) > * { opacity:.55; }
.sheet tr.used:hover td:nth-child(1) > *, .sheet tr.used:hover td:nth-child(2) > * { opacity:.8; }
/* Arkusz: zaznaczenie na osi = wash na CAŁEJ parze przezbrojenie+zlecenie; fokus osi = dodatkowo ring 2px */
.tlsel { position:absolute; top:1px; bottom:1px; border-radius:5px; background:rgba(57,135,229,.15);
  z-index:4; pointer-events:none; }
.tlsel.on { background:rgba(57,135,229,.22); box-shadow:0 0 0 2px var(--accent), 0 0 10px rgba(57,135,229,.4); }
/* Arkusz: drag & drop wiersza na oś */
.sheet tr[draggable="true"] { cursor:grab; }
.sheet tr[draggable="true"]:active { cursor:grabbing; }
/* Lane, ktory PRZYJMIE zlecenie: samo TLO, zero ramki (Stan 26.08). Ramka wygladala jak
   `.row.focus` — czyli „ta maszyna jest zaznaczona", a chodzi o „tu mozesz upuscic". */
.row-area.drop-target { background-color:rgba(57,135,229,.17); }
/* w trakcie ciągnięcia maszyny, które NIE udźwigną tego zlecenia, gasną — eligibility widać od razu */
.row.drag-off .row-label, .row-area.drag-off { opacity:.3; }
/* rail dozwolonej maszyny tez tylko tlem — `inset 3px` bylo dokladnie tym samym, czym znaczymy fokus */
.row.drag-ok .row-label { background:#1b2330; }

/* KARETKA UPUSZCZENIA — pokazuje, gdzie blok wyladuje. Byla niewidoczna: 2 px w kolorze bliskim
   tlu, w lane szerokim na ~1000 px. Teraz bialy rdzen + niebieska poswiata + strzalki na gorze
   i dole, pelna wysokosc lane i z-index ponad blokami. */
.dropcaret { position:absolute; top:0; bottom:0; width:4px; margin-left:-2px; z-index:30;
  background:#fff; pointer-events:none;
  box-shadow:0 0 0 1px rgba(57,135,229,1), 0 0 14px 4px rgba(57,135,229,.95);
  animation:caret-pulse .9s ease-in-out infinite; }
.dropcaret::before, .dropcaret::after { content:''; position:absolute; left:50%; transform:translateX(-50%);
  border-left:6px solid transparent; border-right:6px solid transparent;
  filter:drop-shadow(0 0 4px rgba(57,135,229,.9)); }
.dropcaret::before { top:0; border-top:8px solid #fff; }
.dropcaret::after { bottom:0; border-bottom:8px solid #fff; }
@keyframes caret-pulse { 0%, 100% { opacity:1; } 50% { opacity:.6; } }
@media (prefers-reduced-motion: reduce) { .dropcaret { animation:none; } }
/* duch przeciągania: wiersz zamienia się w kolorowy blok osi (bez przezbrojenia),
   szerokość ∝ czasowi zlecenia w skali osi — niesie się dokładnie to, co wyląduje na planie */
.dragghost { position:absolute; top:-1000px; left:-1000px; height:34px; border-radius:3px;
  display:flex; align-items:center; padding:0 8px; font-size:11.5px; font-weight:700; color:#fff;
  white-space:nowrap; overflow:hidden; pointer-events:none; z-index:100;
  box-shadow:0 6px 18px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.2); }
.dragghost .block-label { overflow:hidden; text-overflow:ellipsis; }
.sheet tr.dragging td { opacity:.35; }
.sheet tr.blk td:first-child { box-shadow:inset 3px 0 0 var(--crit-hi); }
.sheet tr.blk.sel td:first-child { box-shadow:inset 3px 0 0 var(--accent); }
.sheet td .cs { width:12px; height:12px; border-radius:3px; font-size:6.5px; }
/* jedyne miejsce na liście, gdzie kursor zmienia się z łapki na strzałkę: chip farby.
   Strzałka celuje precyzyjnie w 12-pikselowy kwadrat i sygnalizuje „to jest cel, nie uchwyt". */
.sheet td .cs { cursor:default; }
.sheet td .cs:hover { outline:1px solid rgba(255,255,255,.55); outline-offset:1px; }
/* kolumna # ma stałą szerokość — jej zawartość (poz. / +Z / blokada) nie rusza reszty kolumn */
.sheet th:first-child, .sheet td:first-child { width:66px; min-width:66px; padding-left:12px; padding-right:6px; }
/* …a wszystkie trzy stany mają IDENTYCZNE pudełko (ta sama wysokość i ramka), więc przejście
   zaznaczenia między wierszem dodanym a niedodanym nie zmienia wysokości wiersza */
.sheet td:first-child > * { display:inline-flex; align-items:center; justify-content:center;
  box-sizing:border-box; height:18px; min-width:42px; padding:0 6px; margin:0;
  border:1px solid transparent; border-radius:5px; font-size:10px; font-weight:800; line-height:1; }
.sheet td:first-child .poz { border-color:var(--border); }
.sheet td:first-child .addbtn.ghost { border-color:var(--border); }
.sheet td:first-child .addbtn.blocked { border-color:rgba(208,59,59,.45); }
/* chipy w tabeli nigdy się nie zawijają — inaczej wiersz z 11 kolorami byłby wyższy */
.sheet .chips { flex-wrap:nowrap; }
.poz { display:inline-block; background:var(--track); border:1px solid var(--border); color:var(--ink2);
  border-radius:5px; font-size:10px; font-weight:800; padding:0 5px; }
.poz.dim { opacity:.32; border-style:dashed; }
/* zlecenie wykonywalne na obu technologiach — widnieje w zakładce FLEXO i CYFRA */
.techtag { border:1px solid rgba(124,107,214,.55); color:#a99df0; border-radius:999px;
  font-size:9px; padding:0 6px; font-weight:800; letter-spacing:.03em; white-space:nowrap; }
/* rodzina zbiorcza: rodzic = wiersz-blok z sumami, chevron zwija/rozwija podzlecenia */
.zbchev { display:inline-flex; width:18px; height:18px; align-items:center; justify-content:center;
  margin-right:5px; color:var(--muted); border-radius:5px; font-size:10px; vertical-align:-3px; cursor:pointer; }
.zbchev:hover { color:var(--ink); background:rgba(255,255,255,.1); }
tr.zbrow td { background:rgba(255,255,255,.03); }
tr.zbrow td:nth-child(-n+2) { background:#1e1e1d; }
tr.zbrow:hover td:nth-child(-n+2) { background:#232322; }
tr.zbrow.sel td { background:rgba(57,135,229,.14); }
tr.zbrow.sel td:nth-child(-n+2) { background:#1e2936; }
.subind { color:var(--muted); margin-right:6px; }
/* Δ — koszt dołożenia NA KONIEC kolejki, widoczny PRZED dodaniem (feedback Damiana:
   „najdroższa czynność dnia to porównanie kolorów sąsiadów — a wy pokazujecie to PO dodaniu") */
.delta { display:inline-flex; gap:3px; align-items:center; font-size:10.5px; font-weight:800;
  border:1px solid var(--border); border-radius:5px; padding:1px 5px; white-space:nowrap; }
/* ⇄ przy Δ = to jest PRZEZBROJENIE (strata), 🖨 przy CZAS = to jest WYKONANIE (produkcja).
   Bez tych dwóch ikon kolumny są zagadką i nie widać, dlaczego A wybrało tę maszynę. */
.delta .ico { width:11px; height:11px; flex:none; opacity:.75; }
.sheet td.num .ico { width:11px; height:11px; opacity:.55; margin-right:3px; vertical-align:-1px; }
.delta .dwn { color:var(--crit-hi); font-style:normal; }
.delta .up { color:var(--good-hi); font-style:normal; }
.delta.lekkie { border-color:rgba(34,163,78,.35); background:rgba(34,163,78,.07); }
.delta.srednie { border-color:rgba(250,178,25,.35); background:rgba(250,178,25,.06); }
.delta.ciezkie { border-color:rgba(208,59,59,.4); background:rgba(208,59,59,.08); }
.delta.flat, .delta.off { color:var(--muted); border-style:dashed; font-weight:700; }
/* podpowiedź auto-doboru (klawisz A) na ZAZNACZONYM wierszu: która kolumna Δ dostanie
   pracę i dlaczego — automat, którego nie widać przed naciśnięciem, to automat bez zaufania */
td.dcol.auto { background:rgba(57,135,229,.16); box-shadow:inset 0 0 0 1px rgba(57,135,229,.45); }
.autoflag { display:inline-block; margin-left:4px; font-style:normal; font-size:9px; font-weight:900;
  letter-spacing:.02em; color:#8fbcf5; border:1px solid rgba(57,135,229,.55); border-radius:3px;
  padding:0 3px; line-height:13px; vertical-align:middle; cursor:help; }
/* po dołożeniu PRIORYTETU, trzech kolumn kolorów i surowca (26.08) tabela jest szersza —
   Damian pracuje na 22", więc i tak przewija w bok, a sticky #/PRIORYTET/TERMIN zostają */
.stage.ark table.sheet { min-width:1560px; }
.stage.grupy table.sheet { min-width:1890px; }
/* PRIORYTET — numer w kolejce + liczba do przepisania w Graffiti */
.sheet td.prio { white-space:nowrap; }
.prionum { display:inline-block; min-width:15px; font-weight:800; color:var(--ink); text-align:right; }
.priog { display:inline-block; margin-left:5px; font-size:9.5px; font-weight:800; letter-spacing:.02em;
  color:#8fbcf5; border:1px solid rgba(57,135,229,.4); border-radius:3px; padding:0 3px; cursor:help; }
.pusto { color:var(--muted); opacity:.45; }
/* trzy kolumny kolorów: CMYK | KOLORY | LAKIERY (Damian 26.08) */
.sheet td.kolcol, .sheet th.kolcol { white-space:nowrap; }
.sheet td.kolcol .chips { display:inline-flex; align-items:center; gap:2px; }
/* SUROWIEC czyta się razem z WYROBEM, więc ma ten sam rozmiar pisma (Damian 26.08: „idk why it is so small") */
.sheet td.surname { color:var(--ink2); max-width:260px; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; }
/* ⛓ przy ID zamiast osobnej kolumny ZBIORCZE */
.chain { margin-left:4px; opacity:.55; font-size:10px; cursor:help; }
.sheet td.id-zb { font-weight:800; }
.sheet td.id-zb .chain { opacity:.9; }
.zbsum { margin-left:6px; color:var(--muted); font-size:10.5px; font-variant-numeric:tabular-nums; cursor:help; }
/* zaznaczony rodzic zbiorczego → podzlecenia podświetlone DELIKATNIE (ok. 1/4 mocy zaznaczenia),
   żeby było widać rodzinę, ale żeby nie konkurowały z właściwym zaznaczeniem */
.sheet tr.infam td { background:rgba(57,135,229,.05); }
.sheet tr.infam td:nth-child(-n+2) { background:#191d22; }
.sheet tr.infam td:first-child { box-shadow:inset 3px 0 0 rgba(57,135,229,.30); }
.sheet td.szer { font-variant-numeric:tabular-nums; }
/* PRZYTRZYMAJ A — pasek postępu jedzie przez wiersz; puszczenie klawisza anuluje */
.sheet tr.holding { position:relative; }
.sheet tr.holding::after {
  content:''; position:absolute; left:0; top:0; bottom:0; width:0; pointer-events:none; z-index:3;
  /* ZIELONY, nie czerwono-pomaranczowy (Stan 26.08): pasek potwierdza akcje, ktora wlasnie
     wykonujesz - odmowa juz sie odbyla przy krotkim A. Czerwien znaczylaby, ze cos jest zle. */
  background:linear-gradient(90deg, rgba(26,138,64,.26), rgba(34,163,78,.44));
  border-right:2px solid var(--good-hi);
  animation:holdfill var(--hold-ms,900ms) linear forwards;
}
@keyframes holdfill { from { width:0; } to { width:100%; } }
/* kaskada pojawiania się bloków rodziny na osi (opóźnienie ustawia animateGroup) */
.block.appear, .chg.appear { opacity:0; transform-origin:left center; animation:blk-appear .32s ease-out forwards; }
@keyframes blk-appear { from { opacity:0; transform:scaleX(.35); } to { opacity:1; transform:none; } }