/* Okno gotowania (ui/cooking.js). Stały rozmiar 760 × 600 px (na niskim ekranie max-height z okna), strefy o stałej wysokości:
   nagłówek, stan (pasek postępu albo „Piec wolny”), lista przepisów przewijana w środku, pole odbioru na dole.
   Składniki na zielono (są) / pomarańczowo (brakuje). Paski przewijania cienkie, w kolorze ramek (#5a5746). */
#cookwin { position: fixed; inset: 0; z-index: 62; display: none; align-items: center; justify-content: center; overflow: hidden; padding: 14px; background: rgba(8,10,6,.6); font-family: Bahnschrift, 'DIN Alternate', 'Segoe UI', sans-serif; color: #d6d1b6; }
#cookwin.on { display: flex; }
.ck-box { position: relative; box-sizing: border-box; width: min(760px, 96vw); height: min(600px, calc(100vh - 28px)); display: flex; flex-direction: column; gap: 8px; padding: 12px 16px; overflow: hidden; background: rgba(22,25,17,.97); border: 1px solid #5a5746; box-shadow: 0 10px 40px rgba(0,0,0,.6); }
.ck-box .win-x { top: 10px; right: 10px; }
.ck-head { flex: none; height: 28px; display: flex; align-items: baseline; gap: 14px; padding-right: 34px; }
.ck-head h2 { margin: 0; font: 800 17px Bahnschrift, sans-serif; letter-spacing: .24em; text-transform: uppercase; color: #e6e0c4; }
.ck-place { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #8a866f; }
/* strefa stanu: zawsze ta sama wysokość, z napisem „Piec wolny” albo paskiem postępu */
.ck-status { flex: none; height: 32px; display: flex; align-items: center; gap: 8px; }
.ck-idle { flex: 1; font: 800 12px Bahnschrift, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #8a866f; }
.ck-idle[hidden], .ck-prog[hidden], .ck-cancel[hidden] { display: none !important; }
.ck-prog { position: relative; flex: 1; height: 18px; background: rgba(8,10,6,.8); border: 1px solid #4a4d3a; }
.ck-prog i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: linear-gradient(#e0b83c, #a8821c); }
.ck-prog b { position: absolute; inset: 0; display: grid; place-items: center; font: 800 11px Bahnschrift, sans-serif; letter-spacing: .1em; color: #f6efd0; text-shadow: 0 1px 2px #000; }
.ck-cancel { flex: none; padding: 5px 12px; font: 800 11px Bahnschrift, sans-serif; letter-spacing: .14em; color: #e6c4a0; background: rgba(60,36,20,.85); border: 1px solid #7a5a3a; cursor: pointer; }
.ck-cancel:hover { border-color: #d08a4a; }
/* lista przepisów: jedyna przewijana strefa u góry */
.ck-list { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 6px; overflow-x: hidden; overflow-y: auto; padding-right: 4px; }
.ck-row { flex: none; height: 68px; display: grid; grid-template-columns: 40px 1fr auto auto; gap: 10px; align-items: center; padding: 6px 10px; background: rgba(10,12,8,.55); border: 1px solid #3c3f30; border-left: 3px solid #a88548; }
.ck-row.off { opacity: .5; }
.ck-ico { width: 40px; height: 40px; object-fit: contain; }
.ck-main { min-width: 0; }
.ck-name { font: 800 13px Bahnschrift, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #ece6c8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-eff { margin-top: 1px; font-size: 11px; font-weight: 700; letter-spacing: .04em; color: #9fc49a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-need { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; }
.ck-i { position: relative; display: inline-flex; align-items: center; gap: 4px; padding: 1px 6px 1px 3px; background: rgba(8,10,6,.7); border: 1px solid #4a4d3a; font: 800 11px Bahnschrift, sans-serif; cursor: help; }
.ck-i img { width: 20px; height: 20px; }
.ck-time { font: 800 13px Bahnschrift, sans-serif; color: #cfc9ac; white-space: nowrap; }
.ck-btns { display: flex; gap: 6px; }
.ck-btns button { min-width: 92px; padding: 6px 10px; font: 800 11px Bahnschrift, sans-serif; letter-spacing: .12em; color: #e6e0c4; background: rgba(50,58,40,.9); border: 1px solid #6e6a56; cursor: pointer; white-space: nowrap; text-align: center; }
.ck-btns button:first-child { border-color: #d4a838; color: #f6e7a8; background: rgba(86,72,24,.7); }
.ck-btns button:hover:not(.off) { border-color: #d4a838; }
.ck-btns button.off { opacity: .38; cursor: default; }
.ck-empty { margin: 4px 0; font-size: 13px; color: #a8a48a; }
/* pole odbioru: zawsze widoczne, na stałej wysokości, wydzielone linią */
.ck-collect { flex: 0 0 168px; display: flex; flex-direction: column; gap: 6px; padding-top: 8px; border-top: 1px solid #4a4d3a; }
.ck-chead { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ck-ctitle { font: 800 13px Bahnschrift, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #9fd39a; }
.ck-collect-all { padding: 6px 14px; font: 800 11px Bahnschrift, sans-serif; letter-spacing: .14em; color: #f6e7a8; background: rgba(86,72,24,.7); border: 1px solid #d4a838; cursor: pointer; white-space: nowrap; }
.ck-collect-all:hover:not(.off) { background: rgba(110,92,30,.85); }
.ck-collect-all.off { opacity: .38; cursor: default; border-color: #6e6a56; background: rgba(50,58,40,.9); color: #e6e0c4; }
.ck-tiles { flex: 1 1 auto; min-height: 0; display: flex; flex-wrap: wrap; align-content: flex-start; gap: 6px; overflow-x: hidden; overflow-y: auto; }
.ck-tile { position: relative; flex: none; width: 56px; height: 56px; padding: 0; display: flex; align-items: center; justify-content: center; background: rgba(10,12,8,.7); border: 1px solid #4a4d3a; border-bottom: 2px solid #6fb36a; cursor: pointer; }
.ck-tile:hover { border-color: #d4a838; }
.ck-tile img { width: 38px; height: 38px; object-fit: contain; pointer-events: none; }
.ck-tile b { position: absolute; right: 3px; bottom: 1px; font: 800 12px Bahnschrift, sans-serif; color: #f6efd0; text-shadow: 0 1px 2px #000; pointer-events: none; }
.ck-nothing { flex: 1 1 auto; margin: 0; display: flex; align-items: center; justify-content: center; font: 700 12px Bahnschrift, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #6f6b58; }
.ck-nothing[hidden] { display: none; }
/* komunikat o pełnym plecaku (blokada = czerwono, standard interfejsu) */
.ck-msg { flex: none; margin: 0; font: 800 12px Bahnschrift, sans-serif; letter-spacing: .06em; color: #f34d3f; }
.ck-msg[hidden] { display: none; }
/* dymki (wzór .sv-tip z services.css): źródło w składniku / kaflu jest ukryte; pływający klon pokazuje się po najechaniu */
.ck-tip { display: none; }
.ck-tip b { display: block; font-weight: 800; letter-spacing: .06em; color: #ece6c8; margin-bottom: 2px; }
.ck-tip i { display: block; font-style: normal; }
.ck-tip.ck-float { display: block; position: fixed; z-index: 75; min-width: 150px; max-width: 240px; padding: 6px 9px; background: rgba(12,14,9,.98); border: 1px solid #6e6a56; box-shadow: 0 6px 18px rgba(0,0,0,.6); font: 600 12px Bahnschrift, sans-serif; color: #d6d1b6; pointer-events: none; }
.ck-tip.ck-float[hidden] { display: none; }
.ck-tip .ck-eff { white-space: normal; }
.ck-tip span.ck-eff { display: block; font-style: normal; }
.ck-tip span.ck-eff b { display: inline; margin: 0; }
.ck-tip span.ck-eff b.st-pos { color: #7fd16a; }
.ck-tip span.ck-eff b.st-neg { color: #f0913a; }
/* paski przewijania w stylu gry: cienkie, ciemne, kciuk w kolorze ramek */
.ck-list, .ck-tiles { scrollbar-width: thin; scrollbar-color: #5a5746 #0c0e09; }
.ck-list::-webkit-scrollbar, .ck-tiles::-webkit-scrollbar { width: 8px; height: 0; }
.ck-list::-webkit-scrollbar-track, .ck-tiles::-webkit-scrollbar-track { background: #0c0e09; }
.ck-list::-webkit-scrollbar-thumb, .ck-tiles::-webkit-scrollbar-thumb { background: #5a5746; border: 2px solid #0c0e09; }
.ck-list::-webkit-scrollbar-thumb:hover, .ck-tiles::-webkit-scrollbar-thumb:hover { background: #7a7660; }

/* koszt składnika brakujący: czerwony (st-neg to koszt pomarańczowy) */
.ck-i.lack { color: #ee6a4a; border-color: #6a3a30; }
/* UI130: warsztat kuchni w skali 130% mieści się w niskim ekranie (zapas na padding okna) */
#cookwin.on > .ck-box { max-height: calc((100vh - 44px) / var(--ui)); }