@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

:root {
  --bg: #ffffff;
  --fg: #111827;
  /* neutral-900 */
  --muted: #475569;
  /* slate-600 */
  --border: #e5e7eb;
  /* neutral-200 */
  --accent: #b91c1c;
  /* red-700 for effects */
  --accent-2: #7f1d1d;
  /* red-900 deep */
  --btn-bg: #7f1d1d;
  /* default bubble background */
  --btn-fg: #ffffff;
  /* default bubble text */
  --btn-border: #a11e1e;
  /* border tone for bubbles */
  --chip: #f1f5f9;
  /* slate-100 */
  --ring: rgba(185, 28, 28, 0.35);
  --shadow: 0 10px 20px rgba(2, 6, 23, 0.07), 0 2px 6px rgba(2, 6, 23, 0.06);
}