/* External proposal only. Load AFTER the interrupt page's existing inline styles,
   and ONLY on that page. Original body, scripts, values and controls stay exact.
   Root owns integration and browser/a11y validation before acceptance. */
@media (max-width: 1200px) {
  .firmware-series-rail { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); overflow: visible; }
  .firmware-series-rail a { min-width: 0; }
  pre, pre code { min-width: 0; max-width: 100%; white-space: pre-wrap; overflow-wrap: anywhere; }
  .timing-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); overflow: visible; }
  .timing-tab { min-height: 100px; padding: 13px; border-bottom: 1px solid var(--line); }
  .mobile-scroll-hint, .mechanism-guide .table-hint { display: none; }
  .study-wave-scroll, .latency-scope-scroll, .core-flow-scroll,
  .preemption-scroll, .guard-wave, .debug-wave, .system-trace-wave,
  .table-scroll, .concept-table-scroll { min-width: 0; max-width: 100%; overflow: visible; }
  .study-wave, .study-wave-axis, .scope-plot, .preempt-timeline,
  .lab-wave-row, .core-flow-rail { min-width: 0; width: 100%; }
  /* Labels sit above tracks; every generated high/low/current sample remains. */
  .study-wave-row, .lab-wave-row, .scope-row, .scope-measure-row {
    grid-template-columns: minmax(0, 1fr); gap: 7px; margin-block: 12px;
  }
  .study-wave-label, .lab-wave-label, .scope-row-label, .scope-measure-label {
    padding: 0; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere;
  }
  .study-wave-track, .lab-wave-track, .scope-track { min-width: 0; width: 100%; }
  .study-wave-axis { padding-left: 0; gap: 10px; font-size: 11px; line-height: 1.5; }
  .study-wave-axis span { min-width: 0; overflow-wrap: anywhere; }
  /* Keep exact measurement formula text below the unchanged percentage waves.
     In the narrow view these are formula captions, not spatial brackets. */
  .scope-bracket-track { min-height: 0; }
  .scope-bracket { position: static; width: auto !important; height: auto; border: 0; }
  .scope-bracket::before, .scope-bracket::after { display: none; }
  .scope-bracket span { position: static; display: block; white-space: normal; overflow-wrap: anywhere; font-size: 12px; line-height: 1.6; }
  /* Numbered core nodes are a sequence, not simultaneous time slices. */
  .core-flow-rail { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .core-flow-node:not(:last-child)::after { top: auto; right: 50%; bottom: -12px; width: 2px; height: 11px; }
  .isr-contract-path, .handoff-path, .cap-contract-path, .step-rail,
  .debug-signal-path, .cap-source-grid, .pipeline {
    min-width: 0; grid-template-columns: minmax(0, 1fr); grid-auto-flow: row;
    grid-auto-columns: auto; overflow: visible;
  }
  .isr-contract-path > *, .handoff-path > *, .cap-contract-path > *,
  .step-rail > *, .debug-signal-path > *, .cap-source-grid > * { min-width: 0; }
  .isr-contract-controls, .isr-review-tabs, .handoff-tabs,
  .scenario-tabs, .segmented-control, .preemption-phase-tabs, .storm-mode-tabs {
    display: flex; flex-wrap: wrap; min-width: 0; overflow: visible;
  }
  .isr-stage-button, .isr-review-tab, .handoff-tab,
  .scenario-tabs > button, .segmented-control > button, .phase-button, .storm-mode {
    min-width: 0; max-width: 100%; flex: 1 1 145px; white-space: normal;
  }
  .priority-row { width: 100%; min-width: 0; align-items: flex-start; }
  .priority-row span { min-width: 0; }
  /* Pure presentation of the original five phases in chronological order.
     Original overall aria-label and active/complete classes are retained.
     Context labels below repeat existing source labels; no timing is invented. */
  .preempt-timeline { display: flex; flex-direction: column; gap: 10px; }
  .preempt-row, .preempt-track { display: contents; }
  .preempt-row-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .preempt-segment { position: static; left: auto !important; width: 100% !important; height: auto; min-height: 64px; padding: 12px; white-space: normal; overflow: visible; text-align: left; font-size: 13px; line-height: 1.5; }
  .preempt-segment::before { display: block; margin-bottom: 5px; font-weight: 700; font-size: 11px; }
  .preempt-segment[data-preempt-segment="0"] { order: 0; }
  .preempt-segment[data-preempt-segment="1"] { order: 1; }
  .preempt-segment[data-preempt-segment="2"] { order: 2; }
  .preempt-segment[data-preempt-segment="3"] { order: 3; }
  .preempt-segment[data-preempt-segment="4"] { order: 4; }
  .preempt-segment[data-preempt-segment="0"]::before { content: "1 · Thread mode"; }
  .preempt-segment[data-preempt-segment="1"]::before { content: "2 · UART ISR | P7"; }
  .preempt-segment[data-preempt-segment="2"]::before { content: "3 · Safety report | P0"; }
  .preempt-segment[data-preempt-segment="3"]::before { content: "4 · UART ISR | P7"; }
  .preempt-segment[data-preempt-segment="4"]::before { content: "5 · Thread mode"; }
  /* Exact source header labels are repeated for visual association.
     Keep the original THEAD in the DOM and verify native table roles in AX. */
  .mechanism-guide .mechanism-table, .concept-table { display: table; width: 100%; min-width: 0; }
  .mechanism-table thead, .concept-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .mechanism-table tbody, .concept-table tbody { display: block; }
  .mechanism-table tbody tr, .concept-table tbody tr { display: grid; grid-template-columns: minmax(0, 1fr); margin-bottom: 16px; }
  .mechanism-guide .mechanism-table tbody td, .concept-table tbody td {
    position: static; display: block; width: auto; min-width: 0; max-width: 100%;
    padding: 12px; white-space: normal; overflow-wrap: anywhere; font-size: 14px;
  }
  .mechanism-table td::before, .concept-table td::before { display: block; margin-bottom: 5px; font-size: 11px; font-weight: 800; line-height: 1.5; }
  .mechanism-table td:nth-child(1)::before { content: "Mechanism"; }
  .mechanism-table td:nth-child(2)::before { content: "Decision test"; }
  .mechanism-table td:nth-child(3)::before { content: "Main benefit"; }
  .mechanism-table td:nth-child(4)::before { content: "Key constraint"; }
  .mechanism-table td:nth-child(5)::before { content: "ControlNode decision"; }
  .concept-table td:nth-child(1)::before { content: "Term"; }
  .concept-table td:nth-child(2)::before { content: "Practical meaning"; }
  .concept-table td:nth-child(3)::before { content: "Cortex-M examples"; }
  .concept-table td:nth-child(4)::before { content: "Relation to instruction stream"; }
  .concept-table td:nth-child(5)::before { content: "Priority and masking"; }
  .concept-table td:nth-child(6)::before { content: "Normal outcome"; }
}
@media(max-width:600px){.firmware-series-rail{grid-template-columns:1fr 1fr}}
