/* Nova design tokens — the single source of truth for color/geometry.
 * Palette is verbatim from .archive/imessage_mockups (terracotta dark skin).
 * Thesis adapted from the archive DESIGN.md: color belongs to Nova — the
 * accent appears on her presence, her actions, and outgoing bubbles; the
 * rest of the canvas stays monochrome. Use variables, never raw hex. */

:root {
  color-scheme: dark;

  /* Canvas */
  --bg: #0c0e11;
  --surface: #14171b;
  --stage: #1a1d22;
  --bubble-in: #1c2027;
  --hairline: #262b33;

  /* Accent (terracotta — Nova's color) */
  --accent: #c4756b;
  --on-accent: #2b1512;
  --accent-disc: #3a2e2c;
  --accent-dim: #5c3a34;

  /* Text */
  --text-1: #e8eaed;
  --text-2: #8b929c;
  --text-3: #6b7280;

  /* Signals */
  --online: #4ade80;
  --danger: #e5484d;
  --meter-off: #4b5563;

  /* Type */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;

  /* Bubble geometry */
  --bubble-r: 18px;
  --bubble-tail-r: 6px;
  --bubble-pad: 8px 13px;
  --bubble-font: 15px;
  --bubble-line: 1.35;
  --bubble-max: 78%;
  --run-gap: 2px;   /* intra-run */
  --group-gap: 10px; /* inter-run */

  /* Hairline borders render at 0.5px on retina, 1px floor elsewhere */
  --hairline-w: 0.5px;

  /* Layout */
  --rail-w: 150px;
  --thread-max: 720px;
  --bp-desktop: 900px; /* informational — media queries can't read vars */

  /* Elevation */
  --shadow-float: 0 4px 18px rgba(0, 0, 0, 0.32);

  /* Radii for non-bubble chrome */
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
}

@media (min-width: 900px) {
  :root {
    --bubble-max: 62%;
  }
}