@font-face{font-family:'DM Sans';font-style:normal;font-weight:100 1000;font-display:swap;src:url('../assets/fonts/dm-sans.ttf') format('truetype')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('../assets/fonts/manrope.ttf') format('truetype')}
:root{font-family:'DM Sans',sans-serif;color:#293e36;background:#f7f8f5;font-synthesis:none;font-size:13px;--green:#346b54;--muted:#879087;--line:#e5e8e0;--paper:#fffefa}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a,input[type=range]{touch-action:manipulation}button{cursor:pointer}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #92b49d;outline-offset:3px}button:disabled{opacity:.5;cursor:default}button{transition:background .15s,box-shadow .15s,transform .15s}button:hover{filter:brightness(.97)}button:active{transform:translateY(1px)}[hidden]{display:none!important}.app-header{height:82px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 32px;background:#fffefa}.brand{display:flex;align-items:center;text-decoration:none;color:#293e36;font-family:Manrope,sans-serif;font-size:25px;font-weight:800;letter-spacing:-1px;gap:0}.brand-light{font-weight:450;color:#7c8c7b}.brand-mark{width:37px;height:37px;display:grid;place-items:center;background:#386c54;border-radius:10px;color:white;margin-right:11px}.brand-mark svg{width:30px;height:30px}.beta{font:600 9px 'DM Sans',sans-serif;letter-spacing:1.5px;color:#808b7d;border-left:1px solid #dde1d6;padding-left:17px;margin-left:20px}.header-right{display:flex;align-items:center;gap:24px}.local-badge{color:#8b9389;font-size:12px;display:flex;align-items:center;gap:8px}.local-badge i,.drive-status i,.yard-dot,.tiny-dot{width:6px;height:6px;border-radius:50%;background:#71977b;display:inline-block}.button{border:1px solid #dce2d7;background:#fffefa;border-radius:7px;padding:10px 13px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:550;white-space:nowrap}.button.subtle{border:0;background:transparent;padding:8px 0}.help-icon{border:1.5px solid #7b897b;border-radius:50%;width:16px;height:16px;line-height:13px;text-align:center;font-size:11px}.github-label{font-size:21px;text-decoration:none;color:#899484}.app-layout{display:grid;grid-template-columns:300px 1fr;min-height:calc(100dvh - 82px)}.sidebar{border-right:1px solid var(--line);background:#fffefa;display:flex;flex-direction:column}.panel-intro{padding:29px 25px 23px}.eyebrow{font-size:9px;font-weight:650;letter-spacing:1.8px;color:#8a9687}.panel-intro h1{font-family:Manrope,sans-serif;font-size:23px;letter-spacing:-.8px;font-weight:750;margin:9px 0 7px}.panel-intro p{font-size:12px;color:#8a9389;margin:0}.tabs{display:flex;margin:0 24px;border-bottom:1px solid var(--line);gap:27px}.tab{border:0;background:none;padding:0 0 13px;font-size:12px;color:#879087;position:relative;white-space:nowrap}.tab.active{color:#39664e;font-weight:650}.tab.active:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#467858}.tab span{display:inline-block;margin-left:4px;padding:2px 5px;background:#edf0e8;border-radius:4px;font-size:9px}.sidebar-content{padding:20px 25px 24px;flex:1}.units-row{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#91978c;margin-bottom:24px}.segmented{display:flex;padding:3px;background:#f0f2ec;border:1px solid #e8ebe2;border-radius:6px}.segmented button{padding:3px 10px;border:0;border-radius:4px;font-size:11px;background:transparent;color:#8a9287}.segmented button.active{background:white;box-shadow:0 1px 3px #293e3614;color:#3c6048;font-weight:600}.section-title{display:flex;align-items:center;gap:8px}.section-title h2{font-size:13px;font-weight:650;margin:0}.section-symbol{font-size:22px;line-height:17px;color:#6b8d76}.section-tag{font-size:8px;letter-spacing:1px;color:#929b8d;margin-left:auto}.vehicle-preview{height:88px;display:flex;align-items:center;justify-content:center}.vehicle-preview svg{width:216px;height:68px}.car-preview{height:78px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.dimension-field{display:block;font-size:11px;font-weight:500;color:#6f7b6c}.input-wrap{display:flex;align-items:center;position:relative;margin-top:7px;border:1px solid #dfe4d9;background:white;border-radius:6px;height:39px;overflow:hidden}.input-wrap:focus-within{border-color:#71977b;box-shadow:0 0 0 2px #71977b20}.input-wrap input{border:0;background:none;min-width:0;width:100%;padding:10px;font-weight:500;color:#344737;font-variant-numeric:tabular-nums;outline:none;font-size:13px}.input-wrap>span{color:#9ba294;font-size:11px;padding-right:10px}.section-divider{height:1px;background:var(--line);margin:23px 0}.full-field{margin-top:17px}.field-hint{float:right;font-size:9px;font-weight:400;color:#9a9f93;line-height:14px}.rig-summary{margin-top:22px;padding:13px 12px;background:#f0f3eb;border:1px solid #e9eee2;border-radius:6px;display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#7c8774}.rig-summary strong{font-size:15px;font-weight:650;color:#4f6951}.rig-summary small{font-size:10px;font-weight:400}.small-note{font-size:10px;color:#959d90;line-height:1.6;margin:9px 0 0}.toggle-row{display:flex;align-items:center;justify-content:space-between;cursor:pointer}.toggle-row strong{display:block;font-size:11px;font-weight:550}.toggle-row small{font-size:9px;color:#939d8b;display:block;margin-top:5px}.toggle-row input{position:absolute;opacity:0;width:0}.switch{width:29px;height:17px;background:#cad2c5;border-radius:14px;padding:3px}.switch:before{content:'';display:block;border-radius:50%;width:11px;height:11px;background:white;box-shadow:0 1px 2px #0002;transition:transform .2s}.toggle-row input:checked+.switch{background:#547e5c}.toggle-row input:checked+.switch:before{transform:translateX(12px)}.toggle-row input:focus-visible+.switch{outline:3px solid #92b49d}.sidebar-footer{border-top:1px solid var(--line);padding:18px 25px;color:#a0a699;font-size:10px;display:flex;align-items:center;gap:8px}.sidebar-footer .tiny-dot{width:4px;height:4px}.workspace{padding:29px 30px 0;min-width:0;display:flex;flex-direction:column}.workspace-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.workspace-top h2{font-family:Manrope,sans-serif;font-size:21px;font-weight:650;letter-spacing:-.6px;margin:7px 0 0;display:flex;align-items:center;gap:11px}.yard-dot{width:6px;height:6px;background:#93a986}.workspace-top .button{font-size:11px}.workspace-top .button>span{font-size:18px;line-height:14px}.yard-container{position:relative;border:1px solid #dde3d5;border-radius:11px;overflow:hidden;flex:1;min-height:450px;background:#f0f2e9}#yard{display:block;width:100%;height:100%;position:absolute;inset:0;touch-action:none;outline:none}.canvas-toolbar{position:absolute;top:18px;left:18px;display:flex;align-items:center;background:#fffefaed;border:1px solid #dfe5d7;border-radius:8px;padding:5px;box-shadow:0 3px 8px #435a3210;gap:5px}.tool-group{display:flex;gap:4px}.tool-button,.icon-button{border:0;background:none;display:flex;align-items:center;justify-content:center;gap:7px;padding:8px 10px;border-radius:5px;font-size:11px;color:#788473}.tool-button.active{background:#e8eee1;color:#426249;font-weight:600}.tool-button svg,.icon-button svg{height:17px;width:17px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.toolbar-divider{height:20px;width:1px;background:#e5e8df;margin:0 2px}.canvas-top-right{position:absolute;top:26px;right:22px;display:flex;align-items:center;gap:19px}.view-label{font-size:8px;letter-spacing:1.5px;color:#929e87}.north-mark{font-size:9px;display:flex;flex-direction:column;align-items:center;color:#72806a;gap:3px}.north-mark span{font-size:24px;line-height:22px}.instruction-chip{position:absolute;left:50%;top:82px;transform:translateX(-50%);font-size:10px;color:#829077;white-space:nowrap;display:flex;align-items:center;gap:7px;pointer-events:none}.instruction-chip .tiny-dot{width:4px;height:4px}.scale-indicator{position:absolute;bottom:24px;left:24px;display:flex;align-items:center;gap:8px;font-size:10px;color:#89937f}.scale-indicator>span:first-child{width:54px;height:6px;border:1px solid #8c997e;border-top:0}.zoom-controls{position:absolute;bottom:18px;right:18px;display:flex;align-items:center;border:1px solid #dfe5d7;background:#fffefaf0;border-radius:6px;padding:2px;box-shadow:0 2px 6px #435a3208}.zoom-controls button{border:0;background:none;color:#788970;padding:6px 9px;font-size:16px}.zoom-controls>span{font-size:10px;min-width:37px;text-align:center;color:#819076;font-variant-numeric:tabular-nums}.telemetry{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:23px;border:1px solid #e0e6d8;border-radius:9px;background:#fffefaef;padding:15px 19px;box-shadow:0 3px 14px #40502d08}.telemetry>div{min-width:69px}.telemetry>div+div{border-left:1px solid #e6eade;padding-left:20px}.telemetry div>span{font-size:7px;font-weight:550;letter-spacing:1.15px;color:#909c85;display:block;white-space:nowrap}.telemetry strong{font-size:19px;font-weight:500;display:flex;gap:4px;align-items:baseline;margin-top:5px;color:#4b6242;white-space:nowrap}.telemetry b{font-weight:500;font-variant-numeric:tabular-nums}.telemetry small{font-size:10px;font-weight:400;color:#8d9884}.mini-steer{font-size:18px;margin-left:7px;align-self:center;display:block;line-height:16px;color:#708665}.angle-dot{width:5px;height:5px;border-radius:50%;background:#8da878;margin-left:8px;align-self:center}.gear{border:1px solid #e2e7da;padding:7px 8px;border-radius:5px;font-size:12px;color:#7c8c70;background:#f2f5ed;margin-left:-4px}.drive-panel{display:flex;align-items:center;justify-content:space-between;border:1px solid #e0e5d8;border-radius:9px;background:#fffefa;margin-top:15px;padding:20px 23px;gap:24px}.drive-status{font-size:8px;letter-spacing:1.05px;font-weight:600;color:#6d8364;display:flex;align-items:center;gap:7px}.drive-status i{width:5px;height:5px}.drive-caption p{font-size:10px;color:#939d8b;margin:8px 0 0}.steering-control{width:190px;flex-shrink:0}.steering-control>div:first-child{display:flex;justify-content:space-between;font-size:10px;color:#7d8a73}.text-button{background:none;border:0;padding:0;font-size:10px;color:#718669;text-decoration:underline;text-underline-offset:3px}.steering-control .text-button{font-size:9px;color:#929e89}.steering-slider{display:flex;align-items:center;gap:10px;margin:8px 0 4px;color:#829276;font-size:17px}.steering-slider input{width:100%;height:3px;accent-color:#497858;cursor:pointer}.steering-ticks{display:flex;justify-content:space-between;padding:0 25px;font-size:7px;color:#a2ab99;letter-spacing:.7px}.pedal-controls{display:flex;gap:8px}.pedal{display:flex;align-items:center;gap:8px;border:1px solid #dfe5d6;background:#f9faf5;border-radius:6px;padding:11px 12px;font-size:11px;user-select:none;touch-action:none}.pedal>span{font-size:17px}.pedal kbd{color:#97a28b;border:1px solid #e3e8dc;border-radius:3px;background:#fffdf8;font:9px 'DM Sans',sans-serif;padding:1px 4px;margin-left:4px}.pedal.forward{background:#3f7052;color:white;border-color:#3f7052}.pedal.forward kbd{background:#578064;color:#d3e0cb;border-color:#6b8f73}.pedal.pressed{box-shadow:inset 0 0 0 3px #99b17d;filter:brightness(.88)}.brake{background:transparent;border:0;padding:0 6px;color:#89967e;font-size:18px;display:flex;flex-direction:column;justify-content:center;gap:3px;touch-action:none;user-select:none}.brake span{font-size:8px}.workspace-footer{display:flex;align-items:center;justify-content:space-between;color:#a0a994;font-size:9px;padding:16px 2px 19px}.workspace-footer>span{display:flex;align-items:center;gap:4px}.workspace-footer kbd{font:9px 'DM Sans',sans-serif;border:1px solid #dee5d5;border-radius:3px;padding:1px 4px;color:#8c9a80;background:#fcfdf8}.key-gap{width:10px}.workspace-footer>span:last-child{gap:8px}.primary{background:#3f7052;color:white;border-color:#3f7052}.full-width{width:100%}.panel-copy{font-size:12px;line-height:1.7;color:#85907e;margin:15px 0}.wall-list{display:flex;flex-direction:column;gap:7px;margin-top:22px}.wall-item{padding:11px 10px;border:1px solid #e2e6dc;background:#fffefa;border-radius:6px;display:flex;justify-content:space-between;font-size:11px}.wall-item span{font-size:10px;color:#8d9884}.wall-item.active{border-color:#7e9b70;background:#eff3e8}.danger{color:#b47860;margin-left:auto}.yard-actions{display:flex;flex-direction:column;gap:14px;margin-top:25px}.toast{position:absolute;top:122px;left:50%;transform:translateX(-50%);padding:12px 18px;border:1px solid #d4bfa5;border-radius:7px;background:#fff9ed;color:#886747;font-size:11px;text-align:center;max-width:85%;width:max-content;box-shadow:0 4px 15px #6850320e;pointer-events:none}.telemetry strong.warning{color:#ba7456}dialog{border:1px solid #dce4d4;border-radius:15px;padding:35px;max-width:480px;width:calc(100% - 32px);color:#344b3b;background:#fffefa;box-shadow:0 20px 80px #1e382d30}dialog::backdrop{background:#293e3660;backdrop-filter:blur(3px)}.dialog-close{position:absolute;right:12px;top:12px}dialog h2{font-family:Manrope,sans-serif;letter-spacing:-.8px;font-size:29px;margin:10px 0}dialog>p{color:#819077;font-size:12px;line-height:1.6}.help-step{display:flex;gap:18px;margin-top:23px}.help-step>b{font-size:12px;color:#8caa7d;padding-top:1px}.help-step h3{margin:0;font-size:13px;font-weight:600}.help-step p{font-size:12px;line-height:1.7;color:#85907c;margin:5px 0 0}.dialog-note{padding:15px;background:#f0f3e9;border-radius:6px;font-size:10px;margin:25px 0 20px}
@media(min-width:1500px){.app-layout{grid-template-columns:330px 1fr}.sidebar-content{padding-left:30px;padding-right:30px}.panel-intro{padding-left:30px}.workspace{padding:35px 40px 0}.drive-panel{padding:24px 28px}.steering-control{width:240px}.yard-container{min-height:540px}}@media(max-width:1150px){.local-badge{display:none}.workspace{padding:23px 20px 0}.drive-caption{display:none}.drive-panel{gap:15px;padding:18px}.steering-control{width:170px}.telemetry{gap:12px;padding:12px}.telemetry>div+div{padding-left:12px}.scale-indicator{bottom:106px}.zoom-controls{bottom:101px}.workspace-footer>span:last-child{display:none}}@media(max-width:760px){.app-header{height:66px;padding:0 18px}.brand{font-size:21px}.brand-mark{width:32px;height:32px}.beta{display:none}.header-right{gap:15px}.github-label{display:none}.app-layout{display:flex;flex-direction:column;min-height:calc(100dvh - 66px)}.workspace{order:0;padding:20px 14px 0}.sidebar{order:1;border-right:0;border-top:1px solid var(--line);margin-top:3px}.yard-container{height:54dvh;min-height:390px;flex:auto}.workspace-top{margin-bottom:17px}.workspace-top h2{font-size:19px}.workspace-top .eyebrow{font-size:8px}.workspace-top .button{padding:9px;font-size:10px}.drive-panel{padding:14px 10px;gap:12px}.steering-control{width:37%;min-width:105px}.pedal-controls{gap:5px}.pedal{padding:10px 9px;font-size:10px;gap:5px}.pedal kbd{display:none}.brake{padding:0 4px}.instruction-chip{font-size:9px;max-width:85%;white-space:normal;text-align:center}.canvas-toolbar{left:12px;top:12px}.canvas-top-right{right:14px;top:22px}.view-label{display:none}.telemetry{bottom:16px;width:max-content;max-width:95%;padding:12px 14px;gap:15px}.telemetry>div{min-width:58px}.telemetry strong{font-size:18px}.workspace-footer{padding:12px 0}.panel-intro{padding:23px 25px 20px}.sidebar-content{max-width:620px;width:100%;align-self:center}.tabs{margin:0 25px}.sidebar-footer{justify-content:center}.vehicle-preview{height:75px}.field-hint{font-size:10px}}
@media(min-width:761px){.app-layout{height:calc(100dvh - 82px);min-height:660px}.sidebar{min-height:0}.panel-intro,.tabs,.sidebar-footer{flex-shrink:0}.sidebar-content{min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#d5ddce transparent}.yard-container{min-height:350px}.workspace{min-height:0}}
.vehicle-preview svg path{fill-rule:evenodd}
.vehicle-preview svg path:not([fill]){fill:none}
@media(max-width:380px){.drive-panel{flex-wrap:wrap;padding:13px}.steering-control{width:100%}.pedal-controls{width:100%}.pedal{flex:1;justify-content:center}.telemetry{gap:9px;padding:11px 10px}.telemetry>div{min-width:49px}.telemetry>div+div{padding-left:9px}.telemetry .gear{padding:6px}.telemetry strong{font-size:16px}.canvas-toolbar{gap:2px}.tool-button{padding:8px}.workspace-top h2{font-size:17px}.workspace-top .button{font-size:9px}}
