:root {
  --emerald-600: #0f6e56; 
  --emerald-700: #0b5745; 
  --forest-800:  #174a3a; 
  --brass-500:   #a9822f; 
  --paper:       #f7f9f8; 
  --white:       #ffffff; 
  --charcoal:    #202925; 
  --slate-500:   #64716b; 
  --sage-200:    #dce5e0; 
  --emerald-300: #5cc9a7; 
  --emerald-100: #e3f1eb; 
  --brass-700:   #7a5c1c; 
  --brass-100:   #f5eedd;
  --sage-50:     #eef3f0; 
  --sage-100:    #e6ede9; 
  --sage-400:    #7d8a84; 
  --sage-700:    #4a5650;
  --green-700:   #14612a; 
  --green-600:   #1e7b34;
  --green-100:   #e2f3e5;
  --amber-700:   #8a5a00; 
  --amber-500:   #d99a1e;
  --amber-100:   #fbf0d9;
  --red-700:     #b42318; 
  --red-100:     #fce8e6;
  --d-app:      #0e1412;
  --d-surface:  #151d1a;
  --d-raised:   #1d2724;
  --d-sunken:   #0b100e;
  --d-shell:    #121a17;
  --d-border:   #26322e;
  --d-border-2: #34423d;
  --d-border-strong: #6b7a73;
  --bg-app:        var(--paper);
  --bg-surface:    var(--white);
  --bg-raised:     var(--white);
  --bg-sunken:     var(--sage-50);
  --bg-well:       var(--sage-100);
  --bg-inverse:    var(--charcoal);
  --bg-shell:      var(--white);
  --scrim:         color-mix(in srgb, var(--charcoal) 45%, transparent);
  --media-well:    #1b2420;
  --surface-lift:  none;
  --field-bg:      var(--white);
  --row-hover:     color-mix(in srgb, var(--accent) 6%, var(--bg-surface));
  --topbar-bg:     rgba(255, 255, 255, 0.88); 
  --border:        var(--sage-200);
  --border-strong: var(--sage-400);
  --text-primary:   var(--charcoal);
  --text-secondary: var(--slate-500);
  --text-tertiary:  var(--sage-400); 
  --text-inverse:   var(--white);
  --text-link:      var(--emerald-700);
  --accent:        var(--emerald-600);
  --accent-hover:  var(--emerald-700);
  --accent-deep:   color-mix(in srgb, var(--accent) 60%, var(--forest-800) 40%);
  --accent-glow:   color-mix(in srgb, var(--accent) 30%, transparent);
  --grad-accent:   linear-gradient(135deg, var(--accent) 0%, var(--accent-deep) 100%);
  --grad-hero:     linear-gradient(150deg, var(--accent-deep) 0%, color-mix(in srgb, var(--accent-deep) 55%, var(--charcoal) 45%) 100%);
  --grad-surface:  linear-gradient(180deg, color-mix(in srgb, var(--accent) 4%, var(--bg-surface)) 0%, var(--bg-surface) 60%);
  --grad-stat:     linear-gradient(150deg, var(--accent-deep) 0%, color-mix(in srgb, var(--accent) 45%, var(--charcoal) 55%) 96%);
  --on-accent-muted: color-mix(in srgb, var(--white) 86%, var(--accent) 14%);
  --on-hero-strong: rgba(255, 255, 255, 0.94);
  --on-hero-muted:  rgba(255, 255, 255, 0.84);
  --on-hero-faint:  rgba(255, 255, 255, 0.18);
  --focus-ring:    var(--accent);
  --focus-halo:    color-mix(in srgb, var(--focus-ring) 28%, transparent);
  --focus-shadow:  0 0 0 2px var(--focus-ring), 0 0 0 6px var(--focus-halo);
  --avatar-bg:     var(--sage-700);
  --soft-primary-bg:  var(--emerald-100); --soft-primary-fg:  var(--emerald-700);
  --soft-tertiary-bg: var(--brass-100);   --soft-tertiary-fg: var(--brass-700);
  --soft-success-bg:  var(--green-100);   --soft-success-fg:  var(--green-700);
  --soft-warning-bg:  var(--amber-100);   --soft-warning-fg:  var(--amber-700);
  --soft-error-bg:    var(--red-100);     --soft-error-fg:    var(--red-700);
  --soft-neutral-bg:  var(--sage-50);     --soft-neutral-fg:  var(--sage-700);
  --solid-primary:  var(--emerald-600); --solid-tertiary: var(--brass-500);
  --solid-success:  var(--green-600);   --solid-warning:  var(--amber-500);
  --solid-error:    var(--red-700);     --solid-neutral:  var(--sage-400);
  --on-solid:       var(--white);
  --overlay-on-solid: color-mix(in srgb, var(--white) 18%, transparent);
  --on-solid-muted: color-mix(in srgb, var(--white) 82%, transparent);
  --tint-1: var(--emerald-700);
  --tint-2: var(--forest-800);
  --tint-3: var(--brass-700);
  --tint-4: var(--green-700);
  --tint-5: var(--sage-700);
  --on-tint: var(--white);
  --font-display: "Source Serif 4", Georgia, serif;
  --font-sans: "Public Sans", system-ui, sans-serif;
  --font-mono: "Source Code Pro", ui-monospace, monospace;
  --fs-display: clamp(34px, 2.8vw + 24px, 48px); --fs-h1: clamp(26px, 1.4vw + 21px, 32px);
  --fs-h2: 23px; --fs-h3: 18px;
  --fs-body-lg: 17px; --fs-body: 15px; --fs-sm: 13px; --fs-xs: 12px; --fs-mono: 13px;
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --fw-extra: 800;
  --lh-tight: 1.1; --lh-snug: 1.28; --lh-normal: 1.5; --lh-relaxed: 1.62;
  --ls-display: -0.015em; --ls-tight: -0.005em;
  --sp-0: 0; --sp-1: 2px; --sp-2: 4px; --sp-3: 8px; --sp-4: 12px; --sp-5: 16px;
  --sp-6: 20px; --sp-7: 24px; --sp-8: 32px; --sp-9: 40px; --sp-10: 48px; --sp-11: 64px; --sp-12: 80px;
  --r-xs: 2px; --r-sm: 4px; --r-md: 6px; --r-lg: 8px; --r-xl: 12px; --r-2xl: 16px; --r-full: 999px;
  --shadow-xs: 0 1px 2px rgba(32, 41, 37, 0.06);
  --shadow-sm: 0 1px 2px rgba(32, 41, 37, 0.06), 0 1px 1px rgba(32, 41, 37, 0.04);
  --shadow-md: 0 2px 6px -2px rgba(32, 41, 37, 0.08), 0 6px 14px -4px rgba(32, 41, 37, 0.09);
  --shadow-lg: 0 6px 14px -8px rgba(32, 41, 37, 0.12), 0 14px 36px -12px rgba(32, 41, 37, 0.18);
  --shadow-xl: 0 12px 28px -12px rgba(32, 41, 37, 0.16), 0 28px 56px -24px rgba(32, 41, 37, 0.26);
  --shadow-accent: 0 2px 8px -2px color-mix(in srgb, var(--accent) 20%, transparent),
                   0 8px 24px -8px var(--accent-glow);
  --ring-hairline: 0 0 0 1px var(--border);
  --blur-glass: 12px;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 120ms; --dur-base: 200ms; --dur-slow: 320ms; --dur-slower: 480ms;
  --stagger: 40ms;
  --texture-noise: none;
  --container: 1200px; --grid-cols: 12; --grid-gutter: 24px;
}
[data-theme="dark"] {
  --bg-app:        var(--d-app);
  --bg-surface:    var(--d-surface);
  --bg-raised:     var(--d-raised);
  --bg-sunken:     var(--d-sunken);
  --bg-shell:      var(--d-shell);
  --bg-well:       #080c0a;
  --bg-inverse:    #eef3f0;
  --surface-lift:  linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0) 64px);
  --field-bg:      var(--d-sunken);
  --row-hover:     color-mix(in srgb, var(--accent) 14%, transparent);
  --topbar-bg:     rgba(14, 20, 18, 0.86);
  --border:        var(--d-border);
  --border-strong: var(--d-border-strong);
  --focus-ring:    color-mix(in srgb, var(--accent) 55%, var(--white) 45%);
  --text-primary:   #eef3f0;
  --text-secondary: #a3b1aa;
  --text-tertiary:  #84918a;
  --text-inverse:   var(--charcoal);
  --text-link:      var(--emerald-300);
  --avatar-bg:      var(--d-border-2);
  --soft-primary-bg:  rgba(15, 110, 86, 0.28);  --soft-primary-fg:  #7fd9bb;
  --soft-tertiary-bg: rgba(169, 130, 47, 0.22); --soft-tertiary-fg: #e0c27e;
  --soft-success-bg:  rgba(30, 123, 52, 0.26);  --soft-success-fg:  #7ed49a;
  --soft-warning-bg:  rgba(217, 154, 30, 0.20); --soft-warning-fg:  #ecc46e;
  --soft-error-bg:    rgba(180, 35, 24, 0.26);  --soft-error-fg:    #f4958c;
  --soft-neutral-bg:  rgba(255, 255, 255, 0.07); --soft-neutral-fg: #c3cec8;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.40);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.45), 0 1px 1px rgba(0, 0, 0, 0.30);
  --shadow-md: 0 2px 6px -2px rgba(0, 0, 0, 0.40), 0 6px 16px -4px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 6px 14px -8px rgba(0, 0, 0, 0.45), 0 16px 40px -12px rgba(0, 0, 0, 0.65);
  --shadow-xl: 0 12px 28px -12px rgba(0, 0, 0, 0.55), 0 32px 64px -24px rgba(0, 0, 0, 0.85);
}