/* Variables de color definidas en UI_GUIDE.md */
:root {
  --app-bg: #edf4ff;
  --header-bg: #ffffff;
  --surface: #ffffff;
  --surface-soft: #f7f9fc;
  --surface-alt: #eef3f9;
  --border: #d7e0eb;
  --border-soft: #e7edf4;
  --border-strong: #c5d1df;
  --text-main: #172033;
  --text-secondary: #65728a;
  --text-muted: #8490a3;
  --primary: #4f46e5;
  --primary-hover: #4338ca;
  --primary-soft: #eeedff;
  --success: #16a34a;
  --success-soft: #dcfce7;
  --warning: #ea580c;
  --warning-soft: #fff1e7;
  --danger: #dc2626;
  --danger-soft: #fee2e2;
  --neutral-chip: #eef1f5;
  --radius-small: 8px;
  --radius-control: 10px;
  --radius-card: 16px;
  --shadow-card: 0 1px 2px rgba(20, 35, 60, 0.04);
}

/* Reseteo simple */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

body {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.4;
  background: var(--app-bg);
  color: var(--text-main);
  height: 100vh;
  display: flex;
  flex-direction: column;
}

a {
  color: var(--primary);
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

.hidden {
  display: none !important;
}

/* Utility classes */
.container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 16px;
}

.flex {
  display: flex;
}
.flex-row {
  flex-direction: row;
}
.flex-col {
  flex-direction: column;
}
.justify-between {
  justify-content: space-between;
}
.align-center {
  align-items: center;
}