/* ==========================================================================
   lb.css: the interactive tools ("labs") of the lifeboat courses, copied from
   lifeboatinspections.com (pages/academy.css "Labs" and SVG ink shades, and
   every pages/lab-*.css) by `mix am.academy.import lb`. The two sites share the
   same tokens (--ink, --paper, --grey, --grey-text, --rule, --field, --danger,
   --s-*, --t-*), so the rules are copied as they are. --danger marks an unsafe
   state inside a lab, nothing else. Don't edit: change the import instead.
   ========================================================================== */

/* ---------- Labs ---------------------------------------------------------- */
.lab { border-top: 1px solid var(--ink); padding-block: var(--s-6) var(--s-6); display: grid; gap: var(--s-5); }
.lab__fallback { color: var(--grey-text); }
.lab__head { display: grid; gap: var(--s-2); }
.lab__kicker { font-size: var(--t-s); color: var(--grey-text); }
.lab__title { font-size: var(--t-l); line-height: var(--lh-head); font-weight: 500; letter-spacing: var(--track-head); text-wrap: balance; }
.lab__intro { color: var(--grey-text); max-width: 40em; }
.lab__controls { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); gap: var(--s-4) var(--s-5); align-items: end; }
.lab__controls:empty, .lab__stage:empty, .lab__out:empty { display: none; }
.lab__field { display: grid; gap: var(--s-2); min-width: 0; }
.lab__field > label, .lab__label { font-size: var(--t-s); color: var(--grey-text); }
.lab__unit { color: var(--grey-text); }
.lab__hint { font-size: var(--t-s); color: var(--grey-text); }
.lab__input { width: 100%; font-variant-numeric: tabular-nums; }
.lab__choice { display: flex; flex-wrap: wrap; gap: 0; border: 1px solid var(--rule); border-radius: var(--radius); overflow: hidden; width: fit-content; max-width: 100%; }
.lab__seg { flex: 1 1 auto; font: inherit; font-size: var(--t-s); padding: 8px 12px; background: var(--paper); color: var(--ink); border: 0; border-inline-end: 1px solid var(--rule); cursor: pointer; }
.lab__seg:last-child { border-inline-end: 0; }
.lab__seg[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.lab__seg:focus-visible, .lab__btn:focus-visible, .lab__hot:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.lab__toggle { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--t-s); cursor: pointer; }
.lab__toggle input { width: 18px; height: 18px; accent-color: var(--ink); }
.lab__stage { min-width: 0; overflow-x: auto; }
.lab__svg { width: 100%; height: auto; display: block; max-width: 100%; }
.lab__out { display: grid; gap: var(--s-4); }
.lab__readouts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 10rem), 1fr)); gap: var(--s-4) var(--s-5); margin: 0; }
.lab__readout { border-top: 1px solid var(--rule); padding-top: var(--s-2); display: grid; gap: 2px; }
.lab__readout dt { font-size: var(--t-s); color: var(--grey-text); }
.lab__readout dd { margin: 0; font-size: var(--t-l); line-height: 1.15; letter-spacing: var(--track-head); font-variant-numeric: tabular-nums; }
.lab__readout.is-bad dd { color: var(--danger); }
.lab__readout.is-good dd::after { content: " ✓"; font-size: var(--t-s); }
.lab__note { max-width: 44em; padding-inline-start: var(--s-3); border-inline-start: 2px solid var(--rule); }
.lab__note.is-bad { border-color: var(--danger); }
.lab__note.is-good { border-color: var(--ink); }
.lab__refs { font-size: var(--t-s); color: var(--grey-text); max-width: 52em; }
.lab__checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-2); }
.lab__check { display: flex; gap: var(--s-3); align-items: flex-start; cursor: pointer; }
.lab__check input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--ink); flex: none; }
.lab__check.is-bad span { color: var(--danger); }
.lab__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.lab__list > li { padding-block: var(--s-3); border-bottom: 1px solid var(--rule); display: grid; gap: var(--s-1); }
.lab__tag { font-size: var(--t-s); color: var(--grey-text); }
.lab__tag.is-bad { color: var(--danger); }
.lab__hot { cursor: pointer; }
.lab__table { width: 100%; border-collapse: collapse; font-size: var(--t-s); }
.lab__table th, .lab__table td { text-align: left; padding: 8px 12px 8px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.lab__table th { color: var(--grey-text); font-weight: 400; }

/* SVG ink shades: drawings use these classes, never literal colours. */
.lab-fill-1 { fill: var(--ink); }
.lab-fill-2 { fill: var(--grey); }
.lab-fill-3 { fill: var(--grey-text); }
.lab-fill-4 { fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-dasharray: 4 3; }
.lab-paper { fill: var(--paper); }
.lab-field { fill: var(--field); }
.lab-line { fill: none; stroke: var(--ink); stroke-width: 1.5; }
.lab-line-thin { fill: none; stroke: var(--grey); stroke-width: 1; }
.lab-rule { fill: none; stroke: var(--rule); stroke-width: 1; }
.lab-bad { fill: var(--danger); }
.lab-bad-line { fill: none; stroke: var(--danger); stroke-width: 2; }
.lab-svg-label { fill: var(--grey-text); font-size: 12px; font-family: var(--font); }
.lab-svg-label--ink { fill: var(--ink); font-size: 13px; font-family: var(--font); }
@media (prefers-reduced-motion: no-preference) { .lab-anim { transition: transform 400ms var(--ease), opacity 300ms var(--ease); } }

/* ---------- lab-accident-timeline.css ----------------------------------- */
/* Lab: accident-timeline (lesson A1). Scoped to .lab--accident-timeline. */
.lab--accident-timeline .lab__controls { display: block; }
.lab--accident-timeline .at__track { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; row-gap: var(--s-3); }
.lab--accident-timeline .at__item { flex: 1 1 9rem; min-width: 0; border-top: 1px solid var(--ink); }
.lab--accident-timeline .at__case { position: relative; display: grid; gap: 2px; width: 100%; text-align: left; font: inherit; color: var(--grey-text); background: none; border: 0; padding: var(--s-4) var(--s-3) var(--s-3) 0; cursor: pointer; }
.lab--accident-timeline .at__case::before { content: ""; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--paper); border: 1px solid var(--ink); }
.lab--accident-timeline .at__year { font-size: var(--t-m); color: var(--ink); font-variant-numeric: tabular-nums; }
.lab--accident-timeline .at__name { font-size: var(--t-s); }
.lab--accident-timeline .at__case:hover .at__name, .lab--accident-timeline .at__case[aria-pressed="true"] .at__name { color: var(--ink); }
.lab--accident-timeline .at__case[aria-pressed="true"]::before { background: var(--ink); }
.lab--accident-timeline .at__case[aria-pressed="true"] .at__year { font-weight: 500; }
.lab--accident-timeline .at__case:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.lab--accident-timeline .at__chart { margin: 0; max-width: 34rem; display: grid; gap: var(--s-2); }
.lab--accident-timeline .at__detail { display: grid; gap: var(--s-3); max-width: 46em; }
.lab--accident-timeline .at__title { font-size: var(--t-m); font-weight: 500; }
.lab--accident-timeline .at__meta { font-size: var(--t-s); color: var(--grey-text); }
.lab--accident-timeline .at__h { font-size: var(--t-s); font-weight: 400; color: var(--grey-text); margin-top: var(--s-2); }
.lab--accident-timeline .at__chart[hidden] { display: none; }

/* ---------- lab-boat-explorer.css --------------------------------------- */
/* Lab: boat-explorer (lesson A3). Scoped to .lab--boat-explorer. */
.lab--boat-explorer .lab__controls { display: block; }
.lab--boat-explorer .lab__stage { display: grid; gap: var(--s-4); }
.lab--boat-explorer .be__pic { max-width: 44rem; }
.lab--boat-explorer .be__hull { stroke: var(--ink); stroke-width: 1.5; }
.lab--boat-explorer .be__solid.is-on { fill: var(--grey); }
.lab--boat-explorer .is-on { stroke-width: 3; }
.lab--boat-explorer .be__mark circle { fill: var(--paper); stroke: var(--ink); stroke-width: 1.5; }
.lab--boat-explorer .be__mark text { fill: var(--ink); font-size: 14px; font-family: var(--font); font-variant-numeric: tabular-nums; pointer-events: none; }
.lab--boat-explorer .be__mark:hover circle { stroke-width: 2.5; }
.lab--boat-explorer .be__mark.is-on circle { fill: var(--ink); }
.lab--boat-explorer .be__mark.is-on text { fill: var(--paper); }
.lab--boat-explorer .be__mark:focus { outline: none; }
.lab--boat-explorer .be__mark:focus-visible circle { stroke-width: 3; stroke-dasharray: 3 2; }
.lab--boat-explorer .be__parts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr)); border-top: 1px solid var(--rule); }
.lab--boat-explorer .be__parts li { border-bottom: 1px solid var(--rule); }
.lab--boat-explorer .be__part { display: flex; gap: var(--s-3); align-items: baseline; width: 100%; text-align: left; font: inherit; font-size: var(--t-s); color: var(--grey-text); background: none; border: 0; padding: 10px 0; cursor: pointer; }
.lab--boat-explorer .be__part:hover, .lab--boat-explorer .be__part[aria-pressed="true"] { color: var(--ink); }
.lab--boat-explorer .be__part[aria-pressed="true"] .be__n { background: var(--ink); color: var(--paper); }
.lab--boat-explorer .be__part:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.lab--boat-explorer .be__n { display: inline-grid; place-items: center; min-width: 1.6em; height: 1.6em; border: 1px solid var(--ink); border-radius: 50%; color: var(--ink); font-size: 12px; }
.lab--boat-explorer .be__detail { display: grid; gap: var(--s-3); max-width: 46em; }
.lab--boat-explorer .be__title { font-size: var(--t-m); font-weight: 500; }
.lab--boat-explorer .be__dl { margin: 0; display: grid; gap: var(--s-3); }
.lab--boat-explorer .be__dl dt { font-size: var(--t-s); color: var(--grey-text); }
.lab--boat-explorer .be__dl dd { margin: 0; }

/* ---------- lab-boat-fault-spotter.css ---------------------------------- */
/* Lab: boat-fault-spotter (lesson B3). Everything scoped under .lab--boat-fault-spotter. */
.lab--boat-fault-spotter .bfs-svg { cursor: crosshair; touch-action: manipulation; }
.lab--boat-fault-spotter .lab__hot { cursor: crosshair; outline: none; }
.lab--boat-fault-spotter .bfs-hit { fill: transparent; stroke: none; }
.lab--boat-fault-spotter .lab__hot:focus-visible .bfs-hit { stroke: var(--ink); stroke-width: 2; stroke-dasharray: 4 3; }
.lab--boat-fault-spotter .bfs-num { fill: var(--paper); font-size: 11px; font-family: var(--font); }
.lab--boat-fault-spotter .bfs-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: var(--s-3); }
.lab--boat-fault-spotter .lab__list strong { font-weight: 500; }
.lab--boat-fault-spotter .bfs-insets { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: var(--s-3); margin-top: var(--s-3); }
.lab--boat-fault-spotter .bfs-insets .lab__svg { max-width: 16rem; }

/* ---------- lab-drill-planner.css --------------------------------------- */
/* Lesson A6 drill planner. Scoped to .lab--drill-planner. */
.lab--drill-planner .lab-drill__months { margin-top: var(--s-5); }
.lab--drill-planner .lab-drill__month { font-weight: 500; }
.lab--drill-planner .lab-drill__items { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-1); font-size: var(--t-s); }
.lab--drill-planner .lab-drill__items > li { padding-inline-start: var(--s-3); border-inline-start: 1px solid var(--rule); }
.lab--drill-planner h3.lab__label { font-weight: 400; margin: 0; }

/* ---------- lab-falls-checker.css --------------------------------------- */
/* Lab: falls-checker (lesson B6). Everything scoped under .lab--falls-checker. */
.lab--falls-checker .fc-part { display: grid; gap: var(--s-4); border-top: 1px solid var(--rule); padding-top: var(--s-5); }
.lab--falls-checker .fc-title { font-size: var(--t-m); font-weight: 500; }
.lab--falls-checker .fc-actions { display: flex; flex-wrap: wrap; gap: var(--s-3); }
.lab--falls-checker .fc-wire { fill: none; stroke: var(--grey-text); stroke-width: 14; stroke-linejoin: miter; }
.lab--falls-checker .fc-lay { fill: none; stroke: var(--paper); stroke-width: 14; stroke-dasharray: 1.5 6; stroke-linejoin: miter; }
.lab--falls-checker .fc-wire.fc-flat, .lab--falls-checker .fc-lay.fc-flat { stroke-width: 24; }
.lab--falls-checker .fc-lay.fc-flat { stroke-dasharray: 1.5 10; }
.lab--falls-checker .fc-broken { fill: none; stroke: var(--ink); stroke-width: 2.5; stroke-linecap: round; }

/* ---------- lab-fleet-planner.css --------------------------------------- */
/* Lab: fleet-planner (lesson C5). Scoped to .lab--fleet-planner. See docs/ACADEMY.md. */
.lab--fleet-planner .lab__controls { display: grid; grid-template-columns: 1fr; gap: var(--s-4); }
.lab--fleet-planner .lab-fleet__ships { display: grid; gap: var(--s-5); }
.lab--fleet-planner .lab-fleet__ship { margin: 0; padding: var(--s-4) 0 0; border: 0; border-top: 1px solid var(--rule); display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); gap: var(--s-4) var(--s-5); align-items: end; min-width: 0; }
.lab--fleet-planner .lab-fleet__ship > legend { padding: 0; font-weight: 500; float: left; grid-column: 1 / -1; }
.lab--fleet-planner .lab-fleet__ship .lab__btn { justify-self: start; }
.lab--fleet-planner .lab-fleet__add .lab__btn:disabled { opacity: 0.5; cursor: not-allowed; }
.lab--fleet-planner .lab__stage { display: grid; gap: var(--s-5); }
.lab--fleet-planner .lab-fleet__svg { max-width: 44rem; }
.lab--fleet-planner .lab-fleet__table { overflow-x: auto; }
.lab--fleet-planner .lab__table td.num { white-space: nowrap; font-variant-numeric: tabular-nums; }
@media (max-width: 40rem) { .lab--fleet-planner .lab__table td.num { white-space: normal; } }

/* ---------- lab-hook-simulator.css -------------------------------------- */
/* Lesson A4 hook simulator. Scoped to .lab--hook-simulator. */
.lab--hook-simulator .lab-hook__wide { grid-column: 1 / -1; }
.lab--hook-simulator .lab-hook__wide .lab__toggle { margin-top: var(--s-2); }
.lab--hook-simulator .lab-hook__hold { position: relative; overflow: hidden; touch-action: none; user-select: none; -webkit-user-select: none; }
.lab--hook-simulator .lab-hook__hold > span:last-child { position: relative; }
.lab--hook-simulator .lab-hook__bar { position: absolute; inset: auto 0 0 0; height: 3px; background: var(--paper); transform: scaleX(0); transform-origin: left; }
.lab--hook-simulator .lab-hook__hold.is-holding .lab-hook__bar { transform: scaleX(1); transition: transform 1500ms linear; }
.lab--hook-simulator .lab-hook__danger { fill: var(--danger); }
.lab--hook-simulator .lab__btn[aria-pressed="true"] { background: var(--ink); color: var(--paper); opacity: 1; }
@media (prefers-reduced-motion: reduce) { .lab--hook-simulator .lab-hook__hold.is-holding .lab-hook__bar { transition: none; } }
.lab--hook-simulator .lab__svg { max-width: 560px; }
.lab--hook-simulator .lab-svg-label { font-size: 14px; }
.lab--hook-simulator .lab-svg-label--ink { font-size: 15px; }

/* ---------- lab-lowering-speed.css -------------------------------------- */
/* Lab: lowering-speed (lesson B5). Everything scoped under .lab--lowering-speed. */
.lab--lowering-speed .ls-part { display: grid; gap: var(--s-4); border-top: 1px solid var(--rule); padding-top: var(--s-5); }
.lab--lowering-speed .ls-title { font-size: var(--t-m); font-weight: 500; }
.lab--lowering-speed .ls-actions { display: flex; flex-wrap: wrap; gap: var(--s-3); }
.lab--lowering-speed .ls-chart, .lab--lowering-speed .ls-scene { max-width: 40rem; }
.lab--lowering-speed .ls-scene text { font-size: 18px; }

/* ---------- lab-psc-inspection.css -------------------------------------- */
/* Lab: psc-inspection (lesson C4). Scoped to .lab--psc-inspection. See docs/ACADEMY.md. */
.lab--psc-inspection .lab-psc__card { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: var(--s-5); align-items: start; }
.lab--psc-inspection .lab-psc__pic { max-width: 11rem; border-top: 1px solid var(--rule); padding-top: var(--s-2); }
.lab--psc-inspection .lab-psc__body { display: grid; gap: var(--s-4); min-width: 0; }
.lab--psc-inspection .lab-psc__scene { font-size: var(--t-m); line-height: 1.35; max-width: 34em; }
.lab--psc-inspection .lab-psc__scene:focus { outline: none; }
.lab--psc-inspection .lab-psc__scene:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
.lab--psc-inspection .lab__choice { flex-direction: column; width: 100%; max-width: 32rem; }
.lab--psc-inspection .lab__seg { text-align: left; border-inline-end: 0; border-bottom: 1px solid var(--rule); padding: 10px 12px; }
.lab--psc-inspection .lab__seg:last-child { border-bottom: 0; }
.lab--psc-inspection .lab-psc__why { display: grid; gap: var(--s-2); max-width: 40em; }
.lab--psc-inspection .lab-psc__why:empty { display: none; }
.lab--psc-inspection .lab-psc__nav { display: flex; gap: var(--s-3); flex-wrap: wrap; }
.lab--psc-inspection .lab__list { counter-reset: none; padding-inline-start: 0; }
.lab--psc-inspection .lab__list:focus { outline: none; }
@media (max-width: 40rem) {
  .lab--psc-inspection .lab-psc__card { grid-template-columns: 1fr; }
  .lab--psc-inspection .lab-psc__pic { max-width: 9rem; }
}
.lab--psc-inspection .lab__stage { display: grid; gap: var(--s-5); }

/* ---------- lab-release-tests.css --------------------------------------- */
/* Lab: release-tests (lesson B4). Everything scoped under .lab--release-tests. */
.lab--release-tests .rt-actions { align-self: end; display: flex; flex-wrap: wrap; gap: var(--s-3); }
.lab--release-tests .rt-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.lab--release-tests .rt-step { display: grid; grid-template-columns: 2rem 1fr auto; gap: var(--s-3); align-items: start; padding-block: var(--s-3); border-bottom: 1px solid var(--rule); }
.lab--release-tests .rt-step.is-wrong { border-inline-start: 2px solid var(--danger); padding-inline-start: var(--s-2); }
.lab--release-tests .rt-step.is-right { border-inline-start: 2px solid var(--ink); padding-inline-start: var(--s-2); }
.lab--release-tests .rt-num { font-size: var(--t-m); line-height: 1.2; color: var(--grey-text); }
.lab--release-tests .rt-body { display: grid; gap: var(--s-1); min-width: 0; }
.lab--release-tests .rt-move { display: flex; border: 1px solid var(--rule); border-radius: var(--radius); overflow: hidden; }
.lab--release-tests .rt-move .lab__seg { min-width: 44px; min-height: 44px; font-size: var(--t-body); }
.lab--release-tests .rt-move .lab__seg:disabled { color: var(--rule); cursor: default; }
.lab--release-tests .rt-mistakes { display: grid; gap: var(--s-3); }
.lab--release-tests .rt-mistakes strong { font-weight: 500; }

/* ---------- lab-report-compare.css -------------------------------------- */
/* Lab: report-compare (lesson C6). Scoped to .lab--report-compare. See docs/ACADEMY.md. */
.lab--report-compare .lab__controls { grid-template-columns: 1fr; }
.lab--report-compare .lab-rc__reports { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-6); }
.lab--report-compare .lab-rc__report { border-top: 1px solid var(--ink); padding-top: var(--s-3); display: grid; gap: var(--s-2); align-content: start; min-width: 0; }
.lab--report-compare .lab-rc__name { font-size: var(--t-m); font-weight: 500; }
.lab--report-compare .lab-rc__rows { margin: 0; }
.lab--report-compare .lab-rc__row { display: grid; gap: 2px; padding-block: var(--s-2); border-bottom: 1px solid var(--rule); font-size: var(--t-s); }
.lab--report-compare .lab-rc__row dt { color: var(--grey-text); }
.lab--report-compare .lab-rc__row dd { margin: 0; overflow-wrap: anywhere; }
.lab--report-compare .lab-rc__row dd.is-bad { color: var(--danger); }
.lab--report-compare .lab-rc__row dd.is-bad::before { content: "Problem: "; font-weight: 500; }
.lab--report-compare .lab-rc__spot { max-width: 40em; }
.lab--report-compare .lab__list > li strong { font-weight: 500; }
@media (max-width: 40rem) { .lab--report-compare .lab-rc__reports { grid-template-columns: 1fr; gap: var(--s-5); } }

/* ---------- lab-rulebook-map.css ---------------------------------------- */
/* Lab: rulebook-map (lesson A2). Scoped to .lab--rulebook-map. */
/* Phones: questions, then the answer, then the map. Wide screens: questions and answer left, map right. */
.lab.lab--rulebook-map { grid-template-areas: "head" "controls" "out" "stage"; }
.lab--rulebook-map > .lab__head { grid-area: head; }
.lab--rulebook-map > .lab__controls { grid-area: controls; display: block; }
.lab--rulebook-map > .lab__out { grid-area: out; }
.lab--rulebook-map > .lab__stage { grid-area: stage; max-width: 26rem; }
@media (min-width: 760px) {
  .lab.lab--rulebook-map { grid-template-columns: minmax(0, 1fr) minmax(0, 26rem); grid-template-areas: "head head" "controls stage" "out stage"; column-gap: var(--s-6); align-items: start; }
}
.lab--rulebook-map .rm__questions { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.lab--rulebook-map .rm__questions li { border-bottom: 1px solid var(--rule); }
.lab--rulebook-map .rm__q { width: 100%; text-align: left; font: inherit; font-size: var(--t-s); color: var(--grey-text); background: none; border: 0; padding: 10px 0 10px var(--s-3); border-inline-start: 2px solid transparent; cursor: pointer; }
.lab--rulebook-map .rm__q:hover { color: var(--ink); }
.lab--rulebook-map .rm__q[aria-pressed="true"] { color: var(--ink); border-inline-start-color: var(--ink); }
.lab--rulebook-map .rm__q:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.lab--rulebook-map .rm__box { fill: var(--paper); stroke: var(--rule); stroke-width: 1; }
.lab--rulebook-map .rm__name { fill: var(--ink); font-size: 13px; font-family: var(--font); }
.lab--rulebook-map .rm__status { fill: var(--grey-text); font-size: 11px; font-family: var(--font); }
.lab--rulebook-map .rm__doc:hover .rm__box { stroke: var(--ink); }
.lab--rulebook-map .rm__doc.is-also .rm__box { stroke: var(--ink); stroke-dasharray: 4 3; }
.lab--rulebook-map .rm__doc.is-on .rm__box { fill: var(--ink); stroke: var(--ink); }
.lab--rulebook-map .rm__doc.is-on .rm__name, .lab--rulebook-map .rm__doc.is-on .rm__status { fill: var(--paper); }
.lab--rulebook-map .rm__doc:focus { outline: none; }
.lab--rulebook-map .rm__doc:focus-visible .rm__box { stroke: var(--ink); stroke-width: 3; }
.lab--rulebook-map .rm__answer { display: grid; gap: var(--s-2); max-width: 46em; }
.lab--rulebook-map .rm__label { font-size: var(--t-s); color: var(--grey-text); }
.lab--rulebook-map .rm__para { font-size: var(--t-m); font-weight: 500; }
.lab--rulebook-map .rm__doc-about { color: var(--grey-text); }
@media (prefers-reduced-motion: no-preference) { .lab--rulebook-map .rm__box { transition: fill 200ms var(--ease), stroke 200ms var(--ease); } }

/* ---------- lab-weekly-walkround.css ------------------------------------ */
/* Lesson A5 weekly walk-round. Scoped to .lab--weekly-walkround. */
.lab--weekly-walkround .lab__list > li { gap: var(--s-2); }
.lab--weekly-walkround .lab__list > li > .lab__field { max-width: 22rem; }
.lab--weekly-walkround .lab-walk__log { font-size: var(--t-s); white-space: pre-wrap; min-height: 14rem; background: var(--field); }
.lab--weekly-walkround [hidden] { display: none; }