/* One-time entry and interaction feedback; no continuous icon motion. */
.ops-app .op-icon-heading{display:flex;align-items:center;gap:8px}
.ops-app .op-title-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:24px;height:24px;color:#327a65}
.ops-app .op-title-icon>.icon{width:21px;height:21px;stroke-width:1.65;transform-origin:center;animation:none}
.ops-app .op-motion-icon{transform-origin:center;transition:color 140ms ease}
.ops-app .op-title-icon.is-entering>.icon{animation:op-icon-arrive 440ms cubic-bezier(.2,.7,.2,1) both}
.ops-app .op-title-icon.is-entering>.icon :is(path,polyline,line){animation:op-icon-trace 500ms ease-out both}
@media(hover:hover){
 .ops-app :is(.side-link,.ow-hub-row,.ow-hub-secondary-link,.op-mobile-nav a):hover .op-motion-icon{animation:op-icon-lift 360ms ease-out}
 .ops-app .btn:hover:not(:disabled)>.op-motion-icon{animation:op-icon-tap 320ms ease-out}
 .ops-app .op-back:hover>.op-motion-icon{animation:op-icon-back 320ms ease-out}
}
.ops-app :is(.side-link,.ow-hub-row,.ow-hub-secondary-link,.btn,.op-mobile-nav a):focus-visible .op-motion-icon{animation:op-icon-lift 360ms ease-out}
.ops-app :is(.btn,.side-link,.ow-hub-row,.op-mobile-nav a):active .op-motion-icon{animation:op-icon-tap 260ms ease-out}
/* The cue rests most of each cycle; only the small title icon moves. */
.ops-app.modal-open .op-title-icon>.icon,.ops-app.picker-open .op-title-icon>.icon{animation-play-state:paused}
@keyframes op-icon-idle{0%,55%,85%,100%{transform:translateY(0) rotate(0)}62%{transform:translateY(-2px) rotate(-9deg)}70%{transform:translateY(-1px) rotate(7deg)}78%{transform:translateY(0) rotate(-3deg)}}
@keyframes op-icon-arrive{0%{opacity:.4;transform:translateY(3px) scale(.88)}65%{opacity:1;transform:translateY(-1px) scale(1.02)}100%{opacity:1;transform:none}}
@keyframes op-icon-trace{from{stroke-dasharray:40;stroke-dashoffset:18}to{stroke-dasharray:none;stroke-dashoffset:0}}
@keyframes op-icon-lift{0%,100%{transform:translateY(0)}45%{transform:translateY(-2px)}}
@keyframes op-icon-tap{0%,100%{transform:scale(1)}45%{transform:scale(.88)}}
@keyframes op-icon-back{0%,100%{transform:translateX(0)}45%{transform:translateX(2px)}}
@media(prefers-reduced-motion:reduce){.ops-app .op-motion-icon,.ops-app .op-title-icon>.icon,.ops-app .op-title-icon>.icon *{animation:none!important;transition:none!important}}
@media print{.ops-app .op-title-icon{display:none}}