
/* One clean, full-width ribbon for all view and canvas navigation controls. */
.canvas-wrap{padding-top:48px}
.view-dock{position:absolute;top:0;left:0;right:0;min-height:48px;z-index:12;display:flex;align-items:center;justify-content:flex-start;gap:6px;padding:5px 10px;background:#0d1727;border-bottom:1px solid var(--line);box-shadow:0 2px 8px rgba(0,0,0,.28);overflow-x:auto;overflow-y:hidden;white-space:nowrap}
.view-dock-label{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:2px}
.view-dock .view-switch{display:flex;flex:0 0 auto;gap:0;margin:0;padding:2px;background:#111f34;border:1px solid #34445f;border-radius:7px;overflow:hidden}
.view-dock .view-switch button{min-width:78px;height:32px;padding:0 11px!important;border:0!important;border-radius:5px!important;background:transparent!important;color:#b9c7da!important;font-size:11.5px!important;font-weight:700!important;box-shadow:none!important}
.view-dock .view-switch button:hover{background:#1a2b48!important;color:#e8f1ff!important}
.view-dock .view-switch button.active{background:#2e6fbb!important;color:#fff!important}
.view-dock .view3d-controls{position:static!important;inset:auto!important;display:none;align-items:center;gap:5px;flex:0 0 auto;max-width:none;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;overflow:visible;white-space:nowrap}
.view-dock .view3d-controls.show{display:flex}
.view-dock .view3d-group{display:flex;align-items:center;gap:3px;padding-right:6px;margin:0;border-right:1px solid var(--line)}
.view-dock .view3d-group:last-child{border-right:0;padding-right:0;margin-left:0}
.view-dock .view3d-group-title{display:none}
.view-dock .view3d-controls button{height:32px;padding:0 9px!important;border:1px solid transparent!important;background:transparent!important;border-radius:6px!important;box-shadow:none!important;color:#d5e1f3;font-size:11px;font-weight:650}
.view-dock .view3d-controls button:hover{background:#1a2b48!important;border-color:#4e79ad!important;color:#fff!important}
.view-dock .view3d-controls button.active,.view-dock .view3d-controls .nav-mode.active{background:#1b3152!important;border-color:#4e79ad!important;color:#78b7ff!important}
.view-dock #fit3D{background:#111f34!important;border-color:#34445f!important}
.view-dock .scale-control{display:flex;align-items:center;gap:6px;min-width:165px;padding:0 2px}
.view-dock .scale-control label{font-size:10px;color:#aebdd0;font-weight:700}
.view-dock .scale-control input[type=range]{width:78px}
.view-dock .scale-value{min-width:30px;font-size:10.5px;color:#aebdd0}
.view-dock .canvas-toolbar{position:static!important;inset:auto!important;transform:none!important;display:flex;align-items:center;gap:3px;flex:0 0 auto;padding:2px 0 2px 6px;margin-left:2px;background:transparent;border:0;border-left:1px solid var(--line);border-radius:0;box-shadow:none;backdrop-filter:none}
.view-dock .canvas-toolbar>button,.view-dock .canvas-toolbar .tool[data-tool="select"]{height:32px;min-width:32px;padding:0 9px!important;margin:0;border:1px solid transparent!important;border-radius:6px!important;background:transparent!important;box-shadow:none!important;color:#d5e1f3;font-size:11.5px;font-weight:650}
.view-dock .canvas-toolbar>button:hover,.view-dock .canvas-toolbar .tool[data-tool="select"]:hover{background:#1a2b48!important;border-color:#4e79ad!important;color:#fff!important}
.view-dock .canvas-toolbar .tool[data-tool="select"]{display:flex!important;flex-direction:row!important;align-items:center;gap:4px}
.view-dock .canvas-toolbar .tool[data-tool="select"] span{font-size:13px}
.view-dock .canvas-toolbar .tool[data-tool="select"] small{font-size:11px;color:inherit}
.view-dock .canvas-toolbar .tool[data-tool="select"].tool-active{background:#1b3152!important;border-color:#4e79ad!important;color:#78b7ff!important}
.canvas-bottom-tools{position:absolute;right:12px;bottom:44px;z-index:7;display:flex;align-items:center;gap:5px;padding:6px;background:rgba(5,12,24,.92);border:1px solid rgba(255,255,255,.12);border-radius:9px;box-shadow:var(--shadow);backdrop-filter:blur(4px)}
.canvas-bottom-tools button{height:30px;padding:0 9px;border:1px solid #34445f;border-radius:7px;background:#101b2d;color:#d5e1f3;font-size:11.5px;font-weight:600;box-shadow:none}
.canvas-bottom-tools button:hover{background:#1a2b48;border-color:#4e79ad;color:#fff}.canvas-bottom-tools button.active{background:var(--accent2);color:var(--accent);border-color:var(--accent)}
.legend{right:12px;bottom:88px}.scale-bar{bottom:244px}.view3d-hint{bottom:88px}
@media (max-width:1150px){.view-dock{padding-left:8px}.view-dock .view-switch button{min-width:68px;padding:0 8px!important}.view-dock .view3d-controls button{padding:0 7px!important}.view-dock .scale-control{min-width:145px}.view-dock .scale-control input[type=range]{width:62px}}
@media (max-width:900px){.canvas-bottom-tools{left:12px;right:auto;max-width:calc(100% - 24px);overflow-x:auto}.legend{bottom:88px;max-width:calc(100% - 24px)}}
@media print{.view-dock,.canvas-bottom-tools{display:none!important}.canvas-wrap{padding-top:0}}
