#scene-navigation{position:absolute;right:14px;bottom:14px;width:156px;padding:8px;border:1px solid #ffffff24;border-radius:16px;background:linear-gradient(145deg,#252a2fed,#111518f5);box-shadow:0 8px 26px #0003;z-index:7;user-select:none;color:#f7f9fa;touch-action:manipulation}
.navigation-title{font:600 9px/1.2 system-ui;letter-spacing:2px;color:#aeb7be;text-align:center;padding-top:2px}.navigation-compass{position:relative;width:140px;height:130px;margin:0 auto}.navigation-compass svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.navigation-compass svg circle,.navigation-ring{fill:none;stroke:#ffffff12;stroke-width:1}.navigation-compass svg line{stroke-width:1.6;stroke-linecap:round}.navigation-compass [data-axis=x]{--axis:#ff8282}.navigation-compass [data-axis=y]{--axis:#bfe84e}.navigation-compass [data-axis=z]{--axis:#78bdff}.navigation-compass svg line{stroke:var(--axis)}
#scene-navigation .navigation-axis{position:absolute;transform:translate(-50%,-50%);width:36px;height:36px;min-width:36px;min-height:36px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--axis);font:700 11px system-ui;isolation:isolate;box-shadow:none}#scene-navigation .navigation-axis:before{content:'';position:absolute;inset:5px;border-radius:50%;background:#293038;border:1px solid color-mix(in srgb,var(--axis) 65%,transparent);z-index:-1}#scene-navigation .navigation-axis[data-rear=true]{opacity:.75}#scene-navigation .navigation-axis:hover:before,#scene-navigation .navigation-axis:focus-visible:before{background:var(--axis)}#scene-navigation .navigation-axis:hover,#scene-navigation .navigation-axis:focus-visible{color:#11181c;opacity:1;outline:none}#scene-navigation .navigation-home{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:38px;height:38px;min-width:38px;min-height:38px;border-radius:12px;border:1px solid #d0f74370;background:#d4ff18;color:#20270a;font:800 12px system-ui;z-index:4;padding:0;box-shadow:0 0 18px #d4ff1818}
#scene-navigation .view-switch{display:grid;grid-template-columns:repeat(3,1fr);padding:3px;gap:2px;border-radius:8px;background:#090c0f66;border:0;box-shadow:none}#scene-navigation .view-switch button{padding:0;min-width:0;min-height:32px;font-size:10px;border:0;border-radius:5px;color:#bbc4cb}#scene-navigation .view-switch button.active{color:#eaffb0;background:#8caf292c}#scene-navigation .navigation-zoom{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:5px}#scene-navigation .navigation-zoom button{width:100%;height:32px;min-height:32px;font-size:21px;padding:0;border:0;border-radius:6px;background:#ffffff0b;color:#e4e9ed}.has-navigation>.scene-top,.has-navigation>.scene-bottom{display:none!important}
.has-navigation #object-actions{left:14px!important;top:auto!important;bottom:14px;transform:none!important;display:flex;gap:4px;padding:6px;border:1px solid #ffffff24;background:#171c21ec;border-radius:12px;max-width:calc(100% - 200px);flex-wrap:wrap}.has-navigation #object-actions button{margin:0;border-radius:6px}.has-navigation:not(:has(#object-actions button)) #object-actions{display:none}.tablet-ui .has-navigation #object-actions{display:grid;grid-template-columns:repeat(4,44px);right:auto;gap:4px;max-width:calc(100% - 190px)}.tablet-ui #scene-navigation button{min-height:44px}.tablet-ui #scene-navigation .navigation-axis{width:44px;height:44px;min-width:44px}.tablet-ui #scene-navigation .navigation-axis:before{inset:9px}.tablet-ui #scene-navigation .navigation-home{width:44px;height:44px;min-width:44px}.tablet-ui #scene-navigation .navigation-zoom button{height:44px}
@container kb-scene (max-width:420px){#scene-navigation{right:8px;bottom:8px;width:140px;padding:5px}.navigation-compass{width:128px;height:120px}.tablet-ui .has-navigation #object-actions{left:8px!important;bottom:8px;grid-template-columns:repeat(2,44px);max-width:100px}}
@media print{#scene-navigation{display:none!important}}

.has-navigation #object-actions{display:none}.has-selection .has-navigation #object-actions{display:flex}.tablet-ui.has-selection .has-navigation #object-actions{display:grid}

.tablet-ui:not(.has-selection) .has-navigation #object-actions{display:none}

/* The orientation overlay has no panel behind it; only the lower controls
   retain a dark surface for readable labels over any room material. */
#scene-navigation{padding:0;border:0;background:transparent;box-shadow:none;border-radius:0}
.navigation-title{color:#4e5960;font-size:8px;letter-spacing:1.2px;text-shadow:0 1px 3px #fff,0 0 5px #fff}
.navigation-compass{cursor:grab;touch-action:none;border-radius:50%;outline-offset:-2px}
.navigation-compass[data-dragging=true]{cursor:grabbing}
.navigation-compass:focus-visible{outline:2px solid #92b50d}
#scene-navigation .navigation-axis,#scene-navigation .navigation-home{display:grid;place-items:center;pointer-events:none}
.navigation-compass svg circle,.navigation-ring{stroke:#52616b44}
#scene-navigation .navigation-lower{padding:8px;border:1px solid #ffffff24;border-radius:14px;background:linear-gradient(145deg,#252a2fed,#111518f5);box-shadow:0 8px 26px #0003}
