/* Tokens de diseño. Claro por defecto; oscuro por preferencia del sistema o por data-theme. */
:root {
  --font-ui: "Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-data: "Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --ink: #0e1726;
  --ink-soft: #3b475c;
  --ink-mute: #5d6982;
  --paper: #f5f6f8;
  --surface: #ffffff;
  --surface-sunk: #eef0f4;
  --line: #dfe3ea;
  --line-strong: #c7cdd8;

  --stamp: #2c3fbf;
  --stamp-ink: #ffffff;
  --stamp-soft: #e8ebfb;
  --stamp-line: #b9c1f0;

  --ok: #0f7a4f;   --ok-soft: #e3f4ec;
  --warn: #8a5200; --warn-soft: #fbf0d9;
  --bad: #b42318;  --bad-soft: #fbe7e5;

  --radius-s: 6px;
  --radius-m: 10px;
  --radius-l: 16px;
  --shadow-pop: 0 18px 48px -12px rgba(14, 23, 38, 0.28), 0 2px 6px rgba(14, 23, 38, 0.08);
  --shadow-receipt: 0 24px 40px -18px rgba(14, 23, 38, 0.35);
  --focus: 0 0 0 3px rgba(44, 63, 191, 0.38);

  --step--1: 0.8125rem;
  --step-0: 0.9375rem;
  --step-1: 1.125rem;
  --step-2: 1.5rem;
  --step-3: 2rem;

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink: #e8ecf5;
    --ink-soft: #b4bdd0;
    --ink-mute: #8a96ae;
    --paper: #0b1220;
    --surface: #111a2c;
    --surface-sunk: #0d1526;
    --line: #232f47;
    --line-strong: #33425f;
    --stamp: #8fa2ff;
    --stamp-ink: #0b1220;
    --stamp-soft: #1a2448;
    --stamp-line: #34428a;
    --ok: #4fd09a;   --ok-soft: #10281f;
    --warn: #f0b252; --warn-soft: #2d2210;
    --bad: #ff8b7e;  --bad-soft: #321614;
    --shadow-pop: 0 18px 48px -12px rgba(0, 0, 0, 0.7), 0 2px 6px rgba(0, 0, 0, 0.4);
    --shadow-receipt: 0 24px 40px -18px rgba(0, 0, 0, 0.7);
    --focus: 0 0 0 3px rgba(143, 162, 255, 0.45);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --ink: #e8ecf5;
  --ink-soft: #b4bdd0;
  --ink-mute: #8a96ae;
  --paper: #0b1220;
  --surface: #111a2c;
  --surface-sunk: #0d1526;
  --line: #232f47;
  --line-strong: #33425f;
  --stamp: #8fa2ff;
  --stamp-ink: #0b1220;
  --stamp-soft: #1a2448;
  --stamp-line: #34428a;
  --ok: #4fd09a;   --ok-soft: #10281f;
  --warn: #f0b252; --warn-soft: #2d2210;
  --bad: #ff8b7e;  --bad-soft: #321614;
  --shadow-pop: 0 18px 48px -12px rgba(0, 0, 0, 0.7), 0 2px 6px rgba(0, 0, 0, 0.4);
  --shadow-receipt: 0 24px 40px -18px rgba(0, 0, 0, 0.7);
  --focus: 0 0 0 3px rgba(143, 162, 255, 0.45);
  color-scheme: dark;
}