dextra-orb{
  --dextra-ink:#111827;
  --dextra-paper:#f7f6f1;
  --dextra-signal:#59d8c9;
  --dextra-focus:#5f7df6;
  --dextra-warn:#d39a48;
  --dextra-danger:#c85c62;
  display:inline-grid;
  place-items:center;
  width:var(--dextra-size,48px);
  height:var(--dextra-size,48px);
  contain:layout paint style;
  vertical-align:middle;
}
dextra-orb[size="18"]{width:18px;height:18px}dextra-orb[size="20"]{width:20px;height:20px}dextra-orb[size="28"]{width:28px;height:28px}dextra-orb[size="34"]{width:34px;height:34px}dextra-orb[size="40"]{width:40px;height:40px}dextra-orb[size="48"]{width:48px;height:48px}dextra-orb[size="64"]{width:64px;height:64px}dextra-orb[size="112"]{width:112px;height:112px}dextra-orb[size="240"]{width:240px;height:240px}
dextra-orb .dextra-wrap{width:100%;height:100%;display:grid;place-items:center;transform-origin:50% 58%;animation:dextra-breathe 4.8s cubic-bezier(.45,0,.55,1) infinite}
dextra-orb svg{width:100%;height:100%;display:block;overflow:visible;filter:none}
dextra-orb .dextra-body{fill:var(--dextra-ink)}
dextra-orb .dextra-eye,dextra-orb .dextra-mouth,dextra-orb .dextra-brow{fill:none;stroke:var(--dextra-paper);stroke-width:6;stroke-linecap:round;stroke-linejoin:round;transform-box:fill-box;transform-origin:center}
dextra-orb .dextra-eye{stroke-width:7}
dextra-orb .dextra-cheek{fill:var(--dextra-signal);opacity:0;transform-box:fill-box;transform-origin:center}
dextra-orb .dextra-face{transform-box:fill-box;transform-origin:center;transition:transform 150ms cubic-bezier(.22,1,.36,1)}
dextra-orb .dextra-mouth{transition:d 160ms cubic-bezier(.22,1,.36,1),opacity 120ms ease,transform 160ms cubic-bezier(.22,1,.36,1)}
dextra-orb .dextra-eye,dextra-orb .dextra-brow,dextra-orb .dextra-cheek{transition:opacity 120ms ease,transform 160ms cubic-bezier(.22,1,.36,1),stroke 120ms ease,fill 120ms ease}
dextra-orb .dextra-brow{opacity:0;stroke-width:4}
dextra-orb .dextra-status-dot{fill:var(--dextra-signal);opacity:0;transform-origin:center;transform-box:fill-box}

dextra-orb[state="idle"] .dextra-eye{animation:dextra-blink 5.4s ease-in-out infinite}
dextra-orb[state="noticing"] .dextra-wrap{animation:dextra-notice 500ms cubic-bezier(.22,1,.36,1) 1}
dextra-orb[state="noticing"] .dextra-eye{transform:scaleY(1.15) scaleX(1.06)}
dextra-orb[state="noticing"] .dextra-cheek{opacity:.8;transform:scale(.8)}
dextra-orb[state="gathering"] .dextra-face{animation:dextra-scan 1.7s cubic-bezier(.45,0,.55,1) infinite}
dextra-orb[state="gathering"] .dextra-status-dot{opacity:1;animation:dextra-pulse 1.2s ease-in-out infinite}
dextra-orb[state="gathering"] .dextra-mouth{opacity:.65}
dextra-orb[state="working"] .dextra-face{transform:translate(2px,2px)}
dextra-orb[state="working"] .dextra-eye{transform:scaleY(.82)}
dextra-orb[state="working"] .dextra-status-dot{opacity:1;fill:var(--dextra-focus);animation:dextra-pulse 1.5s ease-in-out infinite}
dextra-orb[state="working"] .dextra-cheek{opacity:.55}
dextra-orb[state="waiting-user"] .dextra-brow{opacity:1}
dextra-orb[state="waiting-user"] .dextra-eye{transform:scaleY(1.08)}
dextra-orb[state="waiting-user"] .dextra-mouth{transform:scale(.72)}
dextra-orb[state="waiting-user"] .dextra-status-dot{opacity:1;fill:var(--dextra-warn)}
dextra-orb[state="waiting-external"] .dextra-eye{transform:scaleY(.38)}
dextra-orb[state="waiting-external"] .dextra-mouth{opacity:.55;transform:scaleX(.72)}
dextra-orb[state="waiting-external"] .dextra-status-dot{opacity:.7;fill:var(--dextra-focus);animation:dextra-pulse 2.2s ease-in-out infinite}
dextra-orb[state="success"] .dextra-eye{stroke-width:6;transform:translateY(3px) scaleY(.52)}
dextra-orb[state="success"] .dextra-cheek{opacity:1;transform:scale(1)}
dextra-orb[state="success"] .dextra-wrap{animation:dextra-success 620ms cubic-bezier(.22,1,.36,1) 1}
dextra-orb[state="success"] .dextra-status-dot{opacity:1}
dextra-orb[state="failure"] .dextra-face{transform:rotate(-2deg)}
dextra-orb[state="failure"] .dextra-brow{opacity:1;stroke:var(--dextra-danger)}
dextra-orb[state="failure"] .dextra-mouth{stroke:var(--dextra-paper);transform:translateY(2px) scaleX(.84)}
dextra-orb[state="failure"] .dextra-status-dot{opacity:1;fill:var(--dextra-danger)}
dextra-orb[state="resting"] .dextra-wrap{animation:dextra-rest 5.5s ease-in-out infinite}
dextra-orb[state="resting"] .dextra-eye{transform:scaleY(.18)}
dextra-orb[state="resting"] .dextra-mouth{opacity:.55;transform:scaleX(.66)}
dextra-orb[interactive]{cursor:pointer}
dextra-orb[interactive]:hover .dextra-wrap{transform:translateY(-2px) scale(1.025)}
dextra-orb[interactive]:active .dextra-wrap{transform:translateY(0) scale(.97)}

@keyframes dextra-breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-1.5%) scale(1.012)}}
@keyframes dextra-blink{0%,44%,48%,100%{transform:scaleY(1)}46%{transform:scaleY(.12)}}
@keyframes dextra-notice{0%{transform:translateY(0) scale(1)}45%{transform:translateY(-5%) scale(1.045)}100%{transform:translateY(0) scale(1)}}
@keyframes dextra-scan{0%,100%{transform:translateX(-2px)}50%{transform:translateX(2px)}}
@keyframes dextra-pulse{0%,100%{transform:scale(.72);opacity:.45}50%{transform:scale(1);opacity:1}}
@keyframes dextra-success{0%{transform:translateY(0) scale(1)}38%{transform:translateY(-7%) scale(1.04)}70%{transform:translateY(1%) scale(.985)}100%{transform:translateY(0) scale(1)}}
@keyframes dextra-rest{0%,100%{transform:translateY(1%) scale(1,.985)}50%{transform:translateY(2.5%) scale(1.015,.97)}}

@media(hover:hover) and (pointer:fine){dextra-orb[interactive]:hover .dextra-wrap{transform:translateY(-2px) scale(1.025)}}
@media(prefers-reduced-motion:reduce){
  dextra-orb .dextra-wrap,dextra-orb .dextra-face,dextra-orb .dextra-eye,dextra-orb .dextra-status-dot{animation:none!important}
  dextra-orb .dextra-face,dextra-orb .dextra-eye,dextra-orb .dextra-mouth,dextra-orb .dextra-brow,dextra-orb .dextra-cheek{transition:none!important}
  dextra-orb[state="gathering"] .dextra-status-dot,dextra-orb[state="working"] .dextra-status-dot{opacity:1}
}