/* Apex, the Agent's character (rwt-apex.js). One drawing in the current text colour (the workspace accent) with two eyes cut out in --apex-hole (the surface behind it).
 * Poses are plain CSS keyed on data-s, so reduced motion keeps them; every animation and transition sits behind prefers-reduced-motion: no-preference. */
.apex { --gx: 0; --gy: 0; --apex-hole: var(--s1-panel, #fff); color: var(--apex-ink, var(--s1-accent, #8a1538)); overflow: visible; flex: none; display: inline-block; vertical-align: middle; }
.apex .a-f { fill: currentColor; stroke: currentColor; stroke-width: 2.4; stroke-linejoin: round; }
.apex .a-t { fill: var(--apex-hole); }
.apex .a-s { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.apex--sm .a-s { stroke-width: 3.6; }
.apex .a-hp { opacity: 0; stroke: var(--apex-hole); }
.apex .a-fx { transform-origin: 24px 41px; transform: skewX(calc(var(--gx) * -5deg)); }
.apex .a-pp { transform: translate(calc(var(--gx) * 1.6px), calc(var(--gy) * 1.2px)); }
.apex .a-ey { transform-box: fill-box; transform-origin: center; }
.apex[data-s="success"] .a-hp { opacity: 1; } .apex[data-s="success"] .a-pp { opacity: 0; }
.apex[data-s="sleepy"] .a-ey { transform: scaleY(.25); }
.apex[data-s="listen"] .a-fx { transform: scale(1.03, .93); } .apex[data-s="listen"] .a-ey { transform: scale(1.15); }
.apex[data-s="think"] .a-fx { transform: skewX(-6deg); }
.apex[data-s="error"] .a-fx { transform: skewX(8deg); } .apex[data-s="error"] .a-e2 { transform: translateY(-1.8px); }
.apex[data-s="sleepy"] .a-fx { transform: scale(1.05, .9); }
.apex.a-bk .a-ey { transform: scaleY(.1); }
.apex--sm .a-ey { transform-box: fill-box; }
/* Empty and loading blocks (RWTApex.empty / .loading): Apex beside one calm line. */
.k-empty--apex { padding-block: 16px; }
.apex.a-empty { width: 44px; height: 44px; }
.a-loading { border-style: none; background: none; padding-block: 10px; }
@media (prefers-reduced-motion: no-preference) {
  .apex * { transition: transform .32s cubic-bezier(.3, .7, .3, 1), opacity .22s; }
  .apex .a-pp { transition-duration: .16s; } .apex .a-ey { transition-duration: .11s; }
  .apex[data-s="success"] .a-fx { animation: apex-hop .75s cubic-bezier(.3, .7, .3, 1); }
  .apex[data-s="greet"] .a-fx { animation: apex-bow 1.05s cubic-bezier(.3, .7, .3, 1); }
  .apex[data-s="error"] .a-fx { animation: apex-shake .45s; }
  .apex[data-s="talk"] .a-fx { animation: apex-speak .9s ease-in-out infinite alternate; }
  .a-loading { animation: apex-wait .3s .6s both; }
}
@keyframes apex-hop { 35% { translate: 0 -5px; } 60% { translate: 0 0; } 78% { translate: 0 -1.5px; } }
@keyframes apex-bow { 30% { scale: 1.04 .84; } 62% { scale: .99 1.03; } }
@keyframes apex-shake { 20% { translate: -1.6px 0; } 50% { translate: 1.4px 0; } 80% { translate: -.8px 0; } }
@keyframes apex-speak { to { scale: 1.02 .965; } }
@keyframes apex-wait { from { opacity: 0; } to { opacity: 1; } }
/* Nav (20 px): the monogram, in the item's own colour, with no eyes. */
.s1n-ico .apex { --apex-ink: currentColor; width: 20px; height: 20px; }
.s1n-ico .apex .a-pp, .s1n-ico .apex .a-hp { display: none; }
/* Sign-in: the greeter beside the logo slot. */
.rwt-auth-lockup { display: flex; align-items: center; gap: 16px; }
.rwt-auth-lockup .rwt-auth-apex { margin-left: auto; --apex-hole: var(--a-surface, #fff); }
/* Guide and card faces sit on the surface, not on a pill. */
.s1sg-mark:has(.apex) { background: none; }
.s1ag-card-head .apex, .s1-guide-face { margin-right: 6px; }
.s1sf-apex { margin: 0 0 8px; }
/* Toast: a mini Apex on the dark toast; he hops once as it appears. */
.k-toast .apex { --apex-ink: #7ee2ad; --apex-hole: var(--s1-ink); }
/* Home "caught up" and guide faces keep their natural size. */
.s1h-clear .apex { margin-right: 4px; }
