:root{color-scheme:dark;--bg:#0b1117;--surface:#152129;--text:#f0f1e9;--soft:#c1cfc9;--muted:#a6b8b2;--line:#3b4d51;--red:#df3546;--warm:#eac78c;--good:#aedccc;font-family:"Segoe UI","Noto Sans","Liberation Sans",sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:15px;line-height:1.5}h1,h2,h3,p,figure{margin:0}h1,h2,h3{line-height:1.18}h1{font-size:clamp(23px,2.3vw,33px);font-weight:600;letter-spacing:-.035em}h2{font-size:clamp(25px,2.5vw,36px);font-weight:550;letter-spacing:-.04em}h3{font-size:21px;font-weight:600;letter-spacing:-.025em}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit;touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.55;cursor:default}button,a,input,summary{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid #ff969f;outline-offset:4px}[hidden]{display:none!important}fieldset{margin:0;padding:0;border:0;min-width:0}legend{padding:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.exercise-page{padding:clamp(16px,2vw,28px);margin:0 auto;max-width:1760px}.exercise-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 20px;margin-bottom:23px;align-items:center}.exercise-header h1{grid-column:1}.back-link{grid-column:1;font-size:12px;color:var(--muted);text-decoration:none}.back-link span{padding:0 8px;color:#718780}#standalone-full{grid-column:2;grid-row:1/3}.is-embedded .exercise-header{height:0;margin:0;overflow:hidden}.is-embedded h1{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.loading{padding:40px}.eyebrow{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.caption,.muted{font-size:12px;color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:11px 20px;border:1px solid #617575;border-radius:6px;background:#25373e;color:var(--text);font-size:14px;font-weight:600;text-decoration:none;line-height:1.35;white-space:normal}.btn:hover:not(:disabled){background:#334950;border-color:#a6bdb7}.btn.primary{background:#c92c3e;border-color:#f05d6b;color:#fff}.btn.primary:hover:not(:disabled){background:#b82335}.btn.quiet{background:transparent}.text-button{min-height:44px;border:0;background:none;color:var(--soft);padding:8px 0;text-decoration:underline;text-underline-offset:4px;font-size:13px}.text-button:hover{color:#fff}.control{display:grid;gap:6px;min-width:0;color:var(--soft);font-size:13px}.control>span{display:flex;justify-content:space-between;align-items:baseline;gap:10px}.control output{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}input[type=range]{width:100%;height:44px;min-height:44px;min-width:0;margin:0;background:transparent;accent-color:var(--red);cursor:pointer}input[type=range]::-webkit-slider-thumb{min-width:20px;min-height:20px}select,input[type=number],input[type=text]{min-width:0;max-width:100%;min-height:46px;padding:9px 11px;border:1px solid #617575;border-radius:6px;background:#1b2c33;color:var(--text)}.segmented{display:flex;gap:5px}.segmented button{min-height:44px;flex:1;padding:8px 12px;border:1px solid #526968;border-radius:5px;background:transparent;color:var(--soft);font-size:13px}.segmented button[aria-pressed=true]{background:#393c31;border-color:var(--warm);color:#ffe2b0;box-shadow:inset 0 -2px var(--warm)}.segmented button:hover:not(:disabled){border-color:#d3dcd2}.model-note{margin-top:10px;font-size:12px;color:var(--muted);max-width:980px}.model-note summary{cursor:pointer;padding:11px 0;min-height:44px;width:fit-content}.model-note p{padding:0 0 12px;line-height:1.6;max-width:90ch}.scene{display:block;width:100%;height:100%;overflow:hidden}.scene text{font-family:inherit;fill:var(--soft)}.round-count{font-size:12px;letter-spacing:.06em;color:var(--warm);white-space:nowrap}
/* Stopping keeps its following camera; the result ruler uses the same trajectory. */
.brake-settings{display:grid;grid-template-columns:1.2fr 1fr .8fr;gap:28px;align-items:end;margin-bottom:16px}.brake-settings select{width:100%}.brake-window{position:relative;height:clamp(350px,32vw,455px);overflow:hidden;background:#20343f;border:1px solid #4d6567;border-radius:9px 9px 0 0}.brake-window canvas{display:block;width:100%;height:100%}.brake-hud{position:absolute;inset:18px 22px auto;display:flex;justify-content:space-between;align-items:start;gap:20px;pointer-events:none}.brake-hud .speed{font-size:34px;font-weight:550;letter-spacing:-.035em;font-variant-numeric:tabular-nums;line-height:1.1;text-shadow:0 1px 8px #081823}.brake-hud .speed small{font-size:12px;letter-spacing:0;margin-left:5px}.brake-phase{background:#122631e8;padding:7px 11px;border-radius:4px;font-size:12px;color:#e4e9dd}.brake-phase[data-alert=true]{background:#c72b3a;color:#fff}.brake-lead{position:absolute;inset:84px auto auto 25px;max-width:400px;padding:16px 18px;background:#152b34ed;border-radius:5px;pointer-events:none}.brake-lead h2{font-size:clamp(29px,2.8vw,39px);font-weight:550;letter-spacing:-.045em}.brake-lead p{font-size:14px;color:#e0e6da;margin-top:13px;max-width:27ch}.brake-dock{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,28%);gap:24px;align-items:center;padding:20px 23px;border:1px solid #4d6567;border-top:0;background:#172931;border-radius:0 0 9px 9px}.brake-dock .btn{min-height:61px;font-size:19px}.brake-dock kbd{padding:3px 7px;border:1px solid #ffffff70;border-radius:4px;font-size:12px;opacity:.85}.brake-report{display:flex;flex-direction:column;gap:6px;min-width:0}.brake-report h3{font-size:21px}.brake-report p{font-size:13px;color:var(--soft)}.brake-analysis{padding:8px 0 12px}.brake-analysis svg{display:block;width:100%;height:74px;font-family:inherit}.brake-scale-key{display:flex;justify-content:space-between;gap:18px;font-size:12px;color:var(--soft);padding:2px 0 12px}.brake-analysis dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding-top:13px;border-top:1px solid var(--line)}.brake-analysis dt{font-size:12px;color:var(--soft);margin-bottom:5px}.brake-analysis dd{margin:0;font-size:23px;font-variant-numeric:tabular-nums}.brake-analysis dd small{display:block;font-size:12px;color:var(--soft);margin-top:3px}.brake-rider-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 14px;margin:4px 0 14px;padding:12px 14px;background:#172931;border:1px solid #4d6567;border-radius:5px;font-size:12px;color:var(--soft);font-variant-numeric:tabular-nums}.brake-rider-stats strong{grid-column:1/-1;font-size:18px;font-weight:550;color:var(--text)}.brake-dock .btn[aria-disabled=true]{background:#874a51;border-color:#ac7477}.brake-hud .speed small{display:block;margin:3px 0 0;text-align:right}
/* Grip: a rear-view lean study, linked to a vector rather than a driving dashboard. */
.grip-top{display:flex;align-items:center;justify-content:space-between;gap:24px}.grip-top h2{font-size:23px;max-width:none;white-space:nowrap}.grip-envelope{display:flex;align-items:center;gap:12px}.grip-envelope>span{font-size:12px;color:var(--muted)}.grip-studio{display:grid;grid-template-columns:1.2fr 1fr;grid-template-rows:minmax(0,1fr);height:clamp(365px,31vw,445px);position:relative;background:#101e27;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:18px;overflow:hidden}.lean-stage{min-height:0;height:100%;position:relative;overflow:hidden;background:#1c3135}.lean-stage svg{width:100%;height:100%;display:block}.lean-label{position:absolute;left:20px;top:17px;font-size:12px;color:#d0dbd2}.lean-label strong{display:block;font-size:32px;font-weight:500;color:var(--text)}.grip-vector{position:relative;min-width:0;min-height:0;height:100%;padding:10px}.grip-vector svg{width:100%;height:100%;display:block}.grip-vector text{font-family:inherit;fill:var(--soft);font-size:16px}.grip-vector .axis-word{font-size:13px;fill:var(--muted)}.grip-response{display:flex;align-items:center;gap:18px;color:#d0dbd2;font-size:13px;min-height:62px;padding:12px 0;border-bottom:1px solid var(--line)}.grip-response strong{flex:none;color:#b6e4d0;font-size:20px;font-weight:550}.grip-response span{max-width:65ch}.grip-response[data-over=true] strong{color:#ffada1}.lean-stage[data-unavailable=true] #lean-bike{opacity:.38}.lean-stage[data-unavailable=true] #lean-arc{stroke-dasharray:5 5;stroke:#ffc0ac}.exercise-header>*{min-width:0}.grip-deck{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:30px;padding:21px 0 3px}.grip-longitudinal{border-left:1px solid var(--line);padding-left:28px}.grip-longitudinal .control>span{color:var(--text)}.grip-longitudinal .ends{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.grip-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:12px;padding-top:14px;border-top:1px solid var(--line)}.grip-bottom p{color:var(--soft);font-size:14px;max-width:76ch}
/* Position: orthographic map, contextual briefing and direct lateral controls. */
.position-exercise{display:grid;grid-template-columns:minmax(230px,.73fr) minmax(0,1.27fr);grid-template-rows:auto 1fr;gap:0 30px}.position-brief{grid-column:1;grid-row:1}.position-board{grid-column:2;grid-row:1/span 2}.position-guidance{grid-column:1;grid-row:2;align-self:start}.position-brief{display:flex;flex-direction:column;gap:17px;padding:7px 0}.position-brief h2{font-size:clamp(28px,2.65vw,38px);max-width:18ch;margin-top:9px}.position-brief .lead{font-size:15px;color:var(--soft);max-width:34ch}.position-guidance{padding-top:22px;border-top:1px solid var(--line);margin-top:10px}.position-guidance h3{font-size:23px;margin-bottom:10px}.position-guidance p{font-size:14px;color:var(--soft);max-width:36ch;line-height:1.55}.position-guidance .btn{margin-top:22px}.position-legend{display:flex;gap:18px;font-size:12px;margin-top:17px;color:var(--muted)}.position-legend span::before{content:"";display:inline-block;width:15px;border-top:3px solid var(--good);margin:0 6px 3px 0}.position-legend span:last-child::before{border-color:var(--warm);border-top-style:dashed}.position-board{min-width:0;border:1px solid #526961;border-radius:7px;overflow:hidden;background:#172a30}.position-map{height:clamp(390px,36vw,540px);position:relative;cursor:crosshair;background:#293f36}.lane-hint{position:absolute;top:14px;left:16px;background:#172c2de8;color:#d5e0d1;font-size:11px;padding:5px 9px;border-radius:3px;pointer-events:none}.position-controls{padding:15px 19px;border-top:1px solid #526961}.position-controls .control{margin-top:12px}.position-controls .control>span{font-size:12px}.position-intervals{display:flex;justify-content:space-between;gap:16px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.position-intervals strong{color:#dce5d6;font-weight:600;margin-left:6px}
/* Gap judgment: a crossing in daylight. Decisions are followed by two real time intervals. */
.gap-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px}.gap-heading h2{font-size:28px;margin-top:4px}.gap-scene{height:clamp(350px,35vw,480px);position:relative;border-radius:7px 7px 0 0;overflow:hidden;background:#b7c6b4}.gap-scene svg{display:block;width:100%;height:100%}.gap-phase,.gap-clock{position:absolute;top:16px;padding:6px 10px;background:#17313bdc;color:#f2edd9;border-radius:3px;font-size:12px}.gap-phase{left:17px}.gap-clock{right:17px;font-variant-numeric:tabular-nums}.gap-deck{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:20px 24px;background:#193039;border:1px solid #3e5960;border-top:0;border-radius:0 0 7px 7px;min-height:104px}.gap-prompt{font-size:18px;max-width:52ch;color:#dbe3d8}.gap-decisions{display:flex;gap:10px;flex-shrink:0}.gap-decisions .btn{min-width:145px;min-height:60px;font-size:19px}.gap-verdict{display:flex;align-items:center;gap:18px;max-width:76ch}.gap-verdict h3{font-size:23px;color:#ffb4ae}.gap-verdict p{font-size:13px;color:var(--soft);margin-top:6px}.gap-verdict[data-correct=true] h3{color:#bde6ce}.verdict-symbol{display:flex;align-items:center;justify-content:center;min-width:47px;height:47px;border:1px solid #cf6d6b;color:#ffd1c4;border-radius:50%;font-size:28px}.gap-verdict[data-correct=true] .verdict-symbol{color:#d2f0d9;border-color:#7aac95}.gap-deck>.btn{flex-shrink:0}.gap-exercise #gap-analysis{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:30px;margin-top:20px;padding:4px 0 7px}.gap-timing{display:grid;gap:13px;max-width:750px}.gap-timing>div{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:12px;color:var(--muted)}.gap-timing strong{font-size:15px;color:var(--text);font-variant-numeric:tabular-nums}.gap-timing i{grid-column:1/-1;display:block;height:5px;background:#e1c695;border-radius:1px}.gap-timing>div:last-child i{background:#afd7cc}.gap-margin{display:flex;flex-direction:column;align-items:start;gap:2px;color:#ffb3a7}.gap-margin[data-safe=true]{color:#b9e2ce}.gap-margin span{font-size:12px}.gap-margin strong{font-size:33px;font-weight:500;letter-spacing:-.04em;white-space:nowrap}
@media(max-width:900px){.brake-settings{gap:18px}.grip-envelope{display:block}.grip-envelope>span{display:block;margin-bottom:7px}.position-exercise{gap:22px;grid-template-columns:minmax(205px,.75fr) minmax(0,1.25fr)}.position-brief h2{font-size:29px}.gap-deck{gap:17px}.gap-exercise #gap-analysis{gap:20px}.gap-deck>.btn{max-width:190px}}
@media(max-width:620px){
 .exercise-page{padding:14px}.exercise-header{gap:10px 12px;margin-bottom:17px}.exercise-header h1{grid-column:1/-1;font-size:25px}.back-link{font-size:11px}#standalone-full{grid-column:2;grid-row:1;min-height:44px;font-size:11px;padding:7px 10px}.btn{padding:10px 13px}.model-note{margin-top:6px}.control{font-size:12px}.segmented button{padding:8px 8px}.round-count{font-size:11px}
 .brake-settings{grid-template-columns:1fr 1fr;gap:9px 14px;margin-bottom:13px}.brake-settings>.control:first-of-type{grid-column:1/-1}.brake-settings .control{gap:3px}.brake-settings input{height:32px}.brake-settings select{font-size:12px;padding:7px 8px;min-height:44px}.brake-window{height:330px}.brake-hud{inset:13px 15px auto;gap:10px}.brake-hud .speed{font-size:29px}.brake-phase{font-size:11px;padding:6px 8px}.brake-lead{left:14px;top:65px;max-width:50%;padding:12px 14px}.brake-lead h2{display:none}.brake-lead p{font-size:13px;margin-top:0;max-width:24ch}.brake-dock{grid-template-columns:1fr;padding:15px;gap:14px}.brake-dock .btn{width:100%;min-height:56px;font-size:19px}.brake-dock kbd{display:none}.brake-report h3{font-size:19px}.brake-report p{font-size:12px}.brake-analysis dl{gap:12px}.brake-analysis dt{font-size:11px;min-height:2.6em}.brake-analysis dd{font-size:20px}.brake-scale-key{font-size:11px;gap:13px}.brake-scale-key span{max-width:50%}
 .grip-top{display:block}.grip-top h2{font-size:14px;line-height:1.35;max-width:none}.grip-envelope{display:flex;align-items:center;gap:11px;margin-top:13px}.grip-envelope>span{font-size:12px;margin:0}.grip-envelope .segmented{flex:1}.grip-envelope .segmented button{min-height:44px;font-size:12px}.grip-studio{grid-template-columns:1fr 1.23fr;height:280px;margin-top:14px}.lean-label{font-size:10px;top:12px;left:11px}.lean-label strong{font-size:26px}.grip-response{display:block;min-height:0;padding:10px 0;font-size:12px;line-height:1.35}.grip-response strong{display:block;font-size:18px;margin-bottom:4px}.grip-vector{padding:0}.grip-vector .axis-word{font-size:20px}.grip-deck{grid-template-columns:1fr 1fr;gap:11px 18px;padding-top:15px}.grip-longitudinal{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);padding:12px 0 0}.grip-longitudinal .ends{font-size:11px}.grip-longitudinal .control>span{font-size:11px}.grip-bottom{align-items:start;gap:15px;margin-top:10px;padding-top:11px}.grip-bottom p{font-size:13px}.grip-bottom .text-button{white-space:nowrap;min-width:54px;font-size:12px;padding:0}
 .position-exercise{display:flex;flex-direction:column;gap:12px}.position-brief{display:contents}.position-brief h2{order:1;margin-top:1px;font-size:25px;max-width:none}.position-brief .lead{order:2;font-size:13px;max-width:none;margin-top:-4px}.position-board{order:3}.position-guidance{order:4;margin:0;padding-top:13px}.position-guidance h3{font-size:20px;margin-bottom:7px}.position-guidance p{font-size:13px;max-width:none}.position-guidance .btn{margin-top:14px;width:100%}.position-map{height:clamp(310px,43dvh,365px)}.lane-hint{left:11px;top:11px;font-size:10px;padding:5px 7px}.position-controls{padding:12px 13px}.position-controls .control{margin-top:5px}.position-controls .control input{height:44px;min-height:44px}.position-intervals{font-size:11px;gap:10px}.position-intervals strong{margin-left:3px}.position-legend{font-size:11px;margin-top:12px}[data-exercise=position][data-phase=choose] #explanation{display:none}[data-exercise=position][data-phase=choose] .position-guidance{border:0;padding:0}[data-exercise=position][data-phase=choose] .position-guidance .btn{margin:0}
 .gap-heading{gap:12px;align-items:start;margin-bottom:13px}.gap-heading h2{font-size:24px}.gap-heading .eyebrow{font-size:10px}.gap-heading .round-count{padding-top:4px}.gap-scene{height:390px}.gap-phase,.gap-clock{font-size:11px;top:12px;padding:5px 8px}.gap-phase{left:12px;max-width:75%}.gap-clock{right:12px}.gap-deck{flex-direction:column;align-items:stretch;gap:14px;padding:16px;min-height:110px}.gap-prompt{font-size:16px}.gap-decisions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.gap-decisions .btn{min-width:0;min-height:55px;font-size:19px}.gap-deck>.btn{max-width:none}.gap-verdict{align-items:start;gap:12px}.gap-verdict h3{font-size:21px}.gap-verdict p{font-size:12px;margin-top:7px}.verdict-symbol{min-width:34px;height:34px;font-size:23px}.gap-exercise #gap-analysis{grid-template-columns:1fr auto;gap:12px;margin-top:16px}.gap-timing>div{font-size:10px;gap:4px}.gap-timing strong{font-size:13px}.gap-margin strong{font-size:28px}.gap-margin span{font-size:11px}.gap-exercise #gap-analysis>.text-button{grid-column:1/-1;justify-self:start;font-size:12px}.gap-timing{gap:12px}
}
/* Standalone documents use viewport height; embedded documents never feed their own height back. */
@media(min-width:621px){html:not(.is-embedded):not(.is-immersive) .brake-window{height:clamp(350px,calc(100dvh - 350px),670px)}html:not(.is-embedded):not(.is-immersive) .grip-studio{height:clamp(365px,calc(100dvh - 420px),640px)}html:not(.is-embedded):not(.is-immersive) .position-map{height:clamp(390px,calc(100dvh - 300px),650px)}html:not(.is-embedded):not(.is-immersive) .gap-scene{height:clamp(350px,calc(100dvh - 355px),720px)}}
/* Fullscreen: the scene absorbs extra height, never the text or control deck. */
.is-immersive .exercise-page{height:100dvh;max-width:none;display:flex;flex-direction:column;padding:16px}.is-immersive .exercise-header{flex:none;display:flex;justify-content:space-between;gap:14px;margin-bottom:14px}.is-immersive .exercise-header h1{font-size:18px}.is-immersive .back-link{display:none}.is-immersive #standalone-full{min-height:44px;white-space:nowrap;font-size:12px}.is-immersive.is-embedded .exercise-header{display:none}.is-immersive #app{flex:1;min-height:0;display:flex;flex-direction:column}.is-immersive .model-note{flex:none}.is-immersive .brake-machine{flex:1;min-height:0;display:grid;grid-template-rows:auto minmax(240px,1fr) auto auto auto}.is-immersive .brake-window{height:auto;min-height:0}.is-immersive #app[data-exercise=grip]>section{flex:1;min-height:0;display:grid;grid-template-rows:auto minmax(220px,1fr) auto auto auto auto}.is-immersive .grip-studio{height:auto;min-height:0}.is-immersive .position-exercise{flex:1;min-height:0}.is-immersive .position-board{display:flex;flex-direction:column;min-height:0}.is-immersive .position-map{height:auto;flex:1;min-height:270px}.is-immersive .position-controls{flex:none}.is-immersive .gap-exercise{flex:1;min-height:0;display:flex;flex-direction:column}.is-immersive .gap-heading,.is-immersive .gap-deck,.is-immersive #gap-analysis{flex:none}.is-immersive .gap-scene{height:auto;flex:1;min-height:280px}
@media(max-width:620px){.is-immersive .exercise-page{padding:12px}.is-immersive .exercise-header h1{font-size:14px}.is-immersive .position-board{flex:1;min-height:0}.is-immersive .position-map{min-height:240px}.is-immersive .position-brief .lead{font-size:12px}.is-immersive [data-exercise=position][data-phase=feedback] #scenario-lead{display:none}.is-immersive .position-guidance h3{font-size:18px}.is-immersive .position-guidance p{font-size:12px}.is-immersive .position-guidance{padding-top:9px}.is-immersive .position-guidance .btn{margin-top:10px}.is-immersive .gap-scene{min-height:260px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* SVG intrinsic widths must not become minimum track widths in fullscreen grids. */
.lean-stage,.is-immersive #app>*{min-width:0}.is-immersive #app[data-exercise=grip]>section,.is-immersive .brake-machine{grid-template-columns:minmax(0,1fr)}

[data-exercise=braking][data-phase=result] .brake-window{min-height:300px}
.is-immersive [data-exercise=braking][data-phase=result] .brake-machine{grid-template-rows:auto minmax(300px,1fr) auto auto auto}

.grip-presets{position:relative}.grip-presets .segmented{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.grip-presets .segmented button{min-height:44px;padding:8px 11px;font-size:12px;line-height:1.2;text-align:center}.grip-help{position:absolute;right:0;top:calc(100% + 9px);z-index:5;width:min(370px,calc(100vw - 36px));padding:14px 16px;border:1px solid #7f9e9c;border-radius:6px;background:#203641;color:#e5ebde;font-size:13px;line-height:1.5;box-shadow:0 8px 24px #07131b66}.grip-envelope{position:relative}.grip-studio{isolation:isolate}.lean-label{padding:6px 9px;background:#142a30dc;border-radius:4px;left:12px;top:12px}
@media(max-width:620px){.grip-presets{flex:1;min-width:0}.grip-envelope .segmented button{padding:8px 6px;font-size:11px}.grip-help{right:0;width:calc(100vw - 38px);font-size:12px}.lean-label{left:7px;top:7px;padding:5px 7px;font-size:10px}}

.position-verdict{display:flex;align-items:center;gap:10px;font-size:13px;margin-bottom:15px;color:#c7e6d2}.position-verdict-mark{width:40px;height:40px;display:block;flex:none}.position-verdict-mark svg{display:block;width:100%;height:100%}.position-verdict strong{font-weight:600}.position-guidance [data-grade=tradeoff] .position-verdict{color:#f1d29f}.position-guidance [data-grade=poor] .position-verdict{color:#ffb4a6}.position-guidance [data-grade=poor] h3{color:#ffd5c9}.position-controls .control{margin-top:0}.position-complete{grid-column:1/-1;align-self:center;margin:40px auto;padding:35px 25px;max-width:620px;border-top:2px solid #b9d6c5}.position-complete h2{margin:18px 0;font-size:36px}.position-complete p{color:var(--soft);margin-bottom:25px}.position-complete .btn{margin-top:10px}.position-brief>.round-count{margin-top:8px}.position-map:has(+.position-controls input:disabled){cursor:default}
@media(max-width:620px){.position-brief>.round-count{order:0;margin-top:0}.position-verdict{margin-bottom:10px;font-size:12px}.position-verdict-mark{width:32px;height:32px}.position-complete{margin:20px 0;padding:25px 8px}.position-complete h2{font-size:29px}.position-complete p{font-size:14px}.position-complete .btn{width:100%}}

/* Observation is a framed memory scene with an annotation rail, not a driving cockpit. */
.changes-head{display:flex;justify-content:space-between;align-items:start;gap:24px;margin-bottom:18px}.changes-head h2{font-size:25px;max-width:32ch}.changes-head p{font-size:14px;line-height:1.45;color:var(--soft);margin-top:8px;max-width:65ch}
#changes-stage{display:grid;grid-template-columns:minmax(0,1fr) clamp(235px,24vw,310px);gap:26px;min-width:0;align-items:stretch}.observation-frame{display:flex;flex-direction:column;min-width:0;border-top:2px solid #b9cbb8}.observation-frame-title{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:11px 13px;color:#dce4d2;background:#152b33;font-size:12px}.observation-route-key{display:flex;align-items:center;gap:7px;color:#e5d39c;white-space:nowrap}.observation-route-key i{width:22px;border-top:2px dashed currentColor}.changes-plate{height:clamp(410px,35vw,620px);position:relative;overflow:hidden;background:#314b5a;border:1px solid #526b6b;border-top:0}.change-mask{position:absolute;inset:0;background:#111d25}.study-progress{position:absolute;left:0;right:0;bottom:0;height:4px;background:#203645;overflow:hidden}.study-progress span{display:block;width:100%;height:100%;background:#e9c98f;transform-origin:left}
.changes-dock{display:flex;flex-direction:column;justify-content:center;border-left:1px solid var(--line);padding:18px 0 18px 24px;min-width:0}.changes-setup{display:flex;flex-direction:column;gap:30px}.memory-options{min-width:0}.memory-options legend{font-size:13px;color:var(--soft);margin-bottom:13px}.memory-options .segmented{display:grid;grid-template-columns:1fr;gap:7px}.memory-options .segmented button{width:100%;min-height:47px;font-size:13px}.changes-message{display:flex;flex-direction:column;gap:24px;color:var(--soft);font-size:15px;line-height:1.5}.observation-seconds{font-size:64px;line-height:1;color:#e5d6b2;font-variant-numeric:tabular-nums}.observation-seconds small{display:block;font-size:13px;margin-top:12px;color:var(--soft)}
.change-choices{display:flex;flex-direction:column;gap:10px}.change-choices .btn{justify-content:flex-start;text-align:left;min-height:52px;font-size:13px;padding:11px 12px;background:#142b35;line-height:1.35}.choice-number{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:24px;height:24px;border:1px solid #8fa9ae;border-radius:50%;font-size:12px;color:#e7e9d8}.scene .hit{fill:transparent;stroke:transparent;stroke-width:3}.scene [data-selectable=true]{cursor:pointer}.scene [data-selectable=true]:hover .hit{stroke:#9fbdb8;stroke-width:2;stroke-dasharray:5 5}.scene .is-keyboard-focused .hit,.scene .is-keyboard-focused .object-badge{stroke:#ff969f;stroke-width:3;stroke-dasharray:5 4}.scene [data-selected=true] .object-badge{stroke:#f1d8a3;stroke-width:4}.scene [data-answer=true] .hit{fill:#bce5bd10;stroke:#bfe6b7;stroke-width:4}.scene [data-wrong=true] .hit{fill:#ff897510;stroke:#ffad9a;stroke-width:4;stroke-dasharray:7 5}.scene .object-badge{fill:#233e46;stroke:#d4dfcb;stroke-width:2}.scene .object-number{fill:#f2f0d7;font-size:20px;text-anchor:middle;font-weight:600}.scene .object-leader{stroke:#e8edd5;stroke-width:1.1;opacity:.55;fill:none;pointer-events:none}
.changes-feedback{display:flex;flex-direction:column;gap:24px;align-items:stretch}.changes-feedback h3{font-size:23px;line-height:1.25;margin-bottom:12px}.changes-feedback h3>span{color:#c8dfb5}.changes-feedback[data-correct=false] h3>span{color:#ffb4a6}.changes-feedback p{color:var(--soft);font-size:14px;line-height:1.55}.changes-feedback .compare{display:flex;flex-direction:column;gap:9px;font-size:12px;color:var(--muted)}.changes-feedback .compare .segmented{display:flex}.changes-feedback .compare button{flex:1;min-height:44px}.changes-feedback>.btn{width:100%;min-height:48px}
.changes-summary{border-top:2px solid #b3c8b6;padding:30px 0;max-width:900px;margin:auto}.changes-summary h2{font-size:36px}.cue-recap{list-style:none;padding:0;margin:25px 0;display:grid;grid-template-columns:1fr 1fr;gap:0 30px}.cue-recap li{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid var(--line);font-size:15px}.cue-recap .mark{color:#bbdfc2;font-size:20px}.cue-recap .mark.missed{color:#efb59a}
@media(min-width:621px){html:not(.is-embedded):not(.is-immersive) .changes-plate{height:clamp(410px,calc(100dvh - 310px),720px)}}
.is-immersive #changes-stage{flex:1;min-height:0;display:grid}.is-immersive .changes-plate{height:auto;flex:1;min-height:280px}.is-immersive .observation-frame{min-height:0}.is-immersive .changes-head{flex:none}.is-immersive .changes-summary{flex:1;min-height:0}
@media(max-width:900px) and (min-width:621px){#changes-stage{grid-template-columns:minmax(0,1fr) 225px;gap:18px}.changes-dock{padding-left:18px}.changes-feedback h3{font-size:20px}.change-choices .btn{font-size:12px}}
@media(max-width:620px){.changes-head{gap:12px;margin-bottom:12px}.changes-head h2{font-size:21px}.changes-head p{font-size:12px;max-width:39ch;margin-top:6px}.changes-head>.round-count{white-space:nowrap}#changes-stage{display:flex;flex-direction:column;gap:0}.observation-frame-title{font-size:10px;padding:8px 10px}.changes-plate{height:clamp(310px,42dvh,370px)}.changes-dock{border-left:0;border-top:1px solid var(--line);padding:13px 0 0;margin-top:12px;display:block}.changes-setup{gap:13px}.memory-options legend{font-size:12px;margin-bottom:8px}.memory-options .segmented{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.memory-options .segmented button{font-size:11px;padding:8px 4px;min-height:44px}.changes-setup>.btn{width:100%;min-height:48px}.change-choices{display:grid;grid-template-columns:1fr 1fr;gap:7px}.change-choices .btn{font-size:11px;padding:8px 7px;gap:7px;min-height:53px}.choice-number{width:20px;height:20px;font-size:11px}.changes-message{flex-direction:row;align-items:center;justify-content:space-between;gap:12px;font-size:13px;min-height:48px}.changes-message .btn{max-width:55%;font-size:12px}.observation-seconds{font-size:25px;white-space:nowrap}.observation-seconds small{display:inline;font-size:11px;margin-left:5px}.changes-feedback{gap:13px}.changes-feedback h3{font-size:20px;margin-bottom:7px}.changes-feedback p{font-size:13px;line-height:1.45}.changes-feedback .compare{flex-direction:row;align-items:center;gap:12px}.changes-feedback .compare .segmented{flex:1}.changes-summary h2{font-size:29px}.cue-recap{grid-template-columns:1fr;margin:17px 0}.cue-recap li{font-size:13px;padding:12px 0}.changes-summary .btn{width:100%}.is-immersive #changes-stage{display:flex;flex-direction:column}.is-immersive .observation-frame{flex:1;min-height:0}.is-immersive .changes-plate{min-height:255px}.is-immersive .changes-head h2{font-size:18px}.is-immersive .changes-head p{font-size:11px}.is-immersive .changes-dock{flex:none}.is-immersive [data-phase=feedback] .changes-head p{display:none}}

html:not(.is-embedded){scrollbar-gutter:stable}.is-immersive:not(.is-embedded) #exercise{scrollbar-gutter:stable}#change-instruction{min-height:2.9em}
html.is-immersive:not(.is-embedded){overflow:hidden;scrollbar-gutter:auto}html.is-immersive:not(.is-embedded) #exercise{position:fixed;inset:0;overflow:auto;overscroll-behavior:contain;background:var(--bg)}