.article:has([data-interactive="backlash-lost-motion"]){max-width:74rem}
[data-interactive="backlash-lost-motion"]{container-type:inline-size;min-width:0;margin-block:1rem;--bl-steel:#B9BFC7;--bl-bronze:#C4884A;--bl-hand:#FF4500}
.bl-live{font:1rem/1.45 var(--f-body)}
.bl-live-ready>.bl-static{display:none}
.bl-challenge{margin:0 0 .75rem}
.bl-modes,.bl-turns,.bl-run,.bl-view-buttons{display:flex;flex-wrap:wrap;gap:.4rem}
[data-interactive="backlash-lost-motion"] button,[data-interactive="backlash-lost-motion"] select,[data-interactive="backlash-lost-motion"] input{min-height:44px;padding:.4rem .7rem;font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius-xs)}
[data-interactive="backlash-lost-motion"] button{font-family:var(--f-display);font-weight:600;cursor:pointer}
[data-interactive="backlash-lost-motion"] button:disabled{opacity:.55;cursor:not-allowed}
[data-interactive="backlash-lost-motion"] button[aria-pressed="true"]{background:var(--band);color:var(--band-ink);border-color:var(--band)}
[data-interactive="backlash-lost-motion"] :is(button,select,input,.bl-wheel-host,.bl-webgl):focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.bl-modes button{flex:1 1 12rem}
.bl-task{margin:.75rem 0;padding:.7rem .85rem;background:var(--surface-2);border-left:4px solid var(--accent);border-radius:var(--radius-xs)}
.bl-task p{margin:.2rem 0 .5rem}
.bl-predict{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.bl-predict label{font-weight:700}
.bl-predict input{width:7.5rem}
.bl-result{font-weight:600;min-height:1.4em}
.bl-visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bl-coupled{display:grid;gap:.6rem}
.bl-slot{min-width:0}
.bl-live figure{margin:0;min-width:0}
.bl-live figcaption,.bl-linkstate{color:var(--ink-soft);font-size:.92rem;margin:.3rem 0 0}
.bl-sec{margin-top:.6rem!important}
.bl-view.is-unlinked .bl-canvas{opacity:.6;border-style:dashed}
.bl-view [data-bl-link]{width:100%;margin-top:.4rem}
.bl-canvas{height:17rem;max-height:45vh;background:var(--surface-2);border:1px solid var(--rule);border-radius:var(--radius-xs);overflow:hidden;position:relative}
.bl-loading{margin:0;padding:1rem;color:var(--ink-soft)}
.bl-webgl{display:block;width:100%;height:100%;touch-action:none}
.bl-view-buttons{margin-top:.4rem}
.bl-view-buttons button{flex:1 1 5rem}
.bl-instruments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.bl-wheel-host{touch-action:none;cursor:grab;border-radius:50%}
.bl-wheel-host:active{cursor:grabbing}
.bl-wheel,.bl-gauge{display:block;width:100%;height:auto;max-width:12.5rem;margin-inline:auto}
.bl-instruments figcaption{text-align:center}
.bl-drive{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin:.2rem 0 0}
.bl-turns button{min-width:5.2rem}
.bl-status{min-height:1.5em;margin:.3rem 0;color:var(--ink)}
.bl-readout{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.4rem;margin:.4rem 0 1rem}
.bl-readout div{padding:.45rem .55rem;border:1px solid var(--rule);background:var(--surface);border-radius:var(--radius-xs)}
.bl-readout dt{font-size:.8rem;color:var(--ink-soft);font-family:var(--f-display)}
.bl-readout dd{margin:.15rem 0 0;font-weight:700;font-family:var(--f-mono);font-size:1.05rem}
.bl-readout dd.bl-words{font-family:var(--f-display);font-size:.95rem}
.bl-plots{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem}
.bl-settings{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.4rem .8rem;align-items:center;margin-top:1rem;padding:.7rem .85rem;border:1px solid var(--rule);border-radius:var(--radius-xs)}
.bl-settings label{font-weight:700}
.bl-note{grid-column:1/-1;margin:.2rem 0 0;color:var(--ink-soft);font-size:.92rem}
/* shared SVG drawing */
:is(.bl-wheel,.bl-gauge,.bl-loop,.bl-section) text{font-family:var(--f-display);fill:var(--ink)}
.bl-wheel-rim,.bl-gauge-rim{fill:var(--surface-2);stroke:var(--ink-soft);stroke-width:2}
.bl-wheel-face,.bl-gauge-face{fill:var(--surface);stroke:var(--ink);stroke-width:1.5}
.bl-tick{stroke:var(--ink);stroke-width:1}
.bl-tick.is-major{stroke-width:2}
.bl-wheel-num,.bl-gauge-num{font-size:13px}
.bl-wheel-band{fill:var(--flag);opacity:.55}
.bl-wheel-hub{fill:var(--surface-2);stroke:var(--ink)}
.bl-wheel-knob{fill:var(--accent);stroke:var(--ink)}
.bl-index{fill:var(--ink)}
.bl-wheel-read,.bl-gauge-read{font-family:var(--f-mono)!important;font-size:19px;font-weight:700}
.bl-wheel-read,.bl-gauge-read{paint-order:stroke;stroke:var(--surface);stroke-width:5px}
.bl-wheel-read{stroke:var(--surface-2)}
.bl-wheel-unit{font-size:12px}
.bl-gauge-stem{fill:var(--ink-soft)}
.bl-gauge-sub{fill:none;stroke:var(--ink)}
.bl-gauge-subhand{stroke:var(--ink);stroke-width:2.5;stroke-linecap:round}
.bl-gauge-hand{stroke:var(--bl-hand);stroke-width:3.5;stroke-linecap:round}
.bl-gauge-pin{fill:var(--ink)}
.bl-loop,.bl-section{display:block;width:100%;height:auto;background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius-xs)}
.bl-plot{fill:var(--surface);stroke:var(--ink-soft)}
.bl-grid{stroke:var(--rule);stroke-width:1}
.bl-axis-num{font-size:13px}
.bl-axis{font-size:14px;font-weight:600}
.bl-band{fill:var(--accent);opacity:.12}
.bl-line-fwd,.bl-line-rev{stroke:var(--ink);stroke-width:2;fill:none}
.bl-line-rev{stroke-dasharray:8 6}
.bl-trace{fill:none;stroke:var(--accent);stroke-width:3.5;stroke-linejoin:round;stroke-linecap:round}
.bl-now{fill:var(--bl-hand);stroke:var(--ink);stroke-width:2}
.bl-width path{stroke:var(--ink);stroke-width:2.5;fill:none}
.bl-width-label{font-size:14px;font-weight:700;paint-order:stroke;stroke:var(--surface);stroke-width:5px}
.bl-key text{font-size:13px;paint-order:stroke;stroke:var(--surface);stroke-width:4px}
.bl-key path{stroke-width:2.5}
.bl-screw{fill:var(--bl-steel);stroke:#1F1E1C;stroke-width:1.5}
.bl-nut{fill:var(--bl-bronze);stroke:#1F1E1C;stroke-width:1.5}
.bl-contact{stroke:var(--accent);stroke-width:7;stroke-linecap:round}
.bl-axisline{stroke:var(--ink-soft);stroke-width:1.5}
.bl-legend text{font-size:14px}
.bl-tag{font-size:15px}
.bl-state{font-size:15px;font-weight:700}
.bl-small{font-size:14px}
.bl-limit{padding:.65rem;background:var(--surface-2);border-radius:var(--radius-xs)}
.bl-table th[scope="row"]{font-weight:600}
/* static lesson */
.bl-static figure{margin:1rem 0}
.bl-static-instruments{display:grid;grid-template-columns:repeat(2,minmax(0,15rem));gap:1rem;justify-content:center}
.bl-static-sections{display:grid;gap:.6rem}
.bl-static-sections .bl-section{max-width:40rem}
.bl-static .bl-loop{max-width:40rem}
@container (max-width:44rem){.bl-readout{grid-template-columns:repeat(2,minmax(0,1fr))}.bl-readout div:last-child{grid-column:1/-1}}
@container (max-width:30rem){.bl-canvas{height:10.5rem}.bl-coupled{gap:.35rem}.bl-instruments{gap:.4rem}.bl-live figcaption,.bl-linkstate{font-size:.85rem;line-height:1.3}.bl-view-buttons{margin-top:.25rem}}
@media (max-width:34rem){.bl-turns button{flex:1 1 30%;min-width:0;padding-inline:.3rem}.bl-run{width:100%}.bl-run button{flex:1 1 40%}.bl-settings{grid-template-columns:1fr}.bl-settings select{width:100%}.xcard:has([data-interactive="backlash-lost-motion"]) .body{padding-inline:.5rem}}
@media (prefers-reduced-motion:reduce){[data-interactive="backlash-lost-motion"] *{animation:none!important;transition:none!important}}
@media print{
  .bl-live{display:none!important}
  .bl-live-ready>.bl-static{display:block!important}
  [data-interactive="backlash-lost-motion"]{break-inside:auto!important}
  .bl-static figure{break-inside:avoid;page-break-inside:avoid}
  .bl-static .bl-loop{max-height:3.6in;width:auto;max-width:100%}
  .bl-static .bl-static-sections{break-inside:auto;page-break-inside:auto}
  .bl-static-sections .bl-section{max-height:3in;width:auto;max-width:100%;break-inside:avoid;page-break-inside:avoid}
  .bl-keep{break-after:avoid;page-break-after:avoid}
  .bl-static-instruments{grid-template-columns:repeat(2,2.4in)}
  .bl-formula,.bl-static .unit-table-wrap{break-inside:avoid}
}
@container (max-width:30rem){.bl-loop .bl-axis-num{font-size:21px}.bl-loop .bl-axis{font-size:23px}.bl-loop .bl-key text{font-size:20px}.bl-width-label{font-size:22px}.bl-section .bl-state,.bl-section .bl-small{font-size:24px}.bl-legend text{font-size:23px}.bl-wheel-num,.bl-gauge-num{font-size:17px}.bl-wheel-read,.bl-gauge-read{font-size:22px}}