:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#203a42;background:#f2f5f3;font-synthesis:none;font-size:14px;--teal:#146e64;--orange:#e98a48;--line:#d9e3df}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select,summary{cursor:pointer}button{border:1px solid #cad7d3;background:#fff;color:#29454b;border-radius:7px;padding:9px 13px;font-weight:600;transition:background .15s}button:hover{background:#eaf1ee}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #e98a48;outline-offset:3px}button:disabled{opacity:.42;cursor:default}header{height:84px;padding:0 36px;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:#193e45;font-size:23px;font-weight:850;letter-spacing:1.5px}.brand-icon{display:grid;place-items:center;background:#183d43;color:#b3e7c4;border-radius:10px;width:43px;height:43px;font-size:32px}.thin{font-weight:400}.brand small{display:block;font-size:8px;letter-spacing:2px;margin-top:5px}.header-note{color:#6b807c;font-size:12px}.header-actions{display:flex;gap:8px}main{max-width:1680px;margin:auto;padding:28px 36px 0}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px;gap:20px}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:800;color:#688179;margin:0 0 10px}h1{font-size:29px;letter-spacing:-.9px;margin:0 0 8px;font-weight:650}.intro p:not(.eyebrow){margin:0;color:#6c807b;font-size:13px}.scenario-label{font-size:9px;letter-spacing:1.2px;color:#687d75;font-weight:700;min-width:220px}.scenario-label select{display:block;margin-top:8px}.workspace{display:grid;grid-template-columns:282px minmax(0,1fr);gap:20px;align-items:start}.design-panel{border:1px solid var(--line);border-radius:12px;background:white;overflow:hidden}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}h2{font-size:14px;font-weight:700;margin:0}.design-panel>.panel-heading{padding:19px 19px 15px}.tag{font-size:8px;font-weight:700;letter-spacing:1.2px;color:#799087;background:#f0f4f1;border-radius:4px;padding:5px 6px}.control-section{padding:15px 19px;border-top:1px solid #e6ede8}.control-section.compact{padding:11px 19px}h3{font-size:12px;display:flex;align-items:center;gap:9px;margin:0 0 14px}.zone-num{border-radius:5px;padding:5px 6px;color:white;font-size:10px}.z1{background:#42a888}.z2{background:#5c9dcc}.z3{background:#db965b}.control-section label{display:block;font-size:11px;font-weight:600;margin:14px 0 5px}output{float:right;font-variant-numeric:tabular-nums;color:#176e63;font-weight:750}input[type=range]{display:block;width:100%;margin:13px 0 8px;accent-color:#287f70;height:5px;cursor:pointer}select{border:1px solid #d9e3de;border-radius:6px;padding:10px;color:#29454b;background:#fafcfb;width:100%;font-size:11px}.control-section select{margin-top:7px}.micro{font-size:10px;line-height:1.6;color:#7a8c86;margin:6px 0}.compact h3{margin-bottom:4px}.compact .micro{padding-left:33px}details{margin-top:17px}summary{font-size:11px;color:#397568;font-weight:650}.prediction{background:#ecf5ef;margin:0 12px 12px;padding:13px;border:1px solid #d3e6d9;border-radius:8px}.prediction>span{font-size:8px;letter-spacing:1px;font-weight:750;color:#648475}.prediction strong{display:block;font-size:24px;margin-top:5px}.prediction p{font-size:10px;line-height:1.5;margin:7px 0 0;color:#5f7b6b}.experiment{min-width:0}.viewport{height:460px;background:#b4c6aa;position:relative;overflow:hidden;border-radius:12px 12px 0 0}.viewport>canvas,#scene3d,#scene3d canvas{position:absolute;width:100%;height:100%;inset:0;display:block}#scene2d{touch-action:none}.view-top{position:absolute;inset:17px 17px auto;display:flex;justify-content:space-between;gap:12px;pointer-events:none}.view-top>*{pointer-events:auto}.live-pill{background:#16383bea;color:#f5faf5;border:1px solid #ffffff26;border-radius:6px;padding:9px 11px;display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:1px;font-weight:650}.live-pill i{width:6px;height:6px;border-radius:50%;background:#a9d9a6}.segmented{display:flex;background:#ffffffed;padding:3px;border-radius:7px;box-shadow:0 2px 10px #173c3420}.segmented button{border:0;font-size:10px;background:transparent;padding:7px 10px}.segmented button[aria-pressed=true]{background:#183f42;color:white}.zone-legend{position:absolute;top:69px;left:19px;display:flex;gap:12px;background:#fffdf3d9;padding:7px 9px;border-radius:5px;font-size:9px;font-weight:650;color:#365048;pointer-events:none}.zone-legend i,.chart-key i{display:inline-block;width:7px;height:7px;margin-right:4px;border-radius:2px}.view-bottom{position:absolute;bottom:15px;left:17px;right:17px;display:flex;gap:10px;align-items:center}.toggle{font-size:10px;font-weight:650;border-radius:6px;background:#fffef2e8;padding:8px;display:flex;align-items:center;gap:5px}.toggle input{accent-color:#207366}.view-bottom button{font-size:10px;background:#fffef2e8;border:0}.view-bottom>span{margin-left:auto;background:#173b39d6;color:#fff;padding:6px 8px;border-radius:4px;font-size:9px}.transport{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#fff;border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px;gap:12px}.run-actions{display:flex;gap:7px}.transport button{font-size:11px}.primary{background:#186b5d;color:white;border-color:#186b5d;padding:10px 19px}.primary:hover{background:#125647}.time{font-size:11px;color:#778b83;font-variant-numeric:tabular-nums}.time span{font-size:21px;color:#274b44;font-weight:600}.rate{font-size:9px;display:flex;align-items:center;gap:8px;color:#7a8c86}.rate select{width:62px;padding:7px}.telemetry{display:grid;grid-template-columns:repeat(4,1fr);margin:15px 0;border:1px solid var(--line);border-radius:10px;background:white;padding:17px 0}.telemetry>div{padding:0 20px;border-right:1px solid #e2eae6}.telemetry>div:last-child{border:0}.telemetry span{display:block;font-size:8px;letter-spacing:1.1px;color:#7c9088;font-weight:700;margin-bottom:7px}.telemetry strong{font-size:24px;font-weight:600;font-variant-numeric:tabular-nums}.telemetry small{font-size:10px;font-weight:500;color:#7a8d87}.data-row{display:grid;grid-template-columns:1.55fr 1fr;gap:15px}.chart-panel,.sensors{background:white;border:1px solid var(--line);border-radius:10px;padding:16px;min-width:0}.chart-panel h2,.sensors h2{font-size:12px}.chart-key{font-size:8px;white-space:nowrap;color:#6c827a}.chart-key i{background:#2b967b;border-radius:50%;width:5px;height:5px;margin-left:7px}.chart-key .baseline-key{background:#acb9c2}#chart{width:100%;height:142px;display:block;margin-top:12px}#gates{display:flex;gap:8px;margin:16px 0 10px}#gates>div{background:#f4f7f4;border:1px solid #e3eae3;flex:1;padding:10px 6px;border-radius:5px;text-align:center}#gates span{display:block;font-size:9px;color:#728780}#gates strong{display:block;margin:5px 0;font-size:17px;font-weight:600}#gates small{font-size:8px;color:#799086}.results{margin-top:25px;padding:23px;background:#fff;border:1px solid var(--line);border-radius:12px}.result-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.result-heading h2{font-size:20px;font-weight:600}.result-heading button{font-size:10px;margin-left:6px}#result-summary{background:#f4f7f3;border-left:3px solid #89b497;padding:12px;margin:20px 0;color:#597467;font-size:12px;line-height:1.6}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:11px;white-space:nowrap}th{font-size:9px;font-weight:650;color:#7b8d86;letter-spacing:.3px;padding:10px 8px;border-bottom:1px solid #dce5df}td{padding:14px 8px;border-bottom:1px solid #eaf0eb}td button{font-size:9px;padding:5px 8px}.empty{color:#97a69e;text-align:center;padding:23px}.footnote{font-size:9px;color:#7d8e87;line-height:1.6;margin-bottom:0}footer{display:flex;justify-content:space-between;padding:25px 0 30px;align-items:center;font-size:9px;color:#7a8c83}footer b{color:#247563}footer button{border:0;background:transparent;font-size:10px;padding:0}#fbd{position:absolute;right:17px;top:70px;width:245px;background:#16363aec;color:white;padding:14px;border-radius:8px;box-shadow:0 6px 25px #0002}#fbd h4{margin:0;font-size:11px}#fbd h4 span{display:block;font-size:8px;margin-top:5px;color:#acc6be;letter-spacing:1px}#fbd svg{width:100%;height:133px}#fbd text{fill:#d7e8e5;font-size:10px}#fbd p{font-size:9px;line-height:1.5;color:#b7cdc5;margin:0}dialog{border:0;border-radius:14px;padding:32px;max-width:640px;width:calc(100% - 32px);color:#2e4d43;box-shadow:0 30px 150px #0005}dialog::backdrop{background:#0b262a99;backdrop-filter:blur(4px)}dialog h2{font-size:25px;margin:0 0 20px}dialog h3{margin-top:23px}dialog p,dialog li{font-size:13px;line-height:1.8}dialog a{color:#14786a}.close{position:absolute;right:12px;top:12px;border:0;font-size:22px;padding:3px 8px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#193f37;color:white;padding:12px 20px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .2s;font-size:12px;z-index:100}#toast.show{opacity:1}[hidden]{display:none!important}@media(min-width:1450px){.viewport{height:540px}.workspace{grid-template-columns:305px minmax(0,1fr)}}@media(max-width:1100px){header{padding:0 22px}.header-note{display:none}main{padding:25px 22px 0}.workspace{grid-template-columns:255px minmax(0,1fr);gap:15px}.telemetry>div{padding:0 12px}.telemetry strong{font-size:20px}.view-bottom>span{display:none}.chart-key{display:none}.intro h1{font-size:25px}.viewport{height:425px}}@media(max-width:780px){header{height:auto;padding:17px;gap:15px;flex-wrap:wrap}.header-actions button{font-size:10px;padding:8px}.brand{font-size:19px}main{padding:20px 14px}.intro{align-items:start;flex-direction:column}.intro h1{font-size:25px}.scenario-label{width:100%}.workspace{display:flex;flex-direction:column}.design-panel{width:100%}.design-panel form{display:grid;grid-template-columns:1fr 1fr}.control-section:last-child{grid-column:1/-1}.control-section:last-child>label{display:inline-block;width:calc(50% - 9px);vertical-align:top;margin-right:6px}.control-section:last-child>.micro{max-width:90%}.prediction{margin:12px}.experiment{width:100%}.viewport{height:410px}.data-row{grid-template-columns:1fr 1fr;gap:10px}.chart-panel,.sensors{padding:12px}.telemetry>div{padding:0 10px}.telemetry strong{font-size:18px}.telemetry small{display:block;margin-top:3px}.telemetry span{font-size:7px}.result-heading{align-items:start;flex-direction:column}.results{padding:17px}.result-heading button{margin:0 5px 0 0}.view-top{inset:12px 10px auto}.segmented button{font-size:9px;padding:7px}.live-pill{font-size:8px;padding:8px}.zone-legend{font-size:8px;left:10px;gap:7px}.transport{padding:10px}.transport button{font-size:10px;padding:9px}.rate{font-size:0}.time span{font-size:18px}.run-actions{gap:4px}footer{gap:20px;align-items:start}#fbd{width:220px}.data-row{grid-template-columns:1fr}.chart-key{display:block}}

#follow[aria-pressed=true]{background:#173e37;color:white}.view-bottom{flex-wrap:wrap}@media(max-width:420px){.zone-legend{gap:5px;font-size:7px}.live-pill{max-width:140px}.telemetry>div{padding:0 7px}.view-bottom{gap:5px}.view-bottom button,.toggle{font-size:9px}header{padding:14px}.intro h1{font-size:23px}.control-section:last-child>label{width:100%}}

.gate-row{padding:9px 0;border-top:1px solid #e4ebe5}.gate-row .gate-head{display:flex;align-items:center;gap:6px}.gate-head b{color:#21715f}.gate-head select{padding:5px;font-size:10px}.gate-head button{padding:2px 7px;font-size:14px}.gate-row label{margin-top:8px;font-size:10px}.gate-editor>button{font-size:10px;width:100%;margin-top:8px}#gates{display:grid;grid-template-columns:repeat(3,1fr)}.impact-panel{background:white;border:1px solid var(--line);border-radius:10px;padding:17px;margin-top:15px}.impact-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:17px 0;color:#6f847a;font-size:9px}.impact-stats strong{display:block;color:#284c40;font-size:18px;font-weight:600;margin-top:6px;font-variant-numeric:tabular-nums}#impact-chart{display:block;width:100%;height:125px}.impact-slow{display:flex;align-items:center;gap:7px;margin:10px 3px 0;color:#607b6d;font-size:10px}.impact-slow input{accent-color:#217361}.view-bottom{z-index:3}.view-bottom button[aria-pressed=true]{background:#183f39;color:#fff}.view-bottom>span{font-size:8px}.view-top{z-index:3}.zone-legend{z-index:2}#cockpit{position:absolute;inset:0;pointer-events:none}.dashboard{position:absolute;bottom:-4px;left:0;right:0;height:105px;background:linear-gradient(#313a3e,#171e24);border-top:8px solid #626865;border-radius:55% 35% 0 0;box-shadow:0 -4px 6px #0002;color:#bed9d1;display:flex;align-items:center;gap:10px;padding-left:19%;padding-bottom:20px}.dashboard strong{font-size:31px;font-variant-numeric:tabular-nums}.dashboard small{font-size:12px}.dashboard>span:last-child{margin-left:auto;margin-right:15%;font-size:9px;letter-spacing:1px;color:#8ca29a}.wheel{font-size:85px;line-height:80px;color:#12191c;text-shadow:0 -2px 1px #61696c;margin-right:20px}.windshield-left,.windshield-right{position:absolute;top:-20px;bottom:40px;width:17px;background:#3a454b}.windshield-left{left:2%;transform:rotate(-17deg)}.windshield-right{right:2%;transform:rotate(17deg)}#force-breakdown{display:block;color:#ffd2aa;margin-bottom:7px}#fbd{z-index:4}.gate-editor .micro{font-size:10px}@media(max-width:780px){.gate-editor{grid-column:1/-1}.impact-stats{grid-template-columns:repeat(3,1fr)}.view-bottom{bottom:10px;gap:5px}.view-bottom button{padding:7px;font-size:9px}.dashboard{padding-left:10%}.wheel{margin-right:4px}.impact-stats strong{font-size:17px}}
/* Force projections are outside the scene: no mixing ground-plane and vertical axes. */
#fbd.force-panel{position:static;width:auto;margin:14px 0;padding:18px;background:#fff;color:#203a42;border:1px solid var(--line);border-radius:10px;box-shadow:none}
#fbd .force-intro,#fbd .force-note,#fbd .force-context{font-size:11px;line-height:1.6;color:#596f64;margin:10px 0}#fbd .force-note{font-size:10px;color:#718377}
.force-views{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.force-view{background:#f6f9f6;border-radius:7px;padding:10px;min-width:0}.force-view.resultant{background:#eff4f8;border:1px dashed #b4c6d1}
#fbd .force-view h3{font-size:10px;margin:0}#fbd svg{width:100%;height:auto;display:block}#fbd svg text{fill:#526e61;font-size:10px}
.force-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.force-values>div{border-bottom:1px solid #e0e9e3;padding:9px 4px;font-size:11px}.force-values strong,.force-values small{display:block;margin-top:5px}.force-values strong{font-size:16px}.force-values small{font-size:10px;color:#6e8175}
#fbd .force-equation{font-size:12px;color:#28445a;margin:13px 0;font-weight:650}.force-context{padding:9px 12px;background:#f0f5ed;border-radius:5px}
@media(max-width:1000px){.force-views{grid-template-columns:1fr 1fr}.force-view.resultant{grid-column:1/-1}.force-view.resultant svg{max-width:260px;margin:auto}}@media(max-width:480px){.force-views{grid-template-columns:1fr}.force-view svg{max-width:300px;margin:auto}.force-values{grid-template-columns:1fr}.force-values>div{display:grid;grid-template-columns:1fr auto;align-items:center}.force-values small{grid-column:1/-1}}
#custom-barrier{padding:3px 9px 8px;background:#f2f6ed;border-radius:6px}