/* Companion contract UI — Gamify look: neon arc accents on deep navy.
   Principle 2 badge, principle 3 crisis card + outcomes dashboard. */

#companion-level-slot { padding: 0 12px 8px; }

.companion-badge {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  background: rgba(88, 60, 220, 0.12);
  border: 1px solid rgba(139, 92, 246, 0.45);
  border-radius: 10px; padding: 8px 10px;
}
.companion-badge-dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: #8b5cf6; box-shadow: 0 0 10px #8b5cf6;
  flex: none;
}
.companion-badge-title {
  font-size: 13px; font-weight: 800; color: var(--text, #f2f2f7);
}
.companion-badge-sub {
  font-size: 11px; color: var(--muted, #9a9ab0); width: 100%;
}

/* Accountability greeting — visually distinct, still the coach voice. */
.chat-msg.assistant.companion-greeting {
  border-left: 3px solid #8b5cf6;
  background: rgba(88, 60, 220, 0.08);
}

/* Crisis handoff — impossible to miss, calm but unmistakable. */
.chat-msg.assistant.companion-crisis {
  border: 2px solid #ff5d5d;
  background: rgba(255, 93, 93, 0.07);
}
.companion-crisis-card {
  margin-top: 10px; padding: 12px;
  border-radius: 10px;
  background: rgba(10, 10, 18, 0.85);
  border: 1px solid #ff5d5d;
  color: var(--text, #f2f2f7);
}
.companion-crisis-title {
  font-size: 15px; font-weight: 800; color: #ff8a8a; margin-bottom: 8px;
}
.companion-crisis-row { font-size: 13px; margin: 6px 0; line-height: 1.4; }
.companion-crisis-row a { color: #7dd3fc; font-weight: 800; }
.companion-crisis-note {
  font-size: 12px; color: var(--muted, #9a9ab0); margin-top: 8px; line-height: 1.45;
}

/* Outcomes dashboard — scored on outcomes, not minutes. */
.companion-dash {
  border: 1px solid var(--border, #26263a); border-radius: 12px;
  padding: 14px; background: var(--surface, #12121e);
}
.companion-dash-title {
  font-size: 14px; font-weight: 800; margin-bottom: 10px; color: var(--text, #f2f2f7);
}
.companion-dash-stats { display: flex; gap: 10px; margin-bottom: 10px; }
.companion-dash-stat {
  flex: 1; text-align: center; padding: 10px 4px;
  background: rgba(88, 60, 220, 0.1); border-radius: 10px;
}
.companion-dash-stat b { display: block; font-size: 20px; color: #a78bfa; }
.companion-dash-stat span { font-size: 11px; color: var(--muted, #9a9ab0); }
.companion-dash-row {
  display: flex; gap: 10px; font-size: 12px; color: var(--muted, #9a9ab0);
  padding: 6px 0; border-top: 1px solid var(--border, #26263a);
}
.companion-dash-crisis { color: #ff8a8a; font-weight: 700; }
.companion-dash-empty {
  font-size: 12px; color: var(--muted, #9a9ab0); padding: 12px 0 4px;
}