/* El Barto — variables de diseño (colores, tipografías, espacios, radios).
   Cargar ANTES de estilos.css. Tema claro por defecto; oscuro automático o con data-theme="dark". */
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Poppins:wght@400;500;600;700&display=swap');

:root, [data-theme="light"] {
  --red: #c43a26;
  --red-deep: #a52e1d;
  --red-ink: #b0301e;
  --red-tint: #fbe8e4;
  --navy: #262a6b;
  --navy-deep: #1b1e52;
  --mustard: #f9b233;
  --line-orange: #f5a623;
  --night: #15151c;
  --surface: #f3f3f5;
  --surface-raised: #ffffff;
  --ink: #262a6b;
  --ink-muted: #555879;
  --line: #e1e1e8;
  --line-strong: #8a8ca6;
  --on-board: #ffffff;
  --on-mustard: #262a6b;
  --check-light: #ffffff;
  --success: #1d7a46;
  --success-ink: #1d7a46;
  --focus: #262a6b;
  --shadow-float: 0 10px 30px rgba(21,21,28,0.18);
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-10: 40px;
  --check-size: 13px;
  --radius-md: 12px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --font-display: "Archivo Black", "Arial Black", Impact, sans-serif;
  --font-sans: Poppins, "Segoe UI", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  --red: #c43a26;
  --red-deep: #a52e1d;
  --red-ink: #ff8f7a;
  --red-tint: #3b1d19;
  --navy: #262a6b;
  --navy-deep: #1b1e52;
  --mustard: #f9b233;
  --line-orange: #f5a623;
  --night: #15151c;
  --surface: #121217;
  --surface-raised: #1d1d26;
  --ink: #eef0ff;
  --ink-muted: #b3b5cc;
  --line: #2e2e3a;
  --line-strong: #6b6d85;
  --on-board: #ffffff;
  --on-mustard: #262a6b;
  --check-light: #ffffff;
  --success: #1d7a46;
  --success-ink: #6fd39b;
  --focus: #f9b233;
  --shadow-float: 0 10px 30px rgba(0,0,0,0.5);
  }
}
[data-theme="dark"] {
  --red: #c43a26;
  --red-deep: #a52e1d;
  --red-ink: #ff8f7a;
  --red-tint: #3b1d19;
  --navy: #262a6b;
  --navy-deep: #1b1e52;
  --mustard: #f9b233;
  --line-orange: #f5a623;
  --night: #15151c;
  --surface: #121217;
  --surface-raised: #1d1d26;
  --ink: #eef0ff;
  --ink-muted: #b3b5cc;
  --line: #2e2e3a;
  --line-strong: #6b6d85;
  --on-board: #ffffff;
  --on-mustard: #262a6b;
  --check-light: #ffffff;
  --success: #1d7a46;
  --success-ink: #6fd39b;
  --focus: #f9b233;
  --shadow-float: 0 10px 30px rgba(0,0,0,0.5);
}