/* round 7 module (whatif), built by B3: existing variables only (var(--ink) … var(--on-accent,#fff)), no hex colours. */
.wf{display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr);gap:16px;align-items:start} .wf>*{min-width:0}   /* v1: the table scrolls inside its card instead of widening the page */
.wf-side{margin:0;padding:0;overflow:hidden}
.wf-h{padding:14px 16px 10px;border-bottom:1px solid var(--rule)} .wf-h b{font-size:15px}
.wf-sec{padding:10px 16px 12px;border-bottom:1px solid var(--rule)} .wf-sec.dim{opacity:.55}
.wf-lbl{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);margin-bottom:8px;display:flex;align-items:center;gap:6px}
.wf-links{margin-left:auto;text-transform:none;letter-spacing:0;font-weight:600} .wf-links a{color:var(--indigo);text-decoration:none}
.wf-n{text-transform:none;letter-spacing:0;font-weight:500;color:var(--ink3)}
.wf-hrs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:6px} .wf-hrs input{font:inherit;padding:3px 6px;border:1px solid var(--rule);border-radius:6px;background:var(--field);color:var(--ink)}
.wf-hrs .small{flex-basis:100%}
.wf-sat{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--rule2);cursor:pointer}
.wf-sat:first-of-type{border-top:0} .wf-sat>span{display:flex;flex-direction:column;line-height:1.3} .wf-sat.lock{cursor:default}
.wf input.wf-sw{appearance:none;-webkit-appearance:none;width:40px;height:22px;padding:0;margin:0;vertical-align:middle;border-radius:22px;background:var(--grey-l);border:1px solid var(--rule);position:relative;cursor:pointer;flex:none;transition:background .15s}
.wf input.wf-sw:before{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--paper);box-shadow:var(--sh);transition:left .15s}
.wf input.wf-sw:checked{background:var(--green);border-color:var(--green)} .wf input.wf-sw:checked:before{left:20px} .wf input.wf-sw:disabled{cursor:default;opacity:.6}
.wf-ot{display:flex} .wf-ot button{flex:1}
.wf-chips{display:flex;flex-wrap:wrap;gap:6px}
.wf-chips{max-height:180px;overflow-y:auto}
.wf-sum{margin:12px 16px 0;padding:10px 12px;border:1px solid var(--rule);border-radius:10px;background:var(--paper2);line-height:1.6}
.wf-act{padding:0 16px 4px;margin-top:12px} .wf-act .btn.primary{flex:1}
.wf-side>.small{padding:4px 16px 12px}
.wf-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:0 0 14px}
.wf-kpi{background:var(--paper);border:1px solid var(--rule);border-top:4px solid var(--indigo);border-radius:12px;padding:12px 14px;box-shadow:var(--sh)}
.wf-kpi.bad{border-top-color:var(--red)} .wf-kpi.warn{border-top-color:var(--amber)} .wf-kpi.ok{border-top-color:var(--green)} .wf-kpi.ink{border-top-color:var(--ink)}
.wf-kpi .l{font-size:12px;font-weight:600;color:var(--ink2)}
.wf-kpi .v{font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1.2;margin-top:4px;font-variant-numeric:tabular-nums}
.wf-kpi .v .was{color:var(--ink3);font-weight:600} .wf-kpi .d{font-size:12px;color:var(--ink3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wf-tbl{margin:0;padding:0;overflow:hidden} .wf-tbl th,.wf-tbl td{padding:8px 8px} .wf-tbl th:first-child,.wf-tbl td:first-child{padding-left:14px} .wf-tbl .tblwrap{border:0;border-radius:0;box-shadow:none;max-height:70vh}
.wf-show button{padding:4px 10px;font-size:12px} .wf-th{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--rule)} .wf-th b{font-size:15px}
.wf-tbl td.wf-d{white-space:nowrap;font-variant-numeric:tabular-nums} .wf-tbl td.wf-sts{white-space:nowrap}
@media (max-width:1500px){.wf-tbl td.wf-sts{white-space:normal;min-width:96px;line-height:1.9}}   /* R10 fix: WO numbers stay on one line, so the two status tags stack instead of widening the table */
.wf-tbl td.wf-wo b{white-space:nowrap}   /* R10 fix (QA2): WO numbers never wrap */ .wf-tbl td.wf-wo .xs{max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wf-tbl td.gain{color:var(--green-t,var(--green));font-weight:700}
.wf-tbl tr.fixed td{background:var(--green-l)} .wf-tbl tr.worse td{background:var(--red-l)}
.wf-tag{display:inline-block;font-size:11.5px;font-weight:600;height:20px;line-height:20px;padding:0 7px;border-radius:4px;white-space:nowrap;font-variant-numeric:tabular-nums}
.wf-tag.late{background:var(--red-l);color:var(--red-t,var(--red))} .wf-tag.risk{background:var(--amber-l);color:var(--amber-t,var(--ink))}
.wf-tag.ok{background:var(--green-l);color:var(--green-t,var(--green))} .wf-tag.none{background:var(--grey-l);color:var(--ink2)}
.wf-foot{padding:4px 16px 8px;border-top:1px solid var(--rule)}
.wf-list li{margin:4px 0;line-height:1.5}
@media (max-width:1180px){.wf{grid-template-columns:1fr}   /* v1 (V1-D): tablet — controls on top in two columns, the before / after table full width (it scrolled sideways) */
  .wf-side{columns:2;column-gap:0} .wf-side>.wf-h{column-span:all} .wf-side>*{break-inside:avoid}}
@media (max-width:900px){.wf-side{columns:1}}
