#sphere-view .sph-view-navigation { position:absolute; right:10px; bottom:calc(var(--sph-overlay-safe,0px) + 10px); width:90px; z-index:66; pointer-events:none; }
#sphere-view .sph-view-navigation[hidden] { display:none; }
#sphere-view .sph-view-navigation-bar { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:6px; }
#sphere-view :is(.sph-view-navigation-toggle,.sph-view-navigation-collapse) { display:grid; place-items:center; width:100%; height:32px; padding:0; border:0; border-radius:7px; color:#c7c7c7; background:#242424; font-size:14px; pointer-events:auto; cursor:pointer; }
#sphere-view :is(.sph-view-navigation-toggle,.sph-view-navigation-collapse):hover { background:#333; }
#sphere-view .sph-view-navigation-axis { width:90px; height:90px; pointer-events:none; }
#sphere-view .sph-view-navigation-axis[hidden] { display:none; }
#sphere-view .sph-view-navigation-menu { position:absolute; right:0; bottom:calc(100% + 6px); width:124px; padding:5px; border:1px solid #3b3b3b; border-radius:8px; background:#242424; pointer-events:auto; }
#sphere-view .sph-view-navigation-menu[hidden] { display:none; }
#sphere-view .sph-view-navigation-menu button { display:block; width:100%; min-height:30px; padding:4px 9px; border:0; border-radius:4px; background:transparent; color:#ddd; text-align:left; font:400 11px/1.4 Inter,Pretendard,sans-serif; cursor:pointer; }
#sphere-view .sph-view-navigation-menu button:hover { background:#383838; }
#sphere-view .sph-view-navigation :is(button:focus-visible) { outline:1px solid #b8b8b8; outline-offset:-2px; background:#383838; }
#sphere-view .sphu-viewport:has(>.sph-view-navigation:not([hidden])) > #sph-pip { right:112px; }