/* Interactive equipment stays inside the existing iPhone tab frame. */
html, body { touch-action: pan-x pan-y; }
/* Safari 26 can omit a scrolling flex column's vertical padding from its
   scrollHeight (WebKit 316901). Real flex spacers keep every tool's controls
   reachable above the dock, including views whose content almost fits.
   Subtract the adjacent gap so the visible spacing stays the same. */
#panel-test { --bench-gap: 10px; --bench-top-space: 14px; gap: var(--bench-gap); padding-top: 0; padding-bottom: 0; }
#panel-test::before, #panel-test::after { content: ""; display: block; flex: 0 0 auto; pointer-events: none; }
#panel-test::before { height: calc(var(--bench-top-space) - var(--bench-gap)); }
#panel-test::after { height: calc(var(--bottom-dock-height) + 16px - var(--bench-gap)); }
/* Let wrapped labels and readings enlarge the rig rather than overflow its
   old fixed flex basis into the space reserved for the dock. */
.test-rig { flex-basis: auto; }
@media (max-width: 750px) { #panel-test { --bench-gap: 7px; --bench-top-space: 9px; } }
.inspection-photo img, .evidence-photo { -webkit-touch-callout: none; user-select: none; }
.tool-picker { width: 100%; max-width: 850px; margin: 0 auto 14px; display: flex; gap: 7px; flex: 0 0 auto; }
.tool-picker button { flex: 1 1 0; min-width: 0; min-height: 66px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 9px 5px; border: 1px solid #4b5b65; border-radius: 7px; background: #233039; font-size: .8125rem; line-height: 1.3; }
.tool-picker button[aria-pressed=true] { color: #ffda8a; background: #373024; border-color: #cba052; box-shadow: inset 0 -3px #cba052; }
.tool-mark { font: 500 .875rem var(--mono); letter-spacing: .03em; color: #bfccd4; }
.tool-picker [aria-pressed=true] .tool-mark { color: var(--amber); }
.meter-options { flex: 0 0 auto; width: 100%; max-width: 850px; margin: 0 auto 12px; }
#meter-test-picker { display: flex; gap: 6px; flex-wrap: wrap; }
#meter-test-picker button { min-height: 44px; padding: 8px 14px; border: 1px solid #50616b; border-radius: 5px; background: #202c34; font: .8125rem var(--mono); }
#meter-test-picker button[aria-pressed=true] { background: #b8c9ba; color: #15291d; border-color: #b8c9ba; }
#meter-setup-note { font-size: .8125rem; line-height: 1.6; color: #bdc8cf; margin: 9px 0 0; }
#meter-prepare { min-height: 44px; margin-top: 10px; padding: 9px 12px; font-size: .8125rem; }
.single-measure .measure-actions { grid-template-columns: 1fr; }
.single-measure #rest-button { background: var(--amber); color: #152025; border-color: var(--amber); }
.meter-diagram-label { font: 16px var(--mono); fill: #95a8b4; }
#circuit-diagram .node-caption { font-size: 20px; }
.lead-rest .node-ring { stroke-dasharray: 3 3; }
.resistance-mode .circuit.measuring .wire { animation: none; }
.diagnostic-tester { padding: 9px 10px 12px; background: #303b43; border: 7px solid #0b1014; border-radius: 23px; box-shadow: inset 0 0 0 1px #5a6670, 0 4px 0 #080c0f; }
.tester-brand { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 4px 13px; font: 600 .9375rem var(--mono); color: #e6d2aa; }
.tester-brand > span { display: flex; align-items: center; gap: 9px; white-space: nowrap; }
.tester-brand img { width: 27px; height: 27px; border-radius: 5px; }
.tester-brand small { font: .6rem var(--mono); color: #c1c9cd; text-align: right; }
.tester-screen { border: 3px solid #0a0f12; border-radius: 8px; box-shadow: 0 0 0 1px #596770; background: #15232a; }
.tester-screen .instrument-heading { background: #1a2c36; }
.tester-screen .fault-memory { border-bottom: 0; }
.tester-welcome { padding: 25px 15px; text-align: center; background: #0e1a21; border: 1px solid #384e5b; border-radius: 4px; }
.tester-welcome strong { display: block; font: 500 2.5rem var(--mono); color: #e2c27d; margin-bottom: 9px; }
.tester-welcome p { color: #d0dce3; font-size: .875rem; }
.tester-welcome small { display: block; margin-top: 8px; color: #aebfc9; line-height: 1.6; }
.tester-keys { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 15px 4px 12px; }
.tester-keys button { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; background: #1b242b; border: 1px solid #62717a; border-radius: 9px; box-shadow: 0 3px #10171c; padding: 9px; font-size: .8125rem; }
.tester-keys button > span { font: 500 1rem var(--mono); color: #c6d0d7; }
.tester-keys button[aria-pressed=true] { border-color: #c89f57; color: #ffe0a0; background: #3a3429; }
.tester-keys button[aria-pressed=true] > span { color: var(--amber); }
.tester-footer { text-align: center; font: .6rem var(--mono); letter-spacing: .05em; color: #bdc7ce; }
.condition-picker { grid-template-columns: repeat(var(--condition-count,3),minmax(0,1fr)); }
.scanner-actions { gap: 9px; }
.scanner-actions button { flex: 1; min-height: 44px; }
.scanner-actions .primary-button small { color: #394026; }
.capture-heading select, .data-view-options select { font-size: 16px; max-width: 100%; }
.channel-label { min-width: 0; }
.data-view-options { flex-wrap: wrap; }
.hose-instrument { background: #172128; border: 1px solid #53636e; border-radius: 10px; overflow: hidden; box-shadow: 0 4px #0b1116; }
.hose-instructions { padding: 17px 17px 5px; }
.hose-instructions h3 { font-size: 1.6rem; margin-bottom: 9px; }
.hose-instructions p { font-size: .875rem; line-height: 1.6; color: #bac8d2; }
.hose-rig { display: block; width: 100%; height: auto; background: #111b22; margin-top: 12px; user-select: none; }
.rig-schematic { fill: #1d303b; stroke: #7895a7; stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; }
.rig-schematic text { stroke: none; fill: #beced8; font: 18px var(--mono); }
.rig-line { fill: none; stroke-width: 5; }
.charge-pipe { fill: none; stroke-width: 16; stroke: #5a7383; }
.actuator-rod { fill: none; stroke: #bdcdd8; stroke-width: 6; transition: transform .2s; }
.actuator-diaphragm { stroke: #e2bc6c; stroke-width: 5; }
.outlet-cap { stroke: #566671; stroke-width: 10; stroke-dasharray: 4 7; }
.outlet-cap.is-sealed { stroke: #e8bb63; stroke-dasharray: none; }
.hose-hit, .hose-handle-hit { fill: transparent; stroke: none; }
.hose-terminal { cursor: pointer; }
.hose-terminal:focus-visible { outline: none; }
.hose-ring { fill: #0c161c; stroke: #aac1ce; stroke-width: 4; }
.hose-terminal.is-connected .hose-ring { fill: #a38545; stroke: #f6d180; }
.hose-terminal.snap-target .hose-ring, .hose-terminal:focus-visible .hose-ring { stroke: #ffdc7f; stroke-width: 7; }
.test-hose { fill: none; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.hose-shadow { stroke: #050a0e; stroke-width: 12; opacity: .8; }
.hose-body { stroke: #a0944d; stroke-width: 7; }
.smoke-instrument .hose-body { stroke: #879da8; }
.hose-handle { touch-action: none; cursor: grab; }
.hose-handle.dragging { cursor: grabbing; }
.hose-handle:focus-visible { outline: none; }
.hose-handle:focus-visible .hose-handle-hit { stroke: var(--amber); stroke-width: 3; stroke-dasharray: 5 4; }
.hose-fitting { stroke: #dbbe7c; stroke-width: 13; stroke-linecap: round; }
.fitting-ribs { stroke: #514027; stroke-width: 2; }
.blanking-plate { fill: #b3bdc0; stroke: #e6e7d7; stroke-width: 3; }
.plate-bolt { fill: #4d5a60; }
.tool-dock-label { fill: #a6b8c3; font: 17px var(--mono); }
.gauge-rim { fill: #50616b; stroke: #bac7cc; stroke-width: 3; }
.gauge-face { fill: #e7e2cd; stroke: #253138; stroke-width: 4; }
.gauge-ticks { stroke: #283233; stroke-width: 2; }
.vacuum-gauge text { fill: #273331; font: 11px var(--mono); text-anchor: middle; }
.vacuum-gauge .gauge-unit { font-size: 12px; }
.gauge-needle { fill: #c84b35; transition: transform .2s; }
.gauge-needle circle { fill: #333b39; }
.smoke-source rect { fill: #303d44; stroke: #8d9b9e; stroke-width: 3; }
.smoke-source text { fill: #e2cd97; font: 21px var(--mono); }
.smoke-source circle { fill: #526267; }
.is-smoking .smoke-source circle { fill: #a2d8a7; }
.smoke-plume { pointer-events: none; opacity: 0; }
.is-smoking .smoke-plume { opacity: 1; }
.smoke-puff { fill: #e1edf0; opacity: 0; }
.is-smoking .smoke-puff { animation: test-smoke 2.1s var(--puff-delay) linear infinite; }
@keyframes test-smoke { 0% { transform: translate(0,0) scale(.5); opacity: .7; } 100% { transform: translate(var(--puff-x),-75px) scale(3.8); opacity: 0; } }
.hose-readout { display: flex; align-items: center; gap: 10px 20px; flex-wrap: wrap; border-top: 1px solid #3a4e5c; border-bottom: 1px solid #3a4e5c; padding: 13px 17px; background: #1d2e37; }
.hose-readout output { color: #f4d28d; font: 500 1.2rem var(--mono); }
.hose-readout p { flex: 1 1 180px; font-size: .8125rem; color: #c5d1d9; }
.hose-controls { display: flex; flex-wrap: wrap; gap: 9px; padding: 17px 17px 0; }
.hose-controls button { min-height: 44px; font-size: .8125rem; padding: 9px 13px; }
.hose-controls .primary-button, .hose-controls .secondary-button { flex: 1 1 115px; }
.hose-controls .text-button { flex: 1 0 100%; }
.hose-status { padding: 12px 17px 17px; color: #c1cdd5; font-size: .8125rem; line-height: 1.6; min-height: 49px; }
.hold-progress { margin: 15px 17px 0; border-top: 3px solid #52626b; position: relative; }
.hold-progress > span { position: absolute; top: -3px; left: 0; height: 3px; background: var(--amber); animation: vacuum-hold 3s linear forwards; }
.hold-progress > p { color: #bac8ce; font: .75rem var(--mono); padding-top: 9px; }
@keyframes vacuum-hold { from { width: 0; } to { width: 100%; } }
@media (max-width: 480px) {
  .tool-picker { gap: 5px; }
  .tool-picker button { font-size: .75rem; padding: 9px 3px; }
  .tool-mark { font-size: .8125rem; }
  .diagnostic-tester { padding: 7px 6px 10px; border-width: 5px; }
  .tester-brand { gap: 7px; }
  .tester-brand small { font-size: .55rem; max-width: 90px; }
  .tester-keys button { gap: 7px; font-size: .75rem; }
  .hose-instructions { padding: 14px 12px 3px; }
  .hose-readout { padding: 12px; }
  .hose-controls { padding: 14px 12px 0; }
  .hose-status { padding: 10px 12px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .gauge-needle, .actuator-rod { transition: none; }
  .is-smoking .smoke-puff { animation: none; opacity: .55; transform: translate(var(--puff-x),-18px) scale(1.8); }
  .hold-progress > span { animation: none; width: 100%; }
}