/* ═══════════════════════════════════════════════════════════════
   ARKAN Design System 2.0 — Warm Jade Enterprise
   Phase B (Design Integration 2.0): re-ported from the canonical
   handoff (claude_code_handoff/tokens/arkan-tokens.css +
   specs/DESIGN_SYSTEM_warm_jade.md) — the direction is fixed there,
   not invented here. The earlier retint in this file (2026-08-15)
   was a good-faith reconstruction done before that handoff existed
   and used different exact values under the same name; this pass
   replaces those values with the literal canonical ones.
   Every token NAME is unchanged (only values move, plus a handful
   of new canonical concepts added: --money, --halo, --row/--row-hi,
   a 5-step --text-t1..--t5 scale) so all existing routes inherit
   the correction with zero markup/selector changes — the same
   low-risk pattern used for the original retint.
   Kept as an explicit, documented deviation from the literal
   handoff: the theme attribute stays `data-theme` (not
   `data-axis-theme`) — renaming it would require touching every
   consuming stylesheet's selectors for a plumbing detail invisible
   to the user; only the resulting colors are the design-fidelity
   concern.
   Three-layer architecture:
     Layer 1 · :root             — structural tokens (theme-neutral)
     Layer 2 · [data-theme="*"] — semantic color tokens per theme
     Layer 3 · @media system     — OS preference resolution
   ═══════════════════════════════════════════════════════════════ */

/* ── Layer 1: Structural tokens (always active, theme-neutral) ── */
:root {
  /* ── Layout ────────────────────────────────────────────── */
  --sidebar-width:           240px;
  --sidebar-collapsed-width: 64px;
  --header-height:           64px;

  /* ── Font families — IBM Plex Sans/Mono (canonical) ───────
     --font-display kept as an alias (not a separate typeface —
     canonical has none) so the two files that already reference
     it (command-now.css, decision-card.css) pick up the correct
     family with no edits of their own. ── */
  --font-sans:    'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'Consolas', monospace;
  --font-ui:      'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --font-display: var(--font-sans);

  /* ── Type scale ────────────────────────────────────────── */
  --text-xs:   11px;
  --text-sm:   13px;
  --text-base: 14px;
  --text-md:   15px;
  --text-lg:   18px;
  --text-xl:   24px;
  --text-2xl:  32px;
  --text-3xl:  36px;
  --text-4xl:  36px;

  /* ── Font weights — 700/800 reserved for legacy call sites;
       canonical hierarchy is size+color only, never heavier than
       600 on new/updated surfaces ── */
  --font-normal:   400;
  --font-medium:   500;
  --font-semibold: 600;
  --font-bold:     700;

  /* ── Spacing (8px grid — kept; canonical's own irregular step
       list is folded in below as --space-canonical-* for new
       Phase D components, existing spacing stays on the grid to
       avoid a blanket layout rewrite) ────────────────────────── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* ── Border radius — canonical has exactly 3 meaningful radii
       (12 rows/buttons/tiles, 16 panels, 20 pill) + 50% avatars.
       Kept the existing named steps (Phase D will move components
       onto the correct tier — see design audit §5) and added the
       canonical names directly for new/updated components. ── */
  --radius-sm:  8px;
  --radius:     10px;
  --radius-md:  12px;
  --radius-lg:  12px;
  --radius-xl:  16px;
  --radius-2xl: 20px;
  --radius-full: 9999px;
  --r:      12px; /* canonical --r     — rows, buttons, tiles */
  --r-lg:   16px; /* canonical --r-lg  — panels */
  --r-pill: 20px; /* canonical --r-pill — status chips */

  /* ── Transitions — legacy generic steps kept; canonical named
       motion timings added alongside for the ark-* vocabulary
       (Phase I wires these into components) ─────────────────── */
  --transition:      0.15s ease;
  --transition-md:   0.25s ease;
  --transition-fast: 0.12s ease;
  --transition-base: 0.18s ease;
  --transition-slow: 0.30s ease;

  --ease:      cubic-bezier(.2,.8,.2,1);
  --d-press:   180ms;
  --d-state:   260ms;
  --d-rise:    460ms;
  --d-count:   900ms;
  --d-bar:     820ms;
  --stagger:   55ms;
}

/* ═══════════════════════════════════════════════════════════════
   Layer 2a — LIGHT THEME  · Warm Jade Enterprise (Light)
   Canonical values from claude_code_handoff/tokens/arkan-tokens.css
   [data-axis-theme="light"] block, ported onto existing token names.
   ═══════════════════════════════════════════════════════════════ */
[data-theme="light"] {
  /* Tells the browser to paint native form controls (select popups,
     checkboxes, scrollbars) in the matching palette — without this,
     <select> dropdown POPUPS render with the OS default (light)
     surface regardless of our own CSS on the closed control, which
     is exactly what made every employee/user picker unreadable in
     dark mode: near-white option text (inherited from our dark
     --text-primary) landing on a light native popup background. */
  color-scheme: light;

  /* ── Background & surface (canonical --bg/--panel/--panel-2) ── */
  --bg-primary:      #F3F6F4;
  --bg-secondary:    #FFFFFF;
  --surface-primary: #FFFFFF;
  --surface-elevated:#FAFCFB;
  --surface-overlay: rgba(18, 34, 29, 0.45);

  /* ── Legacy bg aliases ─────────────────────────────────── */
  --bg-base:       #F3F6F4;
  --bg-panel:      #FFFFFF;
  --bg-panel-hover:#EDF3F0;
  --bg-card:       #FFFFFF;
  --bg-overlay:    rgba(18, 34, 29, 0.45);
  --bg-subtle:     rgba(18, 119, 94, 0.06);

  /* ── Row surfaces — canonical --row/--row-hi (list rows,
       distinct from panel) ───────────────────────────────── */
  --row:    #F6F9F7;
  --row-hi: #EDF3F0;

  /* ── Borders — canonical --line/--line-soft/--line-strong.
       Fix: --border-strong was previously colored as the accent;
       canonical treats it as a neutral, more-opaque border. ── */
  --border-default: rgba(18, 34, 29, 0.12);
  --border-subtle:  rgba(18, 34, 29, 0.055);
  --border-strong:  rgba(18, 34, 29, 0.2);
  --border-focus:   rgba(18, 119, 94, 0.32);

  /* ── Legacy border aliases ─────────────────────────────── */
  --border:        rgba(18, 34, 29, 0.12);

  /* ── Text — canonical 5-step --t1..--t5 scale ───────────── */
  --text-t1: #111816;
  --text-t2: #303B37;
  --text-t3: #4F5A55;
  --text-t4: #535E58;
  --text-t5: #646F69;
  --text-primary:   #111816;
  --text-secondary: #4F5A55;
  --text-muted:     #646F69;
  --text-disabled:  rgba(17, 24, 22, 0.32);
  --text-inverse:   #F8FFFC;

  /* ── Accent — Warm Jade (canonical --acc/--acc-hi/--acc-soft) ── */
  --accent-primary:      #12775E;
  --accent-hover:        #0C5F49;
  --accent-pressed:      #0A4C3A;
  --accent-surface:      rgba(18, 119, 94, 0.1);

  /* ── Legacy accent aliases — no secondary decorative color in
       canonical (max two colors on any screen); mapped to the
       money/amber family so existing call sites stay visually
       coherent rather than clashing with jade. ─────────────── */
  --accent-primary-dk:   #0C5F49;
  --accent-secondary:    #8A6A2A;
  --accent-secondary-dk: #6E5521;

  /* ── Status colors — canonical only defines acc/crit/ok/money;
       success reuses acc, warning/info reuse money/ok since
       canonical has no separate hues for them (§2 rule: max two
       colored entities per screen, no color-per-category). ── */
  --status-success:    #12775E;
  --status-success-bg: rgba(18, 119, 94, 0.1);
  --status-warning:    #8A6A2A;
  --status-warning-bg: rgba(138, 106, 42, 0.1);
  --status-danger:     #A8544A;
  --status-danger-bg:  rgba(168, 84, 74, 0.1);
  --status-info:       #5D6A65;
  --status-info-bg:    rgba(93, 106, 101, 0.1);
  --status-neutral:    #5D6A65;
  --status-neutral-bg: rgba(93, 106, 101, 0.1);

  /* ── Legacy semantic color aliases ─────────────────────── */
  --color-success: #12775E;
  --color-warning: #8A6A2A;
  --color-danger:  #A8544A;

  /* ── money — canonical --money: any monetary value, mono,
       tabular-nums ─────────────────────────────────────────── */
  --money: #8A6A2A;

  /* ── halo — canonical --halo: glow on the one decision-making
       surface per screen ─────────────────────────────────────── */
  --halo: rgba(18, 119, 94, 0.12);

  /* ── Sidebar — follows theme, same surfaces as the content area ── */
  --sidebar-bg:          #FFFFFF;
  --sidebar-surface:     #F3F6F4;
  --sidebar-border:      rgba(18, 34, 29, 0.12);
  --sidebar-text:        rgba(17, 24, 22, 0.55);
  --sidebar-text-hover:  rgba(17, 24, 22, 0.85);
  --sidebar-text-active: #111816;
  --sidebar-accent:      #12775E;
  --sidebar-active-bg:   rgba(18, 119, 94, 0.1);

  /* ── Header ────────────────────────────────────────────── */
  --header-bg:     #FFFFFF;
  --header-border: rgba(18, 34, 29, 0.12);

  /* ── Shadows — canonical --e1/--e2/--e3, base = var(--shadow) ── */
  --shadow-sm: 0 1px 3px rgba(18, 44, 36, 0.08);
  --shadow:    0 16px 38px rgba(18, 44, 36, 0.14);
  --shadow-lg: 0 30px 70px rgba(18, 44, 36, 0.14);

  /* ── Glass (no blur) ───────────────────────────────────── */
  --glass-bg:     #FFFFFF;
  --glass-border: rgba(18, 34, 29, 0.12);
  --glass-blur:   none;

  /* ── Chart palette — canonical defines no chart tokens;
       derived from the acc/money/ok/crit family rather than
       inventing new hues. ─────────────────────────────────── */
  --chart-1: #12775E;
  --chart-2: #8A6A2A;
  --chart-3: #5D6A65;
  --chart-4: #4F5A55;
  --chart-5: #A8544A;
  --chart-6: #0C5F49;

  /* ── Scrollbar ─────────────────────────────────────────── */
  --scrollbar-thumb:       rgba(18, 119, 94, 0.22);
  --scrollbar-thumb-hover: rgba(18, 119, 94, 0.40);
  --scrollbar-track:       rgba(18, 119, 94, 0.04);

  /* ── Domain accent colors — canonical rule §2.6 forbids
       color-per-entity; kept structurally (sidebar icon coding
       depends on these existing) but pulled into the jade/neutral
       family instead of the old blue/purple set. Flagged in the
       Phase A audit for a Phase D product decision on whether to
       retire this concept entirely. ───────────────────────────── */
  --aura-sd:      #12775E;
  --aura-assets:  #5D6A65;
  --aura-clients: #0C5F49;
  --aura-reports: #8A6A2A;
  --aura-admin:   #4F5A55;
  --aura-ops:     #A8544A;

  /* ── Legacy variable aliases (old pages → new tokens) ──── */
  --color-bg-elevated:  var(--surface-elevated);
  --color-bg-secondary: var(--bg-secondary);
  --color-bg-muted:     var(--row-hi);
  --color-surface:      var(--surface-primary);
  --color-surface-2:    var(--bg-secondary);
  --color-border:       var(--border-default);
  --color-text:         var(--text-primary);
  --color-text-muted:   var(--text-muted);
  --color-muted:        var(--text-muted);
  --color-primary:      var(--accent-primary);
}

/* ═══════════════════════════════════════════════════════════════
   Layer 2b — DARK THEME  · Warm Jade Enterprise (Dark)
   Canonical values from claude_code_handoff/tokens/arkan-tokens.css
   :root (dark-default) block, ported onto existing token names.
   ═══════════════════════════════════════════════════════════════ */
[data-theme="dark"] {
  color-scheme: dark;

  /* ── Background & surface (canonical --bg/--panel/--panel-2) ── */
  --bg-primary:      #08090A;
  --bg-secondary:    #101214;
  --surface-primary: #101214;
  --surface-elevated:#15181A;
  --surface-overlay: rgba(0, 0, 0, 0.72);

  /* ── Legacy bg aliases ─────────────────────────────────── */
  --bg-base:       #08090A;
  --bg-panel:      #101214;
  --bg-panel-hover:#1C2023;
  --bg-card:       #101214;
  --bg-overlay:    rgba(0, 0, 0, 0.72);
  --bg-subtle:     rgba(63, 240, 180, 0.06);

  /* ── Row surfaces — canonical --row/--row-hi ────────────── */
  --row:    #131618;
  --row-hi: #1C2023;

  /* ── Borders — canonical --line/--line-soft/--line-strong.
       Fix: --border-strong was previously the accent color;
       canonical treats it as a neutral, more-opaque border. ── */
  --border-default: rgba(235, 242, 245, 0.11);
  --border-subtle:  rgba(235, 242, 245, 0.055);
  --border-strong:  rgba(235, 242, 245, 0.2);
  --border-focus:   rgba(63, 240, 180, 0.45);

  /* ── Legacy border aliases ─────────────────────────────── */
  --border:        rgba(235, 242, 245, 0.11);

  /* ── Text — canonical 5-step --t1..--t5 scale ───────────── */
  --text-t1: #FFFFFF;
  --text-t2: #E4E9EC;
  --text-t3: #C2C9CD;
  --text-t4: #A8B0B5;
  --text-t5: #949CA1;
  --text-primary:   #FFFFFF;
  --text-secondary: #C2C9CD;
  --text-muted:     #949CA1;
  --text-disabled:  rgba(255, 255, 255, 0.24);
  --text-inverse:   #00120C;

  /* ── Accent — Warm Jade, bright (canonical --acc/--acc-hi) ── */
  --accent-primary:      #3FF0B4;
  --accent-hover:        #6AFFC9;
  --accent-pressed:      #26C99A;
  --accent-surface:      rgba(63, 240, 180, 0.13);

  /* ── Legacy accent aliases — mapped to the money/amber family,
       see the light-theme comment above for why. ───────────── */
  --accent-primary-dk:   #26C99A;
  --accent-secondary:    #FFCF7A;
  --accent-secondary-dk: #D9A968;

  /* ── Status colors — see light-theme comment: canonical only
       defines acc/crit/ok/money. ──────────────────────────── */
  --status-success:    #6AFFC9;
  --status-success-bg: rgba(63, 240, 180, 0.13);
  --status-warning:    #FFCF7A;
  --status-warning-bg: rgba(255, 207, 122, 0.13);
  --status-danger:     #FF8D80;
  --status-danger-bg:  rgba(255, 141, 128, 0.13);
  --status-info:       #9AA4A8;
  --status-info-bg:    rgba(154, 164, 168, 0.12);
  --status-neutral:    #9AA4A8;
  --status-neutral-bg: rgba(154, 164, 168, 0.12);

  /* ── Legacy semantic color aliases ─────────────────────── */
  --color-success: #6AFFC9;
  --color-warning: #FFCF7A;
  --color-danger:  #FF8D80;

  /* ── money — canonical --money ──────────────────────────── */
  --money: #FFCF7A;

  /* ── halo — canonical --halo ─────────────────────────────── */
  --halo: rgba(63, 240, 180, 0.2);

  /* ── Sidebar — canonical shell uses the same --bg as content;
       no separately-tinted chrome color in the reference. ── */
  --sidebar-bg:          #08090A;
  --sidebar-surface:     #101214;
  --sidebar-border:      rgba(235, 242, 245, 0.11);
  --sidebar-text:        rgba(255, 255, 255, 0.42);
  --sidebar-text-hover:  rgba(255, 255, 255, 0.78);
  --sidebar-text-active: #FFFFFF;
  --sidebar-accent:      #3FF0B4;
  --sidebar-active-bg:   rgba(63, 240, 180, 0.16);

  /* ── Header ────────────────────────────────────────────── */
  --header-bg:     #08090A;
  --header-border: rgba(235, 242, 245, 0.11);

  /* ── Shadows — canonical --e1/--e2/--e3, base = var(--shadow) ── */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow:    0 16px 38px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 30px 70px rgba(0, 0, 0, 0.6);

  /* ── Glass (no blur) ───────────────────────────────────── */
  --glass-bg:     #101214;
  --glass-border: rgba(235, 242, 245, 0.11);
  --glass-blur:   none;

  /* ── Chart palette — see light-theme comment. ───────────── */
  --chart-1: #3FF0B4;
  --chart-2: #FFCF7A;
  --chart-3: #9AA4A8;
  --chart-4: #C2C9CD;
  --chart-5: #FF8D80;
  --chart-6: #6AFFC9;

  /* ── Scrollbar ─────────────────────────────────────────── */
  --scrollbar-thumb:       rgba(63, 240, 180, 0.25);
  --scrollbar-thumb-hover: rgba(63, 240, 180, 0.45);
  --scrollbar-track:       rgba(63, 240, 180, 0.04);

  /* ── Domain accent colors — see light-theme comment. ────── */
  --aura-sd:      #3FF0B4;
  --aura-assets:  #9AA4A8;
  --aura-clients: #6AFFC9;
  --aura-reports: #FFCF7A;
  --aura-admin:   #C2C9CD;
  --aura-ops:     #FF8D80;

  /* ── Legacy variable aliases (old pages → new tokens) ──── */
  --color-bg-elevated:  var(--surface-elevated);
  --color-bg-secondary: var(--bg-secondary);
  --color-bg-muted:     var(--row-hi);
  --color-surface:      var(--surface-primary);
  --color-surface-2:    var(--bg-secondary);
  --color-border:       var(--border-default);
  --color-text:         var(--text-primary);
  --color-text-muted:   var(--text-muted);
  --color-muted:        var(--text-muted);
  --color-primary:      var(--accent-primary);
  --color-danger:       var(--status-danger);
  --color-warning:      var(--status-warning);
  --color-success:      var(--status-success);
}

/* ═══════════════════════════════════════════════════════════════
   Layer 3 — SYSTEM THEME (follows OS preference)
   Mirrors Layer 2 exactly — kept in sync manually, same as before.
   ═══════════════════════════════════════════════════════════════ */

@media (prefers-color-scheme: light) {
  [data-theme="system"] {
    color-scheme: light;
    --bg-primary:      #F3F6F4;
    --bg-secondary:    #FFFFFF;
    --surface-primary: #FFFFFF;
    --surface-elevated:#FAFCFB;
    --surface-overlay: rgba(18, 34, 29, 0.45);
    --bg-base:         #F3F6F4;
    --bg-panel:        #FFFFFF;
    --bg-panel-hover:  #EDF3F0;
    --bg-card:         #FFFFFF;
    --bg-overlay:      rgba(18, 34, 29, 0.45);
    --bg-subtle:       rgba(18, 119, 94, 0.06);
    --row:    #F6F9F7;
    --row-hi: #EDF3F0;
    --border-default:  rgba(18, 34, 29, 0.12);
    --border-subtle:   rgba(18, 34, 29, 0.055);
    --border-strong:   rgba(18, 34, 29, 0.2);
    --border-focus:    rgba(18, 119, 94, 0.32);
    --border:          rgba(18, 34, 29, 0.12);
    --text-t1: #111816; --text-t2: #303B37; --text-t3: #4F5A55; --text-t4: #535E58; --text-t5: #646F69;
    --text-primary:    #111816;
    --text-secondary:  #4F5A55;
    --text-muted:      #646F69;
    --text-disabled:   rgba(17, 24, 22, 0.32);
    --text-inverse:    #F8FFFC;
    --accent-primary:      #12775E;
    --accent-hover:        #0C5F49;
    --accent-pressed:      #0A4C3A;
    --accent-surface:      rgba(18, 119, 94, 0.1);
    --accent-primary-dk:   #0C5F49;
    --accent-secondary:    #8A6A2A;
    --accent-secondary-dk: #6E5521;
    --status-success:    #12775E;
    --status-success-bg: rgba(18, 119, 94, 0.1);
    --status-warning:    #8A6A2A;
    --status-warning-bg: rgba(138, 106, 42, 0.1);
    --status-danger:     #A8544A;
    --status-danger-bg:  rgba(168, 84, 74, 0.1);
    --status-info:       #5D6A65;
    --status-info-bg:    rgba(93, 106, 101, 0.1);
    --status-neutral:    #5D6A65;
    --status-neutral-bg: rgba(93, 106, 101, 0.1);
    --color-success: #12775E; --color-warning: #8A6A2A; --color-danger: #A8544A;
    --money: #8A6A2A;
    --halo:  rgba(18, 119, 94, 0.12);
    --sidebar-bg:          #FFFFFF;
    --sidebar-surface:     #F3F6F4;
    --sidebar-border:      rgba(18, 34, 29, 0.12);
    --sidebar-text:        rgba(17, 24, 22, 0.55);
    --sidebar-text-hover:  rgba(17, 24, 22, 0.85);
    --sidebar-text-active: #111816;
    --sidebar-accent:      #12775E;
    --sidebar-active-bg:   rgba(18, 119, 94, 0.1);
    --header-bg:     #FFFFFF;
    --header-border: rgba(18, 34, 29, 0.12);
    --shadow-sm: 0 1px 3px rgba(18, 44, 36, 0.08);
    --shadow:    0 16px 38px rgba(18, 44, 36, 0.14);
    --shadow-lg: 0 30px 70px rgba(18, 44, 36, 0.14);
    --glass-bg: #FFFFFF; --glass-border: rgba(18, 34, 29, 0.12); --glass-blur: none;
    --chart-1: #12775E; --chart-2: #8A6A2A; --chart-3: #5D6A65;
    --chart-4: #4F5A55; --chart-5: #A8544A; --chart-6: #0C5F49;
    --scrollbar-thumb:       rgba(18, 119, 94, 0.22);
    --scrollbar-thumb-hover: rgba(18, 119, 94, 0.40);
    --scrollbar-track:       rgba(18, 119, 94, 0.04);
    --aura-sd: #12775E; --aura-assets: #5D6A65; --aura-clients: #0C5F49;
    --aura-reports: #8A6A2A; --aura-admin: #4F5A55; --aura-ops: #A8544A;
    --color-bg-elevated:  var(--surface-elevated);
    --color-bg-secondary: var(--bg-secondary);
    --color-bg-muted:     var(--row-hi);
    --color-surface:      var(--surface-primary);
    --color-surface-2:    var(--bg-secondary);
    --color-border:       var(--border-default);
    --color-text:         var(--text-primary);
    --color-text-muted:   var(--text-muted);
    --color-muted:        var(--text-muted);
    --color-primary:      var(--accent-primary);
  }
}

@media (prefers-color-scheme: dark) {
  [data-theme="system"] {
    color-scheme: dark;
    --bg-primary:      #08090A;
    --bg-secondary:    #101214;
    --surface-primary: #101214;
    --surface-elevated:#15181A;
    --surface-overlay: rgba(0, 0, 0, 0.72);
    --bg-base:         #08090A;
    --bg-panel:        #101214;
    --bg-panel-hover:  #1C2023;
    --bg-card:         #101214;
    --bg-overlay:      rgba(0, 0, 0, 0.72);
    --bg-subtle:       rgba(63, 240, 180, 0.06);
    --row:    #131618;
    --row-hi: #1C2023;
    --border-default:  rgba(235, 242, 245, 0.11);
    --border-subtle:   rgba(235, 242, 245, 0.055);
    --border-strong:   rgba(235, 242, 245, 0.2);
    --border-focus:    rgba(63, 240, 180, 0.45);
    --border:          rgba(235, 242, 245, 0.11);
    --text-t1: #FFFFFF; --text-t2: #E4E9EC; --text-t3: #C2C9CD; --text-t4: #A8B0B5; --text-t5: #949CA1;
    --text-primary:    #FFFFFF;
    --text-secondary:  #C2C9CD;
    --text-muted:      #949CA1;
    --text-disabled:   rgba(255, 255, 255, 0.24);
    --text-inverse:    #00120C;
    --accent-primary:      #3FF0B4;
    --accent-hover:        #6AFFC9;
    --accent-pressed:      #26C99A;
    --accent-surface:      rgba(63, 240, 180, 0.13);
    --accent-primary-dk:   #26C99A;
    --accent-secondary:    #FFCF7A;
    --accent-secondary-dk: #D9A968;
    --status-success:    #6AFFC9;
    --status-success-bg: rgba(63, 240, 180, 0.13);
    --status-warning:    #FFCF7A;
    --status-warning-bg: rgba(255, 207, 122, 0.13);
    --status-danger:     #FF8D80;
    --status-danger-bg:  rgba(255, 141, 128, 0.13);
    --status-info:       #9AA4A8;
    --status-info-bg:    rgba(154, 164, 168, 0.12);
    --status-neutral:    #9AA4A8;
    --status-neutral-bg: rgba(154, 164, 168, 0.12);
    --color-success: #6AFFC9; --color-warning: #FFCF7A; --color-danger: #FF8D80;
    --money: #FFCF7A;
    --halo:  rgba(63, 240, 180, 0.2);
    --sidebar-bg:          #08090A;
    --sidebar-surface:     #101214;
    --sidebar-border:      rgba(235, 242, 245, 0.11);
    --sidebar-text:        rgba(255, 255, 255, 0.42);
    --sidebar-text-hover:  rgba(255, 255, 255, 0.78);
    --sidebar-text-active: #FFFFFF;
    --sidebar-accent:      #3FF0B4;
    --sidebar-active-bg:   rgba(63, 240, 180, 0.16);
    --header-bg:     #08090A;
    --header-border: rgba(235, 242, 245, 0.11);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
    --shadow:    0 16px 38px rgba(0, 0, 0, 0.6);
    --shadow-lg: 0 30px 70px rgba(0, 0, 0, 0.6);
    --glass-bg: #101214; --glass-border: rgba(235, 242, 245, 0.11); --glass-blur: none;
    --chart-1: #3FF0B4; --chart-2: #FFCF7A; --chart-3: #9AA4A8;
    --chart-4: #C2C9CD; --chart-5: #FF8D80; --chart-6: #6AFFC9;
    --scrollbar-thumb:       rgba(63, 240, 180, 0.25);
    --scrollbar-thumb-hover: rgba(63, 240, 180, 0.45);
    --scrollbar-track:       rgba(63, 240, 180, 0.04);
    --aura-sd: #3FF0B4; --aura-assets: #9AA4A8; --aura-clients: #6AFFC9;
    --aura-reports: #FFCF7A; --aura-admin: #C2C9CD; --aura-ops: #FF8D80;
    --color-bg-elevated:  var(--surface-elevated);
    --color-bg-secondary: var(--bg-secondary);
    --color-bg-muted:     var(--row-hi);
    --color-surface:      var(--surface-primary);
    --color-surface-2:    var(--bg-secondary);
    --color-border:       var(--border-default);
    --color-text:         var(--text-primary);
    --color-text-muted:   var(--text-muted);
    --color-muted:        var(--text-muted);
    --color-primary:      var(--accent-primary);
    --color-danger:       var(--status-danger);
    --color-warning:      var(--status-warning);
    --color-success:      var(--status-success);
  }
}