/* The same sample-count instrument appears in Core and Sensors. Keep its
   presentation local: switching the statistical model must not move the plot. */
#sampleThresholdExplorer {
  min-width: 0;
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  padding: 24px;
  overflow: hidden;
  color: #18212f;
  background: #fff;
  border: 1px solid #d8dde6;
  border-radius: 8px;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 1rem;
  line-height: 1.55;
}

#sampleThresholdExplorer h3 {
  margin: 0;
  max-width: none;
  font-size: 1.25rem;
  line-height: 1.3;
}

#sampleThresholdExplorer p { max-width: none; }
.sensor-page #sampleThresholdExplorer #thresholdPhysicalUnits { grid-column: 1 / -1; margin: 0; }
#sampleThresholdExplorer .threshold-model {
  margin: 10px 0 18px;
  color: #5d6877;
  font-size: .84rem;
  line-height: 1.6;
}

#sampleThresholdExplorer button {
  border: 1px solid #d8dde6;
  border-radius: 999px;
  color: #18212f;
  background: #fff;
  font-family: inherit;
  line-height: 1.4;
  cursor: pointer;
}
#sampleThresholdExplorer button::before { content: none; }
#sampleThresholdExplorer button:disabled {
  opacity: .48;
  cursor: default;
}
#sampleThresholdExplorer button:disabled:hover {
  color: #18212f;
  border-color: #d8dde6;
  background: #fff;
}
#sampleThresholdExplorer .threshold-curve-buttons {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0 14px;
}
#sampleThresholdExplorer .threshold-curve-buttons button {
  min-width: 0;
  min-height: 44px;
  padding: 8px 10px;
  font-size: 14px;
  font-weight: 750;
  border: 2px solid var(--curve-color);
  color: var(--curve-color);
  background: #fff;
}
#sampleThresholdExplorer .threshold-curve-opt { --curve-color: #367d51; }
#sampleThresholdExplorer .threshold-curve-interp { --curve-color: #18212f; }
#sampleThresholdExplorer .threshold-curve-zero-gap { --curve-color: #167c88; }
#sampleThresholdExplorer .threshold-curve-baseline-cap { --curve-color: #b43468; }
#sampleThresholdExplorer .threshold-curve-cap { --curve-color: #7862b2; }
#sampleThresholdExplorer .threshold-curve-buttons button[aria-pressed="true"] {
  color: #fff;
  background: var(--curve-color);
}
#sampleThresholdExplorer .threshold-plot-legend[hidden],
#sampleThresholdExplorer #thresholdCapControls[hidden],
#sampleThresholdExplorer #thresholdCapReadout[hidden] { display: none; }
#sampleThresholdExplorer[data-cap-visible="false"] .threshold-cap-current { display: none; }
#sampleThresholdExplorer #thresholdSetupLabel {
  min-height: 1.55em;
  margin: 10px 0;
  font-size: 14px;
  line-height: 1.55;
}
#sampleThresholdExplorer #thresholdDirectHelp {
  margin: 8px 0 12px;
  color: #5d6877;
  font-size: 14px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-curve-buttons {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#sampleThresholdExplorer[data-threshold-layout="compact"] #thresholdSetupLabel { min-height: 3.1em; }
#sampleThresholdExplorer button:focus-visible,
#sampleThresholdExplorer input:focus-visible,
#sampleThresholdExplorer .threshold-plot-frame:focus-visible {
  outline: 3px solid #92b8e0;
  outline-offset: 3px;
}

#sampleThresholdExplorer .threshold-mode {
  display: inline-grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 100%;
  gap: 4px;
  padding: 4px;
  border: 1px solid #d8dde6;
  border-radius: 14px;
  background: #f3f5f8;
}
#sampleThresholdExplorer .threshold-mode button {
  min-width: 0;
  min-height: 44px;
  padding: 8px 16px;
  border-color: transparent;
  border-radius: 10px;
  background: transparent;
  font-size: .8rem;
  font-weight: 800;
}
#sampleThresholdExplorer .threshold-mode button[aria-pressed="true"] {
  border-color: #235f9e;
  background: #235f9e;
  color: #fff;
}
#sampleThresholdExplorer .threshold-mode button[aria-pressed="false"]:hover {
  color: #18212f;
  background: #e5ebf3;
}
#sampleThresholdExplorer .threshold-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
#sampleThresholdExplorer .threshold-actions button {
  min-height: 38px;
  padding: 8px 14px;
  font-size: .8rem;
  font-weight: 800;
}
#sampleThresholdExplorer .threshold-actions button:hover {
  border-color: #235f9e;
  color: #fff;
  background: #235f9e;
}
#sampleThresholdExplorer [data-blog-share-status="sample-thresholds"] {
  display: block !important;
  min-height: 1.5em;
  margin: 4px 0;
  color: #5d6877;
  font-size: .72rem;
  line-height: 1.5;
}

/* These controls remain present in the deterministic model, but disabled. */
#sampleThresholdExplorer .threshold-iid-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-top: 10px;
}
#sampleThresholdExplorer .threshold-iid-view {
  display: inline-flex;
  max-width: 100%;
  padding: 3px;
  gap: 3px;
  border: 1px solid #d8dde6;
  border-radius: 9px;
  background: #f3f5f8;
}
#sampleThresholdExplorer .threshold-iid-controls button {
  min-height: 38px;
  padding: 6px 12px;
  font-size: .73rem;
  font-weight: 750;
}
#sampleThresholdExplorer .threshold-iid-view button {
  border-color: transparent;
  border-radius: 6px;
  background: transparent;
}
#sampleThresholdExplorer .threshold-iid-view button[aria-pressed="true"] {
  border-color: #bacbdc;
  background: #fff;
  color: #235f9e;
  box-shadow: 0 1px 3px #1825370d;
}
#sampleThresholdExplorer .threshold-iid-view button:not(:disabled):hover {
  color: #18212f;
  background: #e5ebf3;
}
#sampleThresholdExplorer .threshold-iid-controls > button {
  border-color: #bacbdc;
  border-radius: 7px;
  background: #fff;
  color: #235f9e;
}
#sampleThresholdExplorer .threshold-iid-controls > output {
  display: inline-block;
  min-width: 14ch;
  color: #5d6877;
  font-size: .7rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* All copies contribute to the grid height. Only the selected copy is visible
   and exposed to accessibility APIs; no guessed text-height allowance is needed. */
#sampleThresholdExplorer .threshold-mode-note {
  display: grid;
  margin: 12px 0 16px;
  min-height: 3em;
  color: #5d6877;
  font-size: .76rem;
  line-height: 1.5;
}
#sampleThresholdExplorer .threshold-mode-copy {
  grid-area: 1 / 1;
  margin: 0;
  font-size: inherit;
  line-height: inherit;
  min-width: 0;
}
#sampleThresholdExplorer .threshold-mode-copy[aria-hidden="true"] {
  visibility: hidden;
  pointer-events: none;
}
#sampleThresholdExplorer #thresholdPaperNote {
  display: block;
  min-height: 3em;
  margin: 8px 0;
  color: #5d6877;
  font-size: .72rem;
  line-height: 1.5;
}
#sampleThresholdExplorer #thresholdPaperNote[hidden],
#sampleThresholdExplorer #thresholdPaperNote[aria-hidden="true"] {
  visibility: hidden;
}

#sampleThresholdExplorer .threshold-plot-frame {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 12px 0 0;
  padding: 8px 4px 0;
  border: 1px solid #e2e7ed;
  border-radius: 12px;
  background: #fbfcfd;
}
#sampleThresholdExplorer .threshold-plot-frame svg {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  font-family: inherit;
  overflow: visible;
}
#sampleThresholdExplorer .threshold-plot-legend {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: minmax(3em, auto);
  gap: 4px 16px;
  margin: 12px 0 0;
  color: #5d6877;
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.5;
}
#sampleThresholdExplorer .threshold-plot-legend > span {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 7px;
}
#sampleThresholdExplorer .threshold-plot-legend > span[hidden],
#sampleThresholdExplorer .threshold-plot-legend > span[aria-hidden="true"] {
  visibility: hidden;
}
#sampleThresholdExplorer .threshold-plot-legend i { flex: 0 0 22px; }
#sampleThresholdExplorer .threshold-help {
  margin: 12px 0 4px;
  font-size: .76rem;
  line-height: 1.55;
}
#sampleThresholdExplorer .threshold-axis-note {
  margin: 0 0 20px;
  color: #5d6877;
  font-size: .68rem;
  line-height: 1.5;
}

#sampleThresholdExplorer .threshold-control label { min-height: 2.8em; }
#sampleThresholdExplorer .threshold-control small { min-height: 2.8em; }
#sampleThresholdExplorer .threshold-target-count > span { min-height: 2.8em; }
#sampleThresholdExplorer .threshold-target-count output {
  min-height: 2.6em;
  font-variant-numeric: tabular-nums;
}
#sampleThresholdExplorer .threshold-target-count small { min-height: 2.8em; }
#sampleThresholdExplorer .threshold-current-errors {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px 16px;
  min-height: 6em;
  font-size: .7rem;
  line-height: 1.5;
}
#sampleThresholdExplorer .threshold-current-errors > span {
  display: grid;
  grid-template-rows: minmax(3em, auto) auto;
  align-content: start;
  min-width: 0;
}
#sampleThresholdExplorer .threshold-current-errors output { overflow-wrap: anywhere; }
#sampleThresholdExplorer .threshold-readout {
  /* Reserve 3–7 lines for the current longest combined status, rather than
     the 8–16 lines needed before the repeated score recap was removed. */
  min-height: 4.65em;
  margin: 12px 0 16px;
  font-size: .79rem;
  line-height: 1.55;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
#sampleThresholdExplorer .audit-details {
  margin-top: 12px;
  font-size: .8rem;
}
#sampleThresholdExplorer .audit-details summary {
  min-height: 44px;
  font-weight: 800;
}

@media (max-width: 920px) {
  #sampleThresholdExplorer .threshold-readout { min-height: 6.2em; }
  #sampleThresholdExplorer .threshold-plot-frame {
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
  }
  #sampleThresholdExplorer .threshold-plot-frame svg {
    min-width: 800px;
    max-width: none;
  }
}
@media (max-width: 620px) {
  #sampleThresholdExplorer { padding: 18px; }
  /* A stacked phone layout needs no desktop height reserve for absent notes.
     Keep the empty live region mounted so later share feedback is announced. */
  #sampleThresholdExplorer #thresholdPaperNote[hidden],
  #sampleThresholdExplorer #thresholdPaperNote[aria-hidden="true"] { display: none; }
  #sampleThresholdExplorer [data-blog-share-status="sample-thresholds"]:empty {
    min-height: 0;
    margin: 0;
  }
  #sampleThresholdExplorer .threshold-mode { display: grid; }
  #sampleThresholdExplorer .threshold-mode button { padding: 8px; }
  #sampleThresholdExplorer .threshold-plot-legend {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: minmax(4.5em, auto);
    gap: 4px 12px;
  }
  #sampleThresholdExplorer .threshold-current-errors {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  #sampleThresholdExplorer .threshold-current-errors > span {
    grid-template-columns: minmax(0, 1fr) minmax(8ch, auto);
    grid-template-rows: auto;
    min-height: 3em;
    gap: 12px;
  }
  #sampleThresholdExplorer .threshold-current-errors output { text-align: right; }
  #sampleThresholdExplorer .threshold-readout { min-height: 7.75em; }
}
@media (max-width: 420px) {
  #sampleThresholdExplorer .threshold-readout { min-height: 9.3em; }
  #sampleThresholdExplorer { padding: 14px; }
  #sampleThresholdExplorer h3 { font-size: 1.1rem; }
  #sampleThresholdExplorer .threshold-mode button { font-size: .75rem; }
  #sampleThresholdExplorer .threshold-iid-view {
    display: flex;
    flex: 1 1 100%;
  }
  #sampleThresholdExplorer .threshold-iid-view button { flex: 1 1 0; }
  #sampleThresholdExplorer .threshold-target-count output { font-size: 1.1rem; }
  #sampleThresholdExplorer .threshold-target-savings {
    grid-template-columns: minmax(0, 1fr) minmax(8ch, auto);
  }
  #sampleThresholdExplorer .threshold-target-savings output { min-height: 1.3em; }
}

@media (forced-colors: active) {
  #sampleThresholdExplorer button[aria-pressed="true"] { outline: 2px solid Highlight; }
  #sampleThresholdExplorer button:disabled { color: GrayText; }
  #sampleThresholdExplorer .threshold-window-legend .window-necessary { border: 2px solid CanvasText; }
  #sampleThresholdExplorer .threshold-window-legend .window-fitting { border: 2px dashed CanvasText; }
  #sampleThresholdExplorer .threshold-priced-legend i,
  #sampleThresholdExplorer .threshold-plot-legend i { border-color: CanvasText; }
}

#sampleThresholdExplorer .threshold-legend-floor { border-top: 2px dotted #637383; }

/* Training-cap comparison: keep the plot and readouts steady across models. */
#sampleThresholdExplorer .threshold-range-view {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
#sampleThresholdExplorer .threshold-range-view button,
#sampleThresholdExplorer .threshold-cap-presets button {
  min-height: 44px;
  padding: 8px 14px;
  font-size: .76rem;
  font-weight: 750;
}
#sampleThresholdExplorer .threshold-range-view button[aria-pressed="true"] {
  color: #fff;
  border-color: #235f9e;
  background: #235f9e;
}
#sampleThresholdExplorer .threshold-range-note {
  min-height: 3.1em;
  margin: 10px 0 0;
  color: #5d6877;
  font-size: .74rem;
  line-height: 1.55;
}
#sampleThresholdExplorer .threshold-plot-legend {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
#sampleThresholdExplorer .threshold-legend-cap { border-top: 3px solid #7862b2; }
#sampleThresholdExplorer .threshold-legend-zero-gap {
  border: 0;
  height: 3px;
  background: repeating-linear-gradient(to right, #167c88 0 10px, transparent 10px 13px, #167c88 13px 16px, transparent 16px 19px);
}
#sampleThresholdExplorer .threshold-legend-zero-gap-reference {
  border: 0;
  height: 3px;
  opacity: .38;
  background: repeating-linear-gradient(to right, #167c88 0 14px, transparent 14px 18px, #167c88 18px 21px, transparent 21px 25px);
}
#sampleThresholdExplorer .threshold-target-receipt.has-zero-gap {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#sampleThresholdExplorer .threshold-target-receipt.has-zero-gap .threshold-target-count > span,
#sampleThresholdExplorer .threshold-target-receipt.has-zero-gap .threshold-target-count small { min-height: 0; }
#sampleThresholdExplorer .threshold-target-receipt.has-zero-gap .threshold-target-count output { min-height: 1.4em; }
#sampleThresholdExplorer .threshold-target-zero-gap output { color: #167c88; }
#sampleThresholdExplorer .threshold-target-count[hidden] { display: none; }
#sampleThresholdExplorer .threshold-zero-gap-readout {
  margin: 14px 0;
  padding: 12px 16px;
  border-left: 3px solid #167c88;
  background: #f2f9fa;
  font-size: .79rem;
  line-height: 1.55;
  font-variant-numeric: tabular-nums;
}
#sampleThresholdExplorer .threshold-zero-gap-readout[hidden] { display: none; }
#sampleThresholdExplorer #thresholdCapLegendItem[aria-hidden="true"] { visibility: hidden; }
#sampleThresholdExplorer #thresholdPlot { touch-action: pan-y; }
#sampleThresholdExplorer .threshold-cap-controls {
  margin: 12px 0 18px;
  padding: 16px;
  border: 1px solid #d8dde6;
  border-radius: 10px;
  background: #f6f7f9;
}
#sampleThresholdExplorer .threshold-cap-controls[hidden] {
  display: block;
  visibility: hidden;
}
#sampleThresholdExplorer .threshold-cap-label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(14ch, auto);
  align-items: start;
  gap: 12px;
  min-height: 3em;
  font-size: .8rem;
  font-weight: 800;
}
#sampleThresholdExplorer #thresholdCapValue {
  color: #7862b2;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
#sampleThresholdExplorer #thresholdCapSlider {
  display: block;
  width: 100%;
  min-height: 32px;
  margin: 2px 0 10px;
  accent-color: #7862b2;
}
#sampleThresholdExplorer .threshold-cap-presets {
  display: flex;
  flex-wrap: wrap;
  min-width: 0;
  width: 100%;
  gap: 8px;
}
#sampleThresholdExplorer .threshold-cap-presets button {
  flex: 1 1 7rem;
  min-width: 0;
  white-space: normal;
}
#sampleThresholdExplorer .threshold-cap-presets button:first-child { flex: 2 1 13rem; }
#sampleThresholdExplorer .threshold-cap-presets button[aria-pressed="true"] {
  color: #fff;
  border-color: #18212f;
  background: #18212f;
}
/* The cap always keeps its full-width slider. The same instrument can sit in
   a narrow desktop sidebar or span the page, independently of viewport width. */
#sampleThresholdExplorer:is([data-threshold-streamlined="true"], [data-threshold-controls-near-plot="true"]) .threshold-cap-controls:not([hidden]) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 4px 16px;
  margin: 0 0 12px;
  padding: 12px;
}
#sampleThresholdExplorer:is([data-threshold-streamlined="true"], [data-threshold-controls-near-plot="true"]) .threshold-cap-label {
  grid-column: 1;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 0;
}
#sampleThresholdExplorer:is([data-threshold-streamlined="true"], [data-threshold-controls-near-plot="true"]) #thresholdCapSlider { grid-column: 1; margin: 0; }
#sampleThresholdExplorer:is([data-threshold-streamlined="true"], [data-threshold-controls-near-plot="true"]) .threshold-cap-presets {
  grid-column: 1;
  grid-row: auto;
}
#sampleThresholdExplorer .threshold-cap-readout {
  min-height: 5em;
  margin: 12px 0 0;
  font-size: .76rem;
  line-height: 1.55;
  font-variant-numeric: tabular-nums;
}
#sampleThresholdExplorer .threshold-current-errors {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
#sampleThresholdExplorer .threshold-cap-current output { color: #7862b2; }
#sampleThresholdExplorer .threshold-target-cap output { color: #7862b2; }
@media (max-width: 760px) {
  #sampleThresholdExplorer .threshold-plot-legend {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #sampleThresholdExplorer .threshold-cap-label {
    grid-template-columns: minmax(0, 1fr) minmax(12ch, auto);
  }
  #sampleThresholdExplorer .threshold-cap-readout { min-height: 7em; }
}
@media (max-width: 620px) {
  #sampleThresholdExplorer .threshold-current-errors { grid-template-columns: 1fr; }
  #sampleThresholdExplorer .threshold-cap-controls { padding: 12px; }
  #sampleThresholdExplorer .threshold-cap-presets { gap: 6px; }
  #sampleThresholdExplorer .threshold-cap-presets button { padding-inline: 10px; }
  #sampleThresholdExplorer .threshold-range-note { min-height: 4.7em; }
}

/* Every progress message contributes to the reserved height. Streaming a
   constrained curve must not shift the controls or the chart. */
#sampleThresholdExplorer .threshold-range-note { display: grid; }
#sampleThresholdExplorer .threshold-range-note > span { grid-area: 1 / 1; }
#sampleThresholdExplorer .threshold-range-note > [aria-hidden="true"] { visibility: hidden; }

/* A saved cap is editable, but does not constrain the median summaries. */
#sampleThresholdExplorer .threshold-cap-controls[data-active="false"] {
  border-color: #d8dde6;
  background: #f5f7fa;
}
#sampleThresholdExplorer .threshold-cap-controls[data-active="false"] #thresholdCapValue { color: #5d6877; }
#sampleThresholdExplorer .threshold-cap-controls[data-active="false"] #thresholdCapSlider { accent-color: #687587; }

#sampleThresholdExplorer .threshold-legend-median { border: 0; height: 7px; background: repeating-linear-gradient(to right, #367d51 0 6px, transparent 6px 10px) left top / 100% 2px no-repeat, repeating-linear-gradient(to right, #18212f 0 6px, transparent 6px 10px) left bottom / 100% 2px no-repeat; }

@media (max-width: 360px) {
  #sampleThresholdExplorer .threshold-readout { min-height: 10.85em; }
}

/* A compact drawing uses the same instrument and controls. These overrides are
   opt-in: the laptop presentation above is unchanged. The controller moves the
   cap explanation below the scorecards so the useful controls stay by the plot. */
#sampleThresholdExplorer[data-threshold-layout="compact"] {
  padding: 14px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-plot-frame {
  min-width: 0;
  margin: 10px 0 0;
  padding: 0;
  overflow: visible;
  overscroll-behavior: auto;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-plot-frame svg {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  height: auto;
  touch-action: pan-y;
  scroll-margin-top: 2rem;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-plot-legend {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: minmax(3em, auto);
  gap: 3px 10px;
  margin: 8px 0 0;
  font-size: max(12px, .75rem);
  line-height: 1.35;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-plot-legend > span {
  align-items: center;
  gap: 6px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-plot-legend i {
  flex-basis: 18px;
  width: 18px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-secondary-legend {
  grid-template-rows: min-content;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #d8dde6;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-secondary-legend[hidden] { display: none; }
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-secondary-label {
  grid-column: 1 / -1;
  margin: 0 0 3px;
  color: #5d6877;
  font-size: max(12px, .75rem);
  font-weight: 700;
  line-height: 1.35;
}
#sampleThresholdExplorer .threshold-compact-help { display: none; }
#sampleThresholdExplorer .threshold-ring-help { display: none; }
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-wide-help { display: none; }
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-ring-help { display: inline; }
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-compact-help {
  display: block;
  min-height: 0;
  margin: 6px 0 0;
  color: #5d6877;
  font-size: max(12px, .75rem);
  line-height: 1.35;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-compact-summary {
  margin: 10px 0 0;
  font-size: max(12px, .75rem);
  line-height: 1.35;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-cap-controls {
  margin: 10px 0 0;
  padding: 10px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-cap-label {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  min-height: 2.7em;
  font-size: max(12px, .8rem);
  line-height: 1.35;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] #thresholdCapSlider {
  min-height: 32px;
  margin: 2px 0 4px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-cap-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-cap-presets button {
  min-width: 0;
  min-height: 44px;
  padding: 5px 4px;
  font-size: max(12px, .75rem);
  line-height: 1.3;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-receipt {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 10px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-receipt.has-zero-gap {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-count,
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-receipt.has-cap .threshold-target-cap {
  grid-column: auto;
  padding: 7px 9px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-count > span,
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-count small {
  min-height: 0;
  font-size: max(12px, .75rem);
  line-height: 1.35;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-count output {
  min-height: 0;
  margin: 2px 0 0;
  font-size: max(16px, 1rem);
  line-height: 1.2;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-count small { display: none; }
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-savings {
  display: block;
  grid-column: auto;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-count[hidden] {
  display: none;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-current-errors {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
  margin-top: 12px;
  min-height: 0;
  font-size: max(12px, .75rem);
  line-height: 1.4;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-current-errors > span {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(3em, auto) auto;
  gap: 3px;
  min-height: 0;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-current-errors output {
  text-align: left;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-mode {
  display: grid;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-mode button {
  padding-inline: 6px;
  font-size: max(12px, .8rem);
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-iid-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-iid-view {
  display: flex;
  grid-column: 1 / -1;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-iid-view button {
  flex: 1 1 0;
  min-width: 0;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-iid-controls button,
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-range-view button,
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-actions button {
  font-size: max(12px, .78rem);
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-iid-controls > output,
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-mode-note,
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-range-note,
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-axis-note,
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-control small,
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-scales,
#sampleThresholdExplorer[data-threshold-layout="compact"] #thresholdPaperNote,
#sampleThresholdExplorer[data-threshold-layout="compact"] .audit-details pre,
#sampleThresholdExplorer[data-threshold-layout="compact"] [data-blog-share-status="sample-thresholds"] {
  font-size: max(12px, .78rem);
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-controls {
  gap: 10px;
  margin-top: 16px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-control {
  grid-template-columns: minmax(0, 1fr);
  padding: 10px;
  gap: 7px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-control input[type="number"] {
  width: 100%;
  text-align: left;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-control label {
  font-size: max(12px, .8rem);
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-geometry-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-geometry-controls .threshold-control {
  padding: 8px;
  gap: 4px;
}
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-geometry-controls .threshold-control small { display: none; }
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-geometry-controls input[type="number"] {
  padding-block: 5px;
}
@media (max-height: 500px) and (orientation: landscape) {
  #sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-geometry-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-geometry-controls .threshold-control {
    grid-template-columns: minmax(0, 1fr) 90px;
    padding-block: 5px;
  }
  #sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-geometry-controls input[type="number"] { grid-column: 2; grid-row: 1; }
}

/* Hiding every curve also hides its now-empty count summary. */
#sampleThresholdExplorer #thresholdTargetReceipt[hidden] { display: none; }

/* Let the last row fill its width for every combination of visible curves. */
#sampleThresholdExplorer .threshold-target-receipt { display: flex; flex-wrap: wrap; }
#sampleThresholdExplorer .threshold-target-count { flex: 1 1 180px; }
#sampleThresholdExplorer .threshold-current-errors > span[hidden] { display: none; }
#sampleThresholdExplorer[data-threshold-layout="compact"] .threshold-target-count { flex-basis: calc(50% - 1px); }

/* Sibling pages keep geometry controls visible while using the same nearby
   cap, sample-count and target controls as Core. No inputs move on resize. */
#sampleThresholdExplorer[data-threshold-controls-near-plot="true"] .threshold-controls {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}
#sampleThresholdExplorer[data-threshold-controls-near-plot="true"] .threshold-control {
  padding: 10px 12px;
  gap: 5px 10px;
}
#sampleThresholdExplorer[data-threshold-controls-near-plot="true"] .threshold-cap-readout { min-height: 0; }
#sampleThresholdExplorer[data-threshold-controls-near-plot="true"] #thresholdCapHelp { margin-top: 12px; }
@media (max-width: 480px) {
  #sampleThresholdExplorer[data-threshold-controls-near-plot="true"] .threshold-controls { grid-template-columns: minmax(0, 1fr); }
}

/* Three views of the same resource tradeoff on the entry page. */
#sampleThresholdExplorer .threshold-resource-views {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin: 12px 0;
}
#sampleThresholdExplorer .threshold-resource-views button {
  min-height: 44px;
  padding: 7px 10px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
}
#sampleThresholdExplorer .threshold-resource-views button[aria-pressed="true"] {
  background: #e7f0fa;
  color: #235f9e;
  border-color: #235f9e;
}
#sampleThresholdExplorer #thresholdResourceIntro { font-size: 14px; margin: 6px 0; }
#sampleThresholdExplorer .threshold-resource-scores,
#sampleThresholdExplorer .threshold-resource-requirements {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  margin: 12px 0;
}
#sampleThresholdExplorer .threshold-resource-results [hidden] { display: none; }
#sampleThresholdExplorer .threshold-resource-results div[style] {
  flex: 1 1 150px;
  display: grid;
  gap: 3px;
  border-top: 3px solid var(--resource-color);
  padding-top: 6px;
  font-size: 13px;
}
#sampleThresholdExplorer .threshold-resource-results strong { color: var(--resource-color); font-size: 18px; }
#sampleThresholdExplorer #thresholdResourceVerdict { font-size: 15px; margin: 10px 0; }
#sampleThresholdExplorer:is([data-resource-view="quality"],[data-resource-view="map"]) :is(
  .threshold-current-errors, #thresholdTargetReceipt, #thresholdZeroGapReadout,
  #thresholdRangeNote, #thresholdPaperNote, .threshold-scales, #thresholdPlotGuide:not([open])) { display: none; }
#sampleThresholdExplorer:has(#thresholdResourceViews) > .threshold-controls { grid-template-columns: repeat(3,minmax(0,1fr)); }
#sampleThresholdExplorer:has(#thresholdResourceViews) > .threshold-controls .threshold-control { min-width: 0; }
@media (max-width: 700px) {
  #sampleThresholdExplorer:has(#thresholdResourceViews) > .threshold-controls { grid-template-columns: minmax(0,1fr); }
  #sampleThresholdExplorer:has(#thresholdResourceViews) > .threshold-controls .threshold-control {
    grid-template-columns: minmax(0,1fr) 6.5rem;
    padding: 8px;
    gap: 2px 10px;
  }
  #sampleThresholdExplorer:has(#thresholdResourceViews) > .threshold-controls .threshold-control input[type="number"] { grid-column: 2; grid-row: 1; }
  #sampleThresholdExplorer:has(#thresholdResourceViews) > .threshold-controls .threshold-control input[type="range"] { grid-column: 1 / -1; margin: 0; }
  #sampleThresholdExplorer:has(#thresholdResourceViews) > .threshold-controls .threshold-control small { display: none; }
  #sampleThresholdExplorer .threshold-resource-views button { font-size: 12px; padding-inline: 5px; }
  #sampleThresholdExplorer .threshold-resource-results div[style] { flex-basis: 110px; }
}
#sampleThresholdExplorer:is([data-resource-view="quality"],[data-resource-view="map"]) #thresholdIidControls { display: none; }
#sampleThresholdExplorer [data-resource-handle="true"] { touch-action: none; }

#sampleThresholdExplorer[data-threshold-controls-near-plot="true"] .threshold-cap-controls > p { grid-column: 1 / -1; margin: 0; }
#sampleThresholdExplorer .threshold-cap-controls #thresholdCapReadout { min-height: 0; margin: 6px 0 0; font-size: 14px; }
#sampleThresholdExplorer .threshold-resource-requirements small { font-size: 12px; line-height: 1.4; color: #405066; }

/* Price one fitting standard at a time; optional overlays stay in the drawer. */
#sampleThresholdExplorer .threshold-comparison-chooser { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:12px 0 8px; }
.threshold-comparison-chooser > span { grid-column:1/-1; font-weight:750; font-size:15px; }
#sampleThresholdExplorer .threshold-comparison-chooser button { min-width:0; min-height:44px; padding:8px 10px; font-size:14px; border:2px solid var(--comparison-color); background:#fff; color:var(--comparison-color); }
#thresholdComparebaselineCap { --comparison-color:#b43468; }
#thresholdComparezeroGap { --comparison-color:#167c88; }
#thresholdCompareinterp { --comparison-color:#18212f; }
#sampleThresholdExplorer .threshold-comparison-chooser button[aria-pressed="true"] { background:var(--comparison-color); color:white; }
#sampleThresholdExplorer .threshold-curve-baseline-cap { --curve-color:#b43468; }
.threshold-comparison-meaning,.threshold-comparison-summary,.threshold-physical-price { margin:8px 0; color:#405066; font-size:14px; line-height:1.5; }
.threshold-selected-resources { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:12px 0; }
.threshold-sensor-upgrades { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:6px; margin:2px 0 4px; }
.threshold-sensor-upgrade-label { flex-basis:100%; font-size:13px; line-height:1.3; color:#536170; }
#sampleThresholdExplorer .threshold-sensor-upgrades button { flex:1 1 auto; min-height:0; padding:6px 9px; font-size:13px; line-height:1.25; white-space:nowrap; }
#sampleThresholdExplorer .threshold-sensor-upgrades button[aria-pressed="true"] { color:#fff; border-color:#18212f; background:#18212f; }
.threshold-selected-resources[hidden] { display:none; }
.traditional-cost { min-width:0; border-top:3px solid var(--comparison-color,#367d51); padding-top:8px; display:grid; gap:7px; align-content:start; }
.traditional-cost span { font-size:14px; line-height:1.4; }
.traditional-cost strong { font-size:21px; color:var(--comparison-color,#367d51); font-variant-numeric:tabular-nums; }
/* Count tiles that move the plot: keep the tile's look, add a quiet hint. */
#sampleThresholdExplorer button.traditional-jump { font:inherit; color:inherit; text-align:left; background:transparent; border:0; border-top:3px solid var(--comparison-color,#367d51); border-radius:0; margin:0; padding:8px 0 4px; line-height:inherit; cursor:pointer; }
#sampleThresholdExplorer button.traditional-jump:hover { background:transparent; }
#sampleThresholdExplorer button.traditional-jump:hover .traditional-jump-hint, #sampleThresholdExplorer button.traditional-jump:focus-visible .traditional-jump-hint { text-decoration:underline; }
#sampleThresholdExplorer button.traditional-jump:focus-visible { outline:2px solid var(--comparison-color,#367d51); outline-offset:3px; }
.traditional-jump-hint { font-size:12px; line-height:1.3; color:#536170; }
#sampleThresholdExplorer button.traditional-jump[aria-current="true"] .traditional-jump-hint { color:var(--comparison-color,#367d51); font-weight:650; }
.threshold-selected-resources .quality-price { grid-column:1/-1; font-size:16px; }
#sampleThresholdExplorer .core-resource-perspective { margin:14px 0; font-size:15px; line-height:1.6; }
#thresholdPlot [data-threshold-handle="true"] { touch-action:none; }
@media(max-width:560px){
  #sampleThresholdExplorer .threshold-comparison-chooser { grid-template-columns:minmax(0,1fr); }
  #sampleThresholdExplorer .threshold-comparison-chooser button { text-align:left; }
  .threshold-selected-resources { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .traditional-cost.price { grid-column:1/-1; grid-template-columns:auto auto; align-items:baseline; }
  .traditional-cost.price > span:last-child { grid-column:1/-1; }
  .traditional-cost.price strong { text-align:right; }
}
.threshold-priced-legend { display:flex; flex-wrap:wrap; gap:7px 18px; margin:10px 0; font-size:14px; font-weight:700; }
.threshold-priced-legend > span { display:inline-flex; align-items:center; gap:7px; }
.threshold-priced-legend i { display:inline-block; width:25px; border-top:3px solid currentColor; }
.threshold-priced-legend i.zero-gap { border-top-style:dashed; }
#sampleThresholdExplorer .threshold-priced-legend.threshold-curve-buttons { display:flex; flex-wrap:wrap; gap:6px; margin:10px 0; }
#sampleThresholdExplorer .threshold-priced-legend .threshold-curve-key-title { flex-basis:100%; font-size:13px; }
#sampleThresholdExplorer .threshold-priced-legend button { display:inline-flex; align-items:center; gap:7px; min-height:44px; padding:6px 10px; font-size:13px; border-radius:7px; }
#sampleThresholdExplorer .threshold-priced-legend button[aria-pressed="true"] { background:#fff; color:var(--curve-color); }
#sampleThresholdExplorer .threshold-priced-legend button[aria-pressed="false"] { border-color:#d8dde6; color:#5d6877; }
#sampleThresholdExplorer .threshold-priced-legend button::before { content:""; display:block; flex:0 0 24px; border-top:3px solid currentColor; }
#sampleThresholdExplorer .threshold-priced-legend .threshold-curve-zero-gap::before { border-top-style:dashed; }
#sampleThresholdExplorer .threshold-priced-legend button[aria-pressed="false"]::before { opacity:.35; }
@media (max-width:560px) {
  #sampleThresholdExplorer .threshold-priced-legend.threshold-curve-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  #sampleThresholdExplorer .threshold-priced-legend .threshold-curve-key-title { grid-column:1 / -1; }
  #sampleThresholdExplorer .threshold-priced-legend button { text-align:left; padding:6px; gap:5px; }
  #sampleThresholdExplorer .threshold-priced-legend button::before { flex-basis:18px; }
}
.threshold-comparison-verdict { margin:12px 0 6px; font-size:15px; line-height:1.5; font-weight:650; }
#sampleThresholdExplorer .threshold-comparison-verdict,
#sampleThresholdExplorer #thresholdResourceVerdict { min-height: 3em; }
@media (max-width: 700px) {
  #sampleThresholdExplorer .threshold-comparison-verdict,
  #sampleThresholdExplorer #thresholdResourceVerdict { min-height: 4.5em; }
}
.threshold-sensor-route { display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; margin:12px 0; }
.threshold-sensor-route[hidden] { display:none; }
#sampleThresholdExplorer .threshold-sensor-route button { min-height:44px; font-size:14px; }
.threshold-sensor-route p { flex:1 1 240px; margin:0; font-size:14px; line-height:1.5; color:#405066; }
.threshold-window-legend { display:flex; flex-wrap:wrap; gap:7px 18px; margin:10px 0; font-size:13px; line-height:1.45; color:#405066; }
.threshold-window-legend[hidden] { display:none; }
.threshold-window-legend > span { display:inline-flex; align-items:baseline; gap:7px; }
.threshold-window-legend i { display:inline-block; flex:0 0 15px; height:12px; border:1px solid #aaa58e; }
.threshold-window-legend .window-necessary { background:#f7d480; }
.threshold-window-legend .window-fitting { background:#e5edc3; }
.threshold-window-legend small { flex-basis:100%; font-size:12px; }
.threshold-saved-draw-controls { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:8px 0 12px; color:#405066; font-size:13px; }
.threshold-saved-draw-controls[hidden] { display:none; }
#sampleThresholdExplorer .threshold-saved-draw-controls button { min-height:44px; padding:7px 12px; font-size:13px; }

/* Companion explorers keep all real controls before their plot in DOM order.
   The results column determines the SVG's responsive drawing size. */
#sampleThresholdExplorer[data-threshold-controls-near-plot="true"] { padding: 18px; }
#sampleThresholdExplorer[data-threshold-controls-near-plot="true"] .threshold-workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
#sampleThresholdExplorer .threshold-workbench-controls,
#sampleThresholdExplorer .threshold-workbench-results { min-width: 0; }
#sampleThresholdExplorer .threshold-workbench-results .threshold-plot-frame {
  min-width: 0;
  padding: 0;
  margin: 0;
  overflow: visible;
}
#sampleThresholdExplorer .threshold-workbench-results .threshold-plot-frame svg { min-width: 0; width: 100%; max-width: 100%; }
#sampleThresholdExplorer #thresholdIidControls[hidden] { display: none; }
#sampleThresholdExplorer .threshold-workbench-controls .threshold-mode {
  display: grid;
  width: auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 0 10px;
}
#sampleThresholdExplorer .threshold-workbench-controls .threshold-mode button { min-width: 0; padding: 7px 4px; font-size: 12px; }
#sampleThresholdExplorer .threshold-workbench-controls .threshold-curve-buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}
#sampleThresholdExplorer .threshold-workbench-controls .threshold-curve-buttons button { min-width: 0; padding: 7px 5px; font-size: 12px; }
#sampleThresholdExplorer .threshold-workbench-controls .threshold-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
#sampleThresholdExplorer .threshold-workbench-controls .threshold-control { display: grid; grid-template-columns: minmax(0, 1fr); padding: 8px; gap: 4px; }
#sampleThresholdExplorer .threshold-workbench-controls .threshold-control label { min-height: 2.5em; font-size: 12px; line-height: 1.25; }
#sampleThresholdExplorer .threshold-workbench-controls .threshold-control input[type="number"] { width: 100%; min-width: 0; padding: 4px 6px; font-size: 16px; }
#sampleThresholdExplorer .threshold-workbench-controls .threshold-control input[type="range"] { grid-column: 1; margin: 0; min-height: 24px; }
#sampleThresholdExplorer .threshold-workbench-controls .threshold-control small { display: none; }
#sampleThresholdExplorer .threshold-workbench-results .threshold-target-receipt { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 8px 0; }
#sampleThresholdExplorer .threshold-workbench-results .threshold-target-count { min-width: 0; padding: 6px 8px; }
#sampleThresholdExplorer .threshold-workbench-results .threshold-target-count > span { min-height: 0; font-size: 12px; line-height: 1.3; }
#sampleThresholdExplorer .threshold-workbench-results .threshold-target-count output { min-height: 0; font-size: 18px; margin: 3px 0 0; }
#sampleThresholdExplorer .threshold-workbench-results .threshold-target-count small { display: none; }
#sampleThresholdExplorer .threshold-workbench-results .threshold-current-errors { margin: 8px 0; gap: 6px; }
#sampleThresholdExplorer .threshold-workbench-results #thresholdReadout { min-height: 0; margin: 8px 0 0; font-size: 14px; line-height: 1.4; }
#sampleThresholdExplorer .threshold-explorer-guide { margin-top: 16px; }
@media (min-width: 1000px) {
  #sampleThresholdExplorer[data-threshold-controls-near-plot="true"] .threshold-workbench { grid-template-columns: minmax(260px, 29%) minmax(0, 1fr); }
}
@media (max-width: 700px) {
  #sampleThresholdExplorer[data-threshold-controls-near-plot="true"] { padding: 14px; }
  #sampleThresholdExplorer .threshold-workbench-results .threshold-target-receipt { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

#sampleThresholdExplorer .threshold-necessity-interval { margin: 6px 0 10px; padding: 5px 9px; border-left: 3px solid #aa791f; color: #65440c; font-size: 13px; line-height: 1.4; font-weight: 650; }
#sampleThresholdExplorer .threshold-comparison-verdict, #sampleThresholdExplorer #thresholdResourceVerdict { font-size: 15px; font-weight: 600; line-height: 1.5; }

/* Core's resource and fitting choices share a control column with their
   sliders. Keep the plot and its decisive counts together on wide screens. */
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-resource-views { display:grid; grid-template-columns:1fr; gap:5px; }
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-resource-views button { padding:7px 10px; font-size:13px; }
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-comparison-chooser { display:grid; grid-template-columns:1fr; gap:5px; margin:10px 0 6px; }
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-comparison-chooser button { min-height:36px; font-size:13px; padding:6px 10px; }
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-comparison-meaning { font-size:12px; margin:6px 0 10px; }
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-controls { grid-template-columns:1fr; }
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-control { grid-template-columns:minmax(0,1fr) 78px; gap:4px 10px; }
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-control label { min-height:0; align-self:center; }
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-control input[type="range"] { grid-column:1 / -1; }
#sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-results .threshold-current-errors { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:999px) {
 #sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-resource-views,
 #sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-comparison-chooser { display:flex; flex-wrap:wrap; }
 #sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-controls { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:700px) {
 #sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-controls { grid-template-columns:1fr; }
}
@media(min-width:1000px) {
 #sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-resource-views { margin:4px 0 8px; }
 #sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-resource-views button { min-height:36px; }
 #sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls #thresholdSetupLabel { font-size:12px; line-height:1.45; margin:6px 0; }
 #sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-comparison-meaning { line-height:1.4; }
 #sampleThresholdExplorer[data-threshold-streamlined="true"] .threshold-workbench-controls .threshold-control { padding:6px 8px; }
}

#sampleThresholdExplorer .threshold-interval-status { margin:6px 0 10px; padding:5px 9px; border-left:3px solid #738095; color:#47556a; font-size:13px; line-height:1.4; }

#sampleThresholdExplorer .threshold-physical-units { color:#47556a; font-size:13px; line-height:1.45; margin:4px 0 8px; }
#sampleThresholdExplorer #thresholdOriginalDraw[aria-pressed="true"] { border-color:#235f9e; background:#e7f1f8; font-weight:700; }
#sampleThresholdExplorer .threshold-cap-controls { scroll-margin-top:calc(var(--blog-sticky-nav-height, 70px) + 20px); }
@media(forced-colors:active) {
  /* Paint the Canvas halo beneath each glyph. Without paint-order, SVG draws
     the stroke over the fill and erases unhaloed tick and axis text. */
  #thresholdPlot text { fill:CanvasText !important; stroke:Canvas !important; paint-order:stroke fill !important; forced-color-adjust:none; }
  #thresholdFittingRegion, #thresholdFittingReturnRegion,
  #featureResourceFittingRegion, #featureResourceFittingBand { fill:Canvas; stroke:CanvasText; stroke-width:1.5; stroke-dasharray:6 4; forced-color-adjust:none; }
  #thresholdNecessityRegion, #featureResourceExpansion, #featureResourceNecessityBand { fill:Canvas; stroke:CanvasText; stroke-width:1.5; forced-color-adjust:none; }
  #featureResourceNecessityBoundary { stroke:CanvasText; forced-color-adjust:none; }
  /* Keep the charcoal interpolation and violet cap marks visible on a
     dark high-contrast canvas. Target the roles rather than one literal hue. */
  #thresholdPlot [data-series~="capped"][stroke], #thresholdPlot [data-series~="interp"][stroke], #thresholdPlot [stroke="#000"], #thresholdPlot [stroke="#000000"] { stroke:CanvasText !important; forced-color-adjust:none; }
  #thresholdPlot [data-series~="capped"][fill]:not([fill="none"]):not([fill="#fff"]), #thresholdPlot [data-series~="interp"][fill]:not([fill="none"]):not([fill="#fff"]), #thresholdPlot [fill="#000"], #thresholdPlot [fill="#000000"] { fill:CanvasText !important; forced-color-adjust:none; }
}
/* Live one-pass SGD count (sgd-budget-models.js) and Core's SGD paragraph. */
.threshold-sgd-count { margin:4px 0 14px; }
.threshold-sgd-count[hidden] { display:none; }
.threshold-sgd-tile { --comparison-color:#4b5d73; max-width:38em; }
.threshold-sgd-tile small { font-size:13px; line-height:1.45; color:#405066; }
.threshold-sgd-count .threshold-sgd-note { margin:0; }
.core-sgd-saving { margin:18px 0; }
.core-sgd-saving > p { font-size:15px; line-height:1.6; }
#sampleThresholdExplorer button.core-inline-restore, button.core-inline-restore {
  display:inline; min-height:0; margin:0; padding:0; border:0; border-radius:0; background:transparent;
  font:inherit; color:#235f9e; text-decoration:underline; text-underline-offset:.17em; cursor:pointer;
}
#sampleThresholdExplorer button.core-inline-restore:hover, button.core-inline-restore:hover { background:transparent; color:#18212f; }
#sampleThresholdExplorer button.core-inline-restore[hidden], button.core-inline-restore[hidden] { display:none; }
#sampleThresholdExplorer button.core-inline-restore:focus-visible, button.core-inline-restore:focus-visible { outline:2px solid #235f9e; outline-offset:2px; }
