.fleet-map-host { position:relative; overflow:hidden; }
.fleet-scene { position:absolute; inset:0; overflow:hidden; color:#eeefec; background:var(--app-card); font-family:inherit; }
.fleet-scene .fleet-scene-canvas { display:block; width:100%; height:100%; touch-action:none; outline-offset:-4px; }
.fleet-scene-canvas:focus-visible { outline:2px solid #d3b781; }
.fleet-scene-labels { position:absolute; inset:0; pointer-events:none; }
.fleet-scene-views { position:absolute; top:16px; left:16px; display:flex; gap:3px; padding:4px; border:1px solid var(--app-border); border-radius:14px; background:var(--app-surface); box-shadow:0 6px 20px #0003; }
.fleet-scene-views button { min-height:48px; padding:0 14px; border:0; border-radius:10px; background:transparent; color:var(--app-muted); font:600 12px/1.3 sans-serif; font-family:inherit; cursor:pointer; }
.fleet-scene-views button[aria-pressed=true] { background:var(--app-primary); color:var(--app-primary-foreground); }
.fleet-scene-views button:disabled { opacity:.4; cursor:default; }
.fleet-scene button:focus-visible { outline:2px solid #e8c889; outline-offset:3px; }
.fleet-scene-label { position:absolute; left:0; top:0; display:grid; gap:3px; width:max-content; max-width:210px; min-height:48px; padding:8px 12px 8px 16px; border:1px solid #555b5f; border-left:3px solid var(--robot-color); border-radius:10px; color:#f4f3ed; background:var(--app-card); box-shadow:0 4px 14px #0005; text-align:left; font-family:inherit; pointer-events:auto; cursor:pointer; }
.fleet-scene-label:after { content:""; position:absolute; width:1px; height:var(--leader,12px); left:var(--anchor,50%); top:100%; background:var(--robot-color); opacity:.55; pointer-events:none; }
.fleet-scene-label strong { font-size:12px; line-height:1.3; letter-spacing:.025em; font-weight:650; overflow-wrap:anywhere; }
.fleet-scene-label small { max-width:190px; color:#c0c6c8; font-size:11px; line-height:1.4; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.fleet-scene-label[aria-pressed=true] { border-color:var(--robot-color); background:var(--app-surface); box-shadow:0 0 0 3px #ffffff12,0 6px 20px #0005; z-index:2; }
.fleet-scene-label.is-offline { border-style:dashed; }
.fleet-scene-label.is-zone { min-height:0; padding:6px 9px; border-left-width:2px; pointer-events:none; cursor:default; }
.fleet-scene-label.is-zone strong { color:var(--robot-color); font-size:11px; }
.fleet-scene-label.is-zone small:empty { display:none; }
.fleet-scene-label[hidden] { display:none; }
.fleet-scene-legend { position:absolute; top:23px; right:18px; display:flex; gap:15px; color:#b7bec0; font-size:11px; pointer-events:none; }
.fleet-scene-legend span { display:flex; align-items:center; gap:6px; }
.fleet-scene-legend span:before { content:""; width:18px; border-top:2px solid var(--app-map-trail); }
.fleet-scene-legend .route:before { border-top-style:dashed; border-color:var(--app-map-route); }
.fleet-scene-note { position:absolute; bottom:12px; left:16px; right:16px; color:#b0b8bc; font-size:11px; line-height:1.5; pointer-events:none; text-align:center; }
.fleet-scene-ruler { position:absolute; right:20px; bottom:65px; padding-bottom:8px; color:#cbd0cf; font-size:11px; font-variant-numeric:tabular-nums; pointer-events:none; }
.fleet-scene-ruler:after { content:""; position:absolute; right:0; bottom:0; width:var(--ruler-width); border-top:2px solid #bec7c7; transform:rotate(var(--ruler-angle)); transform-origin:right; }
.fleet-map-canvas[hidden] { display:none!important; }
.monitor-page .fleet-map-tools { bottom:44px; }
.monitor-page .fleet-map .btn.small { min-height:48px; height:44px; }
.customer-map .fleet-scene-note { bottom:8px; }
.customer-map .fleet-scene-ruler { bottom:108px; }
.customer-map .fleet-scene .fleet-scene-views { top:auto; bottom:36px; left:12px; }
.customer-map .fleet-scene .fleet-scene-legend { top:auto; bottom:12px; left:16px; right:auto; }
@media(max-width:1200px) {
  .fleet-scene-legend { top:78px; left:20px; right:auto; }
}
@media(max-width:600px) {
  .fleet-scene-views { top:12px; left:12px; }
  .fleet-scene-views button { padding:0 10px; }
  .fleet-scene-label { max-width:156px; padding:7px 9px; }
  .fleet-scene-label small { max-width:138px; }
  .fleet-scene-note { font-size:10px; left:10px; right:10px; }
}