.recovery-lab { max-width: 76rem; margin-inline: auto; }
.recovery-lab .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.rl-intro { display: grid; grid-template-columns: 1.1fr 1fr; gap: .5rem 2.5rem; margin: 1rem 0 1.6rem; }
.rl-intro .lab-kicker { grid-column: 1 / -1; }
.rl-intro h1 { grid-column: 1; grid-row: 2 / span 2; margin: .4rem 0; font: 400 clamp(2.8rem,4.6vw,4rem)/1.03 var(--display); letter-spacing: -.04em; }
.rl-intro h1 em { color: var(--green); font-weight: 400; }
.rl-intro > p:not(.lab-kicker):not(.lab-local) { grid-column: 2; align-self: end; max-width: 53ch; margin: .4rem 0 0; color: var(--muted); font-size: .92rem; line-height: 1.75; }
.rl-intro .lab-local { grid-column: 2; margin: .3rem 0; }
.recovery-lab h2 { font: 400 1.65rem/1.25 var(--display); margin: 0 0 1rem; }
.recovery-lab h3 { font: 600 .9rem/1.5 var(--body,system-ui,sans-serif); margin: 1.5rem 0 .5rem; }
.rl-starters { margin-bottom: 1.3rem; }
.rl-starters h2 { font: 600 .8rem/1.5 system-ui,sans-serif; }
.rl-preset-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .5rem; }
.recovery-lab .rl-preset-grid button { text-align: left; min-height: 48px; background: var(--surface); color: var(--ink); border: 1px solid var(--control-edge); }
.recovery-lab .rl-preset-grid button[aria-pressed=true] { background: var(--sage-surface); border-color: var(--green); box-shadow: inset 3px 0 var(--green); }
.rl-toolbar { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 .5rem; }
.recovery-lab button { min-height: 44px; }
.recovery-lab button:disabled { opacity: .55; cursor: default; }
.recovery-lab button:focus-visible,.recovery-lab input:focus-visible,.recovery-lab select:focus-visible,.recovery-lab summary:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
.recovery-lab a:focus-visible,.recovery-lab [tabindex]:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
.rl-jumps { display: flex; flex-wrap: wrap; gap: .3rem 1.4rem; margin-bottom: 1rem; }
.rl-jumps a { display: inline-flex; align-items: center; min-height: 44px; font-size: .85rem; }
.rl-guide { padding: .4rem 1.3rem 1rem; background: var(--sage-surface); border: 1px solid var(--control-edge); margin-bottom: 1.6rem; }
.rl-guide > summary { min-height: 44px; padding-block: .6rem; cursor: pointer; font-weight: 650; }
.rl-guide p,.rl-worked p,.rl-equations p,.rl-control-help { font-size: .9rem; line-height: 1.8; max-width: 85ch; }
.rl-lesson-buttons { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .4rem; margin-block: 1rem; }
.recovery-lab .rl-lesson-buttons button,.recovery-lab .rl-prediction button { color: var(--green); background: var(--surface); border: 1px solid var(--control-edge); text-align: left; }
.recovery-lab .rl-lesson-buttons button[aria-pressed=true],.recovery-lab .rl-prediction button[aria-pressed=true] { box-shadow: inset 0 -3px var(--green); border-color: var(--green); }
.rl-guide #rl-lesson-title { font-size: 1.5rem; margin: 1.3rem 0 .5rem; }
.rl-lesson-example { border-left: 3px solid var(--green); padding-left: .9rem; }
.rl-guide .rl-prediction { padding: 0; margin: 1rem 0 0; border: 0; }
.rl-prediction legend { font-size: .9rem; font-weight: 650; margin-bottom: .6rem; }
#rl-prediction-choices { display: flex; flex-wrap: wrap; gap: .5rem; }
#rl-prediction-feedback:empty { margin: 0; }
.rl-lesson-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem 1rem; margin-top: 1rem; }
.rl-lesson-actions a { min-height: 44px; display: inline-flex; align-items: center; font-size: .85rem; }
.rl-keep-target { display: inline-flex; width: 44px; min-height: 44px; align-items: center; justify-content: center; cursor: pointer; }
.rl-equations { margin-top: 1rem; font-size: .85rem; }
.rl-equations summary { padding-block: .8rem; min-height: 44px; cursor: pointer; }
.rl-equations table { width: 100%; font-size: .8rem; }
.rl-equations td { overflow-wrap: anywhere; }
.rl-worked { padding: .2rem 0 1rem; }
.rl-worked h3 { margin-top: .5rem; }
.rl-stepper { display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; align-items: center; gap: .8rem; }
.rl-stepper button { padding: .2rem; font-size: 1.3rem; }
.rl-geometry { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 1rem; }
.rl-geometry figure { flex: 1 1 20rem; min-width: 0; margin: 0; }
.rl-geometry figcaption { font-size: .85rem; line-height: 1.8; }
.rl-geometry .lab-diagram svg text { font-size: 14px; }
.rl-geometry .lab-diagram { padding: .4rem; }
.rl-response-trace { fill: none; stroke: var(--green); stroke-width: 2.5; }
.rl-response-base { stroke: var(--lab-amber); stroke-width: 3; stroke-dasharray: 8 6; }
.rl-response-dot { fill: var(--surface); stroke: var(--green); stroke-width: 2; }
.rl-current-guide { stroke: var(--muted); stroke-dasharray: 2 5; stroke-width: 1.5; }
.rl-base-square { fill: none; stroke: var(--lab-amber); stroke-width: 2.5; }
.rl-fiber-line { stroke: var(--lab-teal); stroke-width: 2.5; }
.rl-fiber-plane { fill: var(--sage-surface); stroke: var(--lab-teal); stroke-dasharray: 5 5; }
.rl-vocabulary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem 2rem; }
.rl-vocabulary dt { font-weight: 650; }
.rl-vocabulary dd { margin: .25rem 0 0; }
.rl-workspace { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); margin-top: 1.3rem; border: 1px solid var(--line); border-radius: .3rem; overflow: clip; }
.rl-setup { background: #f0f3e9; padding: 1.5rem; border-right: 1px solid var(--line); }
.rl-setup fieldset,.rl-motion fieldset { padding: 0; border: 0; margin: 0; }
.rl-setup h3 span { display: block; font-weight: 400; font-family: var(--display); color: var(--green); font-size: 1.3rem; }
.rl-input-table { margin: .8rem 0; }
.rl-input-table table { border-collapse: collapse; width: 100%; font-size: .75rem; min-width: 0; }
.recovery-lab .rl-input-table th,.recovery-lab .rl-input-table td { padding: .2rem; border-bottom: 1px solid var(--line); text-align: center; }
.rl-input-table th[scope=row] { white-space: nowrap; font-size: .75rem; }
.rl-input-table input[type=text] { width: 100%; min-width: 2.8rem; min-height: 44px; padding: .3rem .2rem; text-align: center; border: 1px solid var(--control-edge); border-radius: .15rem; background: var(--surface); color: var(--ink); font: 400 .95rem/1.4 system-ui,sans-serif; }
.rl-input-table input[aria-invalid=true] { border: 2px solid var(--lab-amber); }
.recovery-lab .rl-input-table .rl-remove { min-width: 36px; padding: .2rem; color: var(--green); background: transparent; border: 1px solid var(--control-edge); font-size: 1.1rem; }
.rl-input-table tr[data-enabled=false] { background: var(--lab-amber-bg); }
.rl-result { padding: 1.5rem; min-width: 0; background: var(--surface); }
.rl-verdict { border-left: 3px solid var(--green); padding: .9rem 1rem; background: var(--sage-surface); }
.rl-verdict[data-loss=true] { border-color: var(--lab-amber); background: var(--lab-amber-bg); }
.rl-verdict strong { display: block; font: 400 1.7rem/1.2 var(--display); }
.rl-verdict p { font-size: .8rem; line-height: 1.65; margin: .5rem 0 0; }
.rl-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line); margin: 0 0 1rem; }
.rl-metrics dt { font-size: .7rem; line-height: 1.6; color: var(--muted); }
.rl-metrics dd { margin: .25rem 0 0; font: 400 1.8rem/1.2 var(--display); }
.rl-question-tabs { display: flex; flex-wrap: wrap; gap: .4rem; }
.recovery-lab .rl-question-tabs button { padding: .5rem .7rem; border: 1px solid var(--control-edge); color: var(--green); background: var(--surface); }
.recovery-lab .rl-question-tabs button[aria-pressed=true] { background: var(--green); color: var(--surface); }
.rl-certificate { padding: .2rem 0 .8rem; min-height: 10rem; }
.rl-certificate p,.rl-repair p { font-size: .83rem; line-height: 1.75; margin: .6rem 0; }
.rl-formula { font: 400 1rem/1.75 ui-monospace,monospace; background: #f6f5ee; padding: .7rem .8rem; border: 1px solid var(--line); white-space: pre-wrap; overflow-wrap: anywhere; max-width: 100%; }
.rl-repair { border-top: 1px solid var(--line); }
.rl-repair h3 { margin-top: 1rem; }
.rl-repair #rl-undo { color: var(--green); background: transparent; border: 1px solid var(--control-edge); margin: .5rem 0 0 .25rem; }
.rl-motion { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.rl-motion > div > p:not(.lab-kicker) { color: var(--muted); font-size: .85rem; line-height: 1.75; max-width: 80ch; }
.rl-base-inputs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1.2rem; }
.rl-motion-controls { min-width: 0; }
.rl-motion-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.rl-motion-charts > div { min-width: 0; }
.rl-motion-charts h3 { font-size: .8rem; margin: 1rem 0 .3rem; }
.rl-motion .lab-diagram { border: 1px solid var(--line); background: var(--surface); padding: .7rem; }
.rl-motion .lab-diagram svg text { font-size: 12px; }
.rl-motion .rl-plot-base { fill: var(--green); stroke: var(--green); stroke-width: 2; }
.rl-motion .rl-plot-moved { fill: var(--surface); stroke: var(--lab-amber); stroke-width: 2; }
.rl-motion .rl-plot-line { stroke: var(--lab-amber); stroke-width: 2; }
.rl-motion .rl-plot-axis { stroke: var(--line); stroke-width: 1; }
.rl-values { width: 100%; font-size: .85rem; }
.rl-values td { font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.rl-detail { border-top: 1px solid var(--line); margin-top: 1.5rem; font-size: .85rem; line-height: 1.8; }
.rl-detail summary { min-height: 44px; padding: .8rem 0; cursor: pointer; }
.rl-detail p { max-width: 90ch; }
.rl-detail table { width: 100%; font-size: .8rem; }
.rl-detail li { margin-bottom: .3rem; }
.rl-reading { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; border-top: 1px solid var(--line); margin-top: 1.5rem; padding-top: 1rem; }
.rl-reading a { font-size: .8rem; min-height: 44px; display: inline-flex; align-items: center; }
#rl-share-link { display: block; width: 100%; min-height: 44px; }
.recovery-lab [hidden] { display: none !important; }
@media (max-width: 850px) {
  .rl-intro { display: block; }
  .rl-intro h1 { font-size: clamp(2.6rem,7vw,3.4rem); margin-bottom: 1rem; }
  .rl-workspace { grid-template-columns: minmax(0,1fr); }
  .rl-setup { border-right: 0; border-bottom: 1px solid var(--line); }
  .rl-certificate { min-height: 0; }
}
@media (max-width: 520px) {
  .rl-lesson-buttons { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .rl-vocabulary { grid-template-columns: minmax(0,1fr); }
  .rl-guide { padding-inline: .8rem; }
  .rl-preset-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .rl-setup,.rl-result { padding: 1rem .7rem; }
  .rl-base-inputs { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 1rem; }
  .rl-motion-charts { grid-template-columns: minmax(0,1fr); gap: 0; }
  .rl-metrics { gap: .6rem; }
  .rl-input-table { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .recovery-lab,.recovery-lab * { scroll-behavior: auto; animation: none; transition: none; }
}
@media (forced-colors: active) {
  .rl-response-trace,.rl-response-base,.rl-response-dot,.rl-base-square,.rl-fiber-line,.rl-current-guide,.recovery-lab .rl-plot-axis,.recovery-lab .rl-plot-line { stroke: CanvasText; }
  .rl-response-dot,.rl-fiber-plane { fill: Canvas; }
  .recovery-lab .rl-plot-base { fill: CanvasText; stroke: CanvasText; }
  .recovery-lab .rl-plot-moved { fill: Canvas; stroke: CanvasText; }
  .rl-fiber-plane { stroke: CanvasText; }
  .recovery-lab button[aria-pressed=true] { outline: 2px solid Highlight; outline-offset: -3px; }
}
