


:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #042741;
  --surface: #072c47;
  --surface-2: #0f3753;
  --text: #e9eff5;
  --muted: #9fb6c9;
  --line: #2c4a60;
  
  --accent: #ffc107;
  --on-accent: #042741;
  --accent-ink: #ffc107; 
  
  --urgent: #ff8272;
  --important: #8cc22a; 
  --normal: #6ea8ff;
  --info: #97abc0;
  --done: #5fd38d;
  --suspect: #c4a3ff;
  
  --cat-cyan: #4fd1e0;
  --cat-pink: #ff8bc2;
  --cat-citron: #e8e26a;
  --cat-violet: #9c8cff;
  --fill: 50%; 
  --on-state: #ffffff; 
  --shadow: none;
  --shadow-pop: 0 6px 18px rgba(0, 0, 0, 0.45);
  --shadow-bar: 0 -2px 10px rgba(0, 0, 0, 0.35);
  --scrim: rgba(0, 0, 0, 0.6);
}


:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f1f5f8;
  --surface: #ffffff;
  --surface-2: #e6edf3;
  --text: #042741;
  --muted: #476079;
  --line: #cfdae4;
  --accent: #ffc107;
  --on-accent: #042741;
  --accent-ink: #0b4a7a;
  --urgent: #c62f20;
  --important: #426a0c; 
  --normal: #2f5fd0;
  --info: #52667a;
  --done: #277346;
  --suspect: #6d28d9;
  --cat-cyan: #0e7490;
  --cat-pink: #be185d;
  --cat-citron: #7a6f00;
  --cat-violet: #4338ca;
  --fill: 50%; 
  --on-state: #042741; 
  --shadow: 0 1px 3px rgba(4, 39, 65, 0.08), 0 1px 2px rgba(4, 39, 65, 0.05);
  --shadow-pop: 0 6px 18px rgba(4, 39, 65, 0.22);
  --shadow-bar: 0 -2px 10px rgba(4, 39, 65, 0.12);
  --scrim: rgba(4, 39, 65, 0.5);
}


:root {
  
  --card: var(--surface);
  --card-2: var(--surface-2);
  --accent-text: var(--on-accent);
  --danger: var(--urgent);
  --ok: var(--done);
  --warn: var(--important);
  --p-urgent: var(--urgent);
  --p-verifier: var(--suspect);
  --p-payer: var(--important);
  --p-traiter: var(--normal);
  --p-info: var(--info);

  
  --paper: #ffffff; 
  --record: #d93a3a; 
  --on-record: #ffffff;

  
  --radius-card: 12px;
  --radius-box: 10px;
  --radius-ctl: 8px;
  --radius-sm: 6px;
  --radius-xs: 4px;
  --radius-pill: 999px;
  --radius-round: 50%;

  
  --pad-box: var(--space-3) var(--space-3h);
  --pad-row: var(--space-2h) var(--space-3);

  
  --fs-2xs: 11px;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 14px;
  --fs-lg: 15px;
  --fs-base: 16px;
  --fs-xl: 18px;
  --fs-2xl: 20px;
  --fs-3xl: 22px;
  --fs-display: 40px;
  
  --space-0: 2px;
  --space-1: 4px;
  --space-1h: 6px;
  --space-2: 8px;
  --space-2h: 10px;
  --space-3: 12px;
  --space-3h: 14px;
  --space-4: 16px;
  --space-4h: 18px;
  --space-5: 20px;
  --space-6: 24px;

  
  --clear-bar: 72px;
  --clear-fab: 96px;
  --clear-side: 100px;
  --indent-task: 54px;
  --indent-task-sm: 38px;
  --reserve-corner: 40px;

  
  --t-micro: 200ms; 
  --t-std: 300ms; 
  --t-page: 500ms; 
  --t-stagger: 80ms; 
  --ease: cubic-bezier(0.16, 1, 0.3, 1); 
  --t-long: 800ms; 
  --t-spin: 800ms; 
  --t-pulse: 1400ms;
  --t-glow: 1400ms; 
}


:root[data-motion="reduced"] {
  --t-micro: 1ms;
  --t-std: 1ms;
  --t-page: 1ms;
  --t-stagger: 0ms;
  --t-long: 1ms;
  --t-glow: 1ms;
}
