/* ===================================================================
   HUD aesthetic — light-forward sci-fi.
   Light canvas, white plates, brushed-metal accents, dashed hairlines,
   cyan as the single active/positive accent, semantic red and yellow
   reserved for alert and warn. No green.

   Design tokens, web fonts, and the box-sizing reset. Loaded by the
   :app glob like every file here; its contents (custom properties,
   @font-face, a zero-specificity reset) resolve regardless of load order.
   =================================================================== */

/* Fonts — variable woff2, single file per family covers all weights */
@font-face {
  font-family: "Geist";
  src: url("/assets/geist-variable-19dd7337.woff2") format("woff2-variations"),
       url("/assets/geist-variable-19dd7337.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Monda";
  src: url("/assets/monda-variable-b8609845.woff2") format("woff2-variations"),
       url("/assets/monda-variable-b8609845.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("/assets/jetbrains-mono-variable-979d70d0.woff2") format("woff2-variations"),
       url("/assets/jetbrains-mono-variable-979d70d0.woff2") format("woff2");
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  /* canvas + surfaces */
  --bg:          #F0F4F8;
  --canvas:      #F0F4F8;
  --surface:     #FFFFFF;
  --surface-2:   #F8FAFC;
  --surface-3:   #F2F6FB;

  /* brushed metal */
  --metal-1:     #DDE3EB;
  --metal-2:     #C9D1DB;
  --metal-3:     #B0BAC8;
  --metal-4:     #8D97A6;
  --metal-5:     #6B7585;

  /* hairlines */
  --border:      #D5DCE4;
  --border-soft: #E4EAF0;
  --border-strong: #B8C2CE;
  --border-lit:  #5AC8EC;   /* focus accent (cyan) */

  /* under-the-hood greys (insets, dark labels, deep contrast) */
  --deep:        #2A3340;
  --deep-2:      #3A4453;

  /* text */
  --text:        #1A2230;
  --ink-2:       #3A4453;
  --muted:       #6B7585;
  --muted-2:     #97A0AE;

  /* accent (cyan — the brand pulse + active/positive signal) */
  --accent:      #2B9DC4;
  --accent-hover:#1F87AB;
  --on-accent:   #FFFFFF;
  --cyan:        #5AC8EC;
  --cyan-soft:   #7AD9FF;
  --cyan-dim:    #B9E6F5;
  --accent-glow: rgba(90, 200, 236, 0.28);
  --cyan-glow:   0 0 18px rgba(90, 200, 236, 0.55);
  --cyan-glow-sm:0 0 8px rgba(90, 200, 236, 0.45);

  /* alert / warn (no green) */
  --red:         #C8475A;
  --red-bg:      #FDECEE;
  --yellow:      #B8861F;
  --yellow-bg:   #FBF1DA;

  /* shape */
  --radius:      4px;        /* sharper than before — HUD-leaning */
  --radius-md:   8px;
  --radius-pill: 999px;

  /* type */
  --font-body:    "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Monda", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* shadows */
  --shadow-card: 0 1px 0 #fff inset, 0 2px 8px rgba(20, 30, 50, 0.04);
  --shadow-lift: 0 1px 0 #fff inset, 0 6px 22px rgba(20, 30, 50, 0.06);
}