.ranker-system, .route-work, .trip-next { scroll-margin-top:24px; margin:28px 0; }
.engineering-flow { scroll-margin-top:24px; margin:28px 0; }
.engineering-flow .system-flow { grid-template-columns:repeat(4,minmax(0,1fr)); }
.engineering-flow .system-flow a { min-height:150px; }
.flow-boundary { font-size:12px; line-height:1.8; border-left:3px solid var(--accent); padding:10px 15px; margin:0 0 18px; background:var(--surface); }
.engineering-flow .system-panel { scroll-margin-top:24px; }
.system-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:22px; }
.system-heading h2, .route-work h2, .trip-next h2 { font:700 clamp(26px,3vw,35px)/1.15 var(--display); letter-spacing:-1px; margin:10px 0 0; }
.system-hint { font:10px/1.6 var(--mono); color:var(--muted); text-align:right; }
.system-flow { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); list-style:none; padding:0; gap:17px; margin:0 0 18px; }
.system-flow li { position:relative; min-width:0; }
.system-flow li:not(:last-child)::after { content:'→'; position:absolute; right:-14px; top:49%; color:var(--accent); font:15px/1 var(--mono); pointer-events:none; }
.system-flow a { display:flex; flex-direction:column; gap:11px; padding:17px 13px; height:100%; min-height:177px; background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--accent); transition:transform .18s,background .18s; }
.system-flow a:hover, .system-flow a:focus-visible { transform:translateY(-3px); }
.system-flow a.is-current { background:var(--hero); color:white; border-color:var(--hero); }
.system-number { font:10px/1 var(--mono); opacity:.8; }
.system-flow strong { font:700 17px/1.2 var(--display); letter-spacing:-.3px; }
.system-owner { font:9px/1.6 var(--mono); color:var(--tone); }
.system-summary { font-size:10px; line-height:1.6; margin-top:auto; color:var(--muted); }
.system-flow .is-current .system-owner, .system-flow .is-current .system-summary { color:#e0e8ff; }
.system-panel { display:grid; grid-template-columns:1.2fr 1fr; gap:34px; min-height:207px; padding:24px 27px; border:1px solid var(--line); background:var(--soft); }
.system-panel h3 { font:700 23px/1.2 var(--display); letter-spacing:-.6px; margin:8px 0 12px; }
.system-panel p:not(.eyebrow), .system-panel dd { font-size:12px; line-height:1.8; margin:0; }
.system-panel dl { margin:0; display:grid; gap:16px; }
.system-panel dt { font:500 10px/1.6 var(--mono); text-transform:uppercase; letter-spacing:1px; color:var(--tone); margin-bottom:5px; }
.system-footnote { font-size:11px; color:var(--muted); line-height:1.8; margin:14px 0 22px; }
.system-footnote a, .route-work > p a { text-decoration:underline; text-underline-offset:3px; }
.route-work { border-top:2px solid var(--ink); padding-top:28px; }
.route-work > p:not(.eyebrow):not(.system-footnote), .trip-next > p:not(.eyebrow):not(.system-footnote) { font-size:13px; line-height:1.8; max-width:900px; margin:16px 0 22px; }
.route-work-controls { display:flex; gap:22px; margin-bottom:20px; }
.route-work-controls label { flex:1; display:flex; flex-direction:column; gap:9px; font-size:11px; font-weight:800; }
.route-work-controls select { border:1px solid var(--line); background:var(--surface); border-radius:3px; padding:12px; font-size:12px; min-height:44px; width:100%; }
.route-work-output { display:grid; grid-template-columns:1fr 1fr 1.5fr; gap:25px; align-items:center; background:var(--hero); color:white; padding:25px 28px; }
.route-work-output > div { display:flex; flex-direction:column; gap:9px; }
.route-work-output strong { font:700 46px/1 var(--display); letter-spacing:-2px; }
.route-work-output span { font-size:11px; }
.route-work-output p { font:12px/1.9 var(--mono); margin:0; border-left:1px solid #ffffff60; padding-left:25px; }
.route-tradeoffs { margin-top:26px; }
.route-tradeoffs table { width:100%; border-collapse:collapse; table-layout:fixed; }
.route-tradeoffs caption { font:700 21px/1.3 var(--display); text-align:left; margin-bottom:17px; letter-spacing:-.5px; }
.route-tradeoffs th, .route-tradeoffs td { text-align:left; vertical-align:top; border-bottom:1px solid var(--line); padding:15px 17px 15px 0; font-size:12px; line-height:1.8; overflow-wrap:anywhere; }
.route-tradeoffs th:first-child { width:25%; }
.route-tradeoffs th:nth-child(2) { width:30%; }
.route-tradeoffs thead th { font:500 10px/1.7 var(--mono); text-transform:uppercase; color:var(--muted); }
.route-tradeoffs tbody th { font-weight:800; }
.trip-next { border-top:1px solid var(--line); padding-top:28px; }
.trip-next code { font:11px/1.8 var(--mono); white-space:nowrap; }
.trip-order-count { display:flex; gap:24px; align-items:center; background:var(--surface); border-left:4px solid var(--accent); padding:22px; margin:23px 0; }
.trip-order-count > strong { font:700 40px/1 var(--display); letter-spacing:-1.5px; color:var(--accent); }
.trip-order-count > span { font-size:12px; line-height:1.8; }
.trip-proposals { padding:0; list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.trip-proposals li { font-size:12px; line-height:1.85; color:var(--muted); }
.trip-proposals strong { display:block; font:700 18px/1.25 var(--display); color:var(--ink); margin-bottom:10px; letter-spacing:-.4px; }
.ranking-details { margin:24px 0 30px; }
.ranking-details > div { max-width:none; }
.ranking-details .technical-example { margin:22px 0; }
.ranking-details .technical-example p { color:white; }
.ranking-details .technical-notes p { color:var(--ink); }
.ranking-details .technical-constraint { color:var(--muted)!important; }
@media(max-width:1000px) {
  .engineering-flow .system-flow { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .engineering-flow .system-flow li:nth-child(2)::after { content:'↙'; right:50%; top:auto; bottom:-16px; }
  .engineering-flow .system-flow li:nth-child(3)::after { content:'→'; right:-14px; top:49%; bottom:auto; }
  .system-flow { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
  .system-flow li:nth-child(3)::after { content:'↓'; right:50%; top:auto; bottom:-16px; }
  .system-flow a { min-height:145px; }
}
@media(max-width:650px) {
  .engineering-flow .system-flow { grid-template-columns:1fr; }
  .engineering-flow .system-flow a { min-height:0; }
  .engineering-flow .system-flow li:not(:last-child)::after { content:'↓'; top:auto; bottom:-17px; right:50%; }
  .system-heading { display:block; }
  .system-hint { display:block; margin-top:12px; text-align:left; }
  .system-flow { grid-template-columns:1fr; gap:20px; }
  .system-flow a { display:grid; grid-template-columns:24px 1fr; gap:7px 10px; min-height:0; padding:14px 16px; }
  .system-number { grid-row:1 / 4; padding-top:5px; }
  .system-flow strong, .system-owner, .system-summary { grid-column:2; }
  .system-flow li:not(:last-child)::after, .system-flow li:nth-child(3)::after { content:'↓'; top:auto; bottom:-17px; right:50%; }
  .system-panel { grid-template-columns:1fr; gap:20px; padding:22px; }
  .route-work-controls { flex-direction:column; gap:16px; }
  .route-work-output { grid-template-columns:1fr 1fr; gap:22px; padding:24px; }
  .route-work-output p { grid-column:1 / -1; border-left:0; border-top:1px solid #ffffff60; padding:16px 0 0; font-size:11px; }
  .route-tradeoffs table { table-layout:auto; }
  .route-tradeoffs thead { display:none; }
  .route-tradeoffs tr { display:block; padding:15px 0; border-bottom:1px solid var(--line); }
  .route-tradeoffs th, .route-tradeoffs td { display:block; width:100%!important; border:0; padding:0 0 9px; }
  .route-tradeoffs tbody th { font-size:15px; }
  .route-tradeoffs td:nth-child(2)::before { content:'Saved work: '; font-weight:800; }
  .route-tradeoffs td:nth-child(3)::before { content:'Limit: '; font-weight:800; }
  .trip-order-count { align-items:start; flex-direction:column; gap:12px; }
  .trip-proposals { grid-template-columns:1fr; gap:20px; }
}
@media(prefers-reduced-motion:reduce) {
  .system-flow a { transition:none; }
  .system-flow a:hover, .system-flow a:focus-visible { transform:none; }
}