/* Full-width shell and page-specific presentation for the FAIL explainer. */
.explainer-main {
  min-width: 0;
  overflow: clip;
  width: 100%;
}

.explainer-hide-hero-title .hero .title {
  display: none;
}

@supports not (overflow: clip) {
  .explainer-main {
    overflow-x: hidden;
  }
}

/* --------------------------------------------------------------- toc ----- */
.sx-toc {
  display: none;
  position: absolute; top: 0;
  left: max(1rem, calc(50% - var(--figw)/2 - 1.6rem - var(--toc-w)));
  width: var(--toc-w); z-index: 20;
  font-family: var(--sans); font-size: 0.9rem; line-height: 1.35;
}
.sx-toc.is-fixed {
  position: fixed; top: var(--sx-toc-fixed-top, 1rem); bottom: auto;
}
.sx-toc.is-bottomed {
  position: absolute; top: auto; bottom: 0;
}
.sx-toc ol { list-style: none; margin: 0; padding: 0; }
.sx-toc li { margin: 0; }
.sx-toc a {
  display: block; padding: 0.34rem 0 0.34rem 0.7rem;
  color: var(--faint); text-decoration: none;
  border-left: 2px solid var(--rule);
  transition: color 140ms linear, border-color 140ms linear;
}
.sx-toc a:hover { color: var(--body); }
.sx-toc a.is-active { color: var(--ink); border-left-color: var(--accent); font-weight: 600; }
.sx-toc-head {
  font-size: 0.9rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--faint); padding: 0 0 0.5rem 0.7rem;
}
@media (min-width: 1440px) {
  .sx-toc { display: block; }
}
.sx-article h2 { scroll-margin-top: 1.5rem; }

/* ---------------------------------------------------------------- type --- */
.sx-article {
  --ink:        #16181D;
  --body:       #24272E;
  --muted:      #555B63;
  --faint:      #6B7078;
  --rule:       #E4E2DD;
  --rule-soft:  #F0EEEA;
  --paper:      #FFFFFF;
  --wash:       #FFFFFF;
  --accent:     #1F77B4;
  --violate:    #B4483B;
  --ok:         #008000;
  --gold:       #D18400;

  --serif: "Source Serif 4", "Source Serif Pro", Charter, "Iowan Old Style",
           Georgia, Cambria, "Times New Roman", serif;
  --sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
           Helvetica, Arial, sans-serif;
  --mono:  ui-monospace, SFMono-Regular, "SF Mono", "JetBrains Mono", Menlo,
           Consolas, monospace;

  background: var(--paper);
  color: var(--body);
  font-family: var(--serif);
  --fs: clamp(1.18rem, 1.05rem + 0.24vw, 1.36rem);
  --measure: calc(40 * var(--fs));
  --figw: min(calc(52 * var(--fs)), calc(100vw - 3rem));
  --toc-w: 12.5rem;
  font-size: var(--fs);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  padding: 0 1.25rem 4rem;
  position: relative;

  /* Centring is done by the grid, not by auto margins on the children. A
     child rule using margin shorthand would silently reset auto margins and
     shove that element to the left. */
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
}
.sx-article *, .sx-article *::before, .sx-article *::after { box-sizing: border-box; }

/* measure: prose is narrow, figures break out wider */
.sx-article > :not(.sx-toc) { width: min(var(--measure), 100%); max-width: 100%; }
.sx-definition-conditions { list-style-type: lower-roman; padding-left: 2rem; box-sizing: border-box; }
.sx-definition-conditions li { padding-left: 0.25rem; margin-bottom: 0.45rem; }
.sx-article > .sx-toc { width: var(--toc-w); max-width: var(--toc-w); }
.sx-article > .sx-fig { width: var(--figw); }
.sx-article > .sx-fig-mid { width: min(calc(40 * var(--fs)), 100%); }
.sx-article canvas { max-width: 100%; }
.sx-fig-frame { max-width: 100%; }
@media (min-width: 1440px) {
  .sx-article { --figw: min(calc(52 * var(--fs)), calc(100vw - 31rem)); }
}

.sx-article p { margin: 0 0 1.15em; }
.sx-article h1, .sx-article h2, .sx-article h3 {
  font-family: var(--sans); color: var(--ink);
  font-weight: 600; letter-spacing: -0.011em; line-height: 1.25;
}
.sx-article h1 { font-size: 2.25rem; margin: 0 0 0.5rem; letter-spacing: -0.022em; }
.sx-article h2 {
  font-size: 1.65rem; margin: 3.2rem 0 0.9rem;
  padding-top: 1.1rem; border-top: 1px solid var(--rule);
}
.sx-article h3 { font-size: 1.2rem; margin: 2rem 0 0.6rem; }
.sx-article .sx-lede {
  font-size: 1.2rem; line-height: 1.55; color: var(--muted);
  margin: 0 0 1.8rem;
}
.sx-article .sx-byline {
  font-family: var(--sans); font-size: 0.9rem; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--faint);
  padding: 0.9rem 0 1.9rem; border-bottom: 1px solid var(--rule);
  margin-bottom: 2.2rem;
}
.sx-article em { font-style: italic; }
.sx-article strong { font-weight: 600; color: var(--ink); }
.sx-article .v {           /* a math variable used inline in prose */
  font-family: var(--serif); font-style: italic;
}
.sx-article code { font-family: var(--mono); font-size: 0.87em; }

/* --------------------------------------------------------------- math ---- */
.sx-article .eq {
  font-family: var(--serif); font-size: clamp(1.3rem, 1.16rem + 0.3vw, 1.5rem);
  text-align: center; margin: 1.5rem auto 1.6rem;
  color: var(--ink); line-height: 1.9;
}
.sx-article .eq i { font-style: italic; }
.sx-mpc-problem > div { margin-bottom: 0.4rem; }
.sx-math-limit { display: inline-grid; justify-items: center; vertical-align: middle; line-height: 1.1; margin: 0 0.25rem; }
.sx-math-bound { font-size: 0.75em; }
.sx-mpc-references { font: 1rem/1.6 var(--sans); color: var(--muted); margin: 1rem 0; }
.sx-mpc-references summary { cursor: pointer; margin-bottom: 0.75rem; }
.sx-mpc-references p { scroll-margin-top: 2rem; }
.sx-article .eq .op { font-style: normal; padding: 0 0.18em; }
.sx-article .eq .sx-eq-tag { float: right; color: var(--faint); font-style: normal; font-size: 0.9rem; }
.sx-article .note {
  font-family: var(--sans); font-size: 0.9rem; line-height: 1.55;
  color: var(--muted); border-left: 2px solid var(--rule);
  padding: 0.1rem 0 0.1rem 0.9rem; margin: 1.4rem 0 1.5rem;
}

/* -------------------------------------------------------------- figure --- */
.sx-article .sx-fig { margin: 2.4rem auto 2.6rem; }
.sx-fig-frame {
  border: 1px solid var(--rule); border-radius: 3px;
  background: var(--wash); overflow: hidden;
}
.sx-fig canvas { display: block; width: 100%; }
.sx-fig-bar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap;
  padding: 0.55rem 0.85rem; border-bottom: 1px solid var(--rule);
  background: var(--paper);
}
.sx-fig-label {
  font-family: var(--sans); font-size: 0.9rem; font-weight: 600;
  letter-spacing: 0.13em; text-transform: uppercase; color: var(--faint);
}
.sx-fig-read {
  font-family: var(--mono); font-size: 0.9rem; color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.sx-fig-read b { color: var(--ink); font-weight: 600; }
.sx-fig-caption {
  font-family: var(--sans); font-size: 0.9rem; line-height: 1.6;
  color: var(--muted); margin: 0.85rem auto 0; max-width: var(--measure);
}
.sx-fig-caption b { color: var(--body); font-weight: 600; }

/* ------------------------------------------------------------ controls --- */
.sx-ctl {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 0.9rem 1.5rem; align-items: end;
  padding: 0.8rem 0.85rem 0.95rem;
  border-top: 1px solid var(--rule); background: var(--paper);
}
.sx-f { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; }
.sx-f-head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; }
.sx-f-name {
  font-family: var(--sans); font-size: 0.9rem; font-weight: 600;
  letter-spacing: 0.06em; color: var(--muted);
}
.sx-f-val {
  font-family: var(--mono); font-size: 0.9rem; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.sx-article input[type=range] {
  appearance: none; -webkit-appearance: none; width: 100%; height: 16px;
  background: transparent; cursor: pointer; margin: 0;
}
.sx-article input[type=range]::-webkit-slider-runnable-track { height: 2px; background: var(--rule); }
.sx-article input[type=range]::-moz-range-track { height: 2px; background: var(--rule); }
.sx-article input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; width: 13px; height: 13px; border-radius: 50%;
  background: var(--accent); border: 0; margin-top: -5.5px;
}
.sx-article input[type=range]::-moz-range-thumb {
  width: 13px; height: 13px; border-radius: 50%; background: var(--accent); border: 0;
}
.sx-article input[type=range]:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.sx-seg { display: inline-flex; border: 1px solid var(--rule); border-radius: 3px; overflow: hidden; }
.sx-seg button {
  appearance: none; border: 0; border-right: 1px solid var(--rule);
  background: var(--paper); color: var(--muted);
  font-family: var(--sans); font-size: 0.9rem; font-weight: 500;
  padding: 0.42rem 0.8rem; cursor: pointer;
}
.sx-seg button:last-child { border-right: 0; }
.sx-seg button[aria-pressed=true] { background: var(--accent); color: #fff; }
.sx-btn {
  appearance: none; border: 1px solid var(--rule); background: var(--paper);
  color: var(--body); font-family: var(--sans); font-size: 0.9rem;
  padding: 0.42rem 0.75rem; border-radius: 3px; cursor: pointer;
}
.sx-btn:hover { background: var(--wash); }
.sx-seg button:focus-visible, .sx-btn:focus-visible {
  outline: 2px solid var(--accent); outline-offset: -2px;
}

.sx-key { display: inline-block; width: 22px; height: 3px; vertical-align: middle; margin-right: 0.35em; }

/* --------------------------------------- addition: the regression panel --- */
.sx-panel {
  border-top: 1px solid var(--rule); background: var(--paper);
  padding: 0.75rem 0.85rem 0.85rem;
}
.sx-m {
  border-collapse: collapse; font-family: var(--mono); font-size: 0.9rem;
  font-variant-numeric: tabular-nums; color: var(--body);
}
.sx-m th {
  font-family: var(--sans); font-size: 0.9rem; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--faint);
  text-align: center; padding: 0 0.5rem 0.25rem; font-style: normal;
}
.sx-m td { padding: 0.1rem 0.5rem; text-align: right; }
.sx-m .sx-m-l { color: var(--muted); text-align: left; padding-right: 0.75rem; }
.sx-m .sx-m-s, .sx-m th.sx-m-s {
  border-left: 1px solid var(--rule); color: var(--gold); padding-left: 0.75rem;
}
.sx-m-out {
  font-family: var(--mono); font-size: 0.9rem; color: var(--muted);
  margin-top: 0.6rem; line-height: 1.7;
}
.sx-m-out b { color: var(--ink); font-weight: 600; }
.sx-m-ok  { color: var(--ok); }
.sx-m-bad { color: var(--violate); }

/* ----------------------------------------- interactive halfspace fitting --- */
.sx-fit-intro { padding: 1rem 1.1rem 0.8rem; background: var(--paper); }
.sx-fit-intro p { font-family: var(--sans); font-size: 0.9rem; line-height: 1.6; margin: 0; }
.sx-fit-toolbar {
  display: flex; align-items: center; gap: 0.7rem 1rem; flex-wrap: wrap;
  margin-top: 0.85rem; font-family: var(--sans); font-size: 0.9rem;
}
.sx-fit-toolbar label { display: flex; align-items: center; gap: 0.5rem; }
.sx-fit-toolbar select, .sx-fit-number {
  font: inherit; color: var(--ink); background: var(--paper);
  border: 1px solid var(--rule); border-radius: 3px; padding: 0.4rem;
}
.sx-fit-toolbar select:focus-visible, .sx-fit-number:focus-visible,
.sx-fit-lab summary:focus-visible, .sx-fit-lab input[type=checkbox]:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 2px;
}
.sx-fit-equation {
  padding: 0.65rem 1rem; border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule); background: var(--paper);
  font-family: var(--mono); font-size: 0.9rem; text-align: center;
  color: var(--ink); overflow-wrap: anywhere;
}
.sx-fit-plots { display: grid; grid-template-columns: 1fr 1fr; }
.sx-fit-plot { min-width: 0; padding: 0.9rem 0.6rem 0.65rem; }
.sx-fit-plot + .sx-fit-plot { border-left: 1px solid var(--rule); }
.sx-fit-plot h3 { font-size: 0.9rem; margin: 0 0.25rem 0.2rem; }
.sx-fit-plot p { font-family: var(--sans); font-size: 0.9rem; line-height: 1.5; margin: 0 0.25rem; color: var(--muted); }
.sx-fit-plot canvas { width: 100%; }
.sx-fit-plot .sx-f { margin: 0.5rem 0.4rem 0; }
.sx-fit-legend {
  display: flex; flex-wrap: wrap; gap: 0.35rem 1rem; padding: 0.7rem 1rem;
  font: 0.72rem/1.5 var(--sans); color: var(--muted); border-top: 1px solid var(--rule);
}
.sx-fit-legend .sx-key { width: 17px; }
.sx-fit-controls { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; padding: 1rem; }
.sx-fit-controls .sx-f { gap: 0.5rem; }
.sx-fit-number { width: 100%; font: 0.78rem var(--mono); font-variant-numeric: tabular-nums; }
.sx-fit-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 0.8rem 0; }
.sx-fit-primary { background: var(--accent); border-color: var(--accent); color: white; }
.sx-fit-primary:hover { background: #244D89; }
.sx-fit-hint { font: 0.78rem/1.6 var(--sans); color: var(--muted); }
.sx-fit-lab .sx-fit-hint { margin: 0; }
.sx-fit-status { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.65rem; margin: 0 0 0.75rem; }
.sx-fit-status > div { border: 1px solid var(--rule); border-radius: 3px; padding: 0.7rem; background: var(--wash); }
.sx-fit-status span { display: block; font: 0.66rem/1.5 var(--sans); color: var(--muted); }
.sx-fit-status strong { display: block; font: 600 0.82rem/1.6 var(--sans); margin: 0.15rem 0; }
.sx-fit-status small { display: block; font: 0.71rem/1.6 var(--mono); overflow-wrap: anywhere; }
.sx-fit-status [data-tone=bad] strong { color: var(--violate); }
.sx-fit-status [data-tone=ok] strong { color: var(--ok); }
.sx-fit-status [data-tone=bad] { border-color: #E1BEB8; }
.sx-fit-feedback { font: 0.81rem/1.65 var(--sans); color: var(--body); margin: 0 !important; }
.sx-fit-details { margin-top: 0.9rem; font: 0.78rem/1.6 var(--sans); }
.sx-fit-details summary { cursor: pointer; font-weight: 600; padding: 0.3rem 0; }
.sx-fit-table-wrap { overflow-x: auto; margin: 0.5rem 0 0.7rem; }
.sx-fit-table { width: 100%; border-collapse: collapse; font: 0.73rem/1.6 var(--mono); }
.sx-fit-table th { font: 600 0.68rem/1.6 var(--sans); color: var(--muted); white-space: nowrap; }
.sx-fit-table th, .sx-fit-table td { text-align: right; padding: 0.35rem 0.45rem; border-bottom: 1px solid var(--rule-soft); }
.sx-fit-table th:first-child, .sx-fit-table td:first-child { text-align: left; }
.sx-fit-table tr[data-failing=true] td:first-child { color: var(--violate); }
.sx-fit-lab .sx-panel { padding: 1rem; }
@media (max-width: 700px) {
  .sx-fit-plots { grid-template-columns: 1fr; }
  .sx-fit-plot + .sx-fit-plot { border-left: 0; border-top: 1px solid var(--rule); }
  .sx-fit-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sx-fit-status { grid-template-columns: 1fr; }
  .sx-fit-status > div { display: grid; grid-template-columns: 1fr 1.25fr; column-gap: 0.5rem; }
  .sx-fit-status small { grid-column: 1 / -1; }
  .sx-fit-status strong { margin: 0; }
}

@media (max-width: 700px) {
  .sx-article { font-size: var(--fs); }
  .sx-article h1 { font-size: 1.75rem; }
}
@media (prefers-reduced-motion: reduce) {
  .sx-article * { transition: none !important; animation: none !important; }
}

/* Readable controls and figures, with the manuscript's visual conventions. */
body { margin: 0; }
.sx-article { padding-top: 1.2rem; }
.sx-article .eq { overflow-x: auto; padding: 0.25rem 0.5rem; }
.sx-article .eq .sx-eq-tag { float: none; display: block; text-align: right; }
.sx-article .sx-lede { font-size: 1.3rem; color: var(--body); }
.sx-article .note, .sx-fig-caption { font-size: 1rem; }
.sx-fig-label { font-size: 0.9rem; letter-spacing: 0.07em; color: var(--muted); }
.sx-fig-read { font-size: 0.94rem; }
.sx-btn, .sx-seg button { font-size: 1rem; min-height: 44px; padding: 0.5rem 0.8rem; }
.sx-btn:disabled { color: #727780; background: #f3f4f5; cursor: default; }
.sx-btn:hover:not(:disabled) { border-color: var(--accent); }
.sx-fit-primary:hover:not(:disabled) { background: #175d8d; }
.sx-article input[type=range] { height: 28px; }
.sx-article input[type=range]::-webkit-slider-thumb { width: 18px; height: 18px; margin-top: -8px; }
.sx-article input[type=range]::-moz-range-thumb { width: 18px; height: 18px; }
.sx-f-name, .sx-f-val { font-size: 1rem; }
.sx-fit-intro p, .sx-fit-feedback, .sx-fit-hint, .sx-fit-details { font-size: 1rem; }
.sx-fit-equation { font: 1.35rem/1.7 var(--serif); padding: 0.7rem 1rem; }
.sx-fit-plot h3 { font-size: 1.15rem; }
.sx-fit-plot p, .sx-fit-legend { font-size: 0.96rem; }
.sx-fit-number { font-size: 1.05rem; min-height: 42px; }
.sx-fit-status span { font-size: 0.94rem; }
.sx-fit-status strong { font-size: 1.08rem; }
.sx-fit-status small { font-size: 0.9rem; }
.sx-fit-table { font-size: 0.94rem; }
.sx-fit-table th { font-size: 0.91rem; }
.sx-fit-toolbar { margin-top: 1rem; gap: 0.7rem; font-size: 1rem; }
.sx-trajectory-nav { display: flex; align-items: center; flex-wrap: wrap; gap: 0.6rem; }
.sx-trajectory-nav output { font-weight: 600; min-width: 10.5rem; text-align: center; }
.sx-fit-cut-nav { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.sx-fit-cut-nav[hidden] { display: none; }
.sx-fit-cut-nav button[aria-pressed=true] { color: #fff; background: var(--accent); border-color: var(--accent); }
.sx-fit-projection-status { min-height: 3.1em; padding: 0.6rem 0.4rem 0; }
.sx-fit-projection-status[data-tone=bad] { color: var(--violate); }
.sx-rank-details { background: white; border-top: 1px solid var(--rule); padding: 0.8rem 1rem; font: 1rem/1.6 var(--sans); }
.sx-rank-details summary { cursor: pointer; font-weight: 600; }
.sx-rank-details p { margin: 0.7rem 0; }
.sx-rank-details .sx-seg { flex-wrap: wrap; }
.sx-rank-details .sx-panel { padding: 0.8rem 0 0; overflow-x: auto; }
.sx-m { font-size: 1rem; }
.sx-m th { font-size: 0.92rem; letter-spacing: 0; text-transform: none; }
.sx-m-out { font-size: 1rem; }
.sx-paper-figure { margin: 2rem 0; }
.sx-paper-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: center; }
.sx-paper-figure img { display: block; width: 100%; height: auto; background: white; }
.sx-paper-figure figcaption { font: 1rem/1.6 var(--sans); color: var(--muted); margin-top: 0.9rem; }
.sx-paper-label { font: 600 0.9rem/1.5 var(--sans); color: var(--muted); padding-bottom: 0.7rem; }
.sx-paper-figure details { margin-top: 0.8rem; font: 1rem/1.6 var(--sans); }
.sx-paper-figure details img { margin-top: 0.8rem; }
.sx-fit-table-wrap { margin: 0.7rem 0; }
.sx-regression-definition { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem 2rem; }
.sx-matrix-expression { display: inline-flex; align-items: center; gap: 0.65rem; }
.sx-column-vector { display: inline-flex; flex-direction: column; border-left: 1.5px solid currentColor; border-right: 1.5px solid currentColor; padding: 0.1rem 0.65rem; line-height: 1.7; position: relative; }
.sx-column-vector::before, .sx-column-vector::after { content: ""; position: absolute; inset: 0; border-top: 1.5px solid; border-bottom: 1.5px solid; width: 0.3rem; }
.sx-column-vector::after { left: auto; }
.sx-results-table-wrap { overflow-x: auto; }
.sx-results-table { width: 100%; border-collapse: collapse; font: 1rem/1.5 var(--sans); }
.sx-results-table caption { text-align: left; font-weight: 600; margin: 0.6rem 0; }
.sx-results-table th, .sx-results-table td { padding: 0.7rem 0.55rem; border-bottom: 1px solid var(--rule); text-align: right; }
.sx-results-table th:first-child { text-align: left; }
.sx-results-table thead { background: #F6F7F8; }
.sx-results-table tbody th { font-weight: 400; }
.sx-results-table td { white-space: nowrap; }
.sx-trajectory-note { padding: 0 1.1rem 0.7rem; margin: 0 !important; font: 1rem/1.55 var(--sans); }
.sx-article input:disabled { opacity: 0.5; cursor: default; }
@media (max-width: 800px) {
  .sx-fit-plots, .sx-paper-grid { grid-template-columns: 1fr; }
  .sx-fit-plot + .sx-fit-plot { border-left: 0; border-top: 1px solid var(--rule); }
  .sx-fit-status { grid-template-columns: 1fr; }
  .sx-article > .sx-fig { width: 100%; }
  .sx-ctl > .sx-f[style] { grid-column: auto !important; }
}
@media (max-width: 480px) {
  .sx-article { padding-left: 0.8rem; padding-right: 0.8rem; }
  .sx-fit-controls { grid-template-columns: 1fr 1fr; gap: 0.8rem; padding: 0.8rem; }
  .sx-trajectory-nav { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .sx-trajectory-nav output { grid-column: 1 / -1; grid-row: 1; }
  .sx-trajectory-nav button { padding: 0.45rem; font-size: 0.95rem; }
}

/* Visual motivation: progressive MPC comparison and the same-state experiment. */
.sx-mpc-setup { padding: 1rem 1.2rem; background: #F6F7F8; border-left: 3px solid var(--accent); font: 1.05rem/1.6 var(--sans); }
.sx-mpc-setup p { margin: 0.4rem 0 0; }
.sx-mpc-formulation { margin: 1rem 0; }
.sx-mpc-formulation summary { font-family: var(--sans); font-size: 1.05rem; cursor: pointer; padding: 0.5rem 0; }
.sx-mpc-formulation .eq { overflow-x: auto; text-align: left; padding: 0.2rem; }
.sx-mpc-steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-bottom: 1px solid var(--rule); }
.sx-mpc-steps button { border: 0; border-right: 1px solid var(--rule); padding: 0.9rem 0.55rem; background: #F7F8FA; color: var(--body); font: 1rem/1.4 var(--sans); cursor: pointer; }
.sx-mpc-steps button[aria-pressed="true"] { background: #E8F2F9; color: #15527C; box-shadow: inset 0 -3px var(--accent); font-weight: 600; }
.sx-mpc-steps button:hover { background: #E8F2F9; }
.sx-mpc-steps button:focus-visible { outline: 3px solid var(--accent); outline-offset: -4px; }
.sx-mpc-copy { padding: 1.1rem 1.2rem 0.6rem; }
.sx-article .sx-mpc-copy h3 { font-size: 1.3rem; margin: 0 0 0.65rem; }
.sx-mpc-copy p { font: 1.05rem/1.6 var(--sans); margin: 0; }
.sx-motivation-plots { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
.sx-motivation-plot { min-width: 0; padding: 1rem 0.65rem 0.35rem; overflow: hidden; }
.sx-motivation-plot + .sx-motivation-plot { border-left: 1px solid var(--rule); }
.sx-article .sx-motivation-plot h3 { font-size: 1.05rem; margin: 0 0.5rem 0.25rem; min-height: 2.65em; }
.sx-article .sx-motivation-legend { font: 1rem/1.55 var(--sans); margin: 0; padding: 0.85rem 1.2rem; border-top: 1px solid var(--rule); }
.sx-mpc-footer { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; padding: 0.9rem 1.2rem; border-top: 1px solid var(--rule); background: #F7F8FA; }
.sx-mpc-footer p { flex: 1 1 22rem; font: 600 1rem/1.5 var(--sans); margin: 0; }
.sx-mpc-navigation { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.sx-mpc-navigation button { font-size: 1rem; }
.sx-mpc-navigation button[aria-pressed="true"] { background: #E8F2F9; border-color: var(--accent); }
.sx-input-controls { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1rem 1.5rem; align-items: end; padding: 1rem 1.2rem; border-top: 1px solid var(--rule); }
@media (max-width: 800px) {
  .sx-motivation-plots { grid-template-columns: 1fr; }
  .sx-motivation-plot + .sx-motivation-plot { border-left: 0; border-top: 1px solid var(--rule); }
  .sx-mpc-steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sx-input-controls { grid-template-columns: 1fr; }
  .sx-article .sx-motivation-plot h3 { min-height: 0; }
}

.sx-flight-controls { padding: 1rem 1.2rem; border-top: 1px solid var(--rule); display: grid; gap: 0.9rem; }
.sx-flight-controls [data-robust-controls] { padding-top: 0.8rem; border-top: 1px solid var(--rule); }
.sx-flight-controls [data-robust-controls] .sx-mpc-navigation { margin-top: 0.5rem; }
.sx-article .sx-flight-event { margin: 0; font: 600 1.05rem/1.6 var(--sans); min-height: 1.6em; }
.sx-flight-event[data-tone="failure"] { color: var(--violate); }
.sx-flight-event[data-tone="safe"] { color: var(--ok); }
.sx-flight-controls .sx-btn { font-size: 1rem; }