.owl-mark { display: inline-grid; place-items: center; line-height: 0; }

.agent-avatar:has(.owl-mark),
.agent-starter-mark:has(.owl-mark) {
  background: #ffffff;
  border: 1px solid var(--border-neutral);
  box-sizing: border-box;
}
.owl-mark-svg { width: 100%; height: 100%; display: block; overflow: visible; }

.owl-mark--large { width: 42px; height: 42px; }
.owl-mark--small { width: 19px; height: 19px; }

.owl-mark .owl-eye { fill: #ffffff; }
.owl-mark .owl-dash { stroke: #ffffff; fill: none; }

.owl-mark--indigo .owl-body, .owl-mark--indigo .owl-lid, .owl-mark--indigo .owl-pupil { fill: #4f46e5; }
.owl-mark--indigo .owl-stroke { stroke: #4f46e5; }
.owl-mark--indigo .owl-hole { fill: #eef2ff; }

.owl-mark--rose .owl-body, .owl-mark--rose .owl-lid, .owl-mark--rose .owl-pupil { fill: #e11d48; }
.owl-mark--rose .owl-stroke { stroke: #e11d48; }
.owl-mark--rose .owl-hole { fill: #fff1f2; }

.owl-mark--slate .owl-body, .owl-mark--slate .owl-lid, .owl-mark--slate .owl-pupil { fill: #475569; }
.owl-mark--slate .owl-stroke { stroke: #475569; }
.owl-mark--slate .owl-hole { fill: #f8fafc; }

.owl-mark--teal .owl-body, .owl-mark--teal .owl-lid, .owl-mark--teal .owl-pupil { fill: #0d9488; }
.owl-mark--teal .owl-stroke { stroke: #0d9488; }
.owl-mark--teal .owl-hole { fill: #ecfdf5; }

.owl-mark--amber .owl-body, .owl-mark--amber .owl-lid, .owl-mark--amber .owl-pupil { fill: #d97706; }
.owl-mark--amber .owl-stroke { stroke: #d97706; }
.owl-mark--amber .owl-hole { fill: #fffbeb; }

.owl-mark--violet .owl-body, .owl-mark--violet .owl-lid, .owl-mark--violet .owl-pupil { fill: #aa17eb; }
.owl-mark--violet .owl-stroke { stroke: #aa17eb; }
.owl-mark--violet .owl-hole { fill: #fcf4ff; }

.owl-mark--rainbow .owl-body,
.owl-mark--rainbow .owl-pupil,
.owl-mark--rainbow .owl-lid { fill: url(#owl-rainbow); }
.owl-mark--rainbow .owl-stroke { stroke: #8b7bff; }

.owl-float { animation: owl-float 5s ease-in-out infinite; }
@keyframes owl-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-1.6px); }
}

.owl-lid { animation: owl-blink 5.2s infinite; }
@keyframes owl-blink {
  0%, 86%, 100% { transform: translateY(0); }
  90%, 92%      { transform: translateY(34px); }
}

.owl-pupils { animation: owl-idle 5.2s infinite; }
@keyframes owl-idle {
  0%, 45%, 100% { transform: translate(0, 0); }
  52%           { transform: translate(1.3px, -1px); }
  70%           { transform: translate(-1.3px, -1px); }
  80%           { transform: translate(0, 0); }
}

.is-working .owl-pupils { animation: owl-scan 2.6s infinite; }
@keyframes owl-scan {
  0%   { transform: translate(-1.4px, -2.2px); }
  22%  { transform: translate( 1.4px, -2.2px); }
  26%  { transform: translate(-1.4px,  0.6px); }
  48%  { transform: translate( 1.4px,  0.6px); }
  52%  { transform: translate(-1.4px,  2.6px); }
  74%  { transform: translate( 1.4px,  2.6px); }
  82%  { transform: translate(-1.4px, -2.2px); }
  100% { transform: translate(-1.4px, -2.2px); }
}
.is-working .owl-float { animation-duration: 2.4s; }

.owl-glass { animation: owl-glass 4.4s ease-in-out infinite; transform-origin: 68px 58px; }
@keyframes owl-glass {
  0%, 100% { transform: rotate(-7deg); }
  50%      { transform: rotate(9deg); }
}
.is-working .owl-glass { animation-duration: 2.2s; }

.owl-book { animation: owl-book 5.6s ease-in-out infinite; transform-origin: 68px 64px; }
@keyframes owl-book {
  0%, 100% { transform: rotate(-4deg); }
  50%      { transform: rotate(4deg); }
}
.is-working .owl-book { animation-duration: 2.6s; }

.owl-spark { animation: owl-spark 3.4s ease-in-out infinite; transform-origin: 66px 22px; }
@keyframes owl-spark {
  0%, 100% { opacity: .25; transform: scale(.82); }
  45%      { opacity: 1;   transform: scale(1.1); }
}
.is-working .owl-spark { animation-duration: 1.5s; }

@media (prefers-reduced-motion: reduce) {
  .owl-float, .owl-lid, .owl-pupils, .owl-glass, .owl-spark, .owl-book,
  .owl-dock-ring {
    animation: none !important;
  }
}

:root {
  --assistant-width: max(33.333vw, 380px);
  --assistant-wide-width: 66.667vw;
}

.agent-dock-toggle {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 60;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: var(--shadow-raised);
  transition: transform .15s ease, box-shadow .15s ease, right .22s ease;
  padding: 0;
}

.agent-dock-toggle:hover { transform: translateY(-2px); box-shadow: var(--shadow-overlay); }
.agent-dock-toggle:focus-visible { outline: 3px solid var(--text-accent); outline-offset: 3px; }

.agent-dock-toggle { background: #ffffff; border: 2px solid var(--border-neutral); }
.agent-dock-toggle--indigo { border-color: var(--tone-indigo-quiet); }
.agent-dock-toggle--rose { border-color: var(--tone-rose-quiet); }
.agent-dock-toggle--slate { border-color: var(--tone-slate-quiet); }
.agent-dock-toggle--teal { border-color: var(--tone-teal-quiet); }
.agent-dock-toggle--amber { border-color: var(--tone-amber-quiet); }
.agent-dock-toggle--violet { border-color: var(--tone-violet-quiet); }
.agent-dock-toggle--rainbow { border-color: #8b7bff; }

.owl-dock-ring {
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid currentColor;
  opacity: 0;
}

.agent-dock-toggle.is-working .owl-dock-ring { animation: owl-ring 1.9s ease-out infinite; }
@keyframes owl-ring {
  0%   { transform: scale(.9);  opacity: .55; }
  100% { transform: scale(1.24); opacity: 0; }
}

.agent-dock-toggle--indigo .owl-dock-ring { color: var(--tone-indigo); }
.agent-dock-toggle--rose .owl-dock-ring { color: var(--tone-rose); }
.agent-dock-toggle--slate .owl-dock-ring { color: var(--tone-slate); }
.agent-dock-toggle--teal .owl-dock-ring { color: var(--tone-teal); }
.agent-dock-toggle--amber .owl-dock-ring { color: var(--tone-amber); }
.agent-dock-toggle--violet .owl-dock-ring { color: var(--tone-violet); }
.agent-dock-toggle--rainbow .owl-dock-ring { color: #8b7bff; }

.agent-dock-bubble {
  position: absolute;
  top: -6px;
  right: -6px;
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  color: var(--text-faint);
}

.agent-dock-bubble .material-icons { font-size: 22px; }

.agent-dock-bubble.is-unread { color: var(--text-accent); }

.agent-dock-bubble-count {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -60%);
  font-size: 10px;
  font-weight: 700;
  color: var(--text-on-accent);
  line-height: 1;
}

.agent-dock {
  position: fixed;
  top: 64px;
  right: 0;
  bottom: 0;
  width: var(--assistant-width);
  z-index: 55;
  background: var(--surface-card);
  border-left: 1px solid var(--border-neutral);
  box-shadow: var(--shadow-overlay);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform .22s ease, width .22s ease;
}

body.has-assistant-open .agent-dock { transform: translateX(0); }

.agent-dock-host.is-wide .agent-dock { width: var(--assistant-wide-width); }

body.has-assistant-open .tracker-main { margin-right: var(--assistant-width); }

body.has-assistant-open .agent-dock-toggle { right: calc(var(--assistant-width) + 22px); }
body.has-assistant-open .agent-dock-host.is-wide .agent-dock-toggle { right: calc(var(--assistant-wide-width) + 22px); }

.agent-dock-widen .is-wide-icon,
.agent-dock-host.is-wide .agent-dock-widen .is-narrow-icon { display: none; }
.agent-dock-host.is-wide .agent-dock-widen .is-wide-icon { display: inline; }

.agent-dock-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--surface-sunken);
  min-width: 0;
}

.agent-dock-switch {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1 1 auto;
  min-width: 0;
  background: none;
  border: none;
  padding: 4px 6px;
  margin: 0;
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
  color: inherit;
  text-align: left;
}

.agent-dock-switch:hover { background: var(--surface-sunken); }
.agent-dock-switch:focus-visible { outline: 2px solid var(--text-accent); outline-offset: 1px; }
.agent-dock-switch .material-icons { font-size: 18px; color: var(--text-faint); flex: 0 0 auto; }
.agent-dock-switch[aria-expanded="true"] .material-icons { transform: rotate(180deg); }

.agent-dock-title {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-main);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.agent-dock-actions { display: flex; align-items: center; gap: 4px; flex: 0 0 auto; }

.agent-dock-inner { display: contents; }

.agent-dock-list {
  position: absolute;
  top: 52px;
  left: 8px;
  right: 8px;
  z-index: 2;
  max-height: 60%;
  overflow-y: auto;
  background: var(--surface-card);
  border: 1px solid var(--border-neutral);
  border-radius: 10px;
  box-shadow: var(--shadow-overlay);
  padding: 6px;
}

.agent-dock-list-item {
  display: block;
  padding: 8px 10px;
  border-radius: 7px;
  text-decoration: none;
  color: var(--text-main);
}

.agent-dock-list-item:hover { background: var(--surface-app); }
.agent-dock-list-item.is-current { background: var(--surface-sunken); }

.agent-dock-list-title {
  display: block;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.agent-dock-list-meta { display: block; font-size: 11px; color: var(--text-faint); margin-top: 2px; }
.agent-dock-list-working { color: var(--success); font-weight: 600; }
.agent-dock-list-empty { margin: 0; padding: 10px; font-size: 12.5px; color: var(--text-light); }

.agent-dock-list-all {
  display: block;
  margin-top: 4px;
  padding: 8px 10px;
  border-top: 1px solid var(--surface-sunken);
  font-size: 12px;
  color: var(--text-accent);
  text-decoration: none;
}

.agent-dock-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.agent-dock-body .agent-panel { flex: 1 1 auto; min-height: 0; }
.agent-dock-body .agent-starter { flex: 1 1 auto; }

.agent-dock-scrim { display: none; }

@media (max-width: 900px) {
  :root { --assistant-width: 100vw; --assistant-wide-width: 100vw; }

  body.has-assistant-open .tracker-main { margin-right: 0; }
  body.has-assistant-open .agent-dock-toggle { right: 22px; }

  .agent-dock { border-left: none; }
  .agent-dock-widen { display: none; }

  .agent-dock-scrim {
    display: block;
    position: fixed;
    inset: 0;
    background: var(--overlay-scrim);
    opacity: 0;
    pointer-events: none;
    transition: opacity .22s ease;
    z-index: 54;
  }

  body.has-assistant-open .agent-dock-scrim { opacity: 1; pointer-events: auto; }

  body.has-assistant-open .agent-dock-toggle { display: none; }
}

.tracker-navbar-links a.tracker-navbar-ai,
.tracker-drawer-nav a.tracker-drawer-ai {
  --ai-bg: #1e3a8a;
  border: 2px solid transparent;
  border-radius: 999px;
  background:
    linear-gradient(var(--ai-bg), var(--ai-bg)) padding-box,
    linear-gradient(90deg, #ff5f6d, #ffc371, #47e5a0, #22d3ee, #8b7bff, #ff5f6d) border-box;
  background-size: auto, 300% 100%;
  animation: ai-rainbow 7s linear infinite;
}

.tracker-navbar-links a.tracker-navbar-ai { padding: 5px 13px; }

.tracker-drawer-nav a.tracker-drawer-ai {
  --ai-bg: #ffffff;
  border-radius: 10px;
  margin: 6px 0;
}

.tracker-ai-label {
  background: linear-gradient(90deg, #ff5f6d, #ffc371, #47e5a0, #22d3ee, #8b7bff, #ff5f6d);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-weight: 700;
  animation: ai-rainbow 7s linear infinite;
}

@keyframes ai-rainbow {
  from { background-position: 0 0, 0 0; }
  to   { background-position: 0 0, 300% 0; }
}

@keyframes ai-rainbow-text {
  from { background-position: 0 0; }
  to   { background-position: 300% 0; }
}

.tracker-ai-label { animation-name: ai-rainbow-text; }

.tracker-navbar-links a.tracker-navbar-ai.is-active { text-decoration: none; }

@media (prefers-reduced-motion: reduce) {
  .tracker-navbar-links a.tracker-navbar-ai,
  .tracker-drawer-nav a.tracker-drawer-ai,
  .tracker-ai-label { animation: none; }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.agent-question {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 10px;
  padding: 14px 16px;
  border: 1px solid var(--border-neutral);
  border-radius: 14px;
  background: var(--surface-card);
}

.agent-question-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.agent-question-intro {
  margin: 0;
  font-size: 0.9rem;
  opacity: 0.75;
}

.agent-question-field {
  margin: 0;
  padding: 0;
  border: 0;
}

.agent-question-label {
  padding: 0 0 8px;
  font-size: 0.92rem;
  font-weight: 500;
}

.agent-question-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.agent-question-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid var(--border-neutral);
  border-radius: 999px;
  cursor: pointer;
  font-size: 0.88rem;
}

.agent-question-option:has(input:checked) {
  border-color: currentColor;
  background: var(--surface-sunken);
}

.agent-question-option:has(input:disabled) {
  cursor: default;
  opacity: 0.5;
}

.agent-question-next {
  align-self: flex-start;
  margin-top: 8px;
  padding: 5px 14px;
  border: 1px solid var(--border-neutral);
  border-radius: 999px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-size: 0.85rem;
}

.agent-question-next[disabled] {
  cursor: default;
  opacity: 0.45;
}

.agent-question-field.is-done .agent-question-label {
  padding-bottom: 2px;
  font-size: 0.85rem;
  font-weight: 400;
  opacity: 0.65;
}

.agent-question-field.is-done .entity-picker-search,
.agent-question-field.is-done .entity-picker-list,
.agent-question-field.is-done .agent-question-next,
.agent-question-field.is-done .agent-question-option:not(:has(input:checked)) {
  display: none;
}

.agent-question-field.is-done .agent-question-option {
  pointer-events: none;
}

.agent-question-text {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--border-neutral);
  border-radius: 10px;
  font: inherit;
}

.agent-question-send {
  position: sticky;
  bottom: 0;
  align-self: flex-end;
  padding: 7px 16px;
  border: 0;
  border-radius: 999px;
  background: var(--text-main);
  color: var(--text-contrast);
  cursor: pointer;
  font: inherit;
  font-size: 0.88rem;
}

.agent-question:has(.agent-question-field[hidden]) .agent-question-send {
  display: none;
}

.agent-question-send[disabled] {
  cursor: default;
  opacity: 0.45;
}

.agent-qa {
  margin: 0;
  padding: 12px 16px;
  border: 1px solid var(--border-neutral);
  border-radius: 12px;
  background: var(--surface-card);
}

.agent-qa-row + .agent-qa-row {
  margin-top: 12px;
}

.agent-qa dt {
  font-size: 0.9em;
  opacity: 0.7;
}

.agent-qa dd {
  margin: 2px 0 0;
  font-weight: 500;
}

.agent-qa dd p {
  margin: 0;
}