/* Calm operational feedback for repeated B2B workflows. */
:root{--motion-fast:.16s;--motion-base:.22s}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #49a89d;outline-offset:2px}
.btn,.icon-btn,.tiny-btn,.type-btn,.notification-trigger,.workspace-group-title,.workspace-child-menu button,.tabs button,.select-item,.tree-course,.lesson,.resource-call{transition:background-color var(--motion-fast) ease,border-color var(--motion-fast) ease,color var(--motion-fast) ease,transform var(--motion-fast) ease,box-shadow var(--motion-fast) ease}
.btn:not(:disabled):hover,.tiny-btn:not(:disabled):hover,.type-btn:not(:disabled):hover{transform:translateY(-1px)}
.btn:not(:disabled):active,.tiny-btn:not(:disabled):active,.type-btn:not(:disabled):active{transform:translateY(0) scale(.98)}
.icon-btn:not(:disabled):active,.workspace-group-title:not(:disabled):active,.workspace-child-menu button:not(:disabled):active{transform:scale(.98)}
.field input,.field textarea,.field select,.context-select,.scope-select select{transition:border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease,background-color var(--motion-fast) ease}
.field input:hover,.field textarea:hover,.field select:hover,.context-select:hover,.scope-select select:hover{border-color:#a8c8c3}
.data-table tbody tr{transition:background-color var(--motion-fast) ease}
.data-table tbody tr:hover{background:#f6faf9}
.data-panel:focus-within,.work-panel:focus-within,.info-panel:focus-within{border-color:#9ec8c2}
.notification-trigger{transition:background-color var(--motion-fast) ease,border-color var(--motion-fast) ease,color var(--motion-fast) ease,transform var(--motion-fast) ease}
.notification-trigger:not(:disabled):hover{transform:translateY(-1px)}
@media (prefers-reduced-motion:no-preference){
  .page{animation:page-enter var(--motion-base) ease both}
  .toast{animation:toast-enter var(--motion-base) ease both}
  .modal-backdrop,.create-dialog{animation:overlay-enter var(--motion-fast) ease both}
  .modal,.dialog{animation:surface-enter var(--motion-base) ease both}
}
@keyframes page-enter{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@keyframes toast-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes overlay-enter{from{opacity:0}to{opacity:1}}
@keyframes surface-enter{from{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}