body {
	padding: 2rem;
	font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
}

h1 {
	font-size: 16px;
	margin-top: 0;
}

p {
	color: rgb(107, 114, 128);
	font-size: 15px;
	margin-bottom: 10px;
	margin-top: 5px;
}

.card {
	max-width: 620px;
	margin: 0 auto;
	padding: 16px;
	border: 1px solid lightgray;
	border-radius: 16px;
}
.card p:last-child {
	margin-bottom: 0;
}
@keyframes pulse-glow {
  0%, 100% { opacity: 0.8; }
  50% { opacity: 1; box-shadow: 0 0 10px currentColor; }
}

/* Voice indicator */
.listening-indicator {
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.1); opacity: 0.7; }
    100% { transform: scale(1); opacity: 1; }
}

#orb-response {
    transition: all 0.3s ease;
    min-height: 8rem;
}
.metric-pulse {
  animation: pulse-glow 2s infinite;
}

/* Emotion states */
.emotion-neutral {
  background: rgba(59, 130, 246, 0.1);
  border-left: 4px solid #3b82f6;
}

.emotion-happy {
  background: rgba(16, 185, 129, 0.1);
  border-left: 4px solid #10b981;
}

.emotion-sad {
  background: rgba(139, 92, 246, 0.1);
  border-left: 4px solid #8b5cf6;
}

.emotion-angry {
  background: rgba(239, 68, 68, 0.1);
  border-left: 4px solid #ef4444;
}

.emotion-surprised {
  background: rgba(245, 158, 11, 0.1);
  border-left: 4px solid #f59e0b;
}

/* Orb states */
.orb-calm {
  background: rgba(59, 130, 246, 0.2);
}

.orb-processing {
  background: rgba(16, 185, 129, 0.2);
}

.orb-creative {
  background: rgba(245, 158, 11, 0.2);
}

.orb-alert {
  background: rgba(239, 68, 68, 0.2);
}
.orb-reflective {
  background: rgba(139, 92, 246, 0.2);
}

/* About page styles */
.team-member {
  transition: transform 0.3s ease;
}

.team-member:hover {
  transform: translateY(-5px);
}

.team-member img {
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.team-member:hover img {
  border-color: rgba(99, 102, 241, 0.5);
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}