/* Light instrument panels inspired by WINDROSE: large figures, fine rules,
   true-wind ochre and apparent-wind blue. One layout for every chapter. */
:root{--left-rail:clamp(220px,18vw,280px);--right-rail:clamp(210px,17vw,264px);--rail-surface:#f5f6eff2;--ink:#263d4c;--muted:#637782}
.edge-grid .left-rail,.edge-grid .right-rail{width:var(--left-rail);background:var(--rail-surface);border-color:#ffffffb0;backdrop-filter:blur(14px)}
.edge-grid .right-rail{width:var(--right-rail);overflow:hidden;padding-bottom:64px}
.edge-grid .left-rail{overflow-y:auto}
.left-rail>.header-actions{display:grid;grid-template-columns:1fr 1fr 32px;padding:8px 12px;gap:3px;border-bottom:1px solid var(--line)}
.left-rail>.header-actions button{font-size:10px;padding:7px 3px;min-width:0;background:transparent}
.edge-grid .left-rail>.controls{position:static;display:block;width:100%;padding:14px 16px;overflow:visible;max-height:none;background:none;border:0;flex:none}
.edge-grid .left-rail>.controls[hidden]{display:none}
.edge-grid .left-rail>.compass{position:static;width:100%;padding:12px;transform:none;background:none;border-top:1px solid var(--line);display:flex;flex:none}
.edge-grid .left-rail>.compass svg{width:128px;height:128px}
.edge-grid .left-rail>.compass .compass-caption{font-size:12px;margin-top:-10px}
.compass-heading b{font-size:18px;font-weight:650;display:block}
.edge-grid .left-rail>.views{background:#f5f6effa}
.edge-grid .right-rail .data-stack>.wind-instrument,.edge-grid .right-rail .data-stack>.instruments{position:static;inset:auto;width:100%;padding:18px 20px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;flex:none;box-shadow:none}
.edge-grid .right-rail .data-stack>.wind-instrument{display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 10px}
.right-rail .wind-instrument>.eyebrow{grid-column:1/-1;color:#927038}
.right-rail #wind-dial{text-align:left;display:flex;align-items:baseline;gap:6px}
.right-rail #wind-dial strong,.edge-grid .right-rail .speed-number{font-size:58px;line-height:1.05;letter-spacing:-.055em;font-weight:650;font-variant-numeric:tabular-nums}
.right-rail .wind-lower{display:grid;grid-template-columns:28px 28px;gap:5px;margin:0;font-size:11px}
.right-rail .wind-lower b{grid-column:1/-1;grid-row:2;text-align:center;font-size:10px;letter-spacing:.1em}
.right-rail .wind-lower button{min-width:28px;min-height:28px;padding:0;background:#e7edeb;border:0;border-radius:5px}
.edge-grid .right-rail .wind-angles{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);padding-top:12px;margin-top:14px}
.edge-grid .right-rail .wind-angle{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.edge-grid .right-rail .wind-angle>span{font-size:11px;letter-spacing:.16em;font-weight:700}
.edge-grid .right-rail .wind-angle strong{font-size:33px;letter-spacing:-.04em}
.right-rail .readings{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.right-rail .readings>div:last-child{display:none}
.right-rail .reading-label{font-size:9px;letter-spacing:.14em;text-transform:uppercase}
.edge-grid .right-rail .reading-value{font-size:32px;font-weight:600;letter-spacing:-.04em}
.right-rail .extra-readings{display:grid;gap:5px;text-transform:uppercase;font-size:9px;letter-spacing:.06em}.extra-readings span{display:flex;justify-content:space-between}.voice-note{font-size:10px!important;color:#93653b!important}
.right-rail .instrument-note{display:none}
.right-rail .snapshot-button{font-size:10px}
.edge-grid .right-rail>.weather-toggle{position:absolute;inset:auto 0 0;width:100%;height:64px;margin:0;padding:10px;z-index:30;order:10;border-top:1px solid var(--line);display:flex;justify-content:center;background:#edf1e9;font-size:12px;gap:9px}
.scene-cog{font-size:30px;line-height:1}
.edge-grid .right-rail>.weather-panel{position:absolute;inset:0 0 64px;width:100%;max-height:none;padding:16px;z-index:25;background:#f5f6ef;transform:translateY(calc(100% + 64px));transition:transform .32s ease,visibility 0s linear .32s;visibility:hidden;border-radius:0;overflow:auto;box-shadow:none}
.edge-grid .right-rail.scene-open>.weather-panel{transform:translateY(0);visibility:visible;transition-delay:0s}
.right-rail.scene-open>.data-stack{visibility:hidden}
#weather-panel .weather-readings,#weather-panel #layers-toggle,.footer-tools{display:none}
#weather-panel #layer-panel{position:static;display:block;width:100%;padding:10px 0;max-height:none;background:none;border:0;box-shadow:none;backdrop-filter:none}
#layer-panel h3{font-size:15px;margin:8px 0}
#layer-panel label,.preference-toggle,.smoke-toggle{display:flex;align-items:center;gap:9px;font-size:11px;padding:7px 0}
#layer-panel .compact-preferences{display:none}
input.toggle-input[type=checkbox]{appearance:none!important;display:inline-block;width:32px!important;height:18px!important;min-width:32px;border:0!important;border-radius:12px;background:#abb6b7;position:relative;cursor:pointer;vertical-align:middle;transition:background .18s;padding:0!important;margin:0;flex:none}
input.toggle-input:before{content:'';position:absolute;width:12px;height:12px;left:3px;top:3px;border-radius:50%;background:white;box-shadow:0 1px 3px #263d4c44;transition:transform .18s}
input.toggle-input:checked{background:#427c77}input.toggle-input:checked:before{transform:translateX(14px)}input.toggle-input:focus-visible{outline:2px solid var(--selection-outline);outline-offset:3px}
.edge-grid .choice-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;overflow:visible;scroll-snap-type:none}
.edge-grid .choice-card{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;width:auto;padding:7px 2px;min-height:66px;flex:auto;border:1px solid #c4cecc;border-radius:5px;background:#ffffff66}
.edge-grid .choice-card.selected{background:#e0ece6;border-color:var(--selection-outline);box-shadow:inset 0 0 0 1px var(--selection-outline)}
.edge-grid .choice-card .sail-icon,.edge-grid .choice-card.selected .sail-icon{display:block;width:28px;height:28px;margin:0}
.edge-grid .choice-card span{font-size:9px;line-height:1.2;white-space:normal;text-align:center;margin-top:5px}
.choice-card i,.swipe-cue,.choice-hint{display:none}
.lesson-controls-note{font-size:10px;color:var(--muted);line-height:1.4;margin:6px 0 14px}
.wheel-control{border:1px solid #c4cecc!important;background:#ffffff70;padding:10px!important;border-radius:8px}
.wheel-control .helm{width:126px;height:126px;margin:5px auto}
.wheel-control .wheel-actions{gap:3px}.wheel-control .wheel-actions button{font-size:9px;padding:5px 4px}.autopilot-switch{font-size:11px!important}.wheel-control #wheel-help{font-size:9px;line-height:1.4}
.control[data-control$=Sheet]{min-height:110px}.trim-tag{min-height:18px}.trim-tag[hidden]{display:block!important;visibility:hidden}
#subject-controls{position:fixed;inset:16px calc(var(--right-rail) + 12px) auto auto!important;left:auto!important;width:auto!important;max-width:240px;max-height:calc(100dvh - 32px);display:block;overflow:visible;z-index:8;pointer-events:none}
#subject-controls[hidden]{display:none!important}
.rope-card{padding:14px 10px 10px;border-radius:9px;background:#f5f6efd9;border:1px solid #ffffffe0;backdrop-filter:blur(12px);box-shadow:0 8px 28px #2a506014;pointer-events:auto}
.rope-card header{display:flex;flex-direction:column;padding:0 4px 10px;border-bottom:1px solid var(--line)}
.rope-card header b{font-size:10px;letter-spacing:.16em}.rope-card header span{font-size:9px;color:var(--muted)}
.rope-bank{display:flex;gap:6px;padding-top:12px}.rope-lane{width:46px;display:flex;flex-direction:column;align-items:center;position:relative}
.rope-lane label{font-size:9px;text-align:center;height:30px;line-height:1.25;max-width:52px}.rope-lane output{font-size:12px;font-variant-numeric:tabular-nums;height:24px}
.rope-grip{width:44px;height:clamp(170px,39vh,390px);position:relative;overflow:hidden;cursor:ns-resize;touch-action:none;border-radius:20px;background:linear-gradient(90deg,transparent,#c5d1ce33,transparent)}
.rope-grip svg{width:40px;height:125%;position:absolute;top:-12%;transform:translateY(calc(var(--sheet) * -24px));transition:transform .1s linear;overflow:visible}
.rope-grip path{fill:none;stroke-linecap:round}.rope-shadow{stroke:#183c4a29;stroke-width:10;transform:translateX(2px)}.rope-core{stroke:var(--rope);stroke-width:7}.rope-flecks{stroke:#fff6de;stroke-width:3;stroke-dasharray:2 7;opacity:.85}
.rope-marker{position:absolute;left:3px;right:3px;height:16px;top:calc((1 - var(--sheet)) * (100% - 16px));border:1px solid var(--rope);border-radius:5px;background:#ffffff55;pointer-events:none}
.rope-trim{font-size:8px;color:#367664;text-align:center;min-height:28px;line-height:1.2;padding-top:6px}.rope-trim[hidden]{display:block!important;visibility:hidden}
.rope-card footer{display:flex;justify-content:space-between;gap:8px;font-size:8px;margin-top:8px;border-top:1px solid var(--line);padding-top:8px}
.tutor-modal{position:fixed!important;inset:auto auto 24px calc(var(--left-rail) + 16px)!important;width:210px!important;max-height:34vh;overflow:auto;z-index:10;background:#fafbf3ee!important;border:1px solid #ffffffb0;border-radius:8px!important;padding:14px!important;box-shadow:0 7px 25px #2544541a}
.tutor-modal[hidden]{display:none!important}.tutor-modal .eyebrow{font-size:9px;letter-spacing:.1em;display:block}.tutor-modal p{font-size:12px;line-height:1.45;margin:9px 0 0}.coach-head{align-items:flex-start}.coach-head #coach-close{font-size:21px;line-height:1;padding:0 2px}
.smoke-choices{gap:4px}.smoke-choices button{padding:6px 2px;font-size:9px;min-width:0}.smoke-choices button svg{display:none}.smoke-choices small{font-size:8px}
.large-helm{position:fixed;bottom:0;left:calc(var(--left-rail) + 8px);right:calc(var(--right-rail) + 8px);height:100px;overflow:hidden;z-index:9;pointer-events:none!important}
.large-helm[hidden]{display:none!important}#large-wheel{position:absolute;left:50%;top:0;width:1600px;height:1600px;transform:translateX(-50%);cursor:ew-resize;touch-action:none;pointer-events:auto}#large-wheel svg{width:100%;height:100%}#large-rudder{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.12em;padding:5px 12px;background:#f5f6efe0;border-radius:4px;white-space:nowrap}
.instrument-lab{margin:0;padding:12px;overflow:hidden;flex:none}.instrument-face,.digital-instruments>div{background:#e7efea;border:1px solid #c4cecc;color:var(--ink);box-shadow:none;border-radius:5px}.instrument-face circle:first-child{fill:#f5f6ef;stroke:#587583}.instrument-face span{background:#f5f6ef;color:var(--ink)}.instrument-face .ticks path{stroke:#647c83}.wind-speed-pair{color:var(--ink)}.instrument-face text{fill:#263d4c}.digital-instruments strong{color:#263d4c}.instrument-face .boat-symbol{fill:#638979}.true-read b{color:#977034}.apparent-read b{color:#3475a0}
.right-rail .instrument-face svg{height:105px!important}.right-rail .digital-instruments>div{min-height:55px}.right-rail .digital-instruments strong{font-size:15px}
.force-legend{left:50%;top:12px;max-width:calc(100% - var(--left-rail) - var(--right-rail) - 180px);font-size:9px}
.drift-key{position:fixed;left:calc(var(--left-rail) + 18px);top:18px;width:210px;background:#f5f6efdf;padding:10px 14px;border-radius:6px;font-size:11px;z-index:8}.drift-key span{display:block;padding:3px 0}.drift-key span:first-child{color:#527f7a}
@media(max-height:780px){.edge-grid .right-rail .data-stack>.wind-instrument,.edge-grid .right-rail .data-stack>.instruments{padding:12px 16px}.right-rail #wind-dial strong,.edge-grid .right-rail .speed-number{font-size:45px}.right-rail .wind-angles{margin-top:8px!important;padding-top:8px!important}.right-rail .wind-angle strong{font-size:28px!important}.right-rail .reading-value{font-size:25px!important}.right-rail #speed-trace{height:16px}.right-rail .snapshot-button{padding:4px}}
@media(max-width:1100px){:root{--left-rail:200px;--right-rail:180px}.tutor-modal{width:185px!important}.rope-lane{width:38px}.rope-bank{gap:2px}.rope-card{padding:10px 6px}.edge-grid .left-rail{width:var(--left-rail)}.edge-grid .right-rail{width:var(--right-rail)}}
@media(max-width:760px){:root{--left-rail:132px;--right-rail:122px}.edge-grid .left-rail{width:var(--left-rail)}.edge-grid .right-rail{width:var(--right-rail);padding-bottom:52px}.left-rail>.header-actions{grid-template-columns:1fr 30px;padding:5px;gap:2px}.left-rail>.header-actions #open-voyages{grid-column:1/-1}.left-rail>.header-actions button{font-size:8px}.edge-grid .left-rail>.controls{padding:9px}.edge-grid .choice-track{grid-template-columns:repeat(2,minmax(0,1fr))}.edge-grid .choice-card{min-height:60px}.edge-grid .choice-card span{font-size:8px}.edge-grid .left-rail>.compass svg{width:100px;height:100px}.edge-grid .right-rail .data-stack>.wind-instrument,.edge-grid .right-rail .data-stack>.instruments{padding:10px}.right-rail #wind-dial strong,.edge-grid .right-rail .speed-number{font-size:35px}.right-rail .wind-lower{grid-template-columns:22px 22px;gap:2px}.right-rail .wind-lower button{min-width:22px;min-height:26px}.right-rail .wind-instrument{gap:0 3px!important}.edge-grid .right-rail .wind-angles{gap:4px}.edge-grid .right-rail .wind-angle strong{font-size:22px!important}.edge-grid .right-rail .wind-angle>span{font-size:9px}.right-rail .reading-label{font-size:7px}.edge-grid .right-rail .reading-value{font-size:22px!important}.right-rail .readings{gap:5px}.edge-grid .right-rail>.weather-toggle{height:52px;font-size:9px;gap:4px}.scene-cog{font-size:23px}.edge-grid .right-rail>.weather-panel{bottom:52px;padding:10px}.wheel-control .helm{width:95px;height:95px}.wheel-control{padding:6px!important}.autopilot-switch{font-size:9px!important}.autopilot-switch b{display:none}.autopilot-actions button{font-size:6px}.lesson-controls-note{font-size:9px}.rope-grip{height:160px;width:30px}.rope-grip svg{width:30px}.rope-lane{width:30px}.rope-lane label{font-size:7px}.rope-card header span{font-size:7px}.rope-card header b{font-size:8px}.rope-card footer{font-size:7px}.tutor-modal{inset:auto auto 10px 10px!important;width:calc(100% - var(--right-rail) - 20px)!important;max-height:25vh;padding:10px!important}.tutor-modal p{font-size:10px}.tutor-modal .eyebrow{font-size:8px}.large-helm{height:78px}#large-wheel{width:1200px;height:1200px}#large-rudder{font-size:8px}.drift-key{width:150px;font-size:9px}}
@media(max-width:520px){#subject-controls{top:auto!important;bottom:125px!important;right:calc(var(--right-rail) + 4px)!important;max-width:calc(100% - var(--left-rail) - var(--right-rail) - 8px)}.rope-card{padding:7px 2px}.rope-bank{flex-wrap:wrap;justify-content:center;gap:6px 0}.rope-grip{height:90px}.rope-lane{width:30px}.rope-lane label{height:24px}.rope-lane output{font-size:9px;height:17px}.rope-trim{font-size:6px;min-height:18px}.rope-card header span{display:none}.rope-card footer{flex-direction:column;gap:0}.force-legend{display:none}.right-rail .instrument-face svg{height:78px!important}.right-rail .digital-instruments{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.weather-panel,.toggle-input:before,.rope-grip svg{transition:none!important}}
/* Focus the visible arc, not a 1600px off-screen element: focusing the latter
   scrolls even an overflow:hidden container in Chromium. */
#large-wheel{inset:0;width:100%;height:100%;transform:none}
#large-wheel svg{position:absolute;top:0;left:50%;width:1600px;height:1600px;max-width:none;transform:translateX(-50%);pointer-events:none}
#large-helm:not([hidden])~#airflow-key{bottom:112px}
@media(max-width:760px){#large-wheel{width:100%;height:100%}#large-wheel svg{width:1200px;height:1200px}}

.data-stack{min-height:0;flex:1;overflow-y:auto;scrollbar-width:thin}.theory-mode .right-rail .instruments{display:block}.data-stack>.instrument-lab{flex:none}.principles-mode .right-rail .wind-instrument{display:none}
.rope-grip svg{inset:0;width:100%;height:100%;transform:none;transition:none}
.rope-marker{top:calc(5% + (1 - var(--sheet)) * 90%);transform:translateY(-50%)}
@media(max-width:520px){#airflow-key{display:none}}
/* Wind-router typography and fine, compact menu treatments (reference repo read only). */
@font-face{font-family:'Fira Sans Condensed';font-style:normal;font-weight:300;font-display:swap;src:url('./assets/fonts/fira-sans-condensed-300.ttf') format('truetype')}
@font-face{font-family:'Fira Sans Condensed';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/fira-sans-condensed-400.ttf') format('truetype')}
@font-face{font-family:'Fira Sans Condensed';font-style:normal;font-weight:600;font-display:swap;src:url('./assets/fonts/fira-sans-condensed-600.ttf') format('truetype')}
:root{--font:'Fira Sans Condensed','Fira Sans',system-ui,sans-serif;--ink:#243c4b;--muted:#647581;--rail-surface:#f7f9f6f5;--line:#d2dae3;--helm-width:208px}
body,h1,h2,h3,.serif,.chapter-number,.speed-number,.compass text{font-family:var(--font);font-weight:300;-webkit-font-smoothing:antialiased}
button,input,select{font-family:var(--font);font-weight:400}button{border-radius:4px}.eyebrow{font-weight:400;letter-spacing:.12em}
.edge-grid .brand-name{font-size:24px;font-weight:400;letter-spacing:.14em}.edge-grid .brand-sub{font-size:10px;font-weight:300;letter-spacing:.09em}
.edge-grid .mission h1{font-size:25px;font-weight:400;line-height:1.1;letter-spacing:-.015em}.edge-grid .chapter-number{font-size:14px;font-weight:400}
.left-rail>.header-actions button{font-size:12px;font-weight:400;padding:8px 3px}.lesson-controls-note{font-size:12px;line-height:1.35;font-weight:300}
.edge-grid .choice-card{border-color:#d2dae3;background:#fff9;border-radius:4px;min-height:63px}.edge-grid .choice-card.selected{background:#e9f1f5;border-color:var(--selection-outline);box-shadow:none;color:#0a3d62}.edge-grid .choice-card span{font-size:12px;font-weight:300}.edge-grid .control>label{font-size:13px;font-weight:400}
.boat-tabs button{font-weight:400;font-size:12px}.tutor-modal p{font-size:13px;font-weight:300}.weather-title h3{font-size:22px;font-weight:400}#layer-panel label,.preference-toggle,.smoke-toggle{font-size:13px;font-weight:300}
.edge-grid .right-rail .data-stack>.wind-instrument{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;padding:20px}
.wind-pair{min-width:0}.wind-pair>.eyebrow{font-size:12px;letter-spacing:.14em}.true-wind{color:#86642b}.apparent-wind{color:#245e85}
.right-rail #wind-dial,.right-rail .wind-speed{display:flex;align-items:baseline;gap:4px;margin:4px 0 18px;line-height:1}
.right-rail #wind-dial strong,.right-rail .wind-speed strong{font-size:49px!important;line-height:1;font-weight:400;letter-spacing:-.045em;font-variant-numeric:tabular-nums}.right-rail #wind-dial span,.wind-speed span{font-size:14px;font-weight:300}
.edge-grid .right-rail .wind-angle{gap:5px;border-top:1px solid #d2dae3;padding-top:12px}.edge-grid .right-rail .wind-angle>span{font-size:12px;font-weight:400;letter-spacing:.14em}.edge-grid .right-rail .wind-angle strong{font-size:39px!important;font-weight:400;line-height:1.15}
.wind-adjust{grid-column:1/-1;display:flex;align-items:center;gap:5px;margin-top:16px;border-top:1px solid var(--line);padding-top:10px;font-size:11px;color:var(--muted)}.wind-adjust>span{margin-right:auto}.wind-adjust button{width:28px;height:26px;min-height:0;padding:0;font-size:19px;line-height:1;background:#e9eff1;border:0}.wind-adjust b{font-size:12px;font-weight:400;letter-spacing:.06em;margin-left:5px}
.edge-grid .right-rail .speed-number{font-size:51px;font-weight:400}.edge-grid .right-rail .reading-value{font-size:30px;font-weight:400}.right-rail .extra-readings{font-size:11px;font-weight:300}.extra-readings b{font-weight:400}
.edge-grid .right-rail>.compass{position:static;inset:auto;width:100%;padding:10px 16px 5px;transform:none;background:#f7f9f6;display:grid;grid-template-columns:1fr 100px;align-items:center;flex:none;border-top:1px solid var(--line);min-height:125px}
.right-rail .compass svg{width:100px;height:100px;grid-column:2;grid-row:1/3}.right-rail .compass-heading{font-size:12px;text-align:left}.right-rail .compass-heading b{font-size:23px;font-weight:400;margin-top:4px}.right-rail .compass-caption{margin:0;text-align:left;font-size:11px;grid-column:1}.right-rail .compass[hidden]{display:none!important}
#subject-controls{width:var(--helm-width)!important;max-width:var(--helm-width);max-height:calc(100dvh - 235px)}.rope-card{border-radius:4px;padding:12px;background:#f7f9f6ed}.rope-bank{justify-content:space-around}.rope-lane label{font-size:11px;font-weight:400}.rope-lane output{font-size:15px;font-weight:400}.rope-grip{height:clamp(95px,calc(100dvh - 425px),350px)}.rope-card header b{font-weight:400;font-size:11px}.rope-card header span{font-size:11px}.rope-card footer{font-size:10px}.rope-trim{font-size:10px}
.helm-dock{position:fixed;right:calc(var(--right-rail) + 12px);bottom:16px;width:var(--helm-width);z-index:11;pointer-events:auto}.helm-dock[hidden]{display:none}.helm-dock .wheel-control{display:grid;grid-template-columns:64px 1fr;gap:7px;margin:0;padding:12px!important;border:1px solid #fff!important;border-radius:4px;background:#f7f9f6ed;backdrop-filter:blur(12px)}
.helm-dock .wheel-control>label,.helm-dock .autopilot-actions{grid-column:1/-1;margin:0}.helm-dock .wheel-control>label:first-child{font-size:12px;font-weight:400}.helm-dock .autopilot-switch{font-size:14px!important}.helm-dock .autopilot-switch b{font-size:9px;font-weight:400}.helm-dock .autopilot-actions{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}.helm-dock .autopilot-actions[hidden]{display:none}.helm-dock .autopilot-actions button{font-size:11px;padding:6px 1px}.helm-dock .helm{width:64px;height:64px;margin:0;grid-column:1}.helm-dock .wheel-actions{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.helm-dock .wheel-actions button{font-size:10px;padding:5px}.helm-dock #wheel-help{display:none}.helm-dock .wheel-control .control-note{display:none}
.large-helm{right:calc(var(--right-rail) + var(--helm-width) + 28px)}#large-wheel svg{filter:drop-shadow(0 5px 5px #16324180)}
@media(max-width:1100px){:root{--helm-width:174px}.right-rail #wind-dial strong,.right-rail .wind-speed strong{font-size:36px!important}.edge-grid .right-rail .data-stack>.wind-instrument{padding:14px;gap:0 12px}.edge-grid .right-rail .wind-angle strong{font-size:30px!important}.right-rail .compass-heading b{font-size:19px}.edge-grid .right-rail>.compass{grid-template-columns:1fr 75px;padding:10px}.right-rail .compass svg{width:75px;height:75px}.wind-adjust{gap:3px}.wind-adjust button{width:22px}.wind-adjust b{font-size:10px}.rope-lane{width:34px}}
@media(max-width:760px){:root{--helm-width:120px}.edge-grid .brand-name{font-size:18px}.edge-grid .mission h1{font-size:19px}.left-rail>.header-actions button{font-size:10px}.edge-grid .choice-card span{font-size:10px}.edge-grid .right-rail .data-stack>.wind-instrument{padding:10px;gap:0 7px}.right-rail #wind-dial strong,.right-rail .wind-speed strong{font-size:29px!important}.right-rail #wind-dial span,.wind-speed span{font-size:10px}.edge-grid .right-rail .wind-angle strong{font-size:26px!important}.wind-pair>.eyebrow,.edge-grid .right-rail .wind-angle>span{font-size:10px}.wind-adjust{flex-wrap:wrap;margin-top:9px;padding-top:7px}.wind-adjust>span{font-size:9px}.wind-adjust b{flex-basis:100%;text-align:right}.edge-grid .right-rail>.compass{display:flex;flex-direction:column;padding:7px;min-height:155px}.right-rail .compass svg{width:88px;height:88px}.right-rail .compass-heading{font-size:11px;text-align:center}.right-rail .compass-heading b{font-size:18px;margin:0}.right-rail .compass-caption{font-size:10px}.helm-dock{right:calc(var(--right-rail) + 4px);bottom:12px}.helm-dock .wheel-control{padding:7px!important;grid-template-columns:40px 1fr;gap:5px}.helm-dock .helm{width:40px;height:40px}.helm-dock .autopilot-actions{grid-template-columns:repeat(2,1fr)}.helm-dock .autopilot-actions #tack-course{grid-column:1/-1;grid-row:3}.helm-dock .autopilot-actions button{padding:3px}.helm-dock .wheel-actions button{padding:1px;font-size:8px}.helm-dock .autopilot-switch{font-size:12px!important}.helm-dock .autopilot-switch b{display:none}.rope-lane{width:30px}.rope-lane label{font-size:9px}.rope-lane output{font-size:12px}.rope-card{padding:6px}.rope-trim{font-size:8px}.rope-card footer{font-size:8px}.large-helm{right:calc(var(--right-rail) + 8px);bottom:220px;height:68px}.tutor-modal{bottom:auto!important;top:16px!important;left:calc(var(--left-rail) + 5px)!important;width:calc(100% - var(--left-rail) - var(--right-rail) - 10px)!important;max-height:25vh}#subject-controls{top:27vh!important;bottom:auto!important;max-height:calc(73vh - 245px)}.rope-grip{height:clamp(65px,calc(73vh - 375px),160px)}}
.edge-grid .right-rail>.compass svg{width:100px!important;height:100px!important;min-width:0;max-width:100%}.right-rail .compass-heading{min-width:0}
@media(max-width:1100px){.edge-grid .right-rail>.compass svg{width:75px!important;height:75px!important}}
@media(max-width:760px){.edge-grid .right-rail>.compass svg{width:88px!important;height:88px!important}}
.principles-mode .edge-grid .right-rail .data-stack>.wind-instrument,.principles-mode .edge-grid .right-rail>.compass{display:none}
@media(min-width:761px) and (max-height:850px){.rope-grip{height:clamp(95px,calc(100dvh - 490px),350px)}}
@media(max-width:520px){#subject-controls{top:42vh!important}.rope-grip{height:80px}.rope-card header{padding-bottom:5px}.rope-bank{padding-top:6px}.rope-lane label{height:24px}.rope-card footer{margin-top:4px;padding-top:4px}.tutor-modal{max-height:19vh!important}.right-rail #wind-dial strong,.right-rail .wind-speed strong{font-size:25px!important}.right-rail #wind-dial,.right-rail .wind-speed{gap:2px}.right-rail #wind-dial span,.wind-speed span{font-size:9px}}
/* Windrose instrument hierarchy, adapted to the light cockpit palette. */
.instruments-mode .instrument-lab{padding:12px 14px;border-bottom:1px solid var(--line)}
.instruments-mode .instrument-face{padding:0;background:transparent;border:0;border-radius:0}
.instruments-mode .right-rail .instrument-face svg{display:block;width:100%;height:auto!important;max-height:245px}
.instrument-face .windrose-dial circle{stroke-width:.35;fill:none;stroke:#789099}
.instrument-face .windrose-dial .dial-field,.instrument-face .windrose-dial .dial-hub{fill:#f5f6ef}
.instrument-face .windrose-dial .port-sector{fill:none;stroke:#c74843;stroke-width:6}
.instrument-face .windrose-dial .starboard-sector{fill:none;stroke:#299966;stroke-width:6}
.instrument-face .windrose-dial .ticks path{stroke:#54717b;stroke-width:.35}
.instrument-face .windrose-dial text{text-anchor:middle;font-family:inherit;fill:#536a72;font-size:7px;font-weight:400}
.instrument-face .windrose-dial .dial-label{font-size:5px;fill:#008b9b}
.instrument-face .windrose-dial .dial-value{font-size:19px;font-weight:600;fill:#203b48;letter-spacing:-.7px}
.instrument-face .windrose-dial .dial-side{font-size:4px;fill:#57747a;letter-spacing:.2px}
.instrument-face .true-pointer{fill:#c38b27}.instrument-face .apparent-pointer{fill:#3188cb}
.instrument-face .rose-key{margin:4px 0 0;display:flex;justify-content:space-between;gap:8px}
.instrument-face .rose-key span{padding:0;background:none;font-size:11px}.rose-key b{margin-left:5px}
.instrument-face .true-read{color:#946b27}.instrument-face .apparent-read{color:#2085af}
.instruments-mode .digital-instruments{gap:0;border-top:1px solid var(--line);margin-top:9px}
.instruments-mode .right-rail .digital-instruments>div{background:transparent;border:0;border-radius:0;padding:9px 4px;min-height:75px;text-align:center}
.instruments-mode .digital-instruments>div+div{border-left:1px solid var(--line)}
.instruments-mode .right-rail .digital-instruments strong{font-family:inherit;font-size:27px;font-weight:600;line-height:1.1;color:#087f91;letter-spacing:-.6px}
.instruments-mode .digital-instruments span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;margin:5px 0}
.instruments-mode .digital-instruments small{display:block;font-size:10px;color:#627880}
.instruments-mode .right-rail .wind-instrument{background:#f4f6ef}
.instruments-mode .apparent-wind,.instruments-mode .apparent-angle strong{color:#087f91!important}
.instruments-mode .right-rail .instruments .speed-number{color:#b77b23}
.instruments-mode .sounder-demo svg{height:150px}.instruments-mode .sounder-demo p{margin-top:0}
@media(max-width:760px){.instruments-mode .instrument-lab{padding:8px}.instruments-mode .right-rail .digital-instruments strong{font-size:20px}.instruments-mode .digital-instruments{grid-template-columns:1fr}.instruments-mode .digital-instruments>div+div{border-left:0;border-top:1px solid var(--line)}}
/* Keep the helm centred on the full sea frame, raised by one rim diameter. */
.large-helm{left:calc(var(--left-rail) + 8px);right:calc(var(--right-rail) + 8px);bottom:35px}
#airflow-key,#large-helm:not([hidden])~#airflow-key{top:16px;right:calc(var(--right-rail) + 16px);bottom:auto;left:auto;transform:none;max-width:calc(100% - var(--left-rail) - var(--right-rail) - 32px)}
@media(max-width:760px){.large-helm{bottom:26px}#airflow-key{top:7px;right:calc(var(--right-rail) + 5px);font-size:8px;padding:3px;grid-template-columns:auto minmax(20px,50px) auto}#airflow-key small{font-size:7px}}
.edge-grid .right-rail>.compass{display:flex;flex-direction:column;gap:2px;padding:5px 12px 10px;min-height:0}
.edge-grid .right-rail>.compass svg{order:0;width:175px!important;height:175px!important;max-width:100%;flex:none;cursor:crosshair;touch-action:none}
.right-rail .compass-heading{order:1;text-align:center;font-size:12px}.right-rail .compass-heading b{font-size:27px;margin:0;font-weight:400}
.right-rail .compass-caption{order:2;text-align:center;font-size:13px;margin-top:1px}
@media(max-width:760px){.edge-grid .right-rail>.compass{padding:4px 5px 7px}.edge-grid .right-rail>.compass svg{width:112px!important;height:112px!important}.right-rail .compass-heading{font-size:10px}.right-rail .compass-heading b{font-size:22px}.right-rail .compass-caption{font-size:11px}}
/* Chapter 2 keeps the essential readouts in view above the fixed heading card. */
.instruments-mode .edge-grid .right-rail>.compass{display:flex!important}
.instruments-mode .edge-grid .right-rail .data-stack>.wind-instrument{padding:12px 18px}
.instruments-mode .right-rail #wind-dial,.instruments-mode .right-rail .wind-speed{margin-bottom:10px}
.instruments-mode .edge-grid .right-rail .wind-angle{padding-top:7px;gap:2px}
.instruments-mode .wind-adjust{margin-top:9px;padding-top:6px}
.instruments-mode .right-rail .instrument-face svg{max-height:185px}
.instruments-mode .instrument-lab{padding:8px 14px}.instruments-mode .instrument-lab>.eyebrow{margin-bottom:3px}
.instruments-mode .right-rail .data-stack>.instruments{padding:8px 18px;display:flex;align-items:baseline;gap:12px}
.instruments-mode .instruments #speed-trace,.instruments-mode .instruments .readings,.instruments-mode .instruments .extra-readings,.instruments-mode .instruments .snapshot-button{display:none}
.helm-dock .wheel-actions{display:flex;justify-content:flex-end}.helm-dock .wheel-actions[hidden]{display:none!important}
.instruments-mode .force-legend{display:flex;gap:22px;font-size:14px;line-height:1.4;max-width:calc(100% - var(--left-rail) - var(--right-rail) - 32px)}
.instruments-mode .force-legend .legend-item{gap:9px}
.instruments-mode .force-legend .legend-dot{width:14px;height:14px;flex:0 0 14px}
@media(max-width:760px){.instruments-mode .force-legend{left:calc(var(--left-rail) + 8px);right:calc(var(--right-rail) + 8px);top:10px;transform:none;max-width:none;width:auto;font-size:11px;gap:7px 12px}.instruments-mode .force-legend .legend-dot{width:11px;height:11px;flex-basis:11px}}
.instruments-mode .digital-instruments>div:last-child small:last-child{display:none}
.instruments-mode .right-rail .digital-instruments>div{padding:6px 4px;min-height:0}
.instruments-mode .right-rail .digital-instruments strong{font-weight:600;line-height:1.1}
.instruments-mode .digital-instruments span{line-height:1.2;margin:3px 0}.instruments-mode .digital-instruments small{line-height:1.25}
.instruments-mode .right-rail .instrument-face svg{max-height:175px}
.instruments-mode .right-rail #wind-dial strong,.instruments-mode .right-rail .wind-speed strong{font-size:43px!important}
.instruments-mode .edge-grid .right-rail .wind-angle strong{font-size:32px!important}
.instruments-mode .right-rail #wind-dial,.instruments-mode .right-rail .wind-speed{margin-bottom:6px}
#airflow-key,#large-helm:not([hidden])~#airflow-key{right:calc(var(--right-rail) + var(--helm-width) + 32px)}
@media(max-width:760px){#airflow-key,#large-helm:not([hidden])~#airflow-key{right:calc(var(--right-rail) + 7px);top:7px}}
/* Extend the existing raised arc continuously to the viewport edge. */
.large-helm{bottom:0;height:135px}
@media(max-width:760px){.large-helm{bottom:0;height:94px}}
.course-map{margin:12px 0;padding:10px;background:#e8f0ed;border:1px solid #c5d3d2;border-radius:4px}.course-map svg{width:100%;height:165px}.course-map p{font-size:12px;margin:4px 0}.choice-control>label{display:flex;align-items:center;gap:10px}.choice-control>label>input{margin-left:auto}.wind-layer-switches{display:grid;gap:9px;margin:12px 0}.wind-layer-switches label{display:flex;align-items:center;gap:10px}

#loading{background:#eef3f2;color:#253e4b}.loading-brand{text-align:center;margin:0 20px}#loading>p:not(.sr-only){margin-top:24px}.loading-title{font-family:var(--font);font-size:46px;font-weight:400;line-height:1.2;letter-spacing:.14em;text-indent:.14em}.loading-subtitle{font-family:var(--font);font-size:18px;font-weight:300;line-height:1.5;letter-spacing:.09em;text-indent:.09em;margin-top:10px}

button.selected,button[aria-pressed="true"],[role="radio"][aria-checked="true"]{border-color:var(--selection-outline)}
.lesson-landing{position:fixed;inset:0;z-index:90;overflow:auto;background:transparent;padding:48px max(24px,calc((100vw - 1120px)/2));text-align:center}.lesson-landing header{max-width:690px;margin:0 auto 36px}.lesson-landing h1{font:400 32px var(--font);margin:28px 0 12px}.lesson-landing header p{font-size:18px;line-height:1.6;color:#2f4858}.lesson-sequence{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.lesson-sequence li{display:flex}.lesson-sequence button{width:100%;padding:24px;text-align:left;display:flex;flex-direction:column;background:rgba(249,251,250,.9);border:1px solid rgba(203,214,217,.9);border-radius:4px}.lesson-number{font-size:30px;color:#397fa4;font-weight:300}.lesson-sequence h2{font:400 25px var(--font);margin:10px 0}.lesson-sequence p{font-size:16px;line-height:1.5;color:#536d7b;margin-bottom:22px}.lesson-enter{margin-top:auto;color:#397fa4}.lesson-landing footer{margin:30px 0}.lesson-landing footer p{font-size:13px;margin-top:22px}.lesson-landing button:disabled{opacity:.5;cursor:progress}.brand[role=button]{cursor:pointer}@media(max-width:800px){.lesson-sequence{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.lesson-sequence{grid-template-columns:1fr}.lesson-landing{padding:32px 20px}}

/* Quiet sailing view: retain the sea, helm and essential readings only. */
.quiet-ui-toggle{position:fixed;top:16px;left:calc(var(--left-rail) + 14px);z-index:40;width:34px;height:34px;padding:7px;border:1px solid #ffffffaa;border-radius:50%;background:#f7f9f6cc;color:#23465b;backdrop-filter:blur(10px)}.quiet-ui-toggle svg{width:18px;height:18px}.quiet-ui-toggle:hover{background:#fff}
body.quiet-ui .left-rail,body.quiet-ui .right-rail>.compass,body.quiet-ui .right-rail>.weather-panel,body.quiet-ui .right-rail>.weather-toggle,body.quiet-ui .tutor-modal,body.quiet-ui .force-legend,body.quiet-ui .airflow-key,body.quiet-ui .part-tip,body.quiet-ui .drift-key,body.quiet-ui #control-connection,body.quiet-ui .footer{display:none!important}
body.quiet-ui .edge-grid{inset:0;display:block;pointer-events:none!important}body.quiet-ui .right-rail{position:static;width:auto!important;height:auto!important;padding:0!important;background:none!important;border:0!important;overflow:visible!important;pointer-events:none!important}body.quiet-ui .data-stack{position:fixed;top:22px;right:26px;width:min(448px,calc(100vw - 96px));display:grid;grid-template-columns:2fr 1fr;gap:0 28px;overflow:visible!important;color:#173f58;pointer-events:none}
body.quiet-ui .edge-grid .right-rail .data-stack>.wind-instrument,body.quiet-ui .edge-grid .right-rail .data-stack>.instruments{display:block!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;color:#173f58}body.quiet-ui .wind-instrument{display:grid!important;grid-template-columns:1fr 1fr!important;gap:0 28px!important}body.quiet-ui .wind-angle,body.quiet-ui .wind-adjust,body.quiet-ui #speed-trace,body.quiet-ui .instruments .readings,body.quiet-ui .instruments .extra-readings,body.quiet-ui .instrument-note,body.quiet-ui .snapshot-button,body.quiet-ui .comparison{display:none!important}
body.quiet-ui .right-rail #wind-dial,body.quiet-ui .right-rail .wind-speed{display:flex!important;margin:4px 0 0!important;color:#173f58!important}body.quiet-ui .right-rail #wind-dial strong,body.quiet-ui .right-rail .wind-speed strong,body.quiet-ui .right-rail .speed-number{font-size:64px!important;font-weight:300!important;line-height:1!important;color:#173f58!important}body.quiet-ui .right-rail #wind-dial span,body.quiet-ui .wind-speed span,body.quiet-ui .speed-unit{font-size:18px!important;color:#173f58!important}body.quiet-ui .wind-pair>.eyebrow,body.quiet-ui .instruments>.eyebrow{display:block!important;color:#173f58!important;font-size:14px!important;letter-spacing:.16em}body.quiet-ui .instruments{padding-top:2px!important}body.quiet-ui .speed-row{margin:4px 0 0!important}
body.quiet-ui .large-helm{left:0;right:0;bottom:0}.quiet-ui #quiet-ui{top:16px;left:calc(var(--left-rail) + 14px);background:transparent;border-color:#173f5844;color:#173f58;backdrop-filter:none}
@media(max-width:760px){.quiet-ui-toggle{left:calc(var(--left-rail) - 38px);top:12px}.quiet-ui .data-stack{top:15px;right:14px;width:min(300px,calc(100vw - 66px));gap:0 14px}.quiet-ui .wind-instrument{gap:0 14px!important}.quiet-ui .right-rail #wind-dial strong,.quiet-ui .right-rail .wind-speed strong,.quiet-ui .right-rail .speed-number{font-size:41px!important}.quiet-ui .wind-pair>.eyebrow,.quiet-ui .instruments>.eyebrow{font-size:10px!important}.quiet-ui .right-rail #wind-dial span,.quiet-ui .wind-speed span,.quiet-ui .speed-unit{font-size:12px!important}body.quiet-ui .edge-grid .right-rail .wind-angle.apparent-angle>strong{font-size:41px!important}.quiet-ui #quiet-ui{left:12px;top:12px}}

/* Quiet view keeps: TWS, AWS, AWA, SOW, the sheet ropes (muted) and the autopilot switch, all on the right. */
/* Readouts sit on one 2 x 2 grid: label row, value row. TWS | SOW over AWS | AWA. */
body.quiet-ui .data-stack{grid-template-columns:1fr 1fr!important;gap:0 28px!important;align-items:start}
body.quiet-ui .edge-grid .right-rail .data-stack>.wind-instrument,body.quiet-ui .edge-grid .right-rail .data-stack>.instruments,body.quiet-ui .data-stack .wind-pair,body.quiet-ui .data-stack .wind-pair .wind-angle.apparent-angle{display:contents!important}
body.quiet-ui .true-wind>.eyebrow{grid-area:1/1}
body.quiet-ui .true-wind>#wind-dial{grid-area:2/1}
body.quiet-ui .instruments>.eyebrow{grid-area:1/2}
body.quiet-ui .instruments>.speed-row{grid-area:2/2}
body.quiet-ui .apparent-wind>.eyebrow{grid-area:3/1}
body.quiet-ui .apparent-wind>.wind-speed{grid-area:4/1}
body.quiet-ui .apparent-angle>span{grid-area:3/2}
body.quiet-ui .apparent-wind>.eyebrow,body.quiet-ui .edge-grid .right-rail .wind-angle.apparent-angle>span{display:block;margin:16px 0 0!important;font-size:14px!important;line-height:21px!important;letter-spacing:.16em!important;font-weight:400!important;color:#173f58!important}
body.quiet-ui .edge-grid .right-rail .wind-angle.apparent-angle>strong{grid-area:4/2;margin:4px 0 0;font-size:64px!important;font-weight:300!important;line-height:1!important;color:#173f58!important}
body.quiet-ui .data-stack *{border:0!important}
body.quiet-ui #subject-controls{display:block!important;position:fixed;inset:auto 26px 92px auto!important;width:auto!important;max-width:260px;max-height:none;overflow:visible;pointer-events:none}
body.quiet-ui #subject-controls[hidden]{display:none!important}
body.quiet-ui .rope-card{background:transparent;border:0;box-shadow:none;backdrop-filter:none;padding:0}
body.quiet-ui .rope-card header,body.quiet-ui .rope-card footer,body.quiet-ui .rope-trim,body.quiet-ui .rope-trim[hidden]{display:none!important}
body.quiet-ui .rope-bank{padding-top:0;gap:10px;justify-content:flex-end}
body.quiet-ui .rope-lane label,body.quiet-ui .rope-lane output{color:#fff;text-shadow:0 1px 8px #10303f99}
body.quiet-ui .rope-grip{height:clamp(90px,calc(100dvh - 560px),230px);background:linear-gradient(90deg,transparent,#ffffff1f,transparent)}
body.quiet-ui .rope-core{stroke:#ffffffb3}
body.quiet-ui .rope-flecks{display:none}
body.quiet-ui .rope-shadow{stroke:#10303f40}
body.quiet-ui .rope-marker{border-color:#ffffffaa;background:#ffffff22}
body.quiet-ui .helm-dock{display:block!important;right:26px;bottom:26px;left:auto;width:auto;pointer-events:none}
body.quiet-ui .helm-dock .wheel-control{display:block;padding:0!important;border:0!important;background:none;backdrop-filter:none}
body.quiet-ui .helm-dock .wheel-control>label:first-child,body.quiet-ui .helm-dock .autopilot-actions,body.quiet-ui .helm-dock .helm,body.quiet-ui .helm-dock .wheel-actions,body.quiet-ui .helm-dock .control-note{display:none!important}
body.quiet-ui .helm-dock .autopilot-switch{display:inline-grid!important;pointer-events:auto;border:0;margin:0!important;padding:6px 14px;border-radius:20px;background:#10303f66;color:#fff;font-size:14px!important;font-weight:400!important;grid-template-columns:auto auto!important;gap:10px;text-shadow:none}
body.quiet-ui .helm-dock .autopilot-switch span{font-weight:400!important}
body.quiet-ui .helm-dock .autopilot-switch b{display:none!important}