/* 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; }