/* Focused experiment workspace; the story state owns sequence without showing a directory. */
.interaction-layer { padding: 52px 24px 20px; }
.interaction-focus { width: min(1480px, 100%); border: 1px solid #9eada7; border-radius: 10px; background: #eef0e9; box-shadow: 0 20px 70px #00101440; }
.interaction-heading { grid-template-columns: minmax(220px, auto) minmax(0, 1fr); align-items: center; gap: 28px; padding: 17px 24px; background: #fbfaf4; }
.interaction-heading h2 { font-size: clamp(22px, 2vw, 29px); letter-spacing: .02em; }
.interaction-heading p { font-size: 13px; line-height: 1.65; max-width: 720px; }
/* The persistent content element is the only vertical scroll owner. */
.interaction-content { padding: 0; overflow: auto; scrollbar-width: thin; scrollbar-color: #90aaa2 transparent; overscroll-behavior: contain; scroll-padding: 18px; }
.experiment-workspace { min-width: 0; min-height: 100%; }
.experiment-stage { min-width: 0; padding: 20px 24px; font-size: 14px; }
.interaction-footer { gap: 20px; min-height: 80px; padding: 12px 24px; background: #16383d; }
.experiment-companion { display: flex; gap: 12px; align-items: center; min-width: 0; max-width: 840px; color: #e1ede6; }
.experiment-companion-portrait { flex: 0 0 48px; width: 48px; height: 48px; position: relative; overflow: hidden; border: 1px solid #5a837c; border-radius: 50%; background: #385b59; }
.experiment-companion-portrait img { position: absolute; top: 0; left: -50%; width: 200%; height: auto; max-width: none; }
.experiment-companion[data-experiment-partner="m0"] img { left: -15%; width: 130%; }
.experiment-companion-copy { min-width: 0; }
.experiment-companion-copy b { display: block; color: #f2c594; font-size: 12px; line-height: 1.4; }
.experiment-companion-copy p { margin: 3px 0 0; color: #dce9e4; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.interaction-actions { max-width: 45%; flex-wrap: wrap; justify-content: flex-end; }
.interaction-actions button { min-height: 44px; padding: 11px 20px; border-radius: 5px; font-size: 14px; line-height: 1.4; }
.interaction-layer button:focus-visible, .interaction-layer input:focus-visible, .interaction-layer textarea:focus-visible, .interaction-content:focus-visible { outline: 3px solid #dc663e; outline-offset: 3px; }
.interaction-feedback { font-size: 13px; border-radius: 3px; }

/* Measurement section and gauge placement */
.gauge-design-workbench { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, .8fr); gap: 18px; align-items: start; }
.measurement-board, .gauge-plan { min-width: 0; background: rgba(255,255,255,.5); border: 1px solid var(--line); }
.measurement-board { display: grid; grid-template-rows: auto 355px auto; border-radius: 6px; overflow: hidden; }
.measurement-board > header { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 43px; padding: 10px 14px; color: #446364; border-bottom: 1px solid var(--line); }
.measurement-board > header span { font-size: 9px; font-weight: 750; }
.measurement-board > header output { color: #174e4e; font: 800 10px/1 ui-monospace, monospace; }
.measurement-plane { position: relative; min-height: 355px; overflow: hidden; background-color: #eef1ec; background-image: linear-gradient(rgba(41,94,92,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(41,94,92,.055) 1px, transparent 1px); background-size: 28px 28px; cursor: crosshair; touch-action: none; user-select: none; }
.measurement-beam-face { position: absolute; left: 7%; right: 7%; top: 70px; bottom: 80px; overflow: visible; background: #d7e4df; border: 2px solid #3b6868; box-shadow: 0 15px 27px rgba(24,57,58,.14); }
.measurement-layer { position: absolute; z-index: 1; left: 0; right: 0; height: 50%; }
.measurement-layer.upper { top: 0; background: linear-gradient(180deg, rgba(203,225,221,.98), rgba(180,207,201,.92)); }
.measurement-layer.lower { bottom: 0; background: linear-gradient(180deg, rgba(188,211,205,.94), rgba(214,227,221,.98)); }
.measurement-layer b, .measurement-interface b { position: absolute; left: 9px; color: #537374; font-size: 8px; font-weight: 750; }
.measurement-layer.upper b { top: 9px; }
.measurement-layer.lower b { bottom: 9px; }
.pure-bend-band { position: absolute; z-index: 2; inset: 0 31.25%; background: rgba(49,164,145,.12); border-inline: 1px dashed rgba(31,124,112,.44); }
.pure-bend-band b { position: absolute; left: 50%; top: 9px; color: #31746c; font-size: 7px; white-space: nowrap; transform: translateX(-50%); }
.measurement-interface { position: absolute; z-index: 4; left: 0; right: 0; top: 50%; height: 2px; background: #557071; transform: translateY(-50%); }
.measurement-interface b { top: 5px; }
.measurement-y-tick { position: absolute; z-index: 3; left: 0; right: 0; height: 1px; background: rgba(67,102,103,.2); pointer-events: none; }
.measurement-y-tick b { position: absolute; right: calc(100% + 7px); top: 50%; color: #728888; font: 700 7px/1 ui-monospace, monospace; transform: translateY(-50%); }
.measurement-load { position: absolute; z-index: 5; top: -44px; width: 2px; height: 43px; color: var(--orange); background: var(--orange); transform: translateX(-50%); pointer-events: none; }
.measurement-load::after { content: ""; position: absolute; left: -4px; bottom: 0; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); }
.measurement-load b { position: absolute; left: 50%; top: -11px; font: 750 7px/1 ui-monospace, monospace; transform: translateX(-50%); }
.measurement-load.left { left: 31.25%; }
.measurement-load.right { left: 68.75%; }
.measurement-support { position: absolute; z-index: 5; bottom: -27px; width: 0; height: 0; border-left: 13px solid transparent; border-right: 13px solid transparent; border-bottom: 25px solid #294d50; transform: translateX(-50%); pointer-events: none; }
.measurement-support.left { left: 0; }
.measurement-support.right { left: 100%; }
.selected-section { position: absolute; z-index: 6; top: -7px; bottom: -7px; width: 3px; background: var(--orange); box-shadow: 0 0 0 3px rgba(224,92,55,.13); transform: translateX(-50%); pointer-events: none; }
.selected-section b { position: absolute; left: 50%; top: -22px; padding: 4px 6px; color: #fff; background: var(--orange); font: 750 7px/1 ui-monospace, monospace; white-space: nowrap; transform: translateX(-50%); }
.placed-gauge { position: absolute; z-index: 8; width: 64px; height: 18px; color: #fff; background: #147b74; border: 1px solid #eaf5ef; box-shadow: 0 1px 0 rgba(18,52,53,.25); transform: translate(-50%, 50%); pointer-events: none; }
.placed-gauge i { position: absolute; left: 6px; right: 25px; top: 50%; height: 3px; background: repeating-linear-gradient(90deg, #ffd08b 0 4px, #b56b34 4px 6px); transform: translateY(-50%); }
.placed-gauge b { position: absolute; right: 5px; top: 2px; font: 800 7px/1 ui-monospace, monospace; }
.placed-gauge small { position: absolute; right: 4px; bottom: 1px; font: 650 5px/1 ui-monospace, monospace; opacity: .75; }
.measurement-x-axis { position: absolute; left: 7%; right: 7%; bottom: 22px; height: 15px; color: #718686; font: 700 7px/1 ui-monospace, monospace; }
.measurement-x-axis::before { content: ""; position: absolute; left: 0; right: 0; top: -7px; height: 1px; background: #758989; }
.measurement-x-axis span { position: absolute; transform: translateX(-50%); }
.measurement-x-axis span:nth-child(1) { left: 0; transform: none; }
.measurement-x-axis span:nth-child(2) { left: 31.25%; }
.measurement-x-axis span:nth-child(3) { left: 68.75%; }
.measurement-x-axis span:nth-child(4) { left: 100%; transform: translateX(-100%); }
.section-slider { display: grid; grid-template-columns: auto minmax(160px, 1fr) 62px; align-items: center; gap: 11px; min-height: 45px; padding: 8px 14px; color: #50696a; border-top: 1px solid var(--line); font-size: 9px; font-weight: 750; }
.section-slider input { accent-color: var(--orange); }
.section-slider output { color: #1b5351; font: 800 9px/1 ui-monospace, monospace; }
.gauge-plan { padding: 20px; border-radius: 6px; }
.gauge-plan h3 { margin: 0 0 10px; font-family: "STZhongsong", "Songti SC", serif; font-size: clamp(21px, 2vw, 27px); }
.gauge-plan > p { margin: 0 0 17px; color: #536b6c; font-size: 10px; line-height: 1.75; }
.gauge-plan dl { display: grid; gap: 1px; margin: 20px 0 0; background: var(--line); border: 1px solid var(--line); }
.gauge-plan dl div { display: flex; justify-content: space-between; gap: 12px; padding: 11px; background: rgba(249,249,242,.86); }
.gauge-plan dt { color: #6d8181; font-size: 8px; }
.gauge-plan dd { margin: 0; color: #214f4f; font: 750 9px/1 ui-monospace, monospace; }
.coordinate-entry { display: grid; grid-template-columns: 1fr 86px; align-items: end; gap: 8px; margin-top: 15px; padding: 11px; background: #e8eee9; border: 1px solid var(--line); }
.coordinate-entry label { display: grid; gap: 5px; color: #416465; font-size: 10px; font-weight: 750; }
.coordinate-entry input { min-width: 0; min-height: 37px; padding: 7px; color: #174e4e; background: #fffdf6; border: 1px solid #9db4af; font: 700 13px/1 ui-monospace, monospace; }
.coordinate-entry button { min-height: 37px; padding: 7px; color: #fff; background: #276f69; border: 0; font-size: 10px; font-weight: 750; }
.gauge-plan-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 20px; padding-bottom: 13px; border-bottom: 1px solid var(--line); }
.gauge-plan-heading span, .gauge-plan-heading b { display: block; }
.gauge-plan-heading span { color: #738686; font-size: 7px; }
.gauge-plan-heading b { margin-top: 5px; color: #1f5654; font: 800 11px/1 ui-monospace, monospace; }
.gauge-plan-heading button, .gauge-undo { padding: 7px 9px; color: #315c5b; background: transparent; border: 1px solid #9eb2ae; font-size: 8px; font-weight: 750; }
.gauge-count-input { display: grid; grid-template-columns: 1fr 82px; align-items: center; gap: 8px 12px; margin: 17px 0; padding: 14px; color: #385c5d; background: rgba(255,255,255,.53); border: 1px solid var(--line); font-size: 10px; font-weight: 750; }
.gauge-count-input input { width: 100%; padding: 9px; color: #173f40; background: #fbfaf4; border: 1px solid #aabbb7; font: 800 14px/1 ui-monospace, monospace; }
.gauge-count-input small { grid-column: 1 / -1; color: #728585; font-size: 7px; font-weight: 550; }
.gauge-channel-list { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 0 0 10px; padding: 0; list-style: none; }
.gauge-channel-list li { display: grid; grid-template-columns: auto 1fr; gap: 3px 8px; padding: 8px; background: rgba(255,255,255,.55); border: 1px solid var(--line); }
.gauge-channel-list b { grid-row: 1 / 3; align-self: center; display: grid; place-items: center; width: 27px; height: 27px; color: #fff; background: #315f60; font: 800 8px/1 ui-monospace, monospace; }
.gauge-channel-list span { color: #285657; font: 750 8px/1 ui-monospace, monospace; }
.gauge-channel-list small { color: #788a8a; font-size: 7px; }
.gauge-undo { width: 100%; margin-top: 2px; }

/* Bridge and compensation */
.bridge-circuit { position: relative; width: min(260px, 80%); height: 150px; margin: 0 auto 10px; }
.bridge-circuit::before { content: ""; position: absolute; left: 50%; top: 50%; width: 104px; height: 104px; border: 2px solid #54bda9; transform: translate(-50%, -50%) rotate(45deg); }
.bridge-node { position: absolute; z-index: 2; padding: 3px 5px; color: #79d7c6; background: #0b2023; font: 700 7px/1 ui-monospace, monospace; }
.bridge-node.top { left: 50%; top: 0; transform: translateX(-50%); }
.bridge-node.bottom { left: 50%; bottom: 0; transform: translateX(-50%); }
.bridge-node.left { left: 9px; top: 50%; transform: translateY(-50%); }
.bridge-node.right { right: 9px; top: 50%; transform: translateY(-50%); }
.bridge-arm { position: absolute; z-index: 3; display: grid; place-items: center; width: 55px; height: 17px; color: #d8e7e2; background: #54706f; border: 1px solid #78908d; font: 800 8px/1 ui-monospace, monospace; }
.bridge-arm small { position: absolute; top: 20px; color: #7cb9ad; font-size: 6px; white-space: nowrap; }
.bridge-arm.r1 { left: 52px; top: 35px; color: #fff; background: var(--orange); transform: rotate(-45deg); }
.bridge-arm.r2 { right: 52px; top: 35px; transform: rotate(45deg); }
.bridge-arm.r3 { left: 52px; bottom: 35px; transform: rotate(45deg); }
.bridge-arm.rt { right: 52px; bottom: 35px; transform: rotate(-45deg); }
.channel-leds { display: grid; grid-template-columns: repeat(8, 1fr); gap: 4px; padding-top: 8px; border-top: 1px solid rgba(123,188,176,.15); }
.channel-leds span { padding: 5px 2px; color: #587d77; text-align: center; background: rgba(255,255,255,.025); font: 750 7px/1 ui-monospace, monospace; }
.channel-leds span::before { content: ""; display: block; width: 4px; height: 4px; margin: 0 auto 4px; background: #5e6e6d; border-radius: 50%; }
.channel-leds span.on::before { background: #6cd4bd; box-shadow: 0 0 8px #57cbb3; }
.channel-leds small, .config-options small { display: block; margin-top: 5px; font-size: 7px; font-weight: 550; opacity: .72; }
.compensation-scene { display: grid; grid-template-columns: .86fr 1.14fr; gap: clamp(22px, 4vw, 52px); align-items: center; min-height: 100%; }
.thermal-bench { position: relative; display: grid; gap: 16px; min-height: 245px; padding: 30px; overflow: hidden; color: #d9e9e4; background: #143337; border: 7px solid #657b78; }
.specimen-thermal { position: relative; z-index: 2; padding: 17px; color: #183b3e; background: linear-gradient(90deg, #778b89, #d8d9d1 48%, #6b807e); border: 1px solid #dce3dd; }
.specimen-thermal.reference { background: linear-gradient(90deg, #617574, #c2c9c3 48%, #5a716f); }
.specimen-thermal span, .specimen-thermal b { display: block; }
.specimen-thermal span { font-size: 8px; opacity: .7; }
.specimen-thermal b { margin-top: 6px; font-size: 11px; }
.thermal-wave { position: absolute; inset: 0; pointer-events: none; opacity: .35; }
.thermal-wave i { position: absolute; left: -10%; width: 120%; height: 1px; background: repeating-linear-gradient(90deg, transparent 0 12px, #f4a460 12px 19px); transform: rotate(-6deg); }
.thermal-wave i:first-child { top: 31%; }
.thermal-wave i:last-child { bottom: 31%; }
.thermal-wave.matched i { background: repeating-linear-gradient(90deg, transparent 0 12px, #65d5bd 12px 19px); }
.compensation-channels { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 13px; }
.compensation-channels span { padding: 8px; color: #657c7c; background: rgba(255,255,255,.55); border: 1px solid var(--line); font: 750 8px/1 ui-monospace, monospace; }
.compensation-channels b { display: block; margin-top: 5px; color: #a26943; font-size: 7px; }
.compensation-channels span.matched { color: #fff; background: var(--teal); border-color: var(--teal); }
.compensation-channels span.matched b { color: #ccebe4; }

/* First-round diagnostic */
.diagnosis-workbench { display: grid; gap: 14px; max-width: 1020px; margin: 0 auto; padding: clamp(18px, 3vw, 34px); background: rgba(255,255,255,.52); border: 1px solid var(--line); }
.diagnosis-workbench > header { padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.diagnosis-workbench > header span { color: #597a78; font: 700 8px/1 ui-monospace, monospace; letter-spacing: .08em; }
.diagnosis-workbench h3, .diagnosis-workbench h4 { margin: 0; color: #214f4f; font-family: "STZhongsong", "Songti SC", serif; }
.diagnosis-workbench h3 { margin-top: 7px; font-size: clamp(22px, 2.4vw, 32px); }
.diagnosis-workbench h4 { margin-bottom: 10px; font-size: 18px; }
.diagnosis-workbench > header p { max-width: 620px; margin: 8px 0 0; color: #587172; font-size: 11px; line-height: 1.7; }
.diagnostic-evidence { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.diagnostic-evidence article { display: grid; gap: 7px; min-width: 0; padding: 13px; background: #e8efea; border: 1px solid #c5d4ce; }
.diagnostic-evidence span { color: #587a78; font: 700 8px/1 ui-monospace, monospace; }
.diagnostic-evidence b { color: #244f50; font-size: 11px; line-height: 1.55; }
.diagnostic-evidence small { color: #6c7d7b; font-size: 9px; line-height: 1.55; }
.diagnostic-options { padding: 15px; background: #f6f3ea; border: 1px solid #d8d3c4; }
.diagnostic-options button { display: block; width: 100%; margin-top: 7px; padding: 12px; color: #31595a; text-align: left; background: rgba(255,255,255,.65); border: 1px solid #aebfba; font-size: 11px; font-weight: 750; }
.diagnostic-options button.selected { color: #fff; background: #276f69; border-color: #276f69; }
.diagnosis-workbench > .interaction-feedback { margin: 0; }

/* Calibration */
.zero-monitor header, .acquisition-console header, .load-curve-panel header, .record-panel header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.zero-monitor header > span { color: #769e98; font: 700 8px/1 ui-monospace, monospace; letter-spacing: .12em; }
.zero-monitor header b { color: #d6e6e1; font-size: 9px; }
.zero-scan-progress { height: 3px; margin-top: 11px; overflow: hidden; background: rgba(255,255,255,.08); }
.zero-scan-progress i { display: block; width: 0; height: 100%; background: #68d3bb; }
.zero-scan-progress.scanning i { width: 100%; animation: zero-scan .72s ease both; }
.zero-scan-progress.scanned i, .zero-scan-progress.balanced i { width: 100%; }
.zero-channel small { display: block; margin-top: 5px; color: #557b75; font: 600 6px/1 ui-monospace, monospace; }
.load-zero-badge { display: inline-flex; align-items: baseline; gap: 5px; margin-bottom: 10px; padding: 8px 13px; color: #fff; background: #173c40; }
.load-zero-badge b { font: 850 22px/1 ui-monospace, monospace; }
.load-zero-badge span { font-size: 8px; }

/* Four-point bending rig and acquisition console */
.load-workbench { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-areas: "rig monitor" "stability stability" "curve records" "feedback feedback"; gap: 14px; align-items: start; }
.rig-bay, .load-curve-panel, .record-panel { min-width: 0; padding: 13px; background: rgba(255,255,255,.57); border: 1px solid var(--line); }
.rig-bay { grid-area: rig; }
.rig-bay > header { display: flex; justify-content: space-between; gap: 12px; color: #365859; font-size: 12px; }
.rig-bay > header span { color: #617876; }
.beam-rig-svg { display: block; width: 100%; height: 184px; min-height: 0; }
.beam-rig-svg text { fill: #5c7576; font: 700 13px/1 ui-monospace, monospace; }
.beam-rig-svg .rig-frame { fill: none; stroke: #35575a; stroke-width: 15; stroke-linejoin: round; }
.beam-rig-svg .rig-spreader { fill: none; stroke: #314f52; stroke-width: 9; }
.beam-rig-svg .load-arrow { fill: none; stroke: var(--orange); stroke-width: 3; }
.beam-rig-svg .beam-layer { fill: #a8b4b0; stroke: #405b5d; stroke-width: 2; }
.beam-rig-svg .beam-layer.upper { fill: #c8d0ca; }
.beam-rig-svg .beam-interface { stroke: #de6742; stroke-width: 2; }
.beam-rig-svg .rig-support { fill: #29494c; }
.beam-rig-svg .support-roller { fill: #75908c; stroke: #29494c; stroke-width: 3; }
.beam-rig-svg .rig-wedge { fill: #dd7049; stroke: #783f2d; stroke-width: 2; }
.beam-rig-svg .rig-load-readout { fill: #16383d; font-size: 20px; }
.beam-rig-svg.loading .rig-actuator { animation: actuator-load .72s ease-in-out; }
.load-stability { display: grid; grid-template-columns: 10px 1fr auto; align-items: center; gap: 8px; padding: 8px 10px; color: #667b7c; background: #e0e4de; font-size: 8px; }
.load-stability i { width: 7px; height: 7px; background: #8a9794; border-radius: 50%; }
.load-stability.loading i { background: #e28a45; animation: stability-pulse .55s ease-in-out infinite alternate; }
.load-stability.stable i { background: #3ebc9f; box-shadow: 0 0 0 3px rgba(62,188,159,.16); }
.load-stability b { font: 700 7px/1 ui-monospace, monospace; }
.stability-panel { grid-area: stability; display: grid; grid-template-columns: minmax(170px, .55fr) minmax(0, 1.45fr); gap: 12px; align-items: center; padding: 12px; background: #e4ece5; border: 1px solid #bdcec4; border-radius: 6px; }
.stability-window { padding: 8px 10px; color: #506a6b; background: #edf1eb; border: 1px solid #bfd0c9; }
.stability-window > header { display: flex; justify-content: space-between; gap: 8px; color: #547173; font: 700 8px/1 ui-monospace, monospace; }
.stability-window > header b { color: #826344; }
.stability-window[data-stability-status="pass"] > header b { color: #167769; }
.stability-window ol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; margin: 7px 0; padding: 0; list-style: none; }
.stability-window li { min-width: 0; padding: 5px 3px; color: #5e7474; text-align: center; background: #fffdf6; border: 1px solid #d0dbd5; font: 650 7px/1.35 ui-monospace, monospace; }
.stability-window li span, .stability-window li b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stability-window li b { margin-top: 3px; color: #4b6364; font-weight: 800; }
.stability-window li.is-stable { color: #0e625a; background: #d8eee5; border-color: #7bb8a7; }
.stability-window li.is-stable b { color: #0a6d60; }
.stability-window p, .stability-window small { display: block; margin: 0; line-height: 1.45; }
.stability-window p { color: #365d5e; font-size: 8px; font-weight: 750; }
.stability-window small { margin-top: 4px; color: #6a7d7d; font-size: 7px; }
.acquisition-console { grid-area: monitor; min-width: 0; padding: 14px; color: #c9ded8; background: #0d272b; border: 6px solid #5b706e; box-shadow: inset 0 0 35px rgba(44,204,177,.05); }
.acquisition-console header span, .acquisition-console header b { display: block; }
.acquisition-console header span { color: #6f9791; font: 700 7px/1 ui-monospace, monospace; letter-spacing: .12em; }
.acquisition-console header b { margin-top: 5px; font-size: 11px; }
.acquisition-console header strong { color: #75dbc7; font: 850 20px/1 ui-monospace, monospace; }
.channel-monitor { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 12px; }
.channel-monitor > div { position: relative; display: grid; grid-template-columns: 1fr; gap: 8px; min-width: 0; padding: 10px; background: rgba(255,255,255,.045); border: 1px solid rgba(107,192,177,.23); border-radius: 4px; }
.channel-monitor span { color: #71958f; font: 750 8px/1 ui-monospace, monospace; }
.channel-monitor span small { display: block; margin-top: 5px; font-size: 6px; opacity: .65; }
.channel-monitor b { color: #81ddc9; font: 780 13px/1 ui-monospace, monospace; }
.channel-monitor i { position: absolute; right: 9px; bottom: 5px; color: #557871; font: 600 6px/1 ui-monospace, monospace; }
.load-curve-panel { grid-area: curve; }
.load-curve-panel header b, .record-panel header b { font-family: "STZhongsong", "Songti SC", serif; font-size: 15px; }
.load-curve-panel header span, .record-panel header span { color: #708283; font: 700 7px/1 ui-monospace, monospace; }
.load-curve-panel .live-chart { min-height: 150px; max-height: 175px; }
.record-panel { grid-area: records; }
.locked-records, .report-table-scroll { width: 100%; overflow: auto; scrollbar-width: thin; }
.locked-records { margin-top: 9px; }
.locked-records table, .report-table-scroll table { width: 100%; min-width: 520px; border-collapse: collapse; font: 680 8px/1.45 ui-monospace, monospace; }
.locked-records th, .locked-records td, .report-table-scroll th, .report-table-scroll td { padding: 6px 7px; text-align: right; border-bottom: 1px solid rgba(46,88,87,.12); }
.locked-records thead th, .report-table-scroll thead th { position: sticky; top: 0; color: #647a7b; background: #e8e9e2; }
.locked-records tbody tr.captured { color: #1c5351; background: rgba(56,165,145,.07); }
.load-workbench > .interaction-feedback { grid-area: feedback; margin: 0; }

/* Physical wedge positions outside the two load points */
.wedge-load-mark { position: absolute; z-index: 5; top: 25px; width: 2px; height: 48px; background: var(--orange); }
.wedge-load-mark::after { content: ""; position: absolute; left: -5px; bottom: 0; width: 9px; height: 9px; border-right: 2px solid var(--orange); border-bottom: 2px solid var(--orange); transform: rotate(45deg); }
.wedge-load-mark b { position: absolute; left: 50%; top: -13px; color: #9b4c32; font: 800 8px/1 ui-monospace, monospace; transform: translateX(-50%); }
.wedge-load-mark.left { left: 31%; }
.wedge-load-mark.right { right: 31%; }
.wedge-support-mark { position: absolute; z-index: 2; top: 137px; width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 29px solid #29484b; }
.wedge-support-mark.left { left: 7%; }
.wedge-support-mark.right { right: 7%; }

/* Report */
.report-workbench { min-height: 100%; }
.report-tabs { position: sticky; z-index: 8; top: -1px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 1px; margin: -2px 0 14px; background: #aab8b4; border: 1px solid #aab8b4; }
.report-tabs button { min-height: 39px; padding: 8px; color: #536e6f; background: #e9eae3; border: 0; font-size: 9px; font-weight: 750; }
.report-tabs button[aria-selected="true"] { color: #fff; background: #164c4c; box-shadow: inset 0 -3px var(--orange); }
.report-panel { min-height: calc(100% - 55px); padding: clamp(18px, 3vw, 32px); background: rgba(255,255,255,.58); border: 1px solid var(--line); }
.report-panel > header { display: grid; grid-template-columns: .85fr 1.15fr; align-items: end; gap: 25px; margin-bottom: 21px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.report-panel > header span { color: #718485; font-size: 8px; font-weight: 750; letter-spacing: .08em; }
.report-panel > header h3 { margin: 4px 0 0; font-family: "STZhongsong", "Songti SC", serif; font-size: clamp(21px, 2.5vw, 31px); }
.report-panel > header p { margin: 0; color: #5a7071; font-size: 10px; line-height: 1.7; }
.gate-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }
.gate-grid article { position: relative; padding: 16px; background: #edf0e9; border-top: 3px solid #9aa9a5; }
.gate-grid article.pass { border-color: #3fad96; }
.gate-grid article.pass::after { content: "通过"; position: absolute; right: 10px; top: 9px; color: #2f9a84; font-size: 7px; font-weight: 800; }
.gate-grid span, .gate-grid b, .gate-grid small { display: block; }
.gate-grid span { color: #6c7f7f; font-size: 8px; }
.gate-grid b { margin-top: 12px; color: #184b4c; font: 850 21px/1 ui-monospace, monospace; }
.gate-grid small { margin-top: 7px; color: #6e8080; font-size: 7px; }
.quality-note { display: grid; grid-template-columns: 75px 1fr; gap: 14px; margin-top: 17px; padding: 14px; color: #d8ebe6; background: #173d40; }
.quality-note b { color: #73d6c2; font-size: 9px; }
.quality-note p { margin: 0; font-size: 10px; line-height: 1.65; }
.raw-records { display: grid; grid-template-columns: 1fr 1fr; align-content: start; gap: 15px; }
.raw-records > header { grid-column: 1 / -1; }
.report-table-block { min-width: 0; }
.report-table-block h4, .curve-grid h4, .field-grid h4, .comparison-answer h4 { margin: 0 0 9px; color: #365859; font-size: 10px; }
.report-table-scroll { background: rgba(246,246,239,.78); border: 1px solid var(--line); }
.report-table-scroll th small { display: block; font-size: 6px; opacity: .6; }
.curve-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }
.curve-grid article { min-width: 0; padding: 12px; background: #eef0e9; border: 1px solid var(--line); }
.section-plot { width: 100%; height: auto; }
.section-plot .plot-axis { fill: none; stroke: #708384; stroke-width: 1; }
.section-plot .plot-interface { fill: none; stroke: #dc7b58; stroke-width: 1; stroke-dasharray: 4 4; }
.section-plot polyline { fill: none; stroke: #167f77; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.section-plot circle { fill: #e2633e; }
.section-plot text { fill: #738485; font: 650 7px/1 ui-monospace, monospace; }
.curve-reading { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 13px; }
.curve-reading span { padding: 7px 9px; color: #285958; background: #dfece6; font: 750 8px/1 ui-monospace, monospace; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.field-grid article { min-width: 0; padding: 13px; background: #edf0ea; border: 1px solid var(--line); }
.beam-field { position: relative; height: 145px; overflow: hidden; background: #173f59; border: 9px solid #365659; box-shadow: inset 0 0 30px rgba(0,0,0,.18); }
.beam-field::before, .beam-field::after { content: ""; position: absolute; left: 0; right: 0; height: 50%; }
.beam-field::before { top: 0; background: linear-gradient(180deg, rgba(204,70,45,.88), rgba(247,239,207,.5)); }
.beam-field::after { bottom: 0; background: linear-gradient(180deg, rgba(231,235,211,.55), rgba(23,78,112,.9)); }
.beam-field.stacked i { position: absolute; z-index: 3; left: 0; right: 0; top: 50%; height: 3px; background: #f5eee0; box-shadow: 0 -35px rgba(246,239,219,.55), 0 35px rgba(246,239,219,.55); }
.beam-field.wedged i { position: absolute; z-index: 3; left: 0; right: 0; top: 50%; height: 3px; background: #f5eee0; }
.beam-field span { position: absolute; z-index: 4; right: 8px; bottom: 7px; padding: 5px 7px; color: #fff; background: rgba(8,27,31,.68); font-size: 7px; }
.field-load { display: grid; grid-template-columns: auto 1fr 70px; align-items: center; gap: 13px; margin-top: 17px; color: #4f696a; font-size: 9px; font-weight: 750; }
.field-load input { accent-color: var(--orange); }
.field-load output { font: 800 10px/1 ui-monospace, monospace; }
.unload-safety { display: grid; grid-template-columns: 100px 1fr; gap: 12px; margin-top: 15px; padding: 13px; color: #d8e9e4; background: #173d40; font-size: 9px; line-height: 1.65; }
.unload-safety b { color: #6ed3bf; }
.comparison-layout { display: grid; grid-template-columns: 1.1fr .9fr; gap: 17px; }
.prediction-board, .comparison-answer { min-width: 0; padding: 13px; background: #edf0e9; border: 1px solid var(--line); }
.prediction-prompt { display: flex; justify-content: space-between; gap: 15px; margin-bottom: 8px; }
.prediction-prompt b { font-size: 10px; }
.prediction-prompt span { color: #6b7f7f; font-size: 8px; }
.comparison-canvas { width: 100%; min-height: 225px; background: #fbfaf3; border: 1px solid #bac5c1; cursor: crosshair; touch-action: none; user-select: none; }
.prediction-grid { fill: none; stroke: #9baba8; stroke-width: 1; stroke-dasharray: 3 4; }
.prediction-axis-label { fill: #748685; font: 700 8px/1 ui-monospace, monospace; }
.reference-stroke { fill: none; stroke: #899a98; stroke-width: 2; stroke-dasharray: 5 5; }
.prediction-stroke { fill: none; stroke: var(--orange); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.ideal-stroke { fill: none; stroke: #138a7e; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.plot-legend { display: flex; gap: 13px; flex-wrap: wrap; margin-top: 7px; color: #667b7b; font-size: 7px; }
.plot-legend span::before { content: ""; display: inline-block; width: 14px; height: 2px; margin-right: 5px; vertical-align: middle; background: #899a98; }
.plot-legend .ideal::before { background: #138a7e; }
.plot-legend .prediction::before { height: 3px; background: var(--orange); }
.comparison-companion { margin: 8px 0 0; padding: 8px; color: #2d5b58; background: #dcebe5; font-size: 8px; line-height: 1.55; }
.prediction-feedback { margin: 8px 0 0; padding: 8px; color: #634a2c; background: #f3e5d6; border-left: 3px solid #d98652; font-size: 11px; line-height: 1.55; }
.prediction-feedback.pass { color: #225b53; background: #dceee7; border-color: #309b84; }
.prediction-board > button { margin-top: 7px; padding: 7px 10px; color: #456061; background: transparent; border: 1px solid #9badaa; font-size: 8px; font-weight: 750; }
.comparison-answer > p { margin: 0; color: #667a7b; font-size: 10px; line-height: 1.7; }
.comparison-options { display: grid; gap: 7px; }
.comparison-options button { padding: 12px; color: #305152; text-align: left; background: #f9f8f1; border: 1px solid var(--line); font-size: 10px; font-weight: 700; line-height: 1.5; }
.comparison-options button.selected { color: #fff; background: var(--teal); border-color: var(--teal); }
.comparison-result { margin-top: 11px !important; padding: 9px; color: #235d55 !important; background: #d9ece5; border-left: 3px solid var(--teal); }
.comparison-progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 12px; }
.comparison-progress span { display: flex; align-items: center; gap: 7px; padding: 8px; color: #748687; background: #e2e6df; font-size: 8px; }
.comparison-progress i { display: grid; place-items: center; width: 19px; height: 19px; background: #bdc8c4; border-radius: 50%; font: 750 7px/1 ui-monospace, monospace; }
.comparison-progress span.active { color: #80462f; background: #f2dfd4; }
.comparison-progress span.active i { color: #fff; background: var(--orange); }
.comparison-progress span.done { color: #21564f; background: #d9ebe4; }
.comparison-progress span.done i { color: #fff; background: var(--teal); }

/* P0 experiment evidence: readable labels, traceable records, and model-driven plots. */
.experiment-stage { font-size: 16px; }
.measurement-board > header span, .measurement-board > header output, .section-slider { font-size: 12px; }
.measurement-layer b, .measurement-interface b, .pure-bend-band b, .measurement-y-tick b, .measurement-load b, .measurement-x-axis { font-size: 10px; }
.gauge-plan > p, .gauge-count-input, .gauge-plan dd, .gauge-plan-heading b { font-size: 13px; }
.gauge-plan dt, .gauge-plan-heading span, .gauge-count-input small, .gauge-channel-list small { font-size: 11px; }
.coordinate-entry label, .coordinate-entry button { font-size: 12px; }
.zero-monitor header > span, .zero-monitor header b, .load-zero-badge span { font-size: 11px; }
.zero-channel small { font-size: 10px; }
.zero-provenance { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 12px 0; color: #c8dcd5; background: rgba(130,190,178,.19); border: 1px solid rgba(130,190,178,.25); }
.zero-provenance div { min-width: 0; padding: 8px; background: rgba(8,32,35,.26); }
.zero-provenance dt { color: #80aaa2; font-size: 10px; }
.zero-provenance dd { margin: 4px 0 0; overflow: hidden; color: #e2f1eb; font: 650 10px/1.3 ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }
.load-stability { font-size: 12px; }
.load-stability b { font-size: 10px; }
.acquisition-console header span, .load-curve-panel header span, .record-panel header span { font-size: 10px; }
.channel-monitor span { font-size: 11px; }
.channel-monitor span small, .channel-monitor i { font-size: 9px; }
.channel-monitor b { font-size: 16px; }
.locked-records table, .report-table-scroll table { font-size: 11px; }
.locked-records th, .locked-records td, .report-table-scroll th, .report-table-scroll td { padding: 8px; }
.unload-record { display: grid; gap: 4px; margin-top: 10px; padding: 10px; color: #79553c; background: #f1e5dc; border-left: 3px solid #df895e; font-size: 11px; line-height: 1.55; }
.unload-record.verified { color: #1d5952; background: #dceee7; border-color: #329c86; }
.unload-record b { font-size: 12px; }
.chart-label { fill: #60797a; font: 650 9px/1 ui-monospace, monospace; }
.chart-unit { font-weight: 800; }
.metrics-strip span { font-size: 11px; }
.metrics-strip b { font-size: 15px; }
.report-tabs button { font-size: 12px; }
.report-panel > header span { font-size: 11px; }
.report-panel > header p { font-size: 14px; line-height: 1.65; }
.gate-grid article { min-height: 144px; }
.gate-grid article.fail { border-color: #c86348; background: #f4e5df; }
.gate-grid article.insufficient { border-color: #a59152; background: #f2eedf; }
.gate-grid article::after { position: absolute; right: 10px; top: 9px; font-size: 10px; font-weight: 800; }
.gate-grid article.pass::after { content: "通过"; color: #2f9a84; }
.gate-grid article.fail::after { content: "未通过"; color: #ae503a; }
.gate-grid article.insufficient::after { content: "数据不足"; color: #816d2c; }
.gate-grid span { font-size: 12px; }
.gate-grid small { font-size: 10px; line-height: 1.45; }
.gate-grid small strong { font-weight: 850; }
.quality-note.fail { color: #f8e5de; background: #6b372f; }
.quality-note.insufficient { color: #f8f0d8; background: #65592d; }
.quality-note b, .quality-note p { font-size: 12px; }
.report-table-block h4, .curve-grid h4, .field-grid h4, .comparison-answer h4 { font-size: 13px; }
.report-table-scroll th small { font-size: 9px; }
.record-provenance { margin-top: 9px; color: #3e6160; font-size: 11px; }
.record-provenance summary { cursor: pointer; font-weight: 750; }
.record-provenance dl { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 8px 0 0; }
.record-provenance dl div { padding: 7px; background: #e7efea; }
.record-provenance dt { color: #667d7e; font-size: 10px; }
.record-provenance dd { margin: 3px 0 0; overflow: hidden; font: 600 10px/1.35 ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }
.report-writing { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(200px, .7fr) minmax(0, 1.3fr); gap: 14px; padding: 14px; color: #315958; background: #e5eee9; border: 1px solid #bdd0c8; }
.report-writing h4 { margin: 0; font-size: 14px; }
.report-writing p { margin: 8px 0 0; color: #587272; font-size: 12px; line-height: 1.6; }
.report-writing textarea { min-height: 138px; resize: vertical; padding: 11px; color: #234e4e; background: #fffdf7; border: 1px solid #a4bbb5; font: 500 13px/1.65 "Microsoft YaHei", "PingFang SC", sans-serif; }
.report-export-card { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(220px, 1fr) minmax(360px, auto); gap: 18px; align-items: center; padding: 15px; color: #dceae5; background: #173d40; border: 1px solid #285a59; }
.report-export-card span { color: #80d2c0; font: 750 10px/1 ui-monospace, monospace; letter-spacing: .08em; }
.report-export-card h4 { margin: 7px 0 0; color: #fff8e9; font-size: 15px; }
.report-export-card p { max-width: 660px; margin: 7px 0 0; color: #c8dcd6; font-size: 11px; line-height: 1.6; }
.report-export-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.report-export-actions button { min-height: 36px; padding: 8px 10px; color: #eef5f0; background: rgba(255,255,255,.09); border: 1px solid rgba(210,235,227,.42); font-size: 11px; font-weight: 750; }
.report-export-actions button:hover { color: #173d40; background: #edf3ed; }
.print-experiment-report { display: none; }
.section-plot .section-grid path { fill: none; stroke: rgba(64,103,102,.16); stroke-width: 1; }
.section-plot .section-grid text, .section-plot .plot-unit { font-size: 9px; }
.section-plot .plot-theory { stroke: #6f8582; stroke-width: 2; stroke-dasharray: 5 4; }
.section-plot .plot-fit { stroke: #147d73; stroke-width: 3; }
.section-plot .plot-measured { fill: #dd603d; stroke: #fff9ed; stroke-width: 1.4; }
.plot-legend-text { display: flex; flex-wrap: wrap; gap: 9px; margin: 7px 0 0; color: #5b7474; font-size: 10px; }
.empty-plot { min-height: 130px; margin: 0; padding: 26px 12px; color: #657b7b; text-align: center; background: #eef0e9; font-size: 12px; }
.field-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 17px; }
.field-controls .field-load { margin-top: 0; }
.field-load { font-size: 12px; }
.field-load output { font-size: 12px; }
.beam-field-visual { position: relative; width: 100%; aspect-ratio: 360 / 212; overflow: hidden; background: #f7f5ea; border: 1px solid #aebfbb; }
.beam-field-canvas { position: absolute; inset: 0; z-index: 0; display: block; width: 100%; height: 100%; image-rendering: auto; }
.beam-field-svg { position: absolute; inset: 0; z-index: 1; display: block; width: 100%; height: 100%; overflow: visible; background: transparent; border: 0; pointer-events: none; }
.beam-field-svg .field-frame { fill: none; stroke: #466a6b; stroke-width: 1.3; }
.beam-field-svg .field-interface { fill: none; stroke: #70483d; stroke-width: 1.5; stroke-dasharray: 4 3; }
.beam-field-svg .field-load-mark { fill: none; stroke: #c66042; stroke-width: 2; }
.beam-field-svg .field-support-mark { fill: #49676a; }
.beam-field-svg .field-probe-line { fill: none; stroke: #1a373b; stroke-width: 1.5; stroke-dasharray: 3 3; }
.beam-field-svg text { fill: #556f70; font: 650 9px/1 ui-monospace, monospace; }
.beam-field-svg .field-axis-label { font-size: 8px; }
.field-render-note { display: block; margin-top: 5px; color: #3e6b69; font: 650 10px/1.45 ui-monospace, monospace; }
.field-caption { margin: 8px 0 0; color: #587171; font-size: 12px; line-height: 1.5; }
.field-probe { margin-top: 14px; padding: 13px; color: #234f4e; background: #e3eee8; border: 1px solid #b5ccc3; }
.field-probe h4 { margin: 0 0 8px; font-size: 13px; }
.field-probe table { width: 100%; border-collapse: collapse; font: 600 11px/1.4 ui-monospace, monospace; }
.field-probe th, .field-probe td { padding: 7px; text-align: right; border-bottom: 1px solid rgba(46,88,87,.16); }
.field-probe th:first-child { text-align: left; }
.field-probe p { margin: 9px 0 0; font-size: 11px; }
.field-probe .legend { display: inline-block; width: 10px; height: 10px; margin: 0 3px 0 8px; vertical-align: -1px; border-radius: 2px; }
.field-probe .legend.compression { background: hsl(11 71% 45%); }
.field-probe .legend.tension { background: hsl(205 69% 45%); }
.unload-safety { font-size: 12px; }

@keyframes zero-scan { from { width: 0; } to { width: 100%; } }
@keyframes actuator-load { 0% { transform: translateY(-9px); } 55% { transform: translateY(4px); } 100% { transform: none; } }
@keyframes stability-pulse { from { opacity: .35; transform: scale(.75); } to { opacity: 1; transform: scale(1.1); } }

/* A consistent reading scale for controls, measurements, and supporting text. */
.specimen-scene, .instrument-scene, .compensation-scene, .zero-scene { gap: 28px; max-width: 1160px; margin: 12px auto; }
.specimen-scene, .compensation-scene, .zero-scene { align-items: center; min-height: 0; }
.specimen-options { gap: 12px; }
.specimen-drawer { transform: none; padding-right: 56px; border-radius: 8px; }
.specimen-bar::after { width: 36px; left: calc(100% + 8px); font-size: 12px; }
.evidence-option { padding: 18px 100px 18px 18px; border-radius: 6px; }
.evidence-option strong { font-size: 16px; }
.evidence-option small, .evidence-option code { font-size: 12px; }
.evidence-option code { right: 18px; }
.region-facts { font-size: 13px; line-height: 1.6; }
.gauge-count span, .angle-row button, .config-group h3, .config-options button, .zero-control p { font-size: 13px; }
.angle-row button, .gauge-plan-heading button, .gauge-undo, .coordinate-entry button { min-height: 40px; }
.gauge-channel-list b, .gauge-channel-list strong { font-size: 11px; }
.gauge-channel-list small { font-size: 12px; line-height: 1.5; }
.gauge-plan-heading { margin-bottom: 14px; }
.gauge-plan h3 { font-size: 23px; }
.gauge-count { margin-bottom: 12px; }
.gauge-count-input { margin-block: 12px; }
.gauge-plan > p { margin-bottom: 12px; }
.config-options { gap: 10px; }
.config-options small, .compensation-channels span, .compensation-channels b { font-size: 11px; line-height: 1.5; }
.config-options button { min-height: 82px; border-radius: 6px; }
.instrument-console, .thermal-bench, .zero-monitor { border-radius: 8px; box-shadow: none; border-width: 4px; }
.zero-monitor { padding: 20px; }
.zero-channels { gap: 10px; }
.zero-channel { padding: 15px 8px; border-radius: 4px; }
.zero-channel span { font-size: 12px; color: #a1bfb7; }
.zero-channel b { font-size: 24px; line-height: 1.3; font-variant-numeric: tabular-nums; }
.zero-channel small { color: #9bbcb2; }
.zero-provenance { text-align: left; }
.zero-provenance div { background: #e0e9e1; padding: 10px; }
.zero-provenance dt { color: #587269; font-size: 11px; }
.zero-provenance dd { color: #234f47; font-size: 12px; white-space: normal; overflow-wrap: anywhere; }
.rig-bay, .load-curve-panel, .record-panel { border-radius: 6px; background: #fbfcf7; }
.acquisition-console { padding: 15px; border-width: 3px; border-radius: 7px; }
.acquisition-console header span { font-size: 11px; color: #9ebdb5; }
.acquisition-console header b { font-size: 13px; line-height: 1.5; }
.acquisition-console header strong { font-size: 25px; white-space: nowrap; }
.channel-monitor > div > span { display: flex; justify-content: space-between; align-items: center; gap: 3px; color: #a3c0b7; }
.channel-monitor span small { margin: 0; font-size: 10px; opacity: 1; }
.channel-monitor b { font-size: 21px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.channel-monitor i { color: #9bbab0; font-size: 10px; bottom: 8px; right: 6px; }
.load-stability { grid-template-columns: 9px 1fr; gap: 8px; padding: 10px; background: transparent; font-size: 13px; }
.load-stability b { grid-column: 2; font-size: 12px; color: #426f66; }
.stability-window { min-width: 0; padding: 9px 12px; border: 0; border-left: 1px solid #b6cbbf; background: transparent; }
.stability-window > header { font-size: 11px; }
.stability-window ol { margin: 7px 0; }
.stability-window li { font-size: 10px; }
.stability-window ol:has(li:only-child) { display: block; }
.stability-window li:only-child { display: flex; gap: 8px; text-align: left; background: transparent; border: 0; padding: 0; }
.stability-window li:only-child b { margin: 0; }
.stability-window p { font-size: 11px; }
.stability-window small { font-size: 10px; }
.load-curve-panel header span, .record-panel header span { font-size: 11px; }
.load-curve-panel .live-chart { display: block; height: 140px; min-height: 140px; max-height: 160px; }
.load-step { font-size: 11px; }
.locked-records th, .locked-records td { padding: 8px 6px; }
.locked-records thead th:first-child, .locked-records tbody th { position: sticky; left: 0; background: #e7eee6; }
.locked-records thead th:first-child { z-index: 2; }
.unload-record { margin-top: 8px; padding: 9px; }
.report-panel { padding: 20px; border-radius: 6px; }
.report-tabs { gap: 4px; padding: 5px; background: #e0e6de; border: 1px solid #b8c9c0; border-radius: 7px; }
.report-tabs button { min-height: 44px; border-radius: 4px; background: transparent; font-size: 13px; }
.report-panel > header h3 { font-size: 24px; }
.gate-grid article { padding-top: 28px; }
.gate-grid small { font-size: 12px; }
.diagnostic-evidence span, .diagnostic-evidence small { font-size: 12px; }
.diagnostic-evidence b, .diagnostic-options button { font-size: 14px; }
.prediction-prompt { flex-wrap: wrap; gap: 8px; }
.prediction-prompt b, .comparison-answer > p, .comparison-options button { font-size: 13px; }
.prediction-prompt span, .comparison-companion, .plot-legend, .comparison-progress span { font-size: 12px; line-height: 1.5; }
.prediction-board > button { min-height: 40px; font-size: 12px; }
.report-export-actions button { min-height: 44px; font-size: 12px; }
.practice-guidance li, .practice-guidance p { font-size: 13px; }
.practice-guidance button { font-size: 12px; min-height: 40px; }

@media (min-width: 701px) {
  .interaction-layer { display: flex; align-items: center; }
  .interaction-layer:is([data-interaction="material"], [data-interaction="region"], [data-interaction="bridge"], [data-interaction="compensation"], [data-interaction="zero_stacked"], [data-interaction="zero_wedge"], [data-interaction="wedge"]) .interaction-focus { height: auto; max-height: 100%; width: min(1180px, 100%); }
}

@media (min-width: 701px) and (max-width: 1100px) {
  .interaction-layer { padding: 42px 16px 16px; }
  .interaction-heading { gap: 16px; padding: 14px 18px; }
  .experiment-stage { padding: 16px 18px; }
  .channel-monitor { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .channel-monitor b { font-size: 18px; }
  .rig-bay .beam-rig-svg { height: 235px; }
  .specimen-scene, .instrument-scene, .compensation-scene, .zero-scene { gap: 20px; }
}

@media (max-width: 1080px) {
  .gauge-design-workbench { grid-template-columns: minmax(0, 1.3fr) minmax(260px, 1fr); }
  .curve-grid { grid-template-columns: 1fr 1fr; }
  .raw-records { grid-template-columns: 1fr; }
  .raw-records > header { grid-column: auto; }
}

@media (max-width: 700px) {
  .interaction-layer { padding: 0; }
  .interaction-focus { width: 100%; border: 0; border-radius: 0; }
  .interaction-heading { grid-template-columns: 1fr; gap: 6px; padding: max(14px, env(safe-area-inset-top)) 16px 12px; }
  .interaction-heading h2 { font-size: 22px; }
  .interaction-heading p { max-height: none; overflow: visible; font-size: 12px; }
  .experiment-stage { padding: 14px; }
  .interaction-footer { display: grid; grid-template-columns: minmax(0, 1fr); gap: 9px; padding: 10px 14px max(10px, env(safe-area-inset-bottom)); }
  .experiment-companion { gap: 9px; }
  .experiment-companion-portrait { width: 34px; height: 34px; flex-basis: 34px; }
  .experiment-companion-copy b { display: inline; margin-right: 8px; font-size: 12px; }
  .experiment-companion-copy p { display: inline; font-size: 12px; line-height: 1.5; }
  .interaction-actions { max-width: none; width: 100%; }
  .interaction-actions button { flex: 1; font-size: 13px; min-height: 44px; }
  .gauge-design-workbench { grid-template-columns: 1fr; gap: 12px; }
  .measurement-board { grid-template-rows: auto 330px auto; }
  .measurement-board > header { min-height: 39px; padding: 8px 10px; }
  .measurement-plane { min-height: 330px; }
  .measurement-beam-face { left: 10%; right: 6%; top: 68px; bottom: 78px; }
  .measurement-y-tick b { right: calc(100% + 5px); }
  .placed-gauge { width: 54px; height: 16px; }
  .placed-gauge i { left: 5px; right: 22px; }
  .measurement-x-axis { left: 10%; right: 6%; }
  .gauge-plan { padding: 16px; overflow: visible; }
  .gauge-plan h3 { font-size: 21px; }
  .gauge-channel-list { grid-template-columns: 1fr 1fr; }
  .compensation-scene { grid-template-columns: 1fr; }
  .diagnostic-evidence { grid-template-columns: 1fr; }
  .diagnosis-workbench { gap: 11px; padding: 15px; }
  .diagnostic-evidence article { padding: 11px; }
  .stability-window ol { grid-template-columns: repeat(5, minmax(48px, 1fr)); overflow-x: auto; }
  .thermal-bench { min-height: 180px; padding: 18px; border-width: 4px; }
  .channel-leds { grid-template-columns: repeat(4, 1fr); }
  .load-workbench { grid-template-columns: minmax(0, 1fr); grid-template-areas: "rig" "monitor" "stability" "records" "curve" "feedback"; gap: 12px; }
  .stability-panel { grid-template-columns: 1fr; gap: 6px; padding: 10px; }
  .beam-rig-svg { height: 145px; min-height: 0; }
  .channel-monitor { grid-template-columns: repeat(2, 1fr); }
  .channel-monitor > div { grid-template-columns: auto 1fr; gap: 8px; padding: 10px; }
  .channel-monitor > div > span { display: block; }
  .channel-monitor span small { display: block; margin-top: 4px; }
  .channel-monitor b { font-size: 18px; text-align: right; padding-right: 13px; }
  .channel-monitor i { bottom: 7px; }
  .stability-window { padding: 6px 0 0; border-left: 0; border-top: 1px solid #b6cbbf; }
  .load-stability { grid-template-columns: 9px minmax(0, 1fr) auto; padding: 3px 0; }
  .load-stability b { grid-column: auto; font-size: 11px; }
  .specimen-scene, .instrument-scene, .compensation-scene, .zero-scene { margin: 0; gap: 16px; }
  .specimen-drawer { padding-right: 48px; }
  .zero-channels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zero-channel { padding: 12px; }
  .zero-channel b { font-size: 22px; }
  .config-options { grid-template-columns: 1fr; gap: 8px; }
  .config-options button { min-height: 54px; padding: 12px; text-align: left; }
  .config-options small { display: inline; margin-left: 7px; }
  .gauge-plan dl { margin-top: 12px; }
  .locked-records table, .report-table-scroll table { min-width: 585px; }
  .report-tabs { display: flex; overflow-x: auto; }
  .report-tabs button { flex: 0 0 104px; font-size: 12px; }
  .report-panel { padding: 14px; }
  .report-panel > header { grid-template-columns: 1fr; gap: 8px; margin-bottom: 14px; }
  .gate-grid { grid-template-columns: 1fr 1fr; }
  .gate-grid article { padding: 12px; }
  .gate-grid b { font-size: 17px; }
  .curve-grid, .field-grid, .comparison-layout { grid-template-columns: 1fr; }
  .comparison-canvas { min-height: 180px; }
  .comparison-progress span { display: grid; justify-items: center; text-align: center; }
  .quality-note, .unload-safety { grid-template-columns: 1fr; gap: 5px; }
  .zero-provenance, .record-provenance dl, .field-controls { grid-template-columns: 1fr; }
  .report-writing { grid-template-columns: 1fr; }
  .report-export-card { grid-template-columns: 1fr; gap: 12px; }
  .report-export-actions { justify-content: flex-start; }
  .field-probe { overflow-x: auto; }
  .field-probe table { min-width: 510px; }
}

@media (max-height: 540px) and (min-width: 701px) {
  .interaction-layer { padding: 16px; }
  .interaction-heading { padding-block: 10px; }
  .interaction-footer { min-height: 60px; padding-block: 8px; }
  .experiment-companion-portrait { width: 36px; height: 36px; flex-basis: 36px; }
}

@media (prefers-reduced-motion: reduce) {
  .zero-scan-progress i, .beam-rig-svg.loading .rig-actuator, .load-stability.loading i { animation: none !important; }
}

@media print {
  @page { size: A4 landscape; margin: 12mm; }
  body[data-printing-experiment-report="true"] > * { display: none !important; }
  body[data-printing-experiment-report="true"] > .print-experiment-report { display: block !important; color: #152e31; background: #fff; font-family: "Microsoft YaHei", "PingFang SC", sans-serif; font-size: 10pt; line-height: 1.55; }
  .print-experiment-report header { padding-bottom: 10px; border-bottom: 2px solid #1d5353; }
  .print-experiment-report h1, .print-experiment-report h2 { margin: 0; font-family: "STZhongsong", "Songti SC", serif; }
  .print-experiment-report h1 { margin-top: 4px; font-size: 24pt; }
  .print-experiment-report h2 { font-size: 14pt; }
  .print-report-kicker { margin: 0; color: #3f7472; font-size: 9pt; font-weight: 700; letter-spacing: .08em; }
  .print-experiment-report header > p:last-child { margin: 6px 0 0; color: #4f6869; font-size: 9pt; }
  .print-report-section { margin-top: 14px; break-inside: avoid; }
  .print-report-section > p { margin: 5px 0 8px; color: #4f6869; font-size: 8.5pt; }
  .print-experiment-report dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px 12px; margin: 8px 0 0; }
  .print-experiment-report dl div { padding: 6px 8px; background: #edf3ef; border: 1px solid #cad8d2; }
  .print-experiment-report dt { color: #587676; font-size: 8pt; }
  .print-experiment-report dd { margin: 3px 0 0; font-weight: 650; }
  .print-experiment-report table { width: 100%; margin-top: 8px; border-collapse: collapse; font-size: 8pt; }
  .print-experiment-report th, .print-experiment-report td { padding: 5px 6px; text-align: right; border: 1px solid #b9cbc4; }
  .print-experiment-report th { color: #214b4b; background: #e4ede8; font-weight: 800; }
  .print-experiment-report th:first-child, .print-experiment-report td:first-child { text-align: left; }
  .print-experiment-report small { display: block; margin-top: 2px; font-size: 7pt; font-weight: 600; }
  .print-report-conclusion { padding: 9px; color: #203e40 !important; background: #f5f1e7; border-left: 3px solid #c96848; font-size: 10pt !important; line-height: 1.7; }
}

/* P2 local evidence review: visible prompts without automatic scoring or remote calls. */
.report-evidence-review { display: grid; gap: 14px; }
.evidence-review-summary { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 14px; padding: 14px; color: #d9eae5; background: #173d40; }
.evidence-review-summary b { color: #78d4c0; font-size: 13px; }
.evidence-review-summary p { margin: 0; font-size: 12px; line-height: 1.65; }
.evidence-review-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin: 0; padding: 0; list-style: none; }
.evidence-review-list li { min-width: 0; padding: 13px; color: #72512e; background: #f3ead9; border-left: 3px solid #bd9143; }
.evidence-review-list li.ready { color: #235c55; background: #dceee7; border-color: #359c87; }
.evidence-review-list b, .evidence-review-list span { display: block; }
.evidence-review-list b { font-size: 12px; }
.evidence-review-list span { margin-top: 6px; font-size: 11px; line-height: 1.55; }
.evidence-review-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.evidence-review-actions button, .evidence-review-actions a { min-height: 40px; padding: 9px 12px; color: #eff7f2; background: #315f61; border: 1px solid #315f61; font-size: 11px; font-weight: 750; text-decoration: none; }
.evidence-review-actions button:first-child { color: #173d40; background: #e8f0ea; border-color: #9ebbb1; }
.evidence-review-actions a { display: inline-flex; align-items: center; color: #315f61; background: transparent; border-color: #9ebbb1; }
.evidence-review-boundary { margin: 0; color: #627979; font-size: 11px; line-height: 1.6; }

@media (max-width: 700px) {
  .evidence-review-summary, .evidence-review-list { grid-template-columns: 1fr; }
  .evidence-review-actions { display: grid; grid-template-columns: 1fr; }
  .evidence-review-actions button, .evidence-review-actions a { width: 100%; justify-content: center; text-align: center; }
}

/* ---------- Responsive hardening: experiment workspace ---------- */
.experiment-workspace,
.experiment-stage,
.experiment-stage > *,
.experiment-stage article,
.experiment-stage section,
.experiment-stage header,
.experiment-stage footer {
  min-inline-size: 0;
  max-inline-size: 100%;
}

.experiment-stage img,
.experiment-stage svg,
.experiment-stage canvas,
.experiment-stage table {
  max-inline-size: 100%;
}

.interaction-heading > *,
.interaction-footer > *,
.report-panel > header > *,
.report-export-card > * {
  min-inline-size: 0;
}

.report-panel > header p,
.report-export-card p,
.experiment-companion-copy p,
.interaction-heading p {
  overflow-wrap: anywhere;
}

.report-tabs {
  min-inline-size: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}

.report-tabs button {
  min-inline-size: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 900px) {
  .interaction-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .experiment-companion {
    max-inline-size: none;
  }

  .interaction-actions {
    inline-size: 100%;
    max-inline-size: none;
    justify-content: flex-start;
  }

  .interaction-actions button {
    flex: 1 1 auto;
  }

  .gauge-design-workbench,
  .specimen-scene,
  .instrument-scene,
  .compensation-scene,
  .zero-scene,
  .load-workbench {
    grid-template-columns: minmax(0, 1fr);
  }

  .load-workbench {
    grid-template-areas: "rig" "monitor" "stability" "records" "curve" "feedback";
  }

  .channel-monitor,
  .gate-grid,
  .curve-grid,
  .field-grid,
  .raw-records {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .raw-records > header {
    grid-column: 1 / -1;
  }

  .report-panel > header,
  .report-writing,
  .report-export-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .report-export-actions {
    justify-content: flex-start;
  }

  .measurement-board {
    grid-template-rows: auto clamp(260px, 42dvh, 355px) auto;
  }

  .measurement-plane {
    min-height: clamp(260px, 42dvh, 355px);
  }

  .config-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .experiment-stage {
    padding-inline: clamp(10px, 4vw, 14px);
  }

  .channel-monitor,
  .gate-grid,
  .curve-grid,
  .field-grid,
  .raw-records,
  .config-options {
    grid-template-columns: minmax(0, 1fr);
  }

  .raw-records > header {
    grid-column: auto;
  }

  .measurement-board {
    grid-template-rows: auto clamp(235px, 44dvh, 330px) auto;
  }

  .measurement-plane {
    min-height: clamp(235px, 44dvh, 330px);
  }

  .section-slider {
    grid-template-columns: 1fr;
    gap: 6px;
    padding-block: 10px;
  }

  .section-slider output {
    justify-self: start;
  }

  .gauge-count-input,
  .coordinate-entry {
    grid-template-columns: minmax(0, 1fr);
  }

  .gauge-count-input small {
    grid-column: auto;
  }

  .coordinate-entry button {
    inline-size: 100%;
  }

  .report-tabs button {
    flex: 0 0 clamp(88px, 28vw, 112px);
  }

  .report-export-actions,
  .evidence-review-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .report-export-actions button,
  .evidence-review-actions button,
  .evidence-review-actions a {
    inline-size: 100%;
    justify-content: center;
    text-align: center;
  }
}

@media (max-height: 620px) {
  .experiment-stage {
    padding-block: 10px;
  }

  .measurement-board {
    grid-template-rows: auto clamp(210px, 48dvh, 300px) auto;
  }

  .measurement-plane {
    min-height: clamp(210px, 48dvh, 300px);
  }

  .instrument-console,
  .thermal-bench,
  .zero-monitor {
    min-height: 0;
  }
}

/* ---------- Gauge placement workbench: keep the next action beside the beam ---------- */
.measurement-placement-cue {
  position: static;
  z-index: auto;
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  flex: 0 1 auto;
  max-inline-size: 100%;
  padding: 7px 10px;
  color: #174e4e;
  background: rgba(255,253,246,.94);
  border: 1px solid #9eb8b1;
  box-shadow: none;
  pointer-events: none;
}

.measurement-placement-cue b {
  font: 850 11px/1 ui-monospace, monospace;
  white-space: nowrap;
}

.measurement-placement-cue span {
  color: #527070;
  font-size: 10px;
  white-space: nowrap;
}

.measurement-board[data-stage="placement"] > header {
  flex-wrap: wrap;
  row-gap: 5px;
}

.measurement-placement-tools {
  display: grid;
  gap: 8px 12px;
  padding: 10px 14px;
  background: #f4f7f1;
  border-top: 1px solid var(--line);
}

.measurement-placement-status {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 7px 10px;
  min-inline-size: 0;
}

.measurement-placement-status b {
  color: #1d5754;
  font-size: 12px;
  font-weight: 850;
}

.measurement-placement-status span {
  min-inline-size: 0;
  color: #5d7373;
  font-size: 11px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.measurement-placement-tools .placement-tools-channel-list {
  grid-column: 1 / -1;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
}

.measurement-placement-tools .placement-tools-channel-list li {
  min-inline-size: 0;
}

.measurement-placement-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-inline-size: 0;
}

.measurement-placement-controls .coordinate-entry {
  grid-template-columns: minmax(0, 1fr) 96px;
  margin-top: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

.measurement-placement-controls .coordinate-entry label {
  min-inline-size: 0;
}

.measurement-placement-controls .coordinate-entry button,
.measurement-placement-controls .gauge-undo {
  min-block-size: 40px;
}

.measurement-placement-controls .gauge-undo {
  inline-size: auto;
  min-inline-size: 112px;
  margin-top: 0;
}

.measurement-placement-tools .interaction-feedback {
  grid-column: 1 / -1;
  margin: 0;
}

.measurement-fixed-note {
  grid-column: 1 / -1;
  margin: 0;
  color: #527070;
  font-size: 11px;
  line-height: 1.55;
}

.interaction-footer .gauge-undo {
  inline-size: auto;
  min-inline-size: 112px;
  margin-top: 0;
}

.gauge-plan.placement .gauge-channel-list li {
  min-inline-size: 0;
}

@media (max-width: 700px) {
  .measurement-placement-cue {
    flex: 1 1 100%;
    justify-content: center;
    max-inline-size: 100%;
    padding: 5px 7px;
  }

  .measurement-placement-tools {
    gap: 7px;
    padding: 9px 12px;
  }

  .measurement-placement-controls {
    grid-template-columns: minmax(0, 1fr);
  }

  .measurement-placement-controls .coordinate-entry {
    grid-template-columns: minmax(0, 1fr) minmax(88px, auto);
    gap: 7px;
  }

  .measurement-placement-controls .coordinate-entry button {
    inline-size: auto;
  }

  .measurement-placement-controls .gauge-undo {
    min-inline-size: 92px;
  }

  .interaction-footer .gauge-undo {
    min-inline-size: 0;
  }

  .measurement-placement-tools .placement-tools-channel-list {
    gap: 5px;
  }

  .measurement-placement-tools .placement-tools-channel-list li {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
    min-block-size: 42px;
    padding: 6px;
  }

  .measurement-placement-tools .placement-tools-channel-list b {
    inline-size: 100%;
    block-size: auto;
    min-block-size: 20px;
  }

  .measurement-placement-tools .placement-tools-channel-list span {
    font-size: 10px;
  }

  .measurement-fixed-note {
    font-size: 10px;
  }

  .measurement-placement-tools .placement-tools-channel-list small {
    display: none;
  }

  .gauge-plan.placement {
    padding: 12px;
  }

  .gauge-plan.placement .gauge-channel-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 5px;
  }

  .gauge-plan.placement .gauge-channel-list li {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
    min-block-size: 42px;
    padding: 6px;
  }

  .gauge-plan.placement .gauge-channel-list b {
    inline-size: 100%;
    block-size: auto;
    min-block-size: 20px;
  }

  .gauge-plan.placement .gauge-channel-list span {
    font-size: 10px;
  }

  .gauge-plan.placement .gauge-channel-list small {
    display: none;
  }
}

@media (max-width: 560px) {
  .measurement-board[data-stage="placement"] {
    grid-template-rows: auto clamp(210px, 34dvh, 280px) auto;
  }

  .measurement-board[data-stage="placement"] .measurement-plane {
    min-height: clamp(210px, 34dvh, 280px);
  }

  .measurement-board[data-stage="placement"] .measurement-beam-face {
    top: 52px;
    bottom: 58px;
  }

  .measurement-board[data-stage="placement"] .measurement-x-axis {
    bottom: 18px;
  }
}

@media (max-width: 360px) {
  .measurement-placement-controls {
    grid-template-columns: minmax(0, 1fr);
  }

  .measurement-placement-controls .coordinate-entry {
    grid-template-columns: minmax(0, 1fr) minmax(88px, auto);
  }

  .measurement-placement-controls .gauge-undo {
    inline-size: 100%;
  }
}
