/* Generado desde tokens.json. No editar a mano: cambia el JSON y vuelve a generar. */
:root {
  color-scheme: light;
  --color-bg: #F5F6F8;
  --color-surface: #FFFFFF;
  --color-surface-2: #ECEEF2;
  --color-border: #DADEE4;
  --color-border-input: #7A8494;
  --color-text: #12161C;
  --color-text-muted: #505A68;
  --color-accent: #0B6B5E;
  --color-on-accent: #FFFFFF;
  --color-accent-soft: #D9F0EC;
  --color-on-accent-soft: #084F45;
  --color-danger: #B42318;
  --color-danger-soft: #FDE7E5;
  --color-success: #067647;
  --color-success-soft: #DCF5E8;
  --color-warning: #8A4B00;
  --color-warning-soft: #FDEFD3;
  --color-income: #067647;
  --color-expense: #B42318;
  --color-focus-ring: #0B6B5E;
  --color-overlay: #0B0F14;
  --font-sans: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --text-xs: 0.75rem;
  --text-xs-lh: 1.0rem;
  --text-xs-w: 500;
  --text-sm: 0.875rem;
  --text-sm-lh: 1.25rem;
  --text-sm-w: 400;
  --text-base: 1.0rem;
  --text-base-lh: 1.5rem;
  --text-base-w: 400;
  --text-lg: 1.25rem;
  --text-lg-lh: 1.75rem;
  --text-lg-w: 600;
  --text-xl: 1.75rem;
  --text-xl-lh: 2.125rem;
  --text-xl-w: 700;
  --text-2xl: 2.25rem;
  --text-2xl-lh: 2.625rem;
  --text-2xl-w: 700;
  --space-0: 0.0rem;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1.0rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 2.0rem;
  --space-8: 2.5rem;
  --space-9: 3.0rem;
  --space-10: 4.0rem;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-full: 9999px;
  --shadow-sm: 0 1px 2px rgba(18,22,28,.08);
  --shadow-md: 0 4px 16px rgba(18,22,28,.12);
  --shadow-sheet: 0 -8px 32px rgba(18,22,28,.16);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 320ms;
  --ease: cubic-bezier(.2,.8,.2,1);
  --content-max: 480px;
  --header-h: 56px;
  --bottom-nav-h: 64px;
  --fab: 56px;
  --tap-min: 44px;
  --cat-1: #C2410C;
  --cat-2: #0369A1;
  --cat-3: #6D28D9;
  --cat-4: #B91C1C;
  --cat-5: #0F766E;
  --cat-6: #BE185D;
  --cat-7: #A16207;
  --cat-8: #475569;
  --cat-9: #15803D;
  --cat-10: #047857;
  --cat-11: #BE123C;
  --cat-12: #4B5563;
}

/* Oscuro: sigue el sistema, y se puede forzar con data-theme en <html>. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-bg: #0D1015;
    --color-surface: #161B22;
    --color-surface-2: #1F2630;
    --color-border: #2B3440;
    --color-border-input: #8792A2;
    --color-text: #EDF0F4;
    --color-text-muted: #A5AFBD;
    --color-accent: #4FD1BC;
    --color-on-accent: #04201B;
    --color-accent-soft: #123530;
    --color-on-accent-soft: #9CEBDD;
    --color-danger: #FF8A80;
    --color-danger-soft: #3A1A18;
    --color-success: #5DD99B;
    --color-success-soft: #12311F;
    --color-warning: #FBBF4A;
    --color-warning-soft: #3A2A0A;
    --color-income: #5DD99B;
    --color-expense: #FF8A80;
    --color-focus-ring: #4FD1BC;
    --color-overlay: #000000;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #0D1015;
  --color-surface: #161B22;
  --color-surface-2: #1F2630;
  --color-border: #2B3440;
  --color-border-input: #8792A2;
  --color-text: #EDF0F4;
  --color-text-muted: #A5AFBD;
  --color-accent: #4FD1BC;
  --color-on-accent: #04201B;
  --color-accent-soft: #123530;
  --color-on-accent-soft: #9CEBDD;
  --color-danger: #FF8A80;
  --color-danger-soft: #3A1A18;
  --color-success: #5DD99B;
  --color-success-soft: #12311F;
  --color-warning: #FBBF4A;
  --color-warning-soft: #3A2A0A;
  --color-income: #5DD99B;
  --color-expense: #FF8A80;
  --color-focus-ring: #4FD1BC;
  --color-overlay: #000000;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur-base: 0ms; --dur-slow: 0ms; }
}

html { font-family: var(--font-sans); background: var(--color-bg); color: var(--color-text); }
.num { font-variant-numeric: tabular-nums; }
:focus-visible { outline: 2px solid var(--color-focus-ring); outline-offset: 2px; }
