/* Estela — tokens de diseño (derivados de DESIGN.md "Status": cámara de seguridad
   de vidrio nocturno; un solo color de acción, el resto acromático). */
:root {
  /* Superficies */
  --midnight: #09101c;
  --slate-depth: #131d2f;
  --steel-edge: #1b273d;
  --graphite: #3a4049;
  /* Texto */
  --paper: #ffffff;
  --pale-mist: #dce0e5;
  --cloud: #f0f2f5;
  --ash: #a1abbd;
  --mist: #647084;
  /* Marca y acción */
  --signal: #2a4af5;       /* SOLO acciones primarias rellenas */
  --signal-hover: #3b59f7;
  --violet: #7140fd;       /* SOLO identidad de marca: logo, orbes, degradados */
  --amber: #f6b03c;
  --teal: #2a799b;
  --brand-gradient: linear-gradient(78deg, #2a799b -30%, #f6b03c 8%, #ff33a3 98%);
  /* Semánticos mínimos (estado funcional, nunca decoración) */
  --ok: #3ddc97;
  --danger: #ff5d73;

  --font: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --r-btn: 12px;
  --r-card: 20px;
  --r-img: 24px;
  --r-pill: 9999px;
  --shadow: rgba(9, 16, 28, 0.08) 0 4px 20px 0;
  --shadow-pop: rgba(0, 0, 0, 0.45) 0 12px 40px 0;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
#root { height: 100%; }
body {
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.47;
  letter-spacing: -0.005em;
  color: var(--paper);
  background: var(--midnight);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
a { color: inherit; }
::selection { background: rgba(113, 64, 253, 0.45); }
:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }