/* @vybesync/design-tokens — generated by scripts/build.js, do not edit */

@font-face {
  font-family: 'Quicksand';
  src: url('./fonts/Quicksand-VariableFont_wght.ttf') format('truetype-variations'),
       url('./fonts/Quicksand-VariableFont_wght.ttf') format('truetype');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ── Brand palette ─────────────────────────────────────── */
  --vs-orange: #FF6A00;
  --vs-orange-burnt: #FFA400;
  --vs-orange-soft: #FFB24D;
  --vs-orange-dim: #FF6A0022;
  --vs-orange-tile: #2C1C0E;
  --vs-orange-edge: #663C18;
  --vs-purple: #7B3DFF;
  --vs-purple-electric: #B84DFF;
  --vs-purple-dim: #7B3DFF22;
  --vs-onyx: #0A0A0A;
  --vs-white: #FFFFFF;

  /* ── Lane colors (per-product: suffix = wave = lane; sync = orange) ── */
  --vs-count-green: #3BFF7A;
  --vs-manager-blue: #1AA3E8;
  --vs-call-purple: #B84DFF;

  /* ── Surfaces ────────────────────────────────────────── */
  --vs-bg: #0A0A0A;
  --vs-surface: #131313;
  --vs-surface2: #1C1C1C;
  --vs-surface3: #242424;
  --vs-border: #2A2A2A;
  --vs-border-bright: #3A3A3A;
  --vs-scrim: rgba(0, 0, 0, 0.6);

  /* ── Foreground / text ───────────────────────────────── */
  --vs-fg: #F0F0F0;
  --vs-fg-muted: #777777;
  --vs-fg-dim: #444444;

  /* ── Semantic ────────────────────────────────────────── */
  --vs-danger: #FF3B3B;
  --vs-danger-dim: #FF3B3B22;
  --vs-danger-tile: #2C1414;
  --vs-danger-edge: #5C2C2C;
  --vs-success: #3BFF7A;
  --vs-success-dim: #3BFF7A22;
  --vs-success-tile: #142A1E;
  --vs-success-edge: #2A5A40;
  --vs-warn: #FFB24D;
  --vs-warn-dim: #FFB24D22;
  --vs-warn-tile: #2C2412;
  --vs-warn-edge: #5C4A26;
  --vs-facilities: #4D9FFF;
  --vs-facilities-dim: #4D9FFF22;
  --vs-facilities-tile: #0E1C2C;
  --vs-facilities-edge: #1E3E5C;

  /* ── Priority (live-mode action grid / lead queue) ───── */
  --vs-prio-red: #FF3B3B;
  --vs-prio-yellow: #FFB347;
  --vs-prio-green: #3BFF7A;

  /* ── Gradients ───────────────────────────────────────── */
  --vs-grad-orange: linear-gradient(135deg, #FF6A00, #FFA400);
  --vs-grad-orange-h: linear-gradient(90deg, #FF6A00, #FFA400);
  --vs-grad-orange-h-reverse: linear-gradient(90deg, #FFA400, #FF6A00);
  --vs-grad-purple: linear-gradient(135deg, #7B3DFF, #B84DFF);
  --vs-grad-text: linear-gradient(135deg, #FFA400, #FF6A00);

  /* ── Type ────────────────────────────────────────────── */
  --vs-font: 'Quicksand', system-ui, -apple-system, sans-serif;
  --vs-font-mono: ui-monospace, 'SF Mono', Menlo, monospace;
  --vs-h1: 500 28px/1.15 var(--vs-font);
  --vs-h2: 500 22px/1.2 var(--vs-font);
  --vs-h3: 400 18px/1.3 var(--vs-font);
  --vs-body: 300 15px/1.5 var(--vs-font);
  --vs-body-sm: 300 13px/1.5 var(--vs-font);
  --vs-label: 400 11px/1.2 var(--vs-font);
  --vs-meta: 300 10px/1.2 var(--vs-font);
  --vs-track-tight: -0.005em;
  --vs-track-eyebrow: 0.16em;
  --vs-track-badge: 0.08em;

  /* ── Shape ───────────────────────────────────────────── */
  --vs-radius: 14px;
  --vs-radius-sm: 8px;
  --vs-radius-xs: 5px;
  --vs-radius-pill: 99px;

  /* ── Elevation / glow ────────────────────────────────── */
  --vs-shadow-fab: 0 6px 20px rgba(255, 106, 0, 0.45);
  --vs-shadow-card: 0 1px 0 rgba(255,255,255,0.02) inset;
  --vs-shadow-elev: 0 2px 8px rgba(0, 0, 0, 0.40);
  --vs-glow-orange: 0 0 16px 2px rgba(255, 164, 0, 0.45);
  --vs-glow-purple: 0 0 16px 2px rgba(184, 77, 255, 0.45);

  /* ── Spacing ─────────────────────────────────────────── */
  --vs-space-1: 4px;
  --vs-space-2: 8px;
  --vs-space-3: 12px;
  --vs-space-4: 16px;
  --vs-space-5: 20px;
  --vs-space-6: 24px;
  --vs-space-7: 28px;
  --vs-space-8: 32px;
  --vs-space-3-5: 14px;
  --vs-space-4-5: 18px;

  /* ── Motion ──────────────────────────────────────────── */
  --vs-duration-fast: 80ms;
  --vs-duration-base: 180ms;
  --vs-duration-slow: 250ms;
  --vs-easing-out: cubic-bezier(0.4, 0, 0.2, 1);
}