/* Kept from the old calendar planner (removed 2026-11-12): station colour dots (Overview), the Planner heading and
   dialog footer buttons. */
.workspace-content.planner-active h1{font-size:28px;margin-bottom:10px}
.plan-chip{display:inline-block;flex:none}
.plan-chip-mix{background:#087f9c}.plan-chip-label{background:#7a5aa6}.plan-chip-fill{background:#2f8f6b}.plan-chip-pack{background:#c47f12}
#editor-dialog footer .ops-actions,dialog footer .ops-actions{display:flex;gap:8px;align-items:center;width:100%;justify-content:flex-end}
/* Planner: plans + filters on the left, the open plan on the right */
.pl-layout{display:grid;grid-template-columns:270px minmax(0,1fr);gap:14px;align-items:start}
.pl-side{background:#fff;border:1px solid #d6e2e4;border-radius:12px;padding:12px;position:sticky;top:10px;max-height:calc(100vh - 120px);overflow:auto}
.pl-side h3{margin:14px 4px 6px;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:#6a7e83}.pl-side h3 small{text-transform:none;letter-spacing:0;font-weight:400}
.pl-side-head{display:flex;gap:6px}.pl-side-head button{flex:1;padding:8px 6px}.pl-side-head .on{border-color:#1286a0;color:#0f6f88}
.pl-plan{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:6px;align-items:center;width:100%;border:1px solid transparent;background:none;border-radius:8px;padding:6px;text-align:left;font:inherit;cursor:pointer;color:#173f4a}
.pl-plan:hover{background:#f2f7f8}.pl-plan.on{background:#e3f1f5;border-color:#9fd0dc}
.pl-plan strong{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pl-plan small{display:block;font-size:11.5px;color:#6a7e83}
.pl-icon{font-size:17px;text-align:center}.pl-icon.big{font-size:28px}
.pl-st{font-style:normal;font-size:10.5px;font-weight:700;border-radius:999px;padding:1px 7px;background:#fff1d6;color:#7a5410}.pl-st.released{background:#dff3ea;color:#21613f}
.pl-old{display:flex;gap:6px;align-items:center;font-size:12px;color:#5c757c;margin:6px 4px}
.pl-filter-row{display:flex;gap:2px}.pl-filter{flex:1;border:0;background:none;text-align:left;padding:6px 8px;border-radius:6px;font:inherit;font-size:13px;color:#2c5764;cursor:pointer}
.pl-filter:hover{background:#f2f7f8}.pl-filter.on{background:#123f4a;color:#fff}
.pl-mini{border:0;background:none;color:#8aa0a6;cursor:pointer;padding:0 6px}.pl-add{border:0;background:none;color:#1286a0;font:inherit;font-size:12.5px;padding:6px 8px;cursor:pointer}
.pl-head{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:10px 14px;align-items:center;background:#fff;border:1px solid #d6e2e4;border-radius:12px;padding:12px 14px;margin-bottom:12px}
.pl-title{display:flex;gap:10px;align-items:center;min-width:0}.pl-title small{display:block;font-size:12px;color:#6a7e83;text-transform:uppercase;letter-spacing:.04em}
.pl-name{border:1px solid transparent;border-radius:6px;padding:3px 6px;margin-left:-6px;font:inherit;font-size:19px;font-weight:700;color:#173f4a;width:100%;background:none}.pl-name:hover,.pl-name:focus{border-color:#cbdadd;background:#fff}
.pl-head label{display:flex;flex-direction:column;font-size:11px;font-weight:700;color:#6a7e83;text-transform:uppercase;gap:3px}
.pl-head input[type=date]{border:1px solid #cbdadd;border-radius:8px;padding:6px 8px;font:inherit;font-size:13.5px}
.pl-notes{grid-column:1/-1;border:1px solid #e3ecee;border-radius:8px;padding:6px 10px;font:inherit;font-size:13px;resize:vertical;background:#fbfdfd}
.pl-box{background:#fff;border:1px solid #d6e2e4;border-radius:12px;padding:10px 12px;margin-bottom:12px}
.pl-box>header{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;margin-bottom:8px}.pl-box h3{margin:0 auto 0 0;font-size:15px;color:#173f4a}
.pl-box>header input[type=search]{border:1px solid #cbdadd;border-radius:8px;padding:7px 10px;font:inherit;font-size:13px;min-width:220px}
.pl-shipby{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#5c757c}.pl-shipby input{border:1px solid #cbdadd;border-radius:8px;padding:5px 8px;font:inherit;font-size:13px}
.pl-tabs{margin:0;border:0}.pl-tabs button{padding:5px 12px}
.pl-chipf{display:inline-flex;align-items:center;gap:4px;background:#123f4a;color:#fff;border-radius:999px;padding:3px 4px 3px 10px;font-size:12.5px}.pl-chipf button{border:0;background:none;color:#fff;cursor:pointer;font-size:14px}
.pl-scroll{max-height:46vh;overflow:auto;border:1px solid #eef3f4;border-radius:8px}
.pl-grid{width:100%;border-collapse:collapse;font-size:13px}.pl-grid th{position:sticky;top:0;background:#f4f8f9;text-align:left;font-size:11px;text-transform:uppercase;color:#6a7e83;padding:6px;z-index:1}
.pl-grid td{padding:5px 6px;border-top:1px solid #eef3f4;vertical-align:top}.pl-grid td small{display:block;color:#6a7e83;font-size:11.5px}.pl-grid .num{text-align:right;white-space:nowrap}
.pl-grid tr:nth-child(even) td{background:#f7fbf8}.pl-grid tr.pl-high td:first-child{box-shadow:inset 3px 0 0 #d9573b}
.pl-ck{width:28px;text-align:center}.pl-qty{width:70px;text-align:right;border:1px solid #cbdadd;border-radius:6px;padding:3px 5px;font:inherit}
.pl-none{padding:14px;text-align:center}.pl-foot{margin:6px 2px 0;font-size:12px}
.pl-x{border:0;background:none;color:#8aa0a6;font-size:17px;cursor:pointer}.pl-x:hover{color:#a3352b}
.pl-group h4{display:flex;align-items:center;gap:10px;margin:10px 0 6px;font-size:14px;color:#173f4a}.pl-group h4 small{color:#6a7e83;font-weight:400}.pl-group h4 .crm-secondary{margin-left:auto;padding:4px 10px;font-size:12px}
.pl-batch{display:grid;grid-template-columns:minmax(0,1fr) 130px;gap:6px 12px;border:1px solid #e3ecee;border-radius:10px;padding:8px 10px;margin-bottom:8px}
.pl-batch small{display:block;color:#6a7e83;font-size:12px}.pl-batch label{font-size:11px;font-weight:700;color:#6a7e83;text-transform:uppercase;display:flex;flex-direction:column;gap:3px}
.pl-batch input{border:1px solid #cbdadd;border-radius:6px;padding:5px 8px;font:inherit;font-size:14px;text-align:right}
.pl-batch ul{grid-column:1/-1;margin:0;padding-left:18px;font-size:12.5px;color:#33555e}
.pl-kinds{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}
.pl-kind{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;border:2px solid #d6e2e4;border-radius:12px;padding:12px 6px;cursor:pointer;text-align:center}
.pl-kind input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.pl-kind span{font-size:28px}.pl-kind strong{font-size:13px;color:#173f4a}.pl-kind:has(input:checked){border-color:#1286a0;background:#eef7fa}
@media(max-width:1100px){.pl-layout{grid-template-columns:1fr}.pl-side{position:static;max-height:none}.pl-head{grid-template-columns:1fr 1fr}.pl-kinds{grid-template-columns:1fr 1fr}}
.pl-old input{width:16px;height:16px;margin:0;flex:0 0 auto}
.pl-grid td strong,.pl-grid td:first-child{white-space:nowrap}
.pl-shipby{white-space:nowrap}
.pl-grid td:nth-child(2){white-space:nowrap}
/* Compact planner (owner: everything smaller so it all fits) */
.pl-layout{grid-template-columns:230px minmax(0,1fr);gap:10px}
.pl-side{display:flex;flex-direction:column;padding:8px;height:calc(100vh - 110px);max-height:none;overflow:hidden}
.pl-side-top{flex:1;min-height:0;display:flex;flex-direction:column}.pl-plans{flex:1;min-height:0;overflow:auto}
.pl-side-bottom{border-top:1px solid #e3ecee;padding-top:4px;max-height:40%;overflow:auto}
.pl-side h3{margin:8px 4px 4px;font-size:10.5px}.pl-side-head button{padding:6px 4px;font-size:12px;min-height:0}
.pl-plan{padding:4px 5px;grid-template-columns:20px minmax(0,1fr) auto;gap:4px}.pl-plan strong{font-size:12px}.pl-plan small{font-size:10.5px}.pl-icon{font-size:14px}.pl-icon.big{font-size:20px}
.pl-st{font-size:9.5px;padding:0 5px}.pl-filter{padding:4px 6px;font-size:12px}.pl-add,.pl-old{font-size:11.5px}
.pl-head{padding:6px 10px;gap:6px 10px;margin-bottom:8px}.pl-title small{font-size:10.5px}.pl-name{font-size:15px;padding:1px 4px}
.pl-head label{font-size:10px}.pl-head input[type=date]{padding:3px 6px;font-size:12.5px}.pl-head .crm-primary,.pl-head .crm-secondary{padding:5px 10px;font-size:12px;min-height:0}
.pl-notes{padding:3px 8px;font-size:12px}
.pl-box{padding:6px 8px;margin-bottom:8px}.pl-box>header{gap:6px 8px;margin-bottom:5px}.pl-box h3{font-size:12.5px}
.pl-box>header input[type=search]{padding:4px 8px;font-size:12px;min-width:160px}.pl-shipby{font-size:11.5px}.pl-shipby input{padding:3px 6px;font-size:12px}
.pl-tabs button{padding:3px 10px;font-size:12px}.pl-hint{font-size:11px;color:#6a7e83;margin-left:auto}
.pl-avail .pl-scroll{max-height:38vh}
.pl-grid{font-size:12px}.pl-grid th{font-size:10px;padding:4px 5px}.pl-grid td{padding:2px 5px;line-height:1.35}.pl-grid td small{display:inline;font-size:10.5px}
.pl-qty{width:60px;padding:1px 4px;font-size:12px}
.pl-grid tr[data-pl-row]{cursor:grab}.pl-grid tr[data-pl-row]:hover td{background:#eef6f8}
.pl-grid tr.pl-sel td{background:#d6ecf2!important}.pl-grid tr.pl-sel td:first-child{box-shadow:inset 3px 0 0 #1286a0}
.pl-plus{border:1px solid #cbdadd;background:#fff;border-radius:5px;color:#1286a0;font-weight:700;width:22px;height:20px;line-height:1;cursor:pointer;padding:0}.pl-plus:hover{border-color:#1286a0}
.pl-drop{transition:background .15s,border-color .15s}.pl-drop.pl-drop-ready{border:2px dashed #9fd0dc}.pl-drop.pl-drop-over{border:2px dashed #1286a0;background:#eef7fa}.pl-drop.pl-busy{opacity:.6}
.pl-foot{font-size:11px;margin-top:4px}.pl-none{padding:10px;font-size:12px}
.pl-batch{padding:5px 8px;margin-bottom:5px;grid-template-columns:minmax(0,1fr) 110px 24px}.pl-batch strong{font-size:13px}.pl-batch small{font-size:11px}.pl-batch input{padding:2px 6px;font-size:12.5px}.pl-batch ul{font-size:11.5px}
.pl-xb{align-self:center}
.pl-group h4{font-size:12.5px;margin:6px 0 4px}
@media(max-width:1100px){.pl-side{height:auto}}
.pl-qty{height:20px;box-sizing:border-box}
/* The drop bar shown while dragging work into a plan */
.pl-dropbar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:150;display:flex;align-items:center;gap:12px;min-width:min(560px,90vw);justify-content:center;padding:18px 28px;border:3px dashed #1286a0;border-radius:16px;background:#eef7fa;color:#0f5466;font-size:16px;box-shadow:0 10px 30px #123d4c40}
.pl-dropbar span{font-size:24px}.pl-dropbar.pl-drop-over{background:#1286a0;color:#fff;border-style:solid}
.pl-grid input.pl-qty{height:22px;min-height:0;padding:0 4px;line-height:20px}
/* All plans · Week calendar: drag a plan to another day */
.pl-mode{margin:0 0 8px}
.pl-weekbar{display:flex;align-items:center;gap:8px;margin:0 0 8px;flex-wrap:wrap}.pl-weekbar strong{font-size:14px;color:#173f4a}.pl-weekbar .crm-secondary,.pl-weekbar .crm-primary{padding:4px 10px;font-size:12px;min-height:0}
.pl-week{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.pl-days-6{grid-template-columns:repeat(6,minmax(0,1fr))}.pl-days-7{grid-template-columns:repeat(7,minmax(0,1fr))}
.pl-day{background:#f8fbfb;border:1px solid #d6e2e4;border-radius:10px;min-height:340px;display:flex;flex-direction:column;min-width:0}
.pl-day>header{padding:6px 8px;border-bottom:1px solid #e3ecee;display:flex;flex-wrap:wrap;gap:2px 6px;align-items:baseline}.pl-day>header strong{font-size:13px;text-transform:uppercase;color:#173f4a}
.pl-day>header span{font-size:12px;color:#5c757c}.pl-day>header small{margin-left:auto;font-size:11px;color:#6a7e83}
.pl-day.today{border:2px solid #1286a0;background:#fff}.pl-day.today>header{background:#1286a0;border-radius:8px 8px 0 0}.pl-day.today>header *{color:#fff}
.pl-day.past{opacity:.8}.pl-day.over{background:#e3f1f5;border-style:dashed;border-color:#1286a0}
.pl-day-body{padding:6px;display:flex;flex-direction:column;gap:5px;flex:1}
.pl-card{display:grid;grid-template-columns:18px minmax(0,1fr);gap:2px 6px;align-items:start;background:#fff;border:1px solid #d6e2e4;border-left:4px solid #9bb0b5;border-radius:8px;padding:5px 7px;cursor:grab;font-size:12px}
.pl-card strong{display:block;font-size:12px;color:#173f4a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pl-card small{display:block;color:#6a7e83;font-size:10.5px}.pl-card .pl-st{grid-column:2;justify-self:start}
.pl-card.pl-k-mix{border-left-color:#7b5ea7}.pl-card.pl-k-fill{border-left-color:#1286a0}.pl-card.pl-k-label{border-left-color:#d08a2a}.pl-card.pl-k-pack{border-left-color:#3d8a5f}
.pl-card:hover{border-color:#1286a0}.pl-card.pl-moving{opacity:.5}
.pl-free{margin:10px 4px;text-align:center;color:#9bb0b5;font-size:12px}
@media(max-width:900px){.pl-week,.pl-days-6,.pl-days-7{grid-template-columns:1fr}.pl-day{min-height:0}}

/* Work to plan and the plan side by side; the plan stays in view while the list scrolls. */
.pl-work{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:10px;align-items:start}
.pl-work>.pl-box{margin-bottom:0;min-width:0}
.pl-work .pl-avail .pl-scroll{max-height:calc(100svh / var(--ui-zoom,1) - 250px)}
.pl-work>.pl-drop{position:sticky;top:8px;max-height:calc(100svh / var(--ui-zoom,1) - 120px);overflow:auto;min-height:260px}
.pl-work>.pl-drop:empty,.pl-work>.pl-drop.pl-drop-ready{min-height:260px}
@media(max-width:1100px){.pl-work{grid-template-columns:1fr}.pl-work>.pl-drop{position:static;max-height:none;min-height:0}}
.pl-work .pl-scroll{overflow:auto}
.pl-work .pl-grid td,.pl-work .pl-grid th{white-space:nowrap;padding:3px 6px;font-size:12px}
.pl-work .pl-grid td input{width:64px}
.pl-work>.pl-drop .pl-grid{min-width:100%}
.pl-work .pl-grid td{max-width:150px;overflow:hidden;text-overflow:ellipsis}
.pl-work .pl-grid td:has(input),.pl-work .pl-grid td:has(button){max-width:none;overflow:visible}
.pl-work .pl-grid td input{height:24px!important;min-height:0;padding:1px 4px;width:56px}
.pl-work .pl-grid td input.pl-qty{width:66px;appearance:textfield;-moz-appearance:textfield} /* owner: the whole number must show (e.g. 12345.5 gal); no spin arrows */
.pl-qty::-webkit-inner-spin-button,.pl-qty::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.pl-work .pl-grid td button{min-height:0;height:24px;padding:0 6px}
.pl-work{grid-template-columns:minmax(0,1.75fr) minmax(0,1fr)}
.pl-work .pl-grid td{max-width:118px}
.pl-work .pl-grid td,.pl-work .pl-grid th{padding:3px 5px}
.pl-work .pl-grid th{white-space:normal;line-height:1.15;vertical-align:bottom}
.pl-work .pl-grid td{max-width:100px}
.pl-work .pl-grid td{max-width:86px}
.pl-work .pl-grid td:first-child{max-width:none}
.pl-work>.pl-drop .pl-grid td{max-width:70px}.pl-work>.pl-drop .pl-grid td:first-child{max-width:none}
.pl-work .pl-grid td:nth-child(2){max-width:none}

/* Filters right above the "To plan" list (owner): one row that wraps; "Show" picks bulk products / orders / lines. */
.pl-view{display:flex;align-items:center;gap:5px;font-size:11.5px;color:#5c757c}
.pl-view select,.pl-fbar select{border:1px solid #cbdadd;border-radius:7px;padding:2px 6px;font:inherit;font-size:12px;height:26px;background:#fff;color:#173f4a;max-width:170px}
.pl-view select{font-weight:700}
.pl-fbar{display:flex;flex-wrap:wrap;gap:5px 10px;align-items:center;background:#f4f8f9;border:1px solid #e3ecee;border-radius:8px;padding:5px 8px;margin-bottom:6px}
.pl-fbar label{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:#6a7e83;text-transform:uppercase;letter-spacing:.02em;white-space:nowrap}
.pl-fbar input[type=search]{border:1px solid #cbdadd;border-radius:7px;padding:2px 8px;font:inherit;font-size:12px;height:26px;box-sizing:border-box;min-width:180px;flex:1 1 180px;max-width:260px}
.pl-fbar input[type=date]{border:1px solid #cbdadd;border-radius:7px;padding:1px 6px;font:inherit;font-size:12px;height:26px;box-sizing:border-box}
.pl-fbar .pl-fck{text-transform:none;letter-spacing:0;font-weight:400;font-size:12px;color:#33555e}.pl-fck input{width:15px;height:15px;margin:0}
.pl-fsaved{display:flex;align-items:center;gap:4px;margin-left:auto}
.pl-link{border:0;background:none;color:#1286a0;font:inherit;font-size:12px;padding:2px 4px;cursor:pointer;min-height:0}.pl-link:hover{text-decoration:underline}
/* Bulk product → the customers behind it (opens under the row) */
.pl-who{border:1px solid #cbdadd;background:#fff;border-radius:999px;padding:0 8px;height:22px;font:inherit;font-size:11.5px;color:#0f6f88;cursor:pointer;white-space:nowrap;min-height:0}
.pl-who:hover,.pl-who[aria-expanded=true]{border-color:#1286a0;background:#eef7fa}
.pl-grid tr.pl-open td{background:#eef7fa}
.pl-work .pl-grid tr.pl-sub td{max-width:none;white-space:normal;overflow:visible;padding:0 6px 6px 18px;background:#eef7fa}
.pl-fly{display:grid;gap:5px;border-left:3px solid #9fd0dc;padding:4px 0 2px 8px}
.pl-fly-cust{background:#fff;border:1px solid #d6e2e4;border-radius:8px;padding:4px 6px}
.pl-fly-head{display:flex;gap:8px;align-items:baseline;font-size:12px;color:#173f4a}.pl-fly-head small{color:#6a7e83;font-size:11px}.pl-fly-head span{margin-left:auto;font-weight:700;white-space:nowrap}
.pl-fly-line{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto 24px;gap:8px;align-items:center;font-size:11.5px;color:#33555e;padding:2px 2px 2px 8px;border-top:1px solid #eef3f4;border-radius:4px;cursor:grab}
.pl-fly-line:hover{background:#eef6f8}.pl-fly-line.pl-sel{background:#d6ecf2}.pl-fly-line.pl-high{box-shadow:inset 3px 0 0 #d9573b}
.pl-fly-line>span{white-space:nowrap}.pl-fly-line .pl-fly-item{overflow:hidden;text-overflow:ellipsis}.pl-fly-line .num{text-align:right;font-weight:700}
.pl-fly-line .pl-plus{height:20px}
@media(max-width:600px){.pl-fsaved{margin-left:0}.pl-fbar input[type=search]{max-width:none}.pl-fly-line{grid-template-columns:minmax(0,1fr) auto 24px}.pl-fly-line>:nth-child(1){grid-area:1/1}.pl-fly-line>:nth-child(2){grid-area:1/2;justify-self:end}.pl-fly-line>:nth-child(3){grid-area:2/1}.pl-fly-line>:nth-child(4){grid-area:2/2}.pl-fly-line>:nth-child(5){grid-area:1/3/3/4}}
.workspace-main .pl-fbar select,.workspace-main .pl-view select{height:26px;width:auto;padding:0 4px;font-size:12px}
.workspace-main .pl-fbar input[type=search],.workspace-main .pl-fbar input[type=date]{height:26px;width:auto;padding:0 8px;font-size:12px}
.workspace-main .pl-fbar input[type=date]{flex:0 0 auto}
/* Tablets and phones: the list and the plan one under the other (a later rule above had put them side by side again). */
@media(max-width:1100px){.pl-work{grid-template-columns:1fr}.pl-work>.pl-drop{position:static;max-height:none;min-height:0}}
@media(max-width:600px){.workspace-main .pl-fbar select{max-width:min(240px,62vw)}.pl-fbar label{max-width:100%}.pl-hint{display:none}}
@media(max-width:600px){.pl-avail .pl-scroll{container-type:inline-size}.pl-fly{position:sticky;left:4px;width:calc(100cqw - 34px);box-sizing:border-box}}
.pl-fly{grid-template-columns:minmax(0,1fr)}.pl-fly-cust{min-width:0}
.pl-fly-head{flex-wrap:wrap}
.pl-short{color:#a3352b;font-weight:700}

/* Tank strip above a mixing plan (tanks step 2) */
.pl-tanks{background:#fff;border:1px solid #d6e2e4;border-radius:12px;padding:6px 8px;margin-bottom:8px}
.pl-tanks>header{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:5px}.pl-tanks h3{margin:0;font-size:12.5px;color:#173f4a}
.workspace-main .pl-tanks select{height:26px;width:auto;padding:0 4px;font-size:12px;max-width:220px}
.pl-tanks-none{font-size:12px;color:#6a7e83;padding:8px 10px}
.pl-tankrow{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x proximity}
.pl-tank{flex:0 0 112px;scroll-snap-align:start;border:1px solid #d6e2e4;border-radius:10px;padding:5px 6px;background:#fbfdfd;display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;font-size:11px;transition:background .15s,border-color .15s}
.pl-tank strong{font-size:12.5px;color:#173f4a}.pl-tprod{color:#33555e;font-weight:600;height:28px;line-height:14px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pl-tank.free .pl-tprod{color:#2f9e5b}.pl-tk-mixer{background:#f8f5fc;border-color:#d9cdea}.pl-tk-mixer .pl-tprod{color:#5b3f86}
.pl-vessel{width:44px;height:62px;border:2px solid #9bb0b5;border-radius:5px 5px 11px 11px;background:#fff;display:flex;flex-direction:column-reverse;overflow:hidden;margin:2px 0}
.pl-tk-mixer .pl-vessel{border-radius:11px 11px 16px 16px;border-color:#a991c9}
.pl-tank.free .pl-vessel{border-style:dashed}
.pl-lv{display:block;background:linear-gradient(0deg,#1286a0,#4fb3c9);flex:0 0 auto}
.pl-in{display:block;flex:0 0 auto;background:repeating-linear-gradient(0deg,#fff3d6,#fff3d6 3px,#e9c46a 3px,#e9c46a 5px);border-top:2px dashed #d09a2a;box-sizing:border-box}
.pl-tnum{color:#4d6970}.pl-troom{color:#6a7e83;font-size:10.5px}.pl-troom.bad{color:#a3352b;font-weight:700}
.pl-tank.over{border-color:#d9573b}
.pl-tbadges{display:flex;flex-wrap:wrap;gap:2px;justify-content:center;min-height:14px}
.pl-tb{font-size:9.5px;border-radius:999px;padding:0 5px;background:#fff1d6;color:#7a5410;white-space:nowrap}.pl-tb.mine{background:#d09a2a;color:#fff}
.pl-tank.pl-drop-over{border:2px dashed #1286a0;background:#eef7fa}.pl-tank.pl-busy{opacity:.6}
.pl-btanks{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:4px 10px}
.pl-btanks label{flex-direction:row!important;align-items:center;gap:4px!important;text-transform:none!important;font-weight:600!important;font-size:11.5px!important}
.workspace-main .pl-btanks select{height:24px;width:auto;max-width:200px;padding:0 4px;font-size:11.5px}
.pl-batch[draggable=true]{cursor:grab}
@media(max-width:600px){.pl-tank{flex-basis:96px}.pl-tanks .pl-hint{display:none}}
.pl-vessel .h-0{height:0%}.pl-vessel .h-5{height:5%}.pl-vessel .h-10{height:10%}.pl-vessel .h-15{height:15%}.pl-vessel .h-20{height:20%}.pl-vessel .h-25{height:25%}.pl-vessel .h-30{height:30%}.pl-vessel .h-35{height:35%}.pl-vessel .h-40{height:40%}.pl-vessel .h-45{height:45%}.pl-vessel .h-50{height:50%}.pl-vessel .h-55{height:55%}.pl-vessel .h-60{height:60%}.pl-vessel .h-65{height:65%}.pl-vessel .h-70{height:70%}.pl-vessel .h-75{height:75%}.pl-vessel .h-80{height:80%}.pl-vessel .h-85{height:85%}.pl-vessel .h-90{height:90%}.pl-vessel .h-95{height:95%}.pl-vessel .h-100{height:100%}
/* Tanks step 3: bulk set aside for orders */
.pl-sa{display:block;flex:0 0 auto;background:repeating-linear-gradient(45deg,#2f9e5b,#2f9e5b 4px,#55b77c 4px,#55b77c 8px)}
.pl-tb.sa{background:#dff3ea;color:#21613f}
.pl-tfree{color:#21613f;font-size:10.5px}.pl-tfree.bad{color:#a3352b;font-weight:700}
.pl-tlist{border:0;background:none;color:#1286a0;font:inherit;font-size:10.5px;padding:0;cursor:pointer;min-height:0}.pl-tlist:hover{text-decoration:underline}
.pl-shelf{border:1px solid #9cc9ad;background:#eef8f1;color:#21613f;border-radius:999px;font:inherit;font-size:10.5px;font-weight:700;padding:0 6px;margin-right:4px;cursor:pointer;min-height:0;height:18px;line-height:16px;white-space:nowrap}
.pl-shelf:hover{background:#dff3ea;border-color:#2f9e5b}
.pl-work .pl-grid td:has(.pl-shelf){max-width:none}

/* Plan screen fits the window (owner, 2026-11-12): the header and the tank strip stay put; only the "To plan" list and
   "In this plan" scroll. Notes for the station sit in the header row as one line that opens up while typing. */
.pl-head{grid-template-columns:auto minmax(140px,1fr) auto auto auto}
.pl-head>.pl-title{order:0}.pl-head>.pl-notes{order:1}.pl-head>label{order:2}.pl-head>.ops-pill{order:3}.pl-head>.ops-actions{order:4}
.pl-head label{flex-direction:row;align-items:center;gap:6px}
.workspace-main .pl-head .pl-notes{grid-column:auto;height:30px;min-height:0;resize:none;overflow:hidden;padding:5px 8px;line-height:1.35;transition:height .12s}
.workspace-main .pl-head .pl-notes:focus{height:84px;overflow:auto;background:#fff}
@media(max-width:1100px){.pl-head{grid-template-columns:1fr auto}.workspace-main .pl-head .pl-notes{grid-column:1/-1;order:5}}
@media(min-width:1101px){
  .pl-main-work{display:flex;flex-direction:column;height:calc(100svh / var(--ui-zoom,1) - 88px);min-height:460px}
  .pl-side{height:calc(100svh / var(--ui-zoom,1) - 88px)}
  .pl-main-work>.pl-head,.pl-main-work>.pl-tanks{flex:none}
  .pl-main-work>.pl-work{flex:1;min-height:0;grid-template-rows:minmax(0,1fr);align-items:stretch}
  .pl-main-work .pl-work>.pl-avail{display:flex;flex-direction:column;min-height:0;box-sizing:border-box}
  .pl-main-work .pl-work>.pl-avail>*{flex:none}
  .pl-main-work .pl-work .pl-avail .pl-scroll{flex:1 1 auto;min-height:0;max-height:none}
  .pl-main-work .pl-work>.pl-drop{position:static;top:auto;max-height:none;min-height:0;overflow:auto;box-sizing:border-box}
}
/* Smaller tank pictures so more of the "To plan" list shows (owner, 2026-11-12). */
.pl-vessel{width:34px;height:40px;margin:1px 0}
.pl-tank{gap:1px;padding:4px 6px}
/* Tank cards can be dragged (owner, 2026-11-12): rearranged, or dropped onto an order to set bulk aside. */
.pl-tank[draggable=true]{cursor:grab}
.pl-tank.pl-moving{opacity:.45}
.pl-tank.pl-ins-before{box-shadow:-4px 0 0 #1286a0}.pl-tank.pl-ins-after{box-shadow:4px 0 0 #1286a0}
.pl-avail.pl-taking .pl-grid tr[data-pl-row^="o:"] td,.pl-avail.pl-taking .pl-grid tr[data-pl-row^="l:"] td{background:#f1faf5}
.pl-grid tr.pl-tank-target td{background:#d4f0e0!important;box-shadow:inset 0 2px 0 #2f9e5b,inset 0 -2px 0 #2f9e5b}
/* Filling lines above a filling plan (owner, 2026-11-13). */
.pl-fline{flex-basis:132px;background:#f5fbf8;border-color:#cfe5da}
.pl-fline.mine{border:2px solid #2f8f6b;background:#eaf7f0}
.pl-fline[draggable=true]{cursor:grab}
.pl-fmeter{width:100%;height:10px;margin:3px 0}
.workspace-main .pl-head .pl-linesel{height:26px;width:auto;max-width:200px;padding:0 4px;font-size:12px;margin-left:6px}
.workspace-main .pl-grid select.pl-src{height:24px;width:auto;max-width:170px;padding:0 4px;font-size:12px}
.pl-warn{display:block;color:#a3352b;font-size:10.5px;font-weight:600}.pl-warn.soft{color:#8a6a10;font-weight:400}
.pl-work .pl-grid td:has(.pl-src){max-width:none}
.fl-dl{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:6px 0;font-size:12.5px}.fl-dl dt{color:#6a7e83}.fl-dl dd{margin:0}
.fl-sizes{border:1px solid #d6e2e4;border-radius:8px;padding:6px 10px;display:flex;flex-wrap:wrap;gap:4px 14px}.fl-sizes legend{font-size:12px;color:#40555b}
/* Drawings instead of plain cards (owner, 2026-11-13): tall vessels, totes and filling machines. */
.pl-tank{flex:0 0 96px;background:transparent;border-color:transparent;padding:2px 4px}
.pl-tank:hover{border-color:#d6e2e4;background:#fbfdfd}
.pl-tk-mixer{background:transparent;border-color:transparent}
.pl-svg{display:block;width:62px;height:96px;margin:1px auto}
.pl-svg-tote{width:66px}
.pl-svg-machine{width:104px;height:80px}
.pl-fline{flex-basis:132px;background:transparent;border-color:transparent}
.pl-fline.mine{border:2px solid #2f8f6b;background:#f1faf5}
.pl-tank.over,.pl-fline.over{border:2px solid #d9573b;background:#fdf0ee}
.pl-fline.over .pl-troom{color:#a3352b;font-weight:700}
.pl-tank.pl-drop-over{border:2px dashed #1286a0;background:#eef7fa}
@media(max-width:600px){.pl-tank{flex-basis:84px}.pl-svg{width:52px;height:80px}.pl-svg-machine{width:90px;height:68px}}
.tk-pic .pl-svg{width:70px;height:108px;margin:4px auto}
/* Filling redesign (owner, 2026-11-13): one plan per day, a colour per line (--lc set from data-line-color), jobs
   numbered per line and dragged to change the order or the line. */
.fl-dot{display:inline-block;width:11px;height:11px;vertical-align:-1px;margin-right:4px;flex:none}
.fl-dot.num{width:auto;height:20px;vertical-align:middle;margin:0}
.pl-fline{flex-basis:150px;border-top:4px solid var(--lc,#c9d6d9);border-radius:8px}
.pl-fline.off{opacity:.6}
.pl-fline.pl-job-target{border:2px dashed var(--lc,#1286a0);background:#f3f9fb}
.pl-jobs{border-left:4px solid var(--lc,#c9d6d9);padding:2px 0 4px 8px;margin:6px 0 10px;border-radius:2px}
.pl-jobs h4{display:flex;align-items:center;gap:4px;margin:2px 0 4px;font-size:13px}
.pl-jobs h4 small{font-weight:400;color:#6a7e83;margin-left:6px}
.pl-jobs.pl-job-target{background:#f3f9fb;outline:2px dashed var(--lc,#1286a0)}
.pl-jobs .pl-grid td.pl-jobno{width:34px;text-align:center}
.pl-grid tr[data-pl-job][draggable=true]{cursor:grab}
.pl-grid tr[data-pl-job].pl-moving{opacity:.45}
.pl-grid tr.pl-job-before td{box-shadow:inset 0 3px 0 #1286a0}.pl-grid tr.pl-job-after td{box-shadow:inset 0 -3px 0 #1286a0}
.pl-lchips{display:flex;flex-wrap:wrap;gap:1px 8px;font-size:11px;color:#40555b;margin-top:2px}.pl-lchips span{white-space:nowrap}.pl-lchips .pl-nol{color:#a3352b}
.fl-card header{display:flex;align-items:center;gap:4px}
.fl-pic .pl-svg-machine{margin:2px 0 0}
.fl-kind,.fl-colors{border:1px solid #d6e2e4;border-radius:8px;padding:6px 10px;display:flex;flex-wrap:wrap;gap:4px 14px}.fl-kind legend,.fl-colors legend{font-size:12px;color:#40555b}
.fl-colors{gap:6px}.fl-swatch{position:relative;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:2px solid transparent;border-radius:50%;cursor:pointer}
.fl-swatch input{position:absolute;opacity:0;width:1px;height:1px}.fl-swatch .fl-dot{width:22px;height:22px;margin:0}
.fl-swatch:has(input:checked){border-color:#24353a}.fl-swatch:has(input:focus-visible){outline:2px solid #1286a0}
.pl-jobs .pl-grid td small{display:block;color:#6a7e83;font-size:11px;font-weight:400}
