:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#243630;background:#f5f6f2;font-synthesis:none;--orange:#df7544;--border:#e1e6df;--muted:#7b8982;--ink:#243630;--mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;--fl:#218f87;--fr:#e77743;--rl:#9278ba;--rr:#7184af}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:wait}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #f1b28e;outline-offset:3px}button{transition:background .15s,color .15s,border-color .15s}button:hover{filter:brightness(.97)}.topbar{height:64px;padding:0 30px;background:#20332d;color:#f0f2eb;display:flex;align-items:center;justify-content:space-between}.brand{color:inherit;text-decoration:none;display:flex;align-items:center;gap:13px;font-size:12px;letter-spacing:2.5px}.brand strong{font-weight:400;color:#a9b8ab}.brand svg{width:31px;height:29px;fill:none;stroke:#e6a16a;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.topbar-right{display:flex;align-items:center;gap:25px}.local-badge{color:#b6c5b8;font-size:9px;letter-spacing:1.6px;border:1px solid #516158;border-radius:4px;padding:7px 9px}.connection{font-size:11px;display:flex;align-items:center;gap:7px}.connection i{width:6px;height:6px;border-radius:50%;background:#96a69b}.connection.online i{background:#add090}.connection.offline i{background:#ee9b75}.dashboard{max-width:1840px;margin:auto;padding:26px 28px 15px}.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.eyebrow{color:#87938c;font-size:9px;font-weight:600;letter-spacing:1.5px}.eyebrow span{margin:0 10px;color:#aeb8ae}h1{font-size:29px;letter-spacing:-1px;margin:7px 0 5px;font-weight:560}.page-heading p{font-size:12px;color:#7a8880;margin:0}.page-heading p span{padding:0 7px;color:#a6afa9}.world-note{color:#8b978d;font:9px var(--mono);display:flex;align-items:center;gap:8px;letter-spacing:1px}.world-note b{color:#5e7064;letter-spacing:0;font-weight:500;margin-left:8px}.axis-dot{width:7px;height:7px;border-radius:50%;border:2px solid #84a28e}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 318px;grid-template-rows:minmax(450px,calc(100vh - 425px)) auto;gap:16px}.panel{background:#fff;border:1px solid var(--border);border-radius:10px;overflow:hidden;box-shadow:0 2px 5px #21332a03}.scene-panel{position:relative;background:#f0f3ed;display:flex;flex-direction:column;min-height:450px}.scene-toolbar{height:47px;padding:0 16px;position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dfe5db;background:#f7f8f3e8}.scene-label{display:flex;align-items:center;gap:8px;font-size:8px;letter-spacing:1px}.scene-label b{font-weight:600;color:#65776a}.live-dot{width:5px;height:5px;border-radius:50%;background:#9aada0}.scene-label>span:last-child{font-size:10px;letter-spacing:0;color:#7f8f83;border-left:1px solid #d0d8ce;padding-left:9px;margin-left:4px}.view-switch{display:flex;gap:2px;background:#e9ede5;border-radius:5px;padding:3px}.view-switch button{border:0;background:none;color:#7f8b7c;font-size:10px;padding:5px 9px;border-radius:3px}.view-switch button.active{background:#fff;color:#334d3b;box-shadow:0 1px 4px #243b2512}.scene{position:relative;flex:1;min-height:290px;overflow:hidden}.scene canvas{outline:none}.scene-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;background:#f0f3ed;z-index:3;font-size:12px;color:#829184;text-align:center;padding:25px}.scene-loading b{font-weight:500;color:#4d6554}.scene-loading[hidden]{display:none}.loader{height:22px;width:22px;border-radius:50%;border:2px solid #d0dccb;border-top-color:#db8959;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.scene-metrics{position:absolute;top:66px;left:19px;display:flex;gap:28px;pointer-events:none}.scene-metrics div{display:flex;flex-direction:column;gap:6px}.scene-metrics span{font-size:8px;letter-spacing:1.1px;color:#83917f}.scene-metrics strong{font:21px var(--mono);font-weight:400;color:#3a5441;letter-spacing:-1px}.scene-metrics small{font:10px var(--mono);color:#8b9986;letter-spacing:0}.scene-footer{display:flex;align-items:center;justify-content:space-between;font-size:9px;min-height:33px;color:#8a9787;padding:7px 15px;border-top:1px solid #dfe5db;background:#f7f8f3}.scene-footer>span:first-child{display:flex;align-items:center;gap:5px}.scene-footer b{font-weight:400;padding:0 2px;color:#b2bba9}.scene-footer svg{height:13px;width:13px;fill:none;stroke:#8d9b87;stroke-width:1.2;margin-right:4px}.scale-label{letter-spacing:1px;font-size:8px}.scene-legend{position:absolute;bottom:47px;left:18px;display:flex;gap:17px;pointer-events:none}.scene-legend span{display:flex;align-items:center;gap:6px;font-size:9px;color:#75866f}.scene-legend i{display:inline-block;width:16px}.legend-step{border:1px dashed #82967d;height:9px;border-radius:50%}.legend-curve{border-top:2px solid #e19b5e}.legend-prediction{border-top:2px dashed #819780}.controls{grid-row:span 2}.control-section{padding:20px;border-bottom:1px solid #e8ece5}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}.section-heading h2{font-size:12px;font-weight:600;margin:0;letter-spacing:-.1px}.section-heading>span{font:9px var(--mono);color:#bcc4b9}.section-description{font-size:10px;color:#879186;line-height:1.6;margin:0 0 17px}.coordinate-inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px}.coordinate-inputs label>span{font-size:10px;color:#748270;display:flex;justify-content:space-between;margin-bottom:6px}.coordinate-inputs small{color:#a3ae9d;font:10px var(--mono)}.coordinate-inputs input{width:100%;border:1px solid #dde5d8;border-radius:5px;background:#fbfcf9;font:18px var(--mono);color:#3d5641;padding:11px 10px;outline-offset:1px}.go-button{width:100%;background:#df7544;border:1px solid #df7544;color:#fff;font-size:11px;font-weight:600;border-radius:5px;padding:12px 13px;margin-top:11px;display:flex;justify-content:space-between;align-items:center}.go-button span{font-size:17px;line-height:12px;font-weight:400}.quick-targets{display:flex;align-items:center;gap:5px;margin:11px 0 19px}.quick-targets>span{font:8px var(--mono);color:#a7b09f;letter-spacing:1px;margin-right:4px}.quick-targets button{padding:4px 7px;background:#f4f6f0;color:#7c8a73;border:1px solid #e6ebdf;border-radius:4px;font-size:9px}.transport{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:6px}.transport button{border:1px solid #e0e6d9;background:#fff;color:#79876f;border-radius:5px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:10px;height:33px}.transport button.transport-primary{background:#f0f4ec;color:#4e6543;border-color:#dce5d4}.transport button>span{font-size:10px}.parameter{margin-top:18px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px 4px}.parameter label{font-size:10px;color:#65775e}.parameter output{font:11px var(--mono);font-weight:500;color:#3b5633}.parameter output small{font:9px var(--mono);color:#8b9980}.parameter input{grid-column:span 2;width:100%;margin:1px 0 0;accent-color:#d6804d;height:3px;cursor:pointer}.range-ends{grid-column:span 2;display:flex;justify-content:space-between;color:#a3ae99;font:8px var(--mono);margin-top:-2px}.display-section{padding-top:17px;padding-bottom:15px}.display-section .section-heading{margin-bottom:11px}.toggle-row{display:flex;align-items:center;justify-content:space-between;margin:13px 0;font-size:10px;color:#6f8066;cursor:pointer;position:relative}.toggle-row input{position:absolute;right:0;opacity:0;width:27px;height:16px;cursor:pointer}.toggle-row i{width:27px;height:15px;border-radius:10px;background:#dce4d5;position:relative;pointer-events:none;transition:background .15s}.toggle-row i:after{content:"";position:absolute;left:2px;top:2px;width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #25401212;transition:transform .15s}.toggle-row input:checked+i{background:#788e69}.toggle-row input:checked+i:after{transform:translateX(12px)}.toggle-row input:focus-visible+i{outline:3px solid #f1b28e;outline-offset:3px}.model-note{padding:15px 20px;display:flex;align-items:flex-start;gap:10px;background:#fafbf7}.model-note>span{font:10px Georgia,serif;border:1px solid #a8b6a0;color:#8da47e;border-radius:50%;width:12px;height:12px;line-height:11px;text-align:center;margin-top:3px;flex-shrink:0}.model-note p{font-size:9px;line-height:1.7;color:#96a18e;margin:0}.telemetry{display:grid;grid-template-columns:1.1fr 1.1fr .85fr;gap:12px;align-self:start}.telemetry .panel{padding:16px}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:15px}.card-heading h2{font-size:11px;margin:0;font-weight:600;white-space:nowrap}.card-heading>span{font:7px var(--mono);color:#98a48e;letter-spacing:.7px;white-space:nowrap}.state-table>div{display:grid;grid-template-columns:1.2fr .65fr .65fr .65fr;gap:6px;align-items:center;min-height:27px;font-size:9px;border-bottom:1px solid #f0f3eb}.state-table>div:last-child{border-bottom:0}.state-table>div>span{color:#7c8d70;font-size:9px;white-space:nowrap}.state-table small{font:7px var(--mono);color:#a1ad96}.state-table b{font:10px var(--mono);color:#526849;text-align:right}.state-table .state-table-head{min-height:19px;border:0;margin-bottom:2px}.state-table-head>span{font-size:6px!important;text-align:right;color:#a7b29e!important;letter-spacing:.4px}.contact-horizon{display:flex;justify-content:space-between;padding-left:23px;font:7px var(--mono);color:#a0ad93;letter-spacing:.5px;margin-bottom:8px}.contact-horizon span:first-child{color:#668154}.contact-grid{display:flex;flex-direction:column;gap:7px}.contact-row{display:grid;grid-template-columns:17px repeat(var(--stages,12),minmax(0,1fr));gap:3px;align-items:center}.contact-row>span{font:8px var(--mono);font-weight:600}.contact-cell{height:13px;border-radius:2px;background:#f0f3eb;border:1px solid #e2e8da;opacity:.65}.contact-cell.stance{background:var(--leg-color);border-color:var(--leg-color);opacity:.75}.contact-cell.current{outline:1px solid var(--leg-color);outline-offset:1px;opacity:1}.contact-key{display:flex;align-items:center;gap:10px;font-size:7px;color:#9ba98e;margin-top:14px;white-space:nowrap}.contact-key>span{display:flex;align-items:center;gap:4px}.contact-key>span:last-child{margin-left:auto;font:7px var(--mono)}.contact-key i{display:inline-block;width:6px;height:6px;border:1px solid #a8b59a;border-radius:1px;background:#8b9d7a}.contact-key>span:nth-child(2) i{background:#f0f3eb;border-color:#d3ddc9}.force-bars{display:flex;flex-direction:column;gap:11px;margin-top:19px}.force-row{display:grid;grid-template-columns:17px 1fr 42px;gap:7px;align-items:center}.force-row>span{font:8px var(--mono);font-weight:600}.force-row>b{font:9px var(--mono);font-weight:400;color:#728267;text-align:right}.force-track{height:4px;border-radius:3px;background:#eff3e9;overflow:hidden}.force-track i{height:100%;display:block;width:0;border-radius:3px;transition:width .08s}.solver-summary{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #eef2e8;margin-top:17px;padding-top:12px;font:8px var(--mono);color:#8e9e81}.solver-summary span{display:flex;gap:5px;align-items:center;font:8px ui-sans-serif,system-ui}.solver-summary i{width:5px;height:5px;border-radius:50%;background:#9aa98c}.solver-summary b{font-weight:400;white-space:nowrap}.page-footer{display:flex;justify-content:space-between;font-size:8px;color:#a1ad96;margin-top:17px;gap:15px}.page-footer>span:first-child{font:7px var(--mono);letter-spacing:.65px}.page-footer b{font-weight:400;color:#c29d75;padding:0 6px}.error-banner{border:1px solid #e7b7a3;background:#fff0e7;color:#935431;border-radius:6px;padding:10px 14px;font-size:11px;margin-bottom:15px;line-height:1.5}.error-banner[hidden]{display:none}
@media(min-width:1550px){.workspace{grid-template-columns:minmax(0,1fr) 340px}.control-section{padding:23px}.scene-panel{min-height:520px}.telemetry .panel{padding:19px}.state-table>div{min-height:30px}.contact-grid{gap:9px}.contact-cell{height:15px}.force-bars{gap:13px}.force-card .solver-summary{margin-top:22px}.parameter{margin-top:20px}}
@media(max-width:1150px){.dashboard{padding:23px 18px 14px}.topbar{padding:0 22px}.workspace{grid-template-columns:minmax(0,1fr) 290px;gap:12px}.control-section{padding:17px}.telemetry{grid-template-columns:1.1fr 1fr}.force-card{grid-column:span 2}.force-bars{flex-direction:row;gap:20px;margin-top:8px}.force-row{flex:1;grid-template-columns:16px 1fr}.force-row>b{grid-column:2;grid-row:2}.solver-summary{margin-top:10px;padding-top:9px}.scene-footer .scale-label{display:none}.scene-legend{gap:12px}.scene-metrics{gap:20px}.scene-metrics strong{font-size:18px}.page-footer>span:last-child{display:none}.state-table>div{gap:4px}.contact-key{gap:7px}.contact-key>span:last-child{font-size:6px}}
@media(max-width:800px){.dashboard{padding:20px 13px}.topbar{padding:0 16px;height:58px}.local-badge,.world-note{display:none}.brand{font-size:10px;letter-spacing:1.8px}.topbar-right{gap:12px}h1{font-size:26px}.page-heading{margin-bottom:18px}.workspace{display:flex;flex-direction:column}.scene-panel{height:520px}.controls{display:grid;grid-template-columns:1fr 1fr}.control-section{border-right:1px solid var(--border)}.display-section{grid-column:1}.model-note{align-items:center}.telemetry{order:2}.controls{order:1}.scene-toolbar{padding:0 11px}.scene-label{font-size:7px;gap:5px}.view-switch button{font-size:9px;padding:5px 7px}.scene-metrics{gap:22px}.scene-footer{font-size:8px}.scene-legend{font-size:8px;gap:10px}.scene-legend span{font-size:8px}.telemetry .panel{padding:16px}.force-bars{gap:25px}}
@media(max-width:480px){.scene-panel{height:440px;min-height:440px}.scene-metrics{gap:19px;left:14px;top:66px}.scene-metrics span{font-size:6px;letter-spacing:.7px}.scene-metrics strong{font-size:17px}.scene-label>span:last-child{font-size:8px;padding-left:6px;margin-left:0}.view-switch button{font-size:8px;padding:5px 6px}.scene-footer>span:first-child{font-size:7px;gap:3px}.scene-footer svg{display:none}.scene-legend{left:14px;gap:10px;bottom:45px}.scene-legend i{width:11px}.scene-legend span{font-size:6px}.controls{display:block}.control-section{border-right:0;padding:20px}.model-note{padding:18px 20px}.telemetry{grid-template-columns:1fr}.force-card{grid-column:auto}.force-bars{gap:18px}.state-table>div{grid-template-columns:1.1fr .65fr .65fr .65fr;min-height:30px}.state-table b{font-size:11px}.contact-cell{height:18px}.contact-grid{gap:8px}.contact-key>span:last-child{font-size:8px}.card-heading h2{font-size:12px}.page-footer{margin-bottom:5px}.eyebrow{font-size:8px}.connection{font-size:9px}.topbar .brand svg{width:25px}}

/* Public browser runtime startup and touch controls. */
.startup-banner{display:flex;align-items:center;gap:13px;margin-bottom:15px;padding:14px 17px;border:1px solid #dce6d7;border-radius:8px;background:#f7faf3;color:#71836a}
.startup-banner[hidden]{display:none}
.startup-banner>.loader{flex:0 0 22px}
.startup-banner>div{display:flex;flex-direction:column;gap:5px;min-width:0}
.startup-banner b{font-size:12px;font-weight:600;color:#3d5a3c}
.startup-banner #startup-message{font-size:11px;line-height:1.55;overflow-wrap:anywhere}
.scene-footer .touch-hint{display:none}
@media(pointer:coarse){
  .scene-toolbar{height:54px;flex-shrink:0}
  .view-switch button{min-height:40px;min-width:40px}
  .transport button{height:44px}
  .quick-targets button{min-height:40px;padding:8px 10px}
  .go-button{min-height:44px}
  .toggle-row{min-height:40px;margin:5px 0}
  .toggle-row input{height:40px;width:44px;top:50%;transform:translateY(-50%)}
  .parameter input[type="range"]{height:28px;padding:12px 0;background-clip:content-box}
  .scene-footer{min-height:40px}
  .scene-footer .pointer-hint{display:none}
  .scene-footer .touch-hint{display:block;font-size:8px;line-height:1.5}
  .scene-metrics{top:74px}
  .scene-legend{bottom:55px}
}
@media(pointer:coarse) and (max-width:480px){
  .startup-banner{padding:13px;gap:11px}
  .startup-banner b{font-size:11px}
  .startup-banner #startup-message{font-size:10px}
  .scene-footer .touch-hint{font-size:7px}
}

/* Position and desired orientation share one waypoint command. */
.coordinate-inputs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.coordinate-inputs input{min-width:0;padding-left:8px;padding-right:5px;font-size:17px}
.coordinate-inputs label>span{font-size:9px}
.heading-help{margin:9px 0 0;color:#8a9783;font-size:9px;line-height:1.5}
.scene-metrics{gap:23px}
@media(max-width:1150px){.scene-metrics{gap:17px}}
@media(max-width:480px){.scene-metrics{gap:14px}.coordinate-inputs input{font-size:18px}.heading-help{font-size:10px}}

@media(min-width:481px) and (max-width:800px){.controls>.waypoint-section,.controls>.model-note{grid-column:1/-1}}
