/* workbench-specific additions on top of the shared tote-rack styles */
.mark rect:nth-child(n+2){fill:var(--text)}.mark rect:first-child{fill:var(--ply)}
.boards{display:grid;gap:6px}
.board{display:grid;grid-template-columns:52px minmax(0,1fr);gap:8px;align-items:center}
.board .bn{font:600 .78rem var(--mono);color:var(--muted)}
.board .draw{padding:3px}
.cutsheet{margin-top:6px;font-size:.86rem}
.cutsheet li{margin-bottom:.25rem}
.cutsheet b{font-family:var(--mono)}
.tip{background:#1a1612;border:1px solid var(--line2);border-radius:10px;padding:10px 12px;margin:0 0 10px;font-size:.88rem}
.tip h3{font-size:.85rem;margin:0 0 4px;color:var(--ply)}
.tip ul{margin:0;padding-left:1.1rem}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.78rem;color:var(--muted);margin:6px 0 0}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:5px;vertical-align:-2px;border:1px solid rgba(0,0,0,.35)}
@media print{.tip{background:#fff;border-color:#bbb}.tip h3{color:#111}.board .bn{color:#444}}
.sheets{grid-template-columns:minmax(0,1fr)}.sheet .draw{max-width:900px}

/* narrow screens: stack each cut-list row so nothing is clipped, tighten the other tables */
@media (max-width:600px){
  .tbl.stack thead{display:none}
  .tbl.stack,.tbl.stack tbody{display:block}
  .tbl.stack tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 12px;padding:8px 0;border-bottom:1px solid var(--line2)}
  .tbl.stack td{border:0;padding:2px 4px}
  .tbl.stack td[colspan]{grid-column:1/-1}
  .tbl.stack td:nth-child(1){font-weight:600}
  .tbl.stack td[data-l="Qty"]{text-align:right}
  .tbl.stack td[data-l="Qty"]::before{content:"Qty ";color:var(--muted);font-family:inherit;font-size:.74rem;text-transform:uppercase}
  .tbl.stack td[data-l="Material"]{text-align:right;color:var(--muted);white-space:normal}
  .tbl th,.tbl td{padding:6px 5px}
  .tbl td.n{white-space:normal}
  .tbl input{width:64px}
}
.vpane.off,.vpane.off[hidden],.vtabs .off{display:none!important}