body.scl-page #case-lab-main .stage-bottom>.view-controls[data-view-controls]{--controls-ease: cubic-bezier(.22, .8, .25, 1);display:flex;align-items:center;justify-content:flex-end;width:100px;min-width:0;height:52px;padding:3px;gap:0;margin-left:auto;flex:0 0 auto;border:1px solid transparent;border-radius:28px;background:transparent;box-shadow:none;overflow:hidden;transition:width .38s var(--controls-ease),border-color .25s ease,box-shadow .25s ease}body.scl-page #case-lab-main .stage-bottom>.view-controls[data-view-controls].is-open{width:232px;border-color:#ffffff3d;box-shadow:inset 1px 1px 1px #ffffff40,inset -1px -1px 1px #ffffff1c}body.scl-page #case-lab-main .view-controls[data-view-controls] .view-controls-actions{display:flex;align-items:center;position:relative;z-index:1;width:0;min-width:0;height:44px;flex:0 0 auto;overflow:hidden;opacity:0;visibility:hidden;transform:translate(12px);pointer-events:none;transition:width .38s var(--controls-ease),opacity .18s ease,transform .38s var(--controls-ease),visibility 0s .38s}body.scl-page #case-lab-main .view-controls[data-view-controls].is-open .view-controls-actions{width:132px;opacity:1;visibility:visible;transform:translate(0);pointer-events:auto;transition:width .38s var(--controls-ease),opacity .25s .08s ease,transform .38s var(--controls-ease),visibility 0s}body.scl-page #case-lab-main .view-controls[data-view-controls] button{width:44px;height:44px;min-width:44px;min-height:44px;flex:0 0 44px;margin:0;padding:0;box-sizing:border-box;border:1px solid transparent;border-radius:50%;background:transparent;box-shadow:none;color:#fff;transition:background-color .2s ease,border-color .25s ease,box-shadow .25s ease}body.scl-page #case-lab-main .view-controls[data-view-controls] #viewControlsToggle{margin-right:4px}body.scl-page #case-lab-main .view-controls[data-view-controls]:not(.is-open)>button{border-color:#ffffff50;box-shadow:inset 0 0 0 1px #ffffff05}body.scl-page #case-lab-main .view-controls[data-view-controls] button[aria-pressed=true]{background:#ffffff1f;box-shadow:inset 0 0 0 1px #ffffff3d}body.scl-page #case-lab-main .view-controls[data-view-controls] button:focus-visible{outline:2px solid #fff;outline-offset:-4px}body.scl-page #case-lab-main .view-controls[data-view-controls] #viewControlsToggle svg{width:18px;height:18px;transition:transform .38s var(--controls-ease)}body.scl-page #case-lab-main .view-controls[data-view-controls].is-open #viewControlsToggle svg{transform:rotate(45deg)}body.scl-page #case-lab-main .view-controls[data-view-controls]:not(.is-open)>.shej-fluid-optic{opacity:0}@media(hover:hover){body.scl-page #case-lab-main .view-controls[data-view-controls] button:hover:not(:disabled){background:#ffffff16}}@media(prefers-reduced-motion:reduce){body.scl-page #case-lab-main .view-controls[data-view-controls],body.scl-page #case-lab-main .view-controls[data-view-controls] .view-controls-actions,body.scl-page #case-lab-main .view-controls[data-view-controls] button,body.scl-page #case-lab-main .view-controls[data-view-controls] #viewControlsToggle svg{transition:none}}@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){body.scl-page #case-lab-main .stage-bottom>.view-controls[data-view-controls].is-open,body.scl-page #case-lab-main .view-controls[data-view-controls]:not(.is-open)>button{background:#292534}}
/*# sourceMappingURL=/cdn/shop/t/58/assets/scl-view-controls.css.map */
