/* ============================================================
   YACHT CLUB — design tokens
   Monochrome "operator console" terminal language.
   White = primary UI accent. Color used only semantically:
   green=success/live, gold=P1/role/total, red=danger,
   blue=instant, amber=voicemail/warn, gray=neutral/idle.
   Every custom-property NAME is part of the JS/CSS contract —
   only VALUES change here. New names are additive.
   ============================================================ */

/* Self-hosted JetBrains Mono (static/fonts) — no external CDN. */
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/JetBrainsMono-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/JetBrainsMono-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/JetBrainsMono-SemiBold.woff2") format("woff2");
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/JetBrainsMono-Bold.woff2") format("woff2");
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/JetBrainsMono-ExtraBold.woff2") format("woff2");
}

:root {
  color-scheme: dark;   /* native form controls / autofill render dark */

  /* --- base surfaces: true-black terminal ground --- */
  --bg:           #000000;
  --bg-glow:      rgba(255, 255, 255, 0.02);
  --surface:      #0a0b0d;
  --surface-2:    #101217;
  --surface-3:    #16181e;
  --surface-code: #050506;
  --border:       #1a1d23;
  --border-strong:#2b313a;

  /* --- text --- */
  --text:       #f4f5f7;
  --text-muted: #8b9099;
  --text-dim:   #565c66;

  /* --- primary UI accent = monochrome white --- */
  --ui:        #ffffff;
  --ui-dim:    #d6d8dc;
  --ui-soft:   rgba(255, 255, 255, 0.09);
  --ui-line:   rgba(255, 255, 255, 0.24);
  --ui-glow:   rgba(255, 255, 255, 0.30);

  /* --- data-semantic accents --- */
  --accent:        #e3b341;                 /* gold: P1 series, worker role, total, avatar */
  --accent-2:      #7d8cff;                 /* blue/periwinkle: instant */
  --accent-hover:  #f0c45c;
  --accent-soft:   rgba(227, 179, 65, 0.14);
  --grad-accent:   linear-gradient(135deg, #e3b341 0%, #c79a32 100%);
  --teal:          #3fb950;                 /* green: success / active / live / operator hit+p1 */
  --teal-soft:     rgba(63, 185, 80, 0.15);
  --link:          #6ea8ff;
  --purple:        #7d8cff;
  --amber:         #cf9b3a;                 /* voicemail / warn (warmer than gold) */
  --danger:        #f0545c;                 /* red: dead / hangup / off / down / error */
  --danger-soft:   rgba(240, 84, 92, 0.14);

  /* --- shadows / glow (now monochrome-white) --- */
  --shadow-sm:   none;
  --shadow-md:   0 24px 70px rgba(0, 0, 0, 0.72);
  --shadow-glow: 0 0 0 1px rgba(255, 255, 255, 0.55), 0 0 26px rgba(255, 255, 255, 0.22);

  /* --- type: JetBrains Mono everywhere (both stacks point to it) --- */
  --font-sen:  "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --text-caption:    13px;
  --text-mono-sm:    12.5px;
  --text-body-sm:    14px;
  --text-body:       15px;
  --text-heading-sm: 17px;
  --text-heading:    20px;
  --text-heading-lg: 30px;
  --text-display:    40px;

  --leading-tight: 1.1;
  --leading-snug:  1.3;
  --leading-base:  1.5;
  --leading-loose: 1.7;

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  /* --- spacing scale --- */
  --space-4:   4px;
  --space-6:   6px;
  --space-8:   8px;
  --space-9:   9px;   /* was referenced but undefined — fixed */
  --space-12:  12px;
  --space-13:  13px;
  --space-16:  16px;
  --space-17:  17px;
  --space-20:  20px;
  --space-21:  21px;
  --space-24:  24px;
  --space-25:  25px;
  --space-32:  32px;
  --space-40:  40px;
  --space-50:  50px;

  /* --- radii: tight, near-square terminal corners --- */
  --radius-sm:   3px;
  --radius-md:   4px;
  --radius-lg:   6px;
  --radius-xl:   8px;
  --radius-full: 9999px;

  /* --- layout dims --- */
  --topbar-h: 0px;     /* rail layout: no horizontal topbar */
  --rail-w:   66px;    /* left icon rail width */
  --work-max: 1180px;
  --admin-max: none;
  --notes-w: 340px;

  /* --- motion --- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms;
  --dur-base: 220ms;
  --dur-slow: 420ms;
}