/* RedRush design tokens (from redrush.mx: --red #ec3013, --black #0c0b0b, --ink #161212, --gray #8d8888, Anton + Archivo). Dark-first app. */
@import url("https://fonts.googleapis.com/css2?family=Anton&family=Archivo:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap");
:root {
  --red: #ec3013; --red-dark: #c9260c; --red-soft: rgba(236, 48, 19, .14);
  --bg: #0c0b0b; --panel: #161212; --panel-2: #1d1818; --line: rgba(255, 255, 255, .09); --line-2: rgba(255, 255, 255, .16);
  --fg: #f3f2f2; --mute: #8d8888; --dim: #5f5a5a;
  --ok: #2fbf71; --warn: #f2a33a; --info: #4f9cf0; --stop: #ec3013;
  --display: "Anton", "Impact", "Arial Narrow", sans-serif;
  --body: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --r: 10px;
  /* secondary text, status hues that need contrast per theme, map ground */
  --fg-2: #cfcaca; --red-text: #ff8a73;
  --st-asignada: #b9a3ff; --st-fila: #f6d34a; --st-terminal: #3fd0c9;
  --map-bg: #121010; --shadow: rgba(0, 0, 0, .5);
  color-scheme: dark;
}
/* Light theme: warm paper white like redrush.mx's light sections (#f3f2f2), same red. */
:root[data-theme="light"] {
  --red: #d92a10; --red-dark: #b82109; --red-soft: rgba(217, 42, 16, .1);
  --bg: #f3f2f2; --panel: #ffffff; --panel-2: #f7f6f6; --line: rgba(22, 18, 18, .1); --line-2: rgba(22, 18, 18, .18);
  --fg: #161212; --fg-2: #3d3636; --mute: #6b6565; --dim: #9a9494;
  --ok: #17864c; --warn: #b5650a; --info: #1f6fd1; --stop: #d92a10; --red-text: #b82109;
  --st-asignada: #6e4fd8; --st-fila: #a77b00; --st-terminal: #0d8f88;
  --map-bg: #e9e7e6; --shadow: rgba(22, 18, 18, .14);
  color-scheme: light;
}
* { box-sizing: border-box; }
html, body { transition: background-color .2s, color .2s; margin: 0; background: var(--bg); color: var(--fg); font: 400 16px/1.5 var(--body); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
.logo { display: block; mix-blend-mode: lighten; } /* logo jpg has a black ground */
.mono { font-family: var(--mono); font-size: .92em; letter-spacing: -.01em; }
.display { font-family: var(--display); font-weight: 400; text-transform: uppercase; letter-spacing: .01em; }
.btn { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line-2); background: transparent; border-radius: 8px; padding: 8px 14px; font-weight: 600; cursor: pointer; transition: border-color .15s, background .15s; }
.btn:hover { border-color: var(--fg); }
.btn.pri { background: var(--red); border-color: var(--red); color: #fff; }
.btn.pri:hover { background: var(--red-dark); border-color: var(--red-dark); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.field { display: grid; gap: 6px; }
.field label { font-size: 14.5px; color: var(--mute); }
.input { width: 100%; background: var(--panel-2); border: 1px solid var(--line-2); border-radius: 8px; padding: 10px 12px; }
.input:focus { border-color: var(--red); outline: none; }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
