/* =====================================================================
   OCD OS BRAND: one look for every studio.
   https://uxiszlspxwtknpxinjoe.supabase.co/storage/v1/object/public/brand/ocd-brand.css
   (storage folder "brand", written by the brand-kit edge function)

   HOW IT WORKS
   - Every studio links this file in index.html.
   - This file only defines --ocd-* values. It never sets an app's own
     variables, so it can't break an app that writes colors differently.
   - Each studio points its own variables at these, with the same value as a
     fallback, e.g.  --background: var(--ocd-navy-t, 220 43% 18%);
   - Change a value here and every studio changes with it.
   Master look = Financial Studio (navy + gold), 10/30/2026.
   Text must always be sharp and crisp (Andy, 10/30/2026).
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Saira+Semi+Condensed:wght@500;600;700&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
  /* ---- colors as "H S% L%" (for apps that write hsl(var(--x))) ---- */
  --ocd-navy-t: 220 43% 18%;          /* #1A2744 page background */
  --ocd-navy-deep-t: 220 50% 12%;     /* #0F1A2E cards, popovers */
  --ocd-navy-darkest-t: 220 50% 10%;  /* sidebars, header bands */
  --ocd-panel-t: 220 45% 15%;         /* secondary panels */
  --ocd-muted-t: 220 40% 20%;         /* muted fills, hovers */
  --ocd-line-t: 220 40% 22%;          /* borders, inputs */
  --ocd-text-t: 0 0% 100%;            /* main text */
  --ocd-text-soft-t: 0 0% 92%;        /* text on panels */
  --ocd-text-muted-t: 0 0% 72%;       /* secondary text (bright enough to stay crisp) */
  --ocd-gold-t: 46 66% 52%;           /* #D4AF37 the one brand gold */
  --ocd-gold-light-t: 46 70% 85%;
  --ocd-red-t: 6 78% 57%;
  --ocd-green-t: 145 63% 49%;
  --ocd-amber-t: 37 90% 51%;

  /* ---- the same colors as full values (for apps that write var(--x) directly) ---- */
  --ocd-navy: hsl(220 43% 18%);
  --ocd-navy-deep: hsl(220 50% 12%);
  --ocd-navy-darkest: hsl(220 50% 10%);
  --ocd-panel: hsl(220 45% 15%);
  --ocd-muted: hsl(220 40% 20%);
  --ocd-line: hsl(220 40% 22%);
  --ocd-text: hsl(0 0% 100%);
  --ocd-text-soft: hsl(0 0% 92%);
  --ocd-text-muted: hsl(0 0% 72%);
  --ocd-gold: hsl(46 66% 52%);
  --ocd-gold-light: hsl(46 70% 85%);
  --ocd-red: hsl(6 78% 57%);
  --ocd-green: hsl(145 63% 49%);
  --ocd-amber: hsl(37 90% 51%);

  --ocd-radius: 0.5rem;

  /* ---- fonts (crisp: Saira Semi Condensed replaces Rajdhani,
         IBM Plex Mono replaces Share Tech Mono; both looked fuzzy small) ---- */
  --ocd-font-heading: 'Saira Semi Condensed', 'Arial Narrow', Arial, sans-serif;
  --ocd-font-body: 'DM Sans', Arial, sans-serif;
  --ocd-font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  /* ---- logo (cream wordmark + badge, for the navy background) ---- */
  --ocd-logo-url: url('https://uxiszlspxwtknpxinjoe.supabase.co/storage/v1/object/public/brand/logo-dark.svg');
}

/* Sharp, crisp text on the dark background */
html, body {
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
  text-rendering: optimizeLegibility;
}
/* Money and counts line up in columns */
.font-mono, .font-mono-numbers { font-variant-numeric: tabular-nums; }