.hw-workbench{--hw-bg:#0b1522;--hw-panel:#132130;--hw-line:#2a4054;--hw-ink:#dfebf2;--hw-muted:#9eb4c5;--hw-teal:#54d6bd;--hw-amber:#f3bd70;color:var(--hw-ink);background:var(--hw-bg);border:1px solid var(--hw-line);border-radius:16px;overflow:hidden;font:400 14px/1.5 Inter,system-ui,sans-serif;box-shadow:0 20px 55px #0002}.hw-workbench button{font:inherit;cursor:pointer}.hw-workbench button:focus-visible,.hw-hit:focus-visible,.hw-document-launch:focus-visible{outline:3px solid #8af3dd;outline-offset:4px}.hw-workbench button:disabled{cursor:default;opacity:.6}.hw-status-bar{display:flex;gap:17px;flex-wrap:wrap;align-items:center;padding:13px 18px;background:#0c1724;border-bottom:1px solid var(--hw-line);font:600 11px/1.4 ui-monospace,Consolas,monospace;letter-spacing:.035em}.hw-status{display:inline-flex;gap:7px;align-items:center;white-space:nowrap;color:#a5b9c7}.hw-status i{height:7px;width:7px;border-radius:50%;background:#617487}.hw-status-on i{background:#4ad8ac;box-shadow:0 0 9px #4ad8ac80}.hw-status-live{color:#e5bd7e}.hw-status-live i{background:#f3bd70}.hw-status-safe{color:#83d3bc}.hw-status-safe i{background:#61c3a7}.hw-work-safety{margin-left:auto;color:#e6ba7d;font-size:10px}.hw-work-safe{color:#6bd8b5}.hw-power-controls{display:flex;gap:7px;flex-wrap:wrap;padding:12px 16px;background:#101c29}.hw-action{border:1px solid #385066;border-radius:6px;color:#d2e0eb;background:#1b2c3d;padding:8px 11px;font-size:12px!important;font-weight:650!important;transition:background .16s,border-color .16s}.hw-action:hover{background:#263f51;border-color:#6a9baf}.hw-action[data-hw-action=boot]{background:#12483f;border-color:#278876;color:#a4efdd}.hw-action[data-hw-action=unplug]{color:#e9be7e;border-color:#6b5535;background:#30291e}.hw-view-tabs{display:flex;gap:0;align-items:center;border-bottom:1px solid var(--hw-line);padding:0 14px;background:#101d2a}.hw-view-tabs button{border:0;border-bottom:2px solid transparent;background:transparent;color:#97adbf;padding:12px 13px;font-size:12px;font-weight:650}.hw-view-tabs button[aria-selected=true]{border-bottom-color:#4cd6bc;color:#7ee8d3;background:#14312f}.hw-bench-tag{margin-left:auto;font:600 9px ui-monospace,Consolas,monospace;letter-spacing:.13em;color:#6c8b9d}.hw-canvas{position:relative;background:#0a1420;overflow:hidden}.hw-svg{display:block;width:100%;height:auto;max-height:720px}.hw-svg text{font-family:Inter,system-ui,sans-serif;pointer-events:none}.hw-hit{cursor:pointer}.hw-hit:focus-visible{outline:0}.hw-hit:hover>rect,.hw-hit:focus-visible>rect,.hw-hit-selected>rect{stroke:#75e4c7;filter:drop-shadow(0 0 3px #2abfa238)}.hw-hit:hover>rect[fill=transparent],.hw-hit-selected>rect[fill=transparent]{fill:#43bea50b;stroke:#52bc9b;stroke-dasharray:4 3}.hw-document-launch{cursor:pointer}.hw-document-launch:hover>rect:first-child,.hw-document-launch:focus-visible>rect:first-child{fill:#20536a;stroke:#9bffe8;stroke-width:2}.hw-fan-running{animation:hw-spin 4s linear infinite}.hw-delivery{display:flex;gap:18px;align-items:center;justify-content:space-between;padding:15px 18px;border-top:1px solid #25403f;border-bottom:1px solid #25403f;background:#102c2c}.hw-delivery strong,.hw-delivery span{display:block}.hw-delivery strong{font-size:13px;color:#8ee3d0;margin-bottom:3px}.hw-delivery span{font-size:11px;color:#a3c2c4;max-width:450px}.hw-delivery .hw-action{white-space:nowrap;background:#195849;border-color:#398d76;color:#bbf5e1}.hw-delivery .hw-action[aria-disabled=true]{background:#1a3439;border-color:#36545a;color:#86a6ad}.hw-delivery-done{background:#113a2e;border-color:#2d7154}.hw-inspect-controls{display:flex;flex-wrap:wrap;gap:6px;padding:15px 16px 0}.hw-inspect-controls button{color:#b4c7d5;background:#182a3b;border:1px solid #30485d;border-radius:5px;padding:6px 9px;font-size:11px;font-weight:600}.hw-inspect-controls button:hover,.hw-inspect-controls button.hw-inspect-active{color:#8ee9d3;border-color:#358977;background:#143c35}.hw-inspector{margin:12px 16px 16px;padding:16px 17px;background:#142333;border:1px solid #2d4357;border-radius:9px}.hw-inspector-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.hw-eyebrow{color:#6cd4bd;letter-spacing:.12em;font:700 9px/1.6 ui-monospace,Consolas,monospace}.hw-evidence-count{color:#829daf;font:500 10px ui-monospace,Consolas,monospace}.hw-inspector h3,.hw-parts-tray h3{color:#e3edf4;font:650 17px/1.4 Inter,system-ui,sans-serif;margin:6px 0}.hw-inspector p{font-size:12px;line-height:1.75;color:#a9c0d0;margin:8px 0 14px}.hw-repair-actions{display:flex;flex-wrap:wrap;gap:7px}.hw-inline-note{margin:0!important}.hw-parts-tray{border-top:1px solid var(--hw-line);padding:18px 16px;background:#101d2a}.hw-tray-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.hw-tray-heading>span{padding:4px 9px;border:1px solid #31514f;color:#88d2bf;font:600 11px ui-monospace,Consolas,monospace;border-radius:5px}.hw-parts-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.hw-part{display:flex;align-items:center;gap:9px;padding:11px 10px;border:1px solid #30465b;background:#182a3b;border-radius:7px;min-width:0}.hw-part[draggable=true]{cursor:grab}.hw-part[draggable=true]:active{cursor:grabbing}.hw-part-icon{width:26px;flex-shrink:0;font-size:24px;color:#8cb0c1;line-height:1}.hw-part>div:nth-child(2){flex:1;min-width:0}.hw-part strong,.hw-part span{display:block}.hw-part strong{color:#d8e6ef;font-size:11px;font-weight:650}.hw-part span{color:#8ea7ba;font-size:9px;line-height:1.5;margin-top:3px}.hw-part button{background:#153e38;border:1px solid #357d6b;color:#a3edda;border-radius:4px;padding:5px 7px;font-size:10px;font-weight:600}.hw-part-installed{border-color:#2a5047;background:#152e2c}.hw-part-installed .hw-part-icon{color:#64bda2}.hw-part-installed button{color:#87c8b4;background:transparent;border-color:transparent}.hw-drop-hint{position:absolute;bottom:5px;right:10px;color:#80a6b1;font-size:9px;background:#0b1728db;padding:4px 7px;border-radius:3px}.hw-model-note{margin:0;padding:12px 16px;border-top:1px solid #253a4c;font-size:10px;color:#7d98ac;line-height:1.65;background:#0d1926}@keyframes hw-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.hw-fan-running{animation:none}.hw-action{transition:none}}@media(max-width:720px){.hw-status-bar{gap:11px;padding:11px 12px}.hw-work-safety{margin-left:0;flex-basis:100%}.hw-power-controls{padding:10px 11px;gap:6px}.hw-power-controls .hw-action{flex:1 1 calc(50% - 6px);font-size:11px!important;padding:8px 5px}.hw-view-tabs{padding:0 6px}.hw-view-tabs button{padding:10px 11px;font-size:11px}.hw-bench-tag{font-size:8px}.hw-delivery{padding:13px 12px;align-items:flex-start;gap:10px}.hw-delivery .hw-action{font-size:10px!important;padding:7px 8px}.hw-delivery span{font-size:10px}.hw-delivery strong{font-size:12px}.hw-inspect-controls{padding:12px 11px 0}.hw-inspect-controls button{font-size:10px;padding:5px 7px}.hw-inspector{margin:11px;padding:13px}.hw-inspector p{font-size:11px}.hw-parts-tray{padding:15px 11px}.hw-part{padding:8px 7px;gap:6px}.hw-part-icon{width:19px;font-size:20px}.hw-part strong{font-size:10px}.hw-part span{font-size:8px}.hw-part button{font-size:9px;padding:5px}.hw-drop-hint{font-size:8px;right:6px;bottom:0}}@media(max-width:440px){.hw-parts-grid{grid-template-columns:1fr}.hw-delivery{flex-direction:column}.hw-delivery .hw-action{width:100%}.hw-bench-tag{display:none}.hw-inspector h3{font-size:15px}}

/* Keep the same bench usable with a trackpad, touch screen, or keyboard. */
.hw-workbench { container-type: inline-size; }
.hw-workbench button,
.hw-workbench select { touch-action: manipulation; -webkit-tap-highlight-color: #58d8bb33; }
.hw-workbench .hw-action,
.hw-view-tabs button,
.hw-inspect-controls button,
.hw-part button { min-height: 44px; min-width: 44px; box-sizing: border-box; }
.hw-workbench .hw-action { font-size: 13px !important; padding: 10px 13px; }
.hw-power-controls { gap: 8px; }
.hw-power-controls .hw-action { flex: 1 1 130px; }
.hw-view-tabs { flex-wrap: wrap; gap: 2px; }
.hw-view-tabs button { padding: 11px 12px; font-size: 13px; }
.hw-bench-tag { padding: 0 7px; }
.hw-svg-closeup { max-height: 690px; }
.hw-inspect-controls { gap: 8px; }
.hw-inspect-controls button { padding: 9px 12px; font-size: 12px; }
.hw-component-select { display: flex; align-items: center; gap: 14px; margin: 13px 16px 0; color: #a9c0d0; font-size: 12px; font-weight: 600; }
.hw-component-select span { flex-shrink: 0; }
.hw-component-select select { min-width: 0; min-height: 44px; flex: 1; border: 1px solid #36546b; border-radius: 6px; color: #e0edf5; background: #172c3d; padding: 9px 12px; font: inherit; font-size: 13px; }
.hw-component-select select:focus-visible { outline: 3px solid #8af3dd; outline-offset: 3px; }
.hw-work-safety { font-size: 11px; }
.hw-status-bar { row-gap: 8px; }
.hw-inspector h3, .hw-parts-tray h3 { font-size: 18px; }
.hw-inspector p { font-size: 14px; line-height: 1.7; }
.hw-eyebrow, .hw-evidence-count { font-size: 10px; }
.hw-delivery strong { font-size: 14px; }
.hw-delivery span { font-size: 12px; overflow-wrap: anywhere; }
.hw-delivery > div { min-width: 0; }
.hw-delivery .hw-action { white-space: normal; min-width: 138px; flex-shrink: 0; }
.hw-repair-actions .hw-action { flex: 1 1 190px; text-align: center; }
.hw-parts-grid { grid-template-columns: repeat(auto-fit, minmax(min(270px, 100%), 1fr)); gap: 10px; }
.hw-part { gap: 10px; padding: 12px 10px; }
.hw-part strong { font-size: 13px; }
.hw-part span { font-size: 11px; line-height: 1.5; }
.hw-part button { font-size: 12px; padding: 9px; flex-shrink: 0; }
.hw-drop-hint { position: static; display: block; padding: 9px 15px; font-size: 12px; line-height: 1.5; border-top: 1px solid #253b4a; border-radius: 0; }
.hw-model-note { font-size: 11px; }
@container (max-width: 650px) {
  .hw-work-safety { margin-left: 0; flex-basis: 100%; }
  .hw-bench-tag { display: none; }
  .hw-view-tabs { padding: 0 8px; }
  .hw-view-tabs button { flex: 1 1 auto; padding: 10px 8px; font-size: 12px; }
  .hw-delivery { flex-wrap: wrap; }
  .hw-delivery .hw-action { flex: 1 0 150px; }
}
@media (max-width: 820px) {
  .hw-workbench .hw-action { min-height: 44px; font-size: 13px !important; padding: 10px 11px; }
  .hw-power-controls .hw-action { flex-basis: calc(50% - 8px); }
  .hw-status-bar { padding: 12px; }
  .hw-inspector p { font-size: 14px; }
  .hw-inspector h3 { font-size: 18px; }
  .hw-component-select { margin: 12px 11px 0; gap: 10px; }
  .hw-part strong { font-size: 13px; }
  .hw-part span { font-size: 11px; }
  .hw-part button { font-size: 12px; }
  .hw-drop-hint { font-size: 12px; }
}
@media (pointer: coarse) {
  .hw-workbench .hw-action, .hw-view-tabs button, .hw-inspect-controls button, .hw-part button, .hw-component-select select { min-height: 48px; }
  .hw-hit { touch-action: manipulation; }
}
@media (max-width: 440px) {
  .hw-component-select { align-items: stretch; flex-direction: column; gap: 6px; }
  .hw-delivery .hw-action { min-width: 0; flex-basis: auto; }
  .hw-view-tabs button { font-size: 11px; padding-inline: 6px; }
}
@media (pointer: coarse) {
  .hw-component-select select { font-size: 16px; }
}
/* ViewBox letterboxing can reveal off-crop artwork; omit bench annotations in the PC close-up. */
.hw-svg-closeup .hw-bench-annotation { display: none; }

/* State-based missions and optional coaching; the equipment model remains the source of truth. */
.hw-controls-label { flex-basis: 100%; color: #b7d0dc; font-size: 13px; font-weight: 650; line-height: 1.5; }
.hw-canvas-help { margin: 0; padding: 10px 16px; border-bottom: 1px solid var(--hw-line); color: #b1c7d4; background: #10212f; font-size: 13px; line-height: 1.55; }
.hw-help { border-top: 1px solid #35515c; }
.hw-help h4 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 12px; margin: 0; padding: 13px 0 11px; color: #e2efef; font-size: 14px; line-height: 1.6; }
.hw-help h4 span { color: #a9c5d2; font-size: 12px; font-weight: 400; }
.hw-help ol { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; margin: 0; padding: 0; list-style: none; color: #bad0dc; font-size: 13px; line-height: 1.65; }
.hw-help li { min-width: 0; padding: 0 0 11px; overflow-wrap: anywhere; }
.hw-help li > strong { display: block; margin-bottom: 4px; }
.hw-help strong { color: #e2efef; }
.hw-help em { font-style: normal; color: #ddedeb; font-weight: 600; }
.hw-help > p { margin: 0; padding: 0 0 15px; color: #a9c5d2; font-size: 13px; line-height: 1.7; }
.hw-change-heading { display: grid; gap: 4px; margin: 16px 0 11px; padding-top: 13px; border-top: 1px solid #324b5d; }
.hw-change-heading strong { color: #dae9ef; font-size: 14px; font-weight: 650; }
.hw-change-heading span { color: #a5becd; font-size: 13px; line-height: 1.6; }
.hw-mission { padding: 17px 18px 0; border-bottom: 1px solid #2b4354; background: linear-gradient(125deg, #142d35, #111f2d 72%); }
.hw-mission-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.hw-mission-heading > div { min-width: 0; }
.hw-mission-heading h3 { margin: 3px 0 10px; color: #e7f2f6; font-size: 19px; font-weight: 650; line-height: 1.35; }
.hw-mission-count { white-space: nowrap; color: #9cb8c6; font: 500 11px ui-monospace, Consolas, monospace; }
.hw-mission-count strong { font-size: 23px; color: #82e1c8; font-weight: 600; }
.hw-mission progress { display: block; width: 100%; height: 5px; margin: 0 0 15px; overflow: hidden; border: 0; border-radius: 8px; color: #55d2af; background: #263d4a; accent-color: #55d2af; }
.hw-mission progress::-webkit-progress-bar { background: #263d4a; border-radius: 8px; }
.hw-mission progress::-webkit-progress-value { background: #55d2af; border-radius: 8px; }
.hw-mission progress::-moz-progress-bar { background: #55d2af; border-radius: 8px; }
.hw-checkpoints { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; padding: 0; margin: 0 0 13px; list-style: none; }
.hw-checkpoints li { display: flex; align-items: flex-start; gap: 9px; padding: 11px 9px; border: 1px solid #2c4353; border-radius: 7px; background: #10212f; min-width: 0; }
.hw-checkpoints li > span { display: grid; place-items: center; width: 23px; height: 23px; flex-shrink: 0; border: 1px solid #466173; border-radius: 50%; color: #8ea7b7; font: 600 11px ui-monospace, Consolas, monospace; }
.hw-checkpoints li > div { min-width: 0; }
.hw-checkpoints strong, .hw-checkpoints small { display: block; }
.hw-checkpoints strong { color: #b5cad7; font-size: 12px; font-weight: 600; line-height: 1.5; }
.hw-checkpoints small { margin-top: 3px; color: #7997aa; font-size: 10px; line-height: 1.4; }
.hw-checkpoints .hw-checkpoint-current { border-color: #537968; background: #183a35; }
.hw-checkpoint-current > span { color: #d2eddf !important; border-color: #7fae91 !important; }
.hw-checkpoint-current strong { color: #e3efe9; }
.hw-checkpoint-current small { color: #a2c5b8; }
.hw-checkpoints .hw-checkpoint-done { border-color: #316d59; background: #15392f; }
.hw-checkpoint-done > span { background: #4ec49a; color: #0d2c25 !important; border-color: #4ec49a !important; }
.hw-checkpoint-done strong { color: #9fe5cb; }
.hw-mission-next { display: flex; align-items: center; gap: 17px; justify-content: space-between; margin-bottom: 13px; }
.hw-mission-next p { margin: 0; color: #adc6d1; font-size: 13px; line-height: 1.65; max-width: 650px; }
.hw-mission-next .hw-action { flex-shrink: 0; max-width: 260px; background: #1c3a45; border-color: #4b7885; color: #c0e8ed; }
.hw-coach { border-top: 1px solid #35515c; color: #b0c6d2; }
.hw-coach > summary { display: flex; align-items: center; gap: 9px; list-style: none; padding: 11px 0; color: #a8dcd3; font-size: 13px; font-weight: 600; }
.hw-coach > summary::-webkit-details-marker { display: none; }
.hw-coach > summary::after { content: '+'; margin-left: auto; color: #75d6c1; font-size: 21px; font-weight: 400; line-height: 1; }
.hw-coach[open] > summary::after { content: '−'; }
.hw-coach > summary > span { display: grid; place-items: center; width: 22px; height: 22px; border: 1px solid #4b8d80; border-radius: 50%; font-size: 12px; }
.hw-coach summary { min-height: 44px; box-sizing: border-box; cursor: pointer; touch-action: manipulation; }
.hw-coach summary:focus-visible { outline: 3px solid #8af3dd; outline-offset: 2px; border-radius: 4px; }
.hw-coach-body { padding: 0 0 15px; }
.hw-coach-body p { margin: 4px 0 12px; color: #b7cbd7; font-size: 13px; line-height: 1.75; }
.hw-coach-body strong { color: #d6e9ec; font-weight: 650; }
.hw-coach details { margin-top: 6px; padding-left: 14px; border-left: 2px solid #386659; }
.hw-coach details summary { padding: 10px 0 10px 4px; color: #92d6c7; font-size: 13px; font-weight: 600; }
.hw-coach details > div { padding: 0 0 2px 4px; }
.hw-coach details .hw-action { background: #1d5044; border-color: #418e76; color: #d2f3e7; margin: 0 0 5px; }
@container (max-width: 680px) {
  .hw-help ol { grid-template-columns: minmax(0,1fr); gap: 0; }
  .hw-mission { padding: 14px 12px 0; }
  .hw-mission-heading h3 { font-size: 17px; }
  .hw-mission-count { font-size: 10px; }
  .hw-checkpoints { gap: 6px; }
  .hw-checkpoints li { padding: 9px 7px; gap: 6px; }
  .hw-checkpoints strong { font-size: 11px; }
  .hw-checkpoints small { font-size: 9px; }
  .hw-mission-next { flex-wrap: wrap; gap: 9px; }
  .hw-mission-next .hw-action { max-width: none; }
}
@media (max-width: 540px) {
  .hw-mission { padding: 14px 12px 0; }
  .hw-mission-heading { align-items: flex-start; gap: 10px; }
  .hw-mission-heading h3 { font-size: 17px; }
  .hw-mission-count { max-width: 74px; white-space: normal; font-size: 10px; text-align: right; }
  .hw-checkpoints { grid-template-columns: 1fr; gap: 6px; }
  .hw-checkpoints li { align-items: center; padding: 8px 10px; }
  .hw-checkpoints li > div { display: flex; flex: 1; align-items: center; justify-content: space-between; gap: 10px; }
  .hw-checkpoints strong { font-size: 12px; }
  .hw-checkpoints small { font-size: 10px; max-width: 110px; margin: 0; text-align: right; }
  .hw-mission-next { flex-direction: column; align-items: stretch; gap: 10px; }
  .hw-mission-next .hw-action { max-width: none; }
}
@media (pointer: coarse) {
  .hw-coach summary { min-height: 48px; }
}

/* Equipment controls have generous touch targets; dragging is always optional. */
.hw-cable-station,.hw-diagnostics { padding:18px; border-block:1px solid #344a59; background:linear-gradient(115deg,#172a37,#101d2a 75%); }
.hw-cable-heading,.hw-diagnostics-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; }
.hw-cable-heading h3,.hw-diagnostics-heading h3 { margin:4px 0; color:#e0edf1; font-size:17px; line-height:1.4; }
.hw-cable-route,.hw-instrument-tag { color:#b6cbd6; border:1px solid #476171; border-radius:5px; background:#111e29; padding:6px 9px; font:500 11px/1.5 ui-monospace,Consolas,monospace; }
.hw-cable-station>p,.hw-tool-help { margin:10px 0 13px; color:#b9cdd8; font-size:13px; line-height:1.65; }
.hw-cable-pickup { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:14px; }
.hw-cable-pickup>.hw-action { display:flex; align-items:center; justify-content:center; gap:10px; min-height:48px; background:#283948; border-color:#71919d; }
.hw-cable-pickup>.hw-action[aria-pressed=true] { background:#184d43; border-color:#72ddbd; color:#ddfff3; }
.hw-cable-pickup>span { flex:1 1 200px; color:#a8c5ce; font-size:12px; line-height:1.6; }
.hw-cable-plug { display:inline-block; position:relative; width:27px; height:16px; box-sizing:border-box; border:3px solid #a4b0b7; border-radius:3px 3px 6px 6px; background:repeating-linear-gradient(90deg,#b99c51 0 2px,#253340 2px 4px); box-shadow:0 3px 0 #0d1521; }
.hw-cable-plug::before { position:absolute; content:''; left:5px; top:-10px; width:10px; height:8px; background:#18222a; border:1px solid #617584; }
.hw-socket-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.hw-socket { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:13px; text-align:left; min-height:88px; border:1px solid #506571; border-radius:8px; color:#d9e7ee; background:linear-gradient(160deg,#33424e,#172634 70%); box-shadow:inset 0 1px #8394a020,0 3px 0 #07111a; }
.hw-socket:hover { background:linear-gradient(160deg,#415b68,#233a49 70%); border-color:#9ec5c9; }
.hw-socket-target { border:2px solid #7bdfc3; background:linear-gradient(160deg,#26564e,#16352f); }
.hw-socket-connected .hw-port-face { border-color:#e8c772; }
.hw-socket>span:nth-child(2) { min-width:0; flex:1 1 130px; }
.hw-socket strong,.hw-socket small { display:block; }
.hw-socket strong { font-size:13px; line-height:1.5; }
.hw-socket small { margin-top:4px; color:#afc5d0; font-size:11px; line-height:1.5; }
.hw-socket em { margin-left:auto; color:#97e8d2; font-size:12px; line-height:1.5; font-style:normal; font-weight:650; }
.hw-port-face { width:49px; height:25px; flex-shrink:0; display:flex; align-items:center; justify-content:space-evenly; border:3px solid #8c9daa; border-bottom-width:5px; border-radius:4px 4px 8px 8px; background:#030b11; box-shadow:inset 0 3px 3px #000,0 1px #bac6cf66; box-sizing:border-box; }
.hw-port-face i { width:3px; height:6px; background:#b39b61; }
.hw-canvas-cable-held .hw-picture-socket>rect { stroke:#8bffdc; stroke-width:3; filter:drop-shadow(0 0 4px #38d7ae55); }
.hw-canvas-cable-held .hw-picture-socket { cursor:crosshair; }
.hw-diagnostics { background:#0d1a26; }
.hw-instrument-tag { color:#8dc8bd; font-size:10px; letter-spacing:.07em; }
.hw-readout-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.hw-readout { display:flex; flex-direction:column; gap:9px; align-items:stretch; min-width:0; min-height:124px; padding:13px 11px; text-align:left; background:#142733; border:1px solid #3a5664; border-radius:8px; color:#cfe2e7; }
.hw-readout:hover { background:#1b3640; border-color:#76aaac; }
.hw-readout[aria-pressed=true] { border:2px solid #80dcca; padding:12px 10px; background:#1c3a3c; }
.hw-readout>span { font-size:12px; font-weight:600; color:#bacfd8; }
.hw-readout strong { flex:1; color:#e4bc80; font:600 13px/1.6 ui-monospace,Consolas,monospace; overflow-wrap:anywhere; }
.hw-readout-safe strong { color:#99e2c9; }
.hw-readout small { color:#91b3be; font-size:10px; line-height:1.5; }
.hw-readout small>span { float:right; }
.hw-diagnostic-result { padding:14px; margin-top:11px; border:1px solid #3d5f62; border-left:3px solid #6acfb5; border-radius:6px; background:#122c30; }
.hw-diagnostic-result>strong { color:#b2ead9; font-size:13px; }
.hw-diagnostic-result>p { margin:6px 0 0; color:#bdd2d9; font-size:13px; line-height:1.75; }
.hw-tool-note { margin:10px 0 0; color:#93adbf; font-size:11px; line-height:1.7; }
@container(max-width:700px) {
  .hw-readout-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hw-readout { min-height:115px; }
  .hw-cable-station,.hw-diagnostics { padding:15px 12px; }
}
@container(max-width:480px) {
  .hw-socket-grid { grid-template-columns:minmax(0,1fr); }
  .hw-cable-pickup>.hw-action { flex:1 1 auto; }
  .hw-readout strong { font-size:12px; }
}
@media(pointer:coarse) { .hw-cable-station button,.hw-diagnostics button { min-height:48px; } }

.hw-monitor-controls { margin:12px 0; padding:16px; border:1px solid #365367; border-radius:12px; background:#112332; }
.hw-monitor-controls h3 { margin:4px 0 0; color:#e6f1f4; font-size:16px; }
.hw-monitor-controls p { color:#b9cedb; font-size:13px; line-height:1.55; }
.hw-monitor-indicator { display:inline-block; padding:7px 10px; border:1px solid #947342; border-radius:8px; color:#f2ca86; font-size:12px; line-height:1.5; }
.hw-monitor-linked { border-color:#368a78; color:#8ee5cc; }
.hw-source-select,.hw-monitor-cable { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.hw-monitor-controls .hw-action { min-height:44px; }
.hw-monitor-controls .hw-action[aria-pressed="true"] { border-color:#58d2bb; background:#173f40; color:#d4fff3; }
@container(max-width:480px) { .hw-monitor-controls .hw-action { flex:1 1 auto; } }
@media(pointer:coarse) { .hw-monitor-controls .hw-action { min-height:48px; } }

/* Pointer, touch, and keyboard all place the same authored parts onto model sockets. */
.hw-handling{padding:20px 18px 14px;border-top:1px solid #365166;border-bottom:1px solid #365166;background:linear-gradient(150deg,#192d3c,#101f2e 64%)}
.hw-handling-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.hw-handling-heading h3{margin:4px 0 0;color:#edf4f6;font-size:19px;line-height:1.35}
.hw-stock-count{flex:none;padding:6px 9px;border:1px solid #4a686b;border-radius:6px;color:#a1d6cc;font:600 10px/1.5 ui-monospace,Consolas,monospace}
.hw-handling-help{max-width:850px;margin:9px 0 14px;color:#b4c7d2;font-size:12px;line-height:1.75}
.hw-pick-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}
.hw-pick-part{position:relative;display:flex;gap:7px;align-items:center;min-width:0;min-height:78px;padding:10px 7px 17px;border:1px solid #4a6073;border-radius:7px;background:linear-gradient(150deg,#2b4051,#182b3b);color:#e3edf3;text-align:left;box-shadow:inset 0 1px #ffffff0b,0 4px 9px #030c1433;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab!important}
.hw-pick-part:not(:disabled):hover{border-color:#8fbdc8;background:linear-gradient(150deg,#385469,#1c3443)}
.hw-pick-part>svg{width:43px;height:38px;flex:none;filter:drop-shadow(0 3px 2px #0007);pointer-events:none}
.hw-pick-part>span{display:block;min-width:0;pointer-events:none}
.hw-pick-part strong{display:block;color:#dfebf0;font-size:10px;font-weight:700;line-height:1.4;overflow-wrap:anywhere}
.hw-pick-part small{display:block;margin-top:4px;color:#a4bbc9;font-size:8px;line-height:1.45;overflow-wrap:anywhere}
.hw-pick-part em{position:absolute;bottom:3px;right:7px;color:#90cdbf;font:600 8px/1.5 ui-monospace,Consolas,monospace;font-style:normal;pointer-events:none}
.hw-pick-fitted{border-color:#34544e!important;background:#17302f!important;opacity:.72!important;touch-action:auto;box-shadow:none;cursor:default!important}
.hw-pick-fitted svg{filter:grayscale(.35);opacity:.72}
.hw-pick-fitted small{color:#a6d1c1}
.hw-fitted-inventory{margin-top:10px;border-top:1px solid #36515e}
.hw-fitted-inventory summary{padding:9px 0;color:#9fc6c6;font-size:11px;cursor:pointer}
.hw-pick-part.hw-picked{border-color:#96ffe0;box-shadow:0 0 0 2px #5edabf,0 6px 15px #0007;background:#1e4a45;cursor:grabbing!important}
.hw-held-readout{display:flex;align-items:center;gap:12px;margin-top:12px;padding:10px 12px;border:1px solid #3c5c6b;border-radius:7px;background:#0c1b29;min-height:53px}
.hw-held-readout p{flex:1;margin:0;color:#b3ced6;font-size:12px;line-height:1.6}
.hw-held-readout p[data-kind="warning"]{color:#f1ca8b}
.hw-held-readout p[data-kind="success"]{color:#a5e8d0}
.hw-held-readout [hidden]{display:none}
.hw-equipment-stage{isolation:isolate;background:radial-gradient(ellipse at 72% 25%,#1f3c43,#0b1622 65%);border-top:1px solid #344e5f;border-bottom:1px solid #344e5f;box-shadow:inset 0 12px 30px #02091080}
.hw-equipment-stage>.hw-svg{filter:drop-shadow(0 12px 12px #0005)}
.hw-stage-caption{position:absolute;right:12px;bottom:9px;max-width:calc(100% - 24px);color:#869eab;background:#081621d9;padding:4px 7px;border:1px solid #2b4051;border-radius:3px;font:500 8px/1.6 ui-monospace,Consolas,monospace;letter-spacing:.04em;pointer-events:none}
.hw-target-list{padding:12px 16px;background:#101f2c;border-bottom:1px solid #2c4354}
.hw-target-list summary,.hw-quick-install>summary{padding:7px 0;color:#b8d8de;cursor:pointer;font-size:12px;font-weight:650}
.hw-target-list>p{margin:4px 0 11px;color:#99b3c2;font-size:11px;line-height:1.7}
.hw-target-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.hw-target-grid>button{display:flex;align-items:center;gap:9px;min-width:0;min-height:46px;padding:9px 10px;border:1px solid #415a6b;border-radius:6px;background:#1c3040;color:#c4d7df;text-align:left;font-size:11px;line-height:1.5;overflow-wrap:anywhere}
.hw-target-grid>button>span{font-size:23px;line-height:1;color:#a8bfca}
.hw-socket-compatible{outline:2px dashed #8be5d2!important;outline-offset:2px}
g.hw-socket-compatible>rect,g.hw-socket-compatible>g>rect{stroke:#8be5d2!important;stroke-width:2;stroke-dasharray:4 3}
.hw-socket-hover{outline:3px solid #f6d594!important;outline-offset:4px;background:#45513d!important}
g.hw-socket-hover>rect,g.hw-socket-hover>g>rect{stroke:#ffe09a!important;stroke-width:4;stroke-dasharray:none;filter:drop-shadow(0 0 4px #eaba55)}
.hw-drag-ghost{position:fixed;z-index:10000;max-width:180px;padding:10px 13px;border:1px solid #a8f7dd;border-radius:8px;background:#153c3aee;box-shadow:0 8px 22px #0008;color:#d9fff1;font:650 12px/1.5 Inter,system-ui,sans-serif;pointer-events:none;user-select:none}
.hw-dragging-part,.hw-dragging-part *{cursor:grabbing!important}
.hw-quick-install{padding:7px 16px;background:#0f1e2b}
.hw-quick-install .hw-parts-tray{padding:12px 0;background:transparent;border:0}
@container(max-width:900px){.hw-pick-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hw-pick-part{min-height:68px}.hw-pick-part>svg{width:39px;height:33px}.hw-target-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container(max-width:560px){.hw-handling{padding:16px 12px 12px}.hw-handling-heading{align-items:flex-start;gap:8px}.hw-handling-heading h3{font-size:16px}.hw-stock-count{padding:5px 7px;font-size:8px}.hw-handling-help{font-size:11px}.hw-pick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hw-pick-part{min-height:73px;padding:9px 7px 18px}.hw-pick-part strong{font-size:10px}.hw-pick-part small{font-size:9px}.hw-target-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hw-held-readout{align-items:flex-start;flex-wrap:wrap}.hw-held-readout p{flex-basis:100%;font-size:11px}.hw-target-list{padding:10px 12px}.hw-stage-caption{font-size:6px;right:6px;bottom:5px}.hw-bench-tag{display:none}}
@media(pointer:coarse){.hw-target-grid>button{min-height:50px}.hw-pick-part{min-height:78px}.hw-target-list summary{min-height:44px;display:flex;align-items:center}}
@media(prefers-reduced-motion:reduce){.hw-pick-part,.hw-socket-compatible,.hw-socket-hover{transition:none}}

/* A bounded tray sits beside the equipment so a real drag fits a classroom laptop. */
.hw-physical-workspace{display:grid;grid-template-columns:225px minmax(0,1fr);align-items:start;background:#10202d}
.hw-physical-workspace .hw-handling{padding:14px 11px;border-top:0;border-right:1px solid #365166;border-bottom:0;min-width:0}
.hw-physical-workspace .hw-handling-heading{display:block}
.hw-physical-workspace .hw-handling-heading h3{font-size:16px}
.hw-physical-workspace .hw-stock-count{display:inline-block;margin-top:8px;font-size:9px}
.hw-physical-workspace .hw-handling-help{font-size:10px;line-height:1.6;margin:9px 0}
.hw-physical-workspace .hw-pick-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:360px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#547786 #122838;scrollbar-width:thin;padding:2px 3px 4px 2px}
.hw-physical-workspace .hw-pick-part{display:block;min-height:88px;padding:8px 6px 17px}
.hw-physical-workspace .hw-pick-part>svg{display:block;width:45px;height:33px;margin:0 auto 5px}
.hw-physical-workspace .hw-pick-part strong{font-size:9px;line-height:1.4}
.hw-physical-workspace .hw-pick-part small{font-size:8px}
.hw-physical-workspace .hw-held-readout{display:block;margin-top:9px;padding:9px}
.hw-physical-workspace .hw-held-readout p{font-size:10px}
.hw-physical-workspace .hw-held-readout .hw-action{margin-top:8px;font-size:10px!important}
.hw-equipment-pane{min-width:0;padding-top:3px;background:#0b1723}
.hw-equipment-pane .hw-canvas-help{font-size:11px;line-height:1.7;padding:12px;margin:0}
.hw-equipment-pane .hw-svg{min-height:370px}
@container(max-width:760px){.hw-physical-workspace{grid-template-columns:minmax(0,1fr)}.hw-physical-workspace .hw-handling{padding:14px 12px;border-right:0;border-bottom:1px solid #365166}.hw-physical-workspace .hw-handling-heading{display:flex}.hw-physical-workspace .hw-stock-count{margin-top:0}.hw-physical-workspace .hw-pick-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:184px;gap:7px}.hw-physical-workspace .hw-pick-part{min-height:80px}.hw-physical-workspace .hw-pick-part>svg{display:none}.hw-physical-workspace .hw-pick-part strong{font-size:10px}.hw-physical-workspace .hw-pick-part small{font-size:9px}.hw-physical-workspace .hw-handling-help{font-size:11px}.hw-physical-workspace .hw-held-readout p{font-size:11px}.hw-equipment-pane .hw-svg{min-height:0}.hw-physical-workspace .hw-held-readout .hw-action{min-height:44px}}
@container(max-width:430px){.hw-physical-workspace .hw-pick-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:180px}.hw-physical-workspace .hw-handling-heading h3{font-size:15px}.hw-physical-workspace .hw-stock-count{font-size:8px}}

/* Scrolling starts on the card; only this explicit grip starts a touch/pen drag. */
.hw-physical-workspace .hw-pick-part{touch-action:pan-y;min-height:126px;padding-bottom:52px}
.hw-physical-workspace .hw-pick-fitted{touch-action:pan-y;min-height:88px;padding-bottom:17px}
.hw-pick-part>.hw-part-drag-handle{position:absolute;right:4px;bottom:4px;display:flex;align-items:center;justify-content:center;gap:3px;width:44px;height:44px;padding:0;border:1px solid #5c8c9c;border-radius:5px;background:#183c49;color:#c7ecec;touch-action:none;pointer-events:auto;cursor:grab;line-height:1}
.hw-part-drag-handle>b{font-size:23px;font-weight:400;pointer-events:none}
.hw-pick-part .hw-part-drag-handle>small{margin:0;color:#b8dcdf;font-size:9px;line-height:1;pointer-events:none}
@container(max-width:760px){.hw-physical-workspace .hw-pick-part{min-height:110px}.hw-physical-workspace .hw-pick-fitted{min-height:80px}.hw-physical-workspace .hw-pick-grid{max-height:230px}}
.hw-display-controls{padding:10px 16px;border-bottom:1px solid #2e4656;background:#11212f}
.hw-display-controls>summary{padding:8px 0;color:#b9d9e0;font-size:12px;font-weight:650;cursor:pointer}
.hw-quick-source{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 16px;background:#10242f;border-bottom:1px solid #304a59}
.hw-quick-source>span{margin-right:auto;font-size:12px;color:#abc7d4}
.hw-quick-source>span>strong{color:#e2eff4}
.hw-quick-source .hw-action[aria-pressed="true"]{border-color:#6ecdb5;background:#17453f;color:#c9f2e7}
@container(max-width:560px){.hw-quick-source{padding:12px}.hw-quick-source>span{flex-basis:100%}.hw-quick-source .hw-action{min-height:44px}.hw-display-controls{padding:8px 12px}.hw-display-controls>summary{min-height:44px;line-height:1.7}}
