/* ============================================================
   Finora — design tokens
   Warm paper / ink system. Pine-green brand, terracotta outflow.
   Every colour, radius, space and duration used by the app is
   declared here and nowhere else.
   ============================================================ */

:root {
  /* --- Type ------------------------------------------------ */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", "Cascadia Mono",
               Menlo, Consolas, "Liberation Mono", monospace;

  --fs-display: 2.125rem;   /* 34px */
  --fs-h1:      1.625rem;   /* 26px */
  --fs-h2:      1.125rem;   /* 18px */
  --fs-h3:      1rem;       /* 16px */
  --fs-body:    0.9375rem;  /* 15px */
  --fs-sm:      0.875rem;   /* 14px */
  --fs-xs:      0.8125rem;  /* 13px */
  --fs-mono:    0.6875rem;  /* 11px — uppercase micro labels */

  --lh-tight: 1.15;
  --lh-snug:  1.35;
  --lh-body:  1.55;

  --tracking-label: 0.08em;
  --tracking-tight: -0.015em;

  /* --- Space (4px rule) ------------------------------------ */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  20px;
  --s-6:  24px;
  --s-8:  32px;
  --s-10: 40px;
  --s-12: 48px;

  /* --- Shape ----------------------------------------------- */
  --r-xs:   3px;
  --r-sm:   5px;
  --r-md:   8px;
  --r-lg:   12px;
  --r-full: 999px;

  /* --- Motion ---------------------------------------------- */
  --dur-fast: 110ms;
  --dur:      170ms;
  --ease:     cubic-bezier(0.2, 0, 0.15, 1);

  /* --- Layout ---------------------------------------------- */
  --sidebar-w: 244px;
  --topbar-h:  60px;
  --tabbar-h:  58px;
  --content-max: 1180px;

  --z-sticky: 20;
  --z-drawer: 60;
  --z-dialog: 80;
  --z-toast:  90;
}

/* ---------- Light: warm paper ------------------------------ */
:root,
[data-theme="light"] {
  --bg:            #f4f2ec;
  --surface:       #fbfaf7;
  --surface-2:     #efece4;
  --surface-3:     #e7e3d9;
  --surface-inset: #f0ede5;

  --border:        #dfdacf;
  --border-strong: #c7c0b0;

  --text:   #1e1d1a;
  --text-2: #57544c;
  /* Chosen so metadata clears 4.5:1 even on --surface-2, its worst backdrop. */
  --text-3: #6d695f;

  --brand:       #14624f;
  --brand-hover: #0e4d3d;
  --brand-fg:    #ffffff;
  --brand-soft:  #dfeae5;
  --brand-line:  #14624f;

  --pos:      #14624f;
  --pos-soft: #dfeae5;
  --neg:      #a9502e;
  --neg-soft: #f3e4dc;
  --warn:     #7c5912;
  --warn-soft:#f2e8d2;
  --danger:   #98302c;
  --danger-soft:#f4e0de;

  --focus-ring: #14624f;
  --shadow-ambient: 0 6px 20px rgba(30, 29, 26, 0.10);
  --shadow-dialog:  0 18px 46px rgba(30, 29, 26, 0.20);
  --scrim: rgba(30, 29, 26, 0.34);

  --track: #e0dbd0;

  --cat-1: #14624f;
  --cat-2: #b0563a;
  --cat-3: #8a6416;
  --cat-4: #47607d;
  --cat-5: #77496a;
  --cat-6: #5b6b3e;
  --cat-7: #916d48;
  --cat-8: #6b665f;
}

/* ---------- Dark: warm charcoal ---------------------------- */
[data-theme="dark"] {
  --bg:            #131311;
  --surface:       #1a1a18;
  --surface-2:     #222220;
  --surface-3:     #2a2926;
  --surface-inset: #151513;

  --border:        #2f2e2a;
  --border-strong: #46443e;

  --text:   #f0eee9;
  --text-2: #a9a59b;
  /* Chosen so metadata clears 4.5:1 even on --surface-2, its worst backdrop. */
  --text-3: #918d84;

  --brand:       #5fbb9d;
  --brand-hover: #7dcbb1;
  --brand-fg:    #06251d;
  --brand-soft:  #1a2f28;
  --brand-line:  #5fbb9d;

  --pos:      #5fbb9d;
  --pos-soft: #1a2f28;
  --neg:      #dd8f6b;
  --neg-soft: #33241c;
  --warn:     #d3a244;
  --warn-soft:#31281440;
  --danger:   #df716b;
  --danger-soft:#331f1e;

  --focus-ring: #7dcbb1;
  --shadow-ambient: 0 6px 20px rgba(0, 0, 0, 0.45);
  --shadow-dialog:  0 18px 46px rgba(0, 0, 0, 0.62);
  --scrim: rgba(0, 0, 0, 0.62);

  --track: #2f2e2a;

  --cat-1: #5fbb9d;
  --cat-2: #dd8f6b;
  --cat-3: #d3a244;
  --cat-4: #7f9ec4;
  --cat-5: #bf91b1;
  --cat-6: #a2b47a;
  --cat-7: #c6a081;
  --cat-8: #9a958c;
}