@font-face {
  font-family: "Figtree";
  src: url("../../fonts/Figtree-300.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Figtree";
  src: url("../../fonts/Figtree-400.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Figtree";
  src: url("../../fonts/Figtree-500.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Figtree";
  src: url("../../fonts/Figtree-600.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Figtree";
  src: url("../../fonts/Figtree-700.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Figtree";
  src: url("../../fonts/Figtree-800.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Figtree";
  src: url("../../fonts/Figtree-900.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --brand-ink: #0b132a;
  --brand-primary: #1d4ed8;
  --brand-soft: #e0edff;
  --brand-glow: #c7d7ff;
  --brand-base: #f8fafc;
}

body {
  font-family: "Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--brand-ink);
  background-color: var(--brand-base);
}

.card-flat {
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.08);
}

.bg-grid {
  background-image:
    radial-gradient(circle at 10% 10%, rgba(29, 78, 216, 0.08), transparent 45%),
    radial-gradient(circle at 80% 0%, rgba(199, 215, 255, 0.4), transparent 40%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(248, 250, 252, 0.9));
}

.chat-scrollbar::-webkit-scrollbar {
  width: 8px;
}

.chat-scrollbar::-webkit-scrollbar-thumb {
  background: rgba(29, 78, 216, 0.2);
  border-radius: 999px;
}