:root {
  --color-forest-950: #071511;
  --color-forest-900: #0A1C17;
  --color-forest-850: #0E241E;
  --color-forest-800: #122B24;
  --color-forest-700: #1B3D33;
  --color-forest-600: #255245;
  --color-forest-500: #336F5E;
  --color-forest-400: #4B8E7B;
  --color-forest-300: #71B09F;
  --color-forest-200: #A3D1C4;
  --color-forest-100: #D8ECE6;
  --color-forest-50:  #EEF7F4;

  --color-copper-900: #4A1D0B;
  --color-copper-800: #783115;
  --color-copper-700: #A8451E;
  --color-copper-600: #C85828;
  --color-copper-500: #D97746;
  --color-copper-400: #E29267;
  --color-copper-300: #ECB08F;
  --color-copper-200: #F5D1BE;
  --color-copper-100: #FBEBE1;
  --color-copper-50:  #FDF6F1;

  --color-sand-950: #161513;
  --color-sand-900: #23211D;
  --color-sand-800: #3C3933;
  --color-sand-700: #59554C;
  --color-sand-600: #7A756A;
  --color-sand-500: #9F998C;
  --color-sand-400: #C5BFB3;
  --color-sand-300: #DDD8CE;
  --color-sand-200: #EAE6DD;
  --color-sand-100: #F3EFE8;
  --color-sand-50:  #FBF9F5;
  --color-white:    #FFFFFF;

  --color-status-success: #287A5B;
  --color-status-success-bg: #EDF7F2;
  --color-status-warning: #B87214;
  --color-status-warning-bg: #FDF6EC;
  --color-status-info: #225C75;
  --color-status-info-bg: #EEF6FA;

  --font-family-display: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-family-body: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-family-mono: "JetBrains Mono", "SF Mono", "Fira Code", monospace;

  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  --shadow-subtle: 0 1px 3px rgba(10, 28, 23, 0.04), 0 1px 2px rgba(10, 28, 23, 0.02);
  --shadow-card: 0 4px 16px -2px rgba(10, 28, 23, 0.06), 0 2px 6px -1px rgba(10, 28, 23, 0.03);
  --shadow-elevated: 0 12px 32px -4px rgba(10, 28, 23, 0.08), 0 4px 12px -2px rgba(10, 28, 23, 0.04);
  --shadow-accent: 0 8px 24px -4px rgba(217, 119, 70, 0.25);

  --transition-fast: 150ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 250ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 400ms cubic-bezier(0.16, 1, 0.3, 1);
}

[data-theme="light"], html:not([data-theme="dark"]) {
  --bg-page: var(--color-sand-50);
  --bg-surface: var(--color-white);
  --bg-surface-raised: #FFFFFF;
  --bg-surface-subtle: var(--color-sand-100);
  --bg-surface-muted: var(--color-sand-200);
  --bg-surface-dark: var(--color-forest-900);

  --text-primary: var(--color-forest-950);
  --text-secondary: var(--color-sand-700);
  --text-muted: var(--color-sand-600);
  --text-inverse: var(--color-sand-50);
  --text-accent: var(--color-copper-700);

  --border-subtle: var(--color-sand-300);
  --border-default: var(--color-sand-400);
  --border-strong: var(--color-forest-800);
  --border-accent: var(--color-copper-500);

  --primary-btn-bg: var(--color-forest-900);
  --primary-btn-text: var(--color-sand-50);
  --primary-btn-hover: var(--color-forest-800);

  --accent-btn-bg: var(--color-copper-600);
  --accent-btn-text: var(--color-white);
  --accent-btn-hover: var(--color-copper-700);

  --secondary-btn-bg: var(--color-sand-100);
  --secondary-btn-text: var(--color-forest-900);
  --secondary-btn-hover: var(--color-sand-200);

  --badge-bg: var(--color-forest-50);
  --badge-text: var(--color-forest-700);
  --badge-border: var(--color-forest-200);

  --table-header-bg: var(--color-sand-100);
  --table-highlight-bg: #FAF5EE;
  --table-border: var(--color-sand-300);
}

[data-theme="dark"] {
  --bg-page: #081410;
  --bg-surface: #0E1F1A;
  --bg-surface-raised: #142B24;
  --bg-surface-subtle: #19342C;
  --bg-surface-muted: #214339;
  --bg-surface-dark: #050E0B;

  --text-primary: #EDE8DF;
  --text-secondary: #B4AEA1;
  --text-muted: #837E74;
  --text-inverse: #0A1C17;
  --text-accent: #E29267;

  --border-subtle: #1A372E;
  --border-default: #254A3E;
  --border-strong: #417565;
  --border-accent: #C85828;

  --primary-btn-bg: #EDE8DF;
  --primary-btn-text: #0A1C17;
  --primary-btn-hover: #FFFFFF;

  --accent-btn-bg: var(--color-copper-500);
  --accent-btn-text: var(--color-white);
  --accent-btn-hover: var(--color-copper-400);

  --secondary-btn-bg: #162F27;
  --secondary-btn-text: #EDE8DF;
  --secondary-btn-hover: #1E3F35;

  --badge-bg: #122B24;
  --badge-text: #A3D1C4;
  --badge-border: #1E4439;

  --table-header-bg: #0C1D18;
  --table-highlight-bg: #142721;
  --table-border: #1C382F;
}

.tabular-nums {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}
