/* ============================================================
   Spoke Safety Partner Platform — DESIGN TOKENS
   Source of truth. Lifted from the Spoke Safety design system.
   White-first. Orange is the sole accent. Glass is rare.
   ============================================================ */

/* ---- Display face: BCNovaticaSpoke (self-hosted) ---- */
@font-face {
  font-family: 'BCNovaticaSpoke';
  src: url('../fonts/BCNovaticaSpoke-Regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'BCNovaticaSpoke';
  src: url('../fonts/BCNovaticaSpoke-Medium.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'BCNovaticaSpoke';
  src: url('../fonts/BCNovaticaSpoke-Bold.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}

:root {
  /* ---- Color (locked palette) ---- */
  --spoke-orange:#F47920;        /* sole accent: primary actions, active states */
  --spoke-orange-light:#FF9A4D;
  --spoke-orange-deep:#d96813;   /* CTA hover */
  --spoke-red:#E2534F;           /* RESERVED for EYE product — NEVER used in this app */
  --spoke-blue:#59698D;          /* rare */

  --ink:#262626;
  --ink-soft:#3A3A40;
  --grey-med:#959595;
  --grey-light:#ededed;
  --white:#ffffff;
  --black:#000000;

  /* ---- Surfaces ---- */
  --paper:#ffffff;
  --paper-2:#faf9f8;             /* faint warm off-white for rare zoning */
  --line:#ededed;                /* hairline borders everywhere */
  --line-strong:rgba(38,38,38,0.14);

  /* ---- Liquid glass (top bar, sticky bars, modals, toasts only) ---- */
  --glass-bg:rgba(255,255,255,0.62);
  --glass-border:rgba(255,255,255,0.75);
  --glass-shadow:0 8px 32px rgba(38,38,38,0.10), 0 2px 8px rgba(38,38,38,0.05);
  --glass-blur:blur(22px) saturate(180%);

  /* ---- Type ---- */
  --font-display:'BCNovaticaSpoke', sans-serif;
  --font-body:'DM Sans', sans-serif;

  --h1: clamp(2.4rem, 5vw, 3.8rem);
  --h2: clamp(1.7rem, 3.2vw, 2.5rem);
  --h3: clamp(1.2rem, 1.8vw, 1.45rem);
  --lead: clamp(1rem, 1.3vw, 1.1rem);

  /* ---- Layout ---- */
  --topbar-h:64px;
  --sidebar-w:248px;
  --maxw:1180px;
  --canvas-pad:clamp(24px, 4vw, 56px);

  /* ---- Motion ---- */
  --ease:cubic-bezier(0.16,1,0.3,1);
  --t-fast:0.18s var(--ease);
  --t-med:0.32s var(--ease);

  /* ---- Radii (restrained) ---- */
  --r-sm:8px;
  --r:12px;
  --r-lg:16px;
}