frontend/src/app/globals.css

@tailwind base;
@tailwind components;
@tailwind utilities;

@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,300;0,14..32,400;0,14..32,500;0,14..32,600;0,14..32,700;1,14..32,400&display=swap");

* {
  box-sizing: border-box;
}

html, body {
  background-color: #F4F6F9;
  color: #1E293B;
  font-family: "Inter", "Roboto", "IBM Plex Sans", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Scrollbar */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: #F4F6F9; }
::-webkit-scrollbar-thumb { background: #CBD5E1; border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: #47C3A6; }

/* Brand gradient text */
.gradient-text {
  background: linear-gradient(90deg, #8FD15E, #47C3A6, #14B7CC);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Message prose */
.message-content p { margin-bottom: 0.65rem; }
.message-content p:last-child { margin-bottom: 0; }
.message-content ul, .message-content ol { margin: 0.4rem 0 0.65rem 1.2rem; }
.message-content li { margin-bottom: 0.2rem; }
.message-content strong { color: #0F172A; font-weight: 600; }
.message-content em { color: #475569; font-style: italic; }
.message-content code {
  background: #EFF6FF;
  color: #3B82F6;
  padding: 0.1em 0.35em;
  border-radius: 4px;
  font-size: 0.82em;
  font-family: "JetBrains Mono", "Fira Code", monospace;
}

/* Animations */
@keyframes pulseNode {
  0%, 100% { opacity: 0.3; transform: scale(0.85); }
  50%       { opacity: 1;   transform: scale(1.15); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes slideUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

.animate-pulse-node         { animation: pulseNode 1.8s ease-in-out infinite; }
.animate-pulse-node-delay   { animation: pulseNode 1.8s ease-in-out 0.6s infinite; }
.animate-pulse-node-delay2  { animation: pulseNode 1.8s ease-in-out 1.2s infinite; }
.animate-fade-in            { animation: fadeIn  0.35s ease-out; }
.animate-slide-up           { animation: slideUp 0.3s ease-out; }