/* Animate controls, never canvas dimensions, filters or the page layout. */
:root{--motion-fast:120ms;--motion-enter:180ms;--motion-ease:cubic-bezier(.2,.7,.2,1)}
button,summary,select,input,textarea{ -webkit-tap-highlight-color:transparent }
button,summary{touch-action:manipulation;transition:background-color var(--motion-fast) ease,color var(--motion-fast) ease,border-color var(--motion-fast) ease,opacity var(--motion-fast) ease}
select,input,textarea{transition:border-color var(--motion-fast) ease,background-color var(--motion-fast) ease}
:is(button,summary,select,input,textarea):focus-visible{outline:2px solid #247aff;outline-offset:2px}
button:disabled,select:disabled{cursor:default}
@media(hover:hover) and (pointer:fine){:is(header,#views,#plot-toolbar,#sidebar) button:not(:disabled):not(.active):not(.showcase-play):hover,summary:hover{background-color:#edf4ff}}
:is(header,#views,#plot-toolbar,#sidebar) button:not(:disabled):not(.showcase-play):active,summary:active{background-color:#dfeaff}
#workspace-tabs button[data-view]{transition:background-color 150ms ease,color 150ms ease,border-color 150ms ease}
#workspace-transition-status{position:absolute;top:54px;left:50%;transform:translateX(-50%);z-index:45;display:flex;align-items:center;gap:9px;max-width:calc(100% - 20px);padding:10px 14px;border:1px solid #dbe6f4;border-radius:14px;background:#fff;color:#365779;box-shadow:0 4px 16px #21344c12;font-size:13px;white-space:nowrap;pointer-events:none;animation:worm-menu-enter var(--motion-enter) var(--motion-ease)}
#workspace-transition-status::before{content:'';width:7px;height:7px;flex:none;border-radius:50%;background:#247aff;animation:worm-busy 1s ease-in-out infinite alternate}
@keyframes worm-busy{from{opacity:.35}to{opacity:1}}
@keyframes worm-menu-enter{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@keyframes worm-status-enter{from{opacity:0}to{opacity:1}}
@keyframes worm-dialog-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes worm-sheet-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes worm-sidebar-enter{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:translateX(0)}}
#workspace-transition-status{animation-name:worm-status-enter}
dialog[open]{animation:worm-dialog-enter var(--motion-enter) var(--motion-ease)}
dialog::backdrop{animation:worm-status-enter var(--motion-enter) ease}
:is(#file-actions,#toolbar-more,#mobile-header-menu)[open]>:is(.file-popup,#toolbar-more-actions,#mobile-header-actions){animation:worm-menu-enter var(--motion-enter) var(--motion-ease)}
#toast:not([hidden]){animation:worm-dialog-enter var(--motion-enter) var(--motion-ease)}
#phone-sidebar-backdrop{display:none}
#views{position:relative}
.phone-observer #mobile-workspace-bar{gap:6px;width:100%}
.phone-observer #mobile-workspace-select{box-shadow:0 1px 2px #21344c06}
.phone-observer :is(#tree,#groups,#mobile-header-actions,#dialog-content,.phone-fold-content,.phone-volume-content){overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.phone-observer :is(#tree,#groups){touch-action:pan-y}
.phone-observer :is(.ds-head,.ds-tabs,.ds-tools,#mobile-header-actions,.phone-fold-content,.phone-volume-content,.phone-map-tools){backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background-color:#fff}
.phone-observer #dialog-content{overflow-x:auto;overflow-wrap:anywhere}
.phone-observer :is(#sidebar,#properties){max-height:calc(100dvh - 92px - env(safe-area-inset-bottom));overscroll-behavior:contain}
.phone-observer #sidebar .panel-head button{min-width:36px;min-height:36px}
.phone-observer #rms-native-controls #mobile-section-close{position:sticky;top:0;z-index:1;background:#edf4ff;color:#176cff;text-align:center;justify-content:center}
.phone-observer.mobile-section-open #rms-native-controls.has-plot:not([hidden]){animation:worm-sheet-enter 200ms var(--motion-ease)}
.phone-observer :is(.phone-fold-panel,.phone-volume-tools)[open]>:is(.phone-fold-content,.phone-volume-content){animation:worm-sheet-enter var(--motion-enter) var(--motion-ease)}
.phone-observer.navigation-sidebar-open #sidebar{z-index:36;animation:worm-sidebar-enter var(--motion-enter) var(--motion-ease)}
.phone-observer.navigation-sidebar-open #phone-sidebar-backdrop{display:block;position:fixed;inset:48px 0 calc(44px + env(safe-area-inset-bottom));z-index:33;width:100%;height:auto;border:0;border-radius:0;background:#182b443b;animation:worm-status-enter var(--motion-enter) ease}
@media(max-width:650px){
 #mobile-workspace-bar{gap:6px;width:100%}
 #mobile-header-actions{background:#fff}
 #workspace-transition-status{font-size:12px;padding:9px 12px}
 #sidebar .panel-head button{min-width:36px;min-height:36px}
 .mobile-section-open #rms-native-controls.has-plot:not([hidden]){animation:worm-sheet-enter 200ms var(--motion-ease)}
 .navigation-sidebar-open #sidebar{z-index:36;animation:worm-sidebar-enter var(--motion-enter) var(--motion-ease)}
 .navigation-sidebar-open #phone-sidebar-backdrop{display:block;position:fixed;inset:48px 0 calc(44px + env(safe-area-inset-bottom));z-index:33;width:100%;height:auto;border:0;border-radius:0;background:#182b443b;animation:worm-status-enter var(--motion-enter) ease}
}
@media(prefers-reduced-motion:reduce){
 :root{--motion-fast:0ms;--motion-enter:0ms}
 :is(button,summary,select,input,textarea,#workspace-tabs button[data-view]){transition:none!important}
 :is(dialog[open],dialog::backdrop,#toast,#workspace-transition-status,#workspace-transition-status::before,#phone-sidebar-backdrop,#sidebar,#rms-native-controls,.file-popup,#toolbar-more-actions,#mobile-header-actions,.phone-fold-content,.phone-volume-content,.phone-map-tools){animation:none!important;scroll-behavior:auto!important}
}

.phone-observer footer #save-status::after{margin-inline-start:4px}