@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=Barlow:wght@400;500;600;700&display=swap');
:root{font-family:'Barlow',Arial,sans-serif;color:#f2f4f5;background:#161b20;color-scheme:dark;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible{outline:2px solid #ff781f;outline-offset:3px}#simulator{height:100dvh;min-height:360px;position:relative;overflow:hidden}#scene{display:block;width:100%;height:100%;outline:none;touch-action:none}.topbar{position:absolute;left:0;top:0;right:0;height:78px;background:#171c21;display:flex;align-items:center;justify-content:space-between;padding:0 30px;border-bottom:1px solid #394148}.identity,.header-right{display:flex;align-items:center;gap:24px}.wordmark{font-family:Arial,sans-serif;font-size:31px;font-weight:900;letter-spacing:1px;position:relative;font-style:italic;line-height:1}.wordmark span{display:block;height:5px;background:#fa6418;margin-top:4px}.model{display:flex;flex-direction:column;border-left:1px solid #485058;padding-left:24px;gap:4px}.model strong{font-size:19px;font-weight:600;letter-spacing:.04em}.model>span,.session{font-size:12px;letter-spacing:.13em;color:#b1bac1}.session{display:flex;align-items:center;gap:12px}.session i{display:inline-block;width:3px;height:3px;background:#8d979e}.header-right{gap:10px}.header-right .session{margin-right:22px}.icon-button{width:37px;height:37px;border:1px solid #434b52;background:none;border-radius:5px;font-size:20px;display:grid;place-items:center}.icon-button.on{color:#ff822f;border-color:#ff822f}.camera-toolbar{position:absolute;top:99px;left:30px;display:flex;align-items:center;gap:15px;flex-wrap:wrap}.toolbar-label{font-size:12px;letter-spacing:.13em;text-shadow:0 1px 4px #000}.camera-buttons{display:flex;background:#1a2026eb;border:1px solid #66727b4d;padding:4px;border-radius:7px;box-shadow:0 4px 15px #0002}.camera-buttons button{border:0;background:transparent;padding:10px 15px;font-size:14px;color:#c7ced2;border-radius:4px}.camera-buttons button.active{background:#f5f5f3;color:#1d2227}.camera-buttons kbd{margin-left:8px;opacity:.6;font-size:11px}.camera-toolbar>span:last-child{font-size:13px;color:#e4e8eb;text-shadow:0 1px 5px #000;display:none}.telemetry{position:absolute;right:30px;top:100px;width:230px;padding:19px 20px 0;background:#192027ed;border:1px solid #58636d70;border-radius:8px;box-shadow:0 10px 40px #0002}.speed-line{display:flex;align-items:center;gap:17px}.speed-line>#gear{display:grid;place-items:center;border:1px solid #5b646c;border-radius:4px;width:30px;height:36px;color:#ff853f;font-size:18px}.speed-line strong{font-family:'Barlow Condensed',Arial,sans-serif;font-size:53px;line-height:1;font-weight:500;font-variant-numeric:tabular-nums}.unit{font-size:13px;color:#b7c0c6;padding-left:9px}.gauge{height:3px;background:#424b53;margin:18px 0}.gauge i{display:block;background:#fc6a20;width:0;height:100%;transition:width .12s}.telemetry-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;font-size:13px;gap:8px}.telemetry-row>span{color:#b4bdc4}.telemetry-row strong{font-weight:500;white-space:nowrap}.telemetry-row small{font-weight:400;color:#b4bdc4}.telemetry-foot{border-top:1px solid #46515a;display:flex;justify-content:space-between;padding:13px 0;color:#9daab3;font-size:10px;letter-spacing:.06em}.telemetry-foot b{font-weight:500}.operation-prompt{position:absolute;bottom:88px;left:50%;transform:translateX(-50%);padding:14px 16px;display:flex;align-items:center;gap:14px;background:#182129ef;border:1px solid #626e7960;border-radius:8px;box-shadow:0 7px 25px #0002;min-width:600px}.operation-prompt>div{display:flex;flex-direction:column;gap:5px;flex:1}.operation-prompt strong{font-size:15px;font-weight:600}.operation-prompt span{font-size:13px;color:#b4c0c8}#prompt-dot{width:7px;height:7px;border-radius:50%;background:#f28442;flex-shrink:0}.operation-prompt.ready{border-color:#68c48b}.operation-prompt.ready #prompt-dot{background:#79d698}.pickup{white-space:nowrap;padding:12px 15px;border:1px solid #6e7a85;border-radius:4px;background:#37434e;font-size:12px;letter-spacing:.03em}.pickup kbd{font-size:10px;opacity:.7;margin-left:7px}.ready .pickup{background:#e4f3e8;color:#203f2a}.loaded .pickup{background:#f16b21;color:white}.mobile-controls{display:none}footer{position:absolute;bottom:0;left:0;right:0;min-height:48px;background:#171c21ef;border-top:1px solid #4b555b66;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:10px 30px;font-size:12px;color:#b5bec5}footer>div{display:flex;align-items:center;gap:10px}.keys{font-family:monospace;letter-spacing:3px;color:#f1f3f5;margin-left:8px}.keys:first-child{margin-left:0}footer button{background:none;border:none;color:#dde1e5;font-size:12px}.footer-note{color:#8c989f}#toast{position:absolute;top:163px;left:30px;max-width:430px;background:#2b241cec;border:1px solid #e6a15b77;padding:12px 16px;border-radius:6px;font-size:14px;opacity:0;transform:translateY(-4px);transition:.2s;pointer-events:none}#toast.visible{opacity:1;transform:none}#loading{position:absolute;inset:78px 0 0;background:#202930;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;z-index:20}#loading>span:last-child{font-size:14px;color:#b3bdc5}.loader{width:32px;height:32px;border:2px solid #525c65;border-top-color:#ff792b;border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}dialog{max-width:560px;width:calc(100% - 30px);max-height:calc(100dvh - 28px);overflow:auto;border:1px solid #56616a;background:#202830;color:#eff3f6;border-radius:12px;padding:35px;box-shadow:0 20px 100px #0007}dialog::backdrop{background:#071018b8;backdrop-filter:blur(6px)}.close{position:absolute;right:14px;top:10px;border:0;background:none;font-size:28px;color:#b6c1ca}.eyebrow{font-size:12px;letter-spacing:.15em;color:#ff8845}h1{font-family:'Barlow Condensed',Arial,sans-serif;font-size:35px;font-weight:500;margin:13px 0}dialog p{font-size:15px;line-height:1.55;color:#c1cbd2}.help-grid{display:grid;grid-template-columns:1fr auto;gap:14px;border-top:1px solid #4a5660;border-bottom:1px solid #4a5660;padding:20px 0;font-size:14px;margin:20px 0}.help-grid b{font-weight:500;color:#f7ba90}.reference-note{background:#151c22;padding:15px;font-size:12px;color:#aebac3;line-height:1.6;border-radius:5px}.reference-note a{display:inline-block;color:#ffac72;margin-top:8px}.primary{margin-top:22px;background:#fa6b23;border:0;border-radius:5px;width:100%;padding:13px;color:#fff;font-weight:600}.paused-label{color:#ffc08c}
@media(min-width:1450px){.camera-toolbar>span:last-child{display:block}}
@media(max-width:1050px){.session,.footer-note{display:none!important}.topbar{padding:0 20px}.camera-toolbar{left:20px}.telemetry{right:20px}.operation-prompt{min-width:560px}footer{padding:10px 20px}}
@media(pointer:coarse),(max-width:760px){.topbar{height:60px;padding:0 16px}.wordmark{font-size:24px}.identity{gap:14px}.model{padding-left:14px;gap:3px}.model strong{font-size:16px}.model>span{font-size:9px;letter-spacing:.07em}.header-right{gap:6px}.icon-button{width:30px;height:32px;font-size:17px}.camera-toolbar{left:15px;top:74px;gap:0}.toolbar-label{display:none}.camera-buttons button{font-size:12px;padding:8px 10px}.camera-buttons kbd{display:none}.telemetry{top:74px;right:15px;width:167px;padding:11px 12px 0}.speed-line{gap:10px}.speed-line strong{font-size:37px}.speed-line>#gear{height:28px;width:25px;font-size:14px}.unit{font-size:11px}.gauge{margin:10px 0}.telemetry-row{font-size:11px;margin-bottom:10px}.telemetry-foot{font-size:8px;padding:8px 0}.mobile-controls{display:block;position:absolute;inset:0;pointer-events:none}.mobile-controls>div{position:absolute;bottom:46px;pointer-events:auto}.mobile-controls>div>span{display:block;text-align:center;font-size:10px;letter-spacing:.1em;margin-bottom:7px;color:#e2e9ee;text-shadow:0 1px 5px #000}.mobile-controls button{touch-action:none;user-select:none;-webkit-user-select:none;width:59px;height:59px;border:1px solid #9aabb880;background:#202c38d9;border-radius:9px;font-size:26px;box-shadow:0 5px 15px #0002;backdrop-filter:blur(4px)}.mobile-controls button.pressed{background:#e66b2ce8;border-color:#ffad7d}.touch-steer{left:17px}.touch-steer>div,.touch-hydraulic>div{display:flex;gap:9px}.touch-drive{right:17px;display:flex;flex-direction:column;gap:7px}.touch-drive>span{margin-bottom:0!important}.touch-drive button{background:#253748e6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.touch-drive small{font-size:9px;font-weight:600}.touch-hydraulic{left:50%;transform:translateX(-50%)}.touch-hydraulic button{width:44px;height:48px;font-size:23px}.operation-prompt{min-width:0;width:calc(100% - 34px);bottom:195px;padding:11px 12px;gap:10px}.operation-prompt strong{font-size:12px}.operation-prompt span{font-size:11px}.pickup{padding:11px 9px;font-size:10px}.pickup kbd{display:none}footer{min-height:32px;padding:7px 17px;justify-content:flex-end;font-size:11px}footer>div{display:none}footer button{font-size:11px}#toast{left:15px;top:120px;width:calc(100% - 206px);font-size:12px;padding:10px}#loading{inset:60px 0 0}}
@media(max-width:430px){.header-right{gap:4px}#lights{display:none}.model>span{max-width:95px;line-height:1.2}.camera-buttons{padding:3px}.camera-buttons button{padding:8px}.telemetry{width:156px}.operation-prompt>div>span{max-width:200px}.touch-steer{left:12px}.touch-steer>div{gap:6px}.touch-steer button{width:52px;height:57px}.touch-drive{right:12px}.touch-hydraulic{left:54%}.touch-hydraulic>div{gap:5px}.touch-hydraulic button{width:37px}}
@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){.topbar{height:51px}.camera-toolbar,.telemetry{top:62px}.telemetry{width:169px}.telemetry .telemetry-row{margin-bottom:7px}.telemetry-foot{display:none}.camera-buttons button{padding:6px 9px}.operation-prompt{width:390px;bottom:41px;padding:8px 10px}.operation-prompt strong{font-size:11px}.operation-prompt span{font-size:10px}.pickup{padding:9px 7px;font-size:9px}.mobile-controls>div{bottom:40px}.touch-steer button{width:56px;height:56px}.touch-drive{display:grid;grid-template-columns:56px 56px;gap:8px}.touch-drive>span{grid-column:1/3}.touch-drive button{width:56px;height:56px}.touch-hydraulic{left:50%;bottom:113px!important}.touch-hydraulic>span{display:none!important}.touch-hydraulic button{width:43px;height:37px}.operation-prompt>div>span{max-width:220px}#toast{top:108px;width:330px}#loading{inset:51px 0 0}}
.mobile-controls{display:block;position:absolute;inset:0;pointer-events:none}.touch-hydraulic{position:absolute;right:30px;top:352px;left:auto;bottom:auto;transform:none;width:230px;background:#192027ed;border:1px solid #58636d70;border-radius:8px;padding:14px;pointer-events:auto}.touch-hydraulic>span{display:block;text-align:center;font-size:12px;color:#c5d0d9;letter-spacing:.04em}.touch-hydraulic>div{display:flex;gap:10px;margin:11px 0}.touch-hydraulic button{touch-action:none;user-select:none;-webkit-user-select:none;display:flex;align-items:center;justify-content:center;gap:6px;flex:1;width:auto;height:58px;border:1px solid #84939f;border-radius:6px;background:#34444f;font-size:22px}.touch-hydraulic button.pressed{background:#d96220;border-color:#ffb783}.touch-hydraulic button small{font-size:12px;font-weight:700}.touch-hydraulic button kbd{font-size:11px;opacity:.7}.touch-hydraulic .hydraulic-instruction{font-size:11px;margin-top:7px;color:#a4b1bb;letter-spacing:0}.pickup>span{font-size:inherit;color:inherit}.touch-steer,.touch-drive{display:none}
@media(max-width:1050px){.touch-hydraulic{right:20px}}
@media(pointer:coarse),(max-width:760px){.touch-steer{display:block}.touch-drive{display:flex}.touch-hydraulic{left:54%;right:auto;top:auto;bottom:48px;transform:translateX(-50%);width:auto;background:none;border:0;padding:0}.touch-hydraulic>span{font-size:10px;letter-spacing:0;text-shadow:0 1px 4px #000}.touch-hydraulic>div{margin:6px 0;gap:6px}.touch-hydraulic button{width:47px;height:58px;flex-direction:column;gap:0;font-size:22px}.touch-hydraulic button small{font-size:9px}.touch-hydraulic button kbd,.touch-hydraulic .hydraulic-instruction{display:none}.touch-hydraulic #hydraulic-status{font-size:9px;max-width:100px}}
@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){.touch-drive{display:grid}.touch-hydraulic{left:50%;bottom:111px!important}.touch-hydraulic button{width:72px;height:38px;flex-direction:row;gap:5px}.touch-hydraulic>span{display:none!important}.touch-hydraulic>div{margin:0}.touch-hydraulic button small{font-size:10px}}
@media(pointer:fine) and (min-width:761px) and (max-height:650px){.touch-hydraulic{top:auto;bottom:57px}.operation-prompt{left:24px;transform:none;min-width:0;width:calc(100% - 305px)}}
.speed-control{margin:-2px 0 17px}.speed-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;letter-spacing:.04em;margin-bottom:7px;color:#bac6cf}.speed-caption strong{color:#f6b282;font-size:12px;font-weight:500;letter-spacing:0}.speed-options{display:flex;gap:6px}.speed-options button{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:41px;border:1px solid #586875;border-radius:4px;background:#293741;font-size:14px}.speed-options button small{font-size:10px;white-space:nowrap}.speed-options button.active{background:#d75d20;border-color:#ffaa79;color:#fff}.touch-hydraulic{top:425px}
@media(pointer:fine) and (min-width:761px) and (max-height:650px){.touch-hydraulic{left:25px;right:auto;top:170px;bottom:auto}}
@media(pointer:coarse),(max-width:760px){.speed-control{margin:0 0 10px}.speed-caption{font-size:9px;margin-bottom:5px}.speed-caption strong{font-size:10px}.speed-options{gap:4px}.speed-options button{min-height:36px;font-size:12px}.speed-options button small{font-size:9px}.touch-hydraulic{top:auto}}
@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){.speed-control{position:fixed;top:62px;left:240px;right:201px;margin:0;padding:6px 9px;background:#192027ed;border:1px solid #58636d70;border-radius:6px}.speed-caption{display:none}.speed-options button{min-height:31px;flex-direction:row;gap:5px}}

.operation-tools{position:absolute;left:30px;top:161px;width:260px;max-width:calc(100% - 315px);display:flex;flex-direction:column;align-items:flex-start;gap:9px;pointer-events:none}
#horn{display:flex;align-items:center;justify-content:center;gap:10px;min-width:143px;min-height:48px;padding:10px 14px;border:1px solid #c5a764;background:#292d2bee;color:#ffe6a4;border-radius:7px;touch-action:none;user-select:none;-webkit-user-select:none;pointer-events:auto;box-shadow:0 4px 18px #0003;font-weight:600;font-size:14px}
#horn svg{width:23px;height:23px;flex-shrink:0}#horn kbd{border:1px solid #88774c;padding:2px 5px;border-radius:3px;margin-left:6px;font-size:12px}#horn.pressed{background:#f4bb40;color:#292211;border-color:#ffdc85}
#sound-state{font-size:12px;color:#edf0ed;text-shadow:0 1px 4px #000,0 1px 8px #000}
.timer-panel{width:100%;padding:15px;background:#192027f2;border:1px solid #65788780;border-radius:8px;box-shadow:0 7px 25px #0002;pointer-events:auto}
.timer-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px;font-weight:600;letter-spacing:.045em}.timer-heading>span{color:#ffae77;letter-spacing:0}.timer-goal{font-size:14px;color:#b7c5cd;margin:7px 0 10px;line-height:1.3}
.timer-readout{display:flex;align-items:baseline;gap:9px}.timer-readout strong{font-family:'Barlow Condensed',Arial,sans-serif;font-size:46px;line-height:1;font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:.02em}.timer-readout>span{font-size:12px;color:#bbc6ce}
.timer-elapsed{display:flex;justify-content:space-between;font-size:13px;color:#b8c6cf;margin:6px 0 12px}.timer-elapsed b{font-variant-numeric:tabular-nums;font-weight:500;color:#e3eaee}
.timer-settings{display:flex;align-items:center;gap:8px;font-size:14px}.timer-settings input{width:65px;min-height:35px;padding:5px 7px;border:1px solid #798996;border-radius:4px;background:#26343e;color:#fff;font:inherit;font-size:16px;touch-action:manipulation}.timer-settings label{flex:1}.timer-settings input:disabled{opacity:.65}.timer-settings input:focus-visible{outline:2px solid #ffac71;outline-offset:2px}
.timer-actions{display:flex;gap:7px;margin-top:10px}.timer-actions button{flex:1;min-width:0;min-height:38px;padding:7px 8px;border:1px solid #fa8c50;border-radius:4px;background:#e16623;color:#fff;font-size:14px;font-weight:600}.timer-actions #timer-cancel{border-color:#617380;background:#2b3c48;font-size:13px;font-weight:400}.timer-actions button[hidden]{display:none}
#timer-result{font-size:13px;color:#b7c6d1;line-height:1.35;margin-top:10px}.timer-panel.urgent,.timer-panel[data-state=expired]{border-color:#fc9364}.timer-panel.urgent #timer-clock,.timer-panel[data-state=expired] #timer-result{color:#ffad7f}.timer-panel[data-state=completed]{border-color:#83cfa0}.timer-panel[data-state=completed] #timer-result{color:#a3e7bd;font-weight:600}
#toast{left:310px;top:162px;max-width:calc(100% - 600px)}
@media(max-width:1050px){.operation-tools{left:20px;width:230px}#toast{left:270px;max-width:calc(100% - 550px)}}
@media(pointer:coarse),(max-width:760px){.operation-tools{top:124px;left:15px;width:185px;max-width:calc(100% - 202px);gap:7px}#horn{min-width:0;width:136px;max-width:100%;min-height:44px;padding:8px 10px;gap:7px;font-size:13px}#horn kbd,#sound-state{display:none}.timer-panel{padding:9px}.timer-heading{font-size:12px;letter-spacing:0}.timer-goal{font-size:12px;margin:4px 0 6px}.timer-readout{gap:5px}.timer-readout strong{font-size:34px}.timer-readout>span{font-size:12px}.timer-elapsed{font-size:12px;margin:4px 0 7px}.timer-settings{gap:5px;font-size:12px}.timer-settings input{width:48px;min-height:31px;padding:3px 5px}.timer-actions{gap:4px;margin-top:7px}.timer-actions button{min-height:34px;padding:5px 4px;font-size:12px}.timer-actions #timer-cancel{font-size:12px}#timer-result{font-size:12px;margin-top:7px}#toast{left:15px;top:auto;bottom:263px;width:calc(100% - 30px);max-width:430px}}
@media(max-width:430px){.operation-tools{max-width:calc(100% - 186px)}}
@media(pointer:coarse) and (orientation:portrait) and (max-height:650px),(max-width:760px) and (orientation:portrait) and (max-height:650px){#horn{position:fixed;left:15px;bottom:118px;width:124px}.timer-goal{display:none}.timer-heading{margin-bottom:7px}}
@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){.operation-tools{top:108px;left:15px;width:350px;max-width:calc(100% - 220px);display:grid;grid-template-columns:124px 1fr;align-items:start;gap:10px}#horn{width:124px;min-height:44px}.timer-panel{grid-column:2;grid-row:1/3;display:grid;grid-template-columns:1fr 1fr;column-gap:8px;padding:8px}.timer-heading,.timer-actions,#timer-result{grid-column:1/3}.timer-goal,.timer-readout>span{display:none}.timer-readout{grid-column:1;grid-row:2;margin-top:5px}.timer-readout strong{font-size:30px}.timer-elapsed{grid-column:2;grid-row:2;flex-direction:column;gap:2px;justify-content:center;margin:0}.timer-settings{grid-column:1/3;margin-top:6px}.timer-settings input{min-height:29px}.timer-actions button{min-height:31px}#timer-result{margin-top:5px}#toast{left:15px;top:auto;bottom:111px;width:calc(100% - 230px)}}
@media(pointer:fine) and (min-width:761px) and (max-height:650px){.operation-tools{left:280px;top:170px;max-width:calc(100% - 550px)}#sound-state{display:none}.timer-panel{padding:10px}.timer-readout strong{font-size:36px}.timer-goal{margin:5px 0}.timer-elapsed{margin:4px 0 8px}#toast{left:25px;top:auto;bottom:155px;max-width:calc(100% - 305px)}}
.warehouse-info{position:absolute;left:50%;bottom:172px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;max-width:330px;padding:9px 15px;background:#192027ed;border:1px solid #65788780;border-radius:6px;pointer-events:none}.warehouse-info strong{font-size:14px;font-weight:600}.warehouse-info>span{font-size:12px;color:#bac7ce}.warehouse-info #rack-vacancies{color:#9cdbb0}.pickup:disabled{opacity:.7;background:#2d4247;color:#b8dcd1;cursor:default}
@media(pointer:coarse),(max-width:760px){.warehouse-info{left:auto;right:15px;top:310px;bottom:auto;transform:none;width:167px;max-width:calc(50% - 20px);padding:8px;align-items:flex-start;gap:3px}.warehouse-info strong,.warehouse-info>span{font-size:12px;line-height:1.3}}
@media(max-width:430px){.warehouse-info{width:156px}}
@media(orientation:portrait) and (max-height:650px){.warehouse-info{top:302px}.warehouse-info>span{display:none}}
@media(orientation:landscape) and (max-height:600px){.warehouse-info{display:none}}

/* Touch-first refinements. These rules are deliberately scoped to coarse pointers so
   the established notebook/desktop layout remains unchanged. */
@media (pointer:coarse){
  #simulator{height:100svh;height:100dvh;min-height:0}
  .topbar{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
  .mobile-controls>div{bottom:calc(46px + env(safe-area-inset-bottom))}
  footer{padding-bottom:calc(7px + env(safe-area-inset-bottom))}
  .operation-prompt{bottom:calc(195px + env(safe-area-inset-bottom))}
  .touch-steer button,.touch-drive button{min-width:56px;min-height:56px}
  .touch-hydraulic button{min-width:48px;min-height:58px}
  .camera-buttons button,.speed-options button,.pickup,#horn,.timer-actions button{touch-action:manipulation}
}
@media (pointer:coarse) and (min-width:761px){
  .topbar{height:68px;padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
  .camera-toolbar{top:84px;left:max(24px,env(safe-area-inset-left))}
  .telemetry{top:84px;right:max(24px,env(safe-area-inset-right));width:214px}
  .operation-tools{top:151px;left:max(24px,env(safe-area-inset-left));width:246px}
  .touch-steer{left:max(28px,env(safe-area-inset-left))}
  .touch-drive{right:max(28px,env(safe-area-inset-right))}
  .touch-hydraulic{bottom:calc(58px + env(safe-area-inset-bottom));left:50%}
  .operation-prompt{bottom:calc(82px + env(safe-area-inset-bottom));width:min(610px,calc(100% - 480px));min-width:0}
  .warehouse-info{bottom:calc(162px + env(safe-area-inset-bottom))}
  footer{min-height:48px;padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
}
@media (pointer:coarse) and (orientation:portrait){
  .operation-prompt{bottom:calc(208px + env(safe-area-inset-bottom))}
  #toast{bottom:calc(275px + env(safe-area-inset-bottom))}
}
@media (pointer:coarse) and (orientation:landscape) and (max-height:600px){
  .mobile-controls>div{bottom:calc(40px + env(safe-area-inset-bottom))}
  .touch-hydraulic{bottom:calc(111px + env(safe-area-inset-bottom))!important}
  .operation-prompt{bottom:calc(41px + env(safe-area-inset-bottom))}
}

/* Clear play view for phones and compact touch tablets. */
@media (pointer:coarse) and (max-width:900px){
  .topbar{height:54px;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));background:#171c21e8}
  .wordmark{font-size:22px}.wordmark span{height:3px;margin-top:3px}.model{display:none}
  .header-right{gap:5px}.icon-button{width:34px;height:34px;font-size:17px}#lights{display:none}
  .camera-toolbar{top:62px;left:10px}.camera-buttons{padding:2px}.camera-buttons button{padding:7px 9px;font-size:12px}
  .telemetry{top:104px;right:10px;width:124px;padding:8px 9px 6px;border-radius:7px;background:#192027df}
  .speed-line{gap:6px}.speed-line>#gear{width:23px;height:25px;font-size:12px}.speed-line strong{font-size:28px}.unit{font-size:9px;padding-left:3px}
  .gauge{margin:6px 0}.speed-control{margin:0 0 7px}.speed-caption{display:none}.speed-options{gap:3px}.speed-options button{min-height:29px;padding:2px;font-size:12px}.speed-options button small{display:none}
  .telemetry-row{margin:0;padding:4px 0;border-top:1px solid #71808a40;font-size:10px;line-height:1.15}.telemetry-row>span{max-width:59px}.telemetry-row strong{font-size:10px}.align-row,.telemetry-foot{display:none}
  .operation-tools{top:104px;left:10px;width:116px;max-width:none;gap:6px}
  #horn{width:44px;height:42px;min-width:44px;min-height:42px;padding:8px;border-radius:7px}#horn svg{width:25px;height:25px}#horn span,#sound-state{display:none}
  .timer-panel{width:116px;padding:7px 8px;background:#192027df}.timer-heading{font-size:9px}.timer-heading>span{font-size:9px}.timer-goal,.timer-elapsed,.timer-settings,#timer-result{display:none}
  .timer-readout{margin-top:5px}.timer-readout strong{font-size:27px}.timer-readout>span{display:none}.timer-actions{margin-top:6px}.timer-actions button,.timer-actions #timer-cancel{min-height:30px;padding:4px;font-size:10px}
  .warehouse-info{display:none}
  .operation-prompt{left:10px;right:10px;bottom:calc(181px + env(safe-area-inset-bottom));transform:none;width:auto;min-width:0;padding:8px 9px;gap:7px;border-radius:7px;background:#182129df}
  .operation-prompt>div{gap:0}.operation-prompt strong{font-size:12px}.operation-prompt>div>span{display:none}.pickup{min-height:40px;padding:8px 10px;font-size:10px}
  .mobile-controls>div{bottom:calc(39px + env(safe-area-inset-bottom))}.mobile-controls>div>span{font-size:9px;margin-bottom:4px}
  .touch-steer{left:10px}.touch-steer>div{gap:6px}.touch-steer button{width:54px;height:58px;min-width:54px}
  .touch-drive{right:10px;gap:6px}.touch-drive button{width:56px;height:58px;min-width:56px;min-height:58px}
  .touch-hydraulic{left:50%;bottom:calc(39px + env(safe-area-inset-bottom));transform:translateX(-50%)}.touch-hydraulic>div{gap:5px;margin:4px 0}.touch-hydraulic button{width:48px;height:58px;min-width:48px}.touch-hydraulic #hydraulic-status{display:none}
  footer{min-height:30px;padding:5px max(12px,env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom));background:#171c21dc}footer button{font-size:10px}
  #toast{left:10px;right:10px;bottom:calc(246px + env(safe-area-inset-bottom));width:auto;max-width:none;padding:8px 10px;font-size:11px}
  #loading{inset:54px 0 0}
}
@media (pointer:coarse) and (max-width:900px) and (orientation:landscape){
  .topbar{height:46px}.wordmark{font-size:19px}.camera-toolbar{top:52px}.camera-buttons button{padding:5px 8px}
  .telemetry{top:52px;width:116px}.operation-tools{top:52px;left:142px;width:105px}.timer-panel{width:105px}#horn{width:38px;height:36px;min-width:38px;min-height:36px}
  .operation-prompt{top:98px;bottom:auto;left:50%;right:auto;transform:translateX(-50%);width:min(310px,42vw)}
  .mobile-controls>div{bottom:calc(34px + env(safe-area-inset-bottom))}.touch-hydraulic{bottom:calc(34px + env(safe-area-inset-bottom))!important}
  #toast{top:143px;bottom:auto;left:50%;right:auto;transform:translateX(-50%);width:min(320px,48vw)}
  #loading{inset:46px 0 0}
}