:root {
  /* Brand: blue purple */
  --purple-50:  #f2ecfb;
  --purple-400: #a286d3;
  --purple-500: #8a66c8;
  --purple-600: #6a3eb9;
  --purple-700: #5a32a3; /* hover on purple */

  /* Accent: yellow green */
  --lime-50:  #f0fae4;
  --lime-300: #abe471;
  --lime-400: #97dc4d;
  --lime-500: #7dd51e;
  --lime-600: #6cbf14; /* hover on lime */
  --lime-800: #3f6f0c; /* text on white */

  /* Accent: orange red */
  --orange-50:  #fdeee6;
  --orange-300: #ec8c5a;
  --orange-400: #e87031;
  --orange-500: #e14a01;
  --orange-700: #b83c00; /* text on white, white text on it */
  --orange-800: #9a3300; /* hover on orange */

  /* Neutrals (purple-tinted) */
  --text:       #1e1530;
  --text-muted: #5c5470;
  --border:     #e6e1ef;
  --bg:         #faf9fc;
  --surface:    #ffffff;

  /* Roles */
  --primary:    var(--purple-600);
  --primary-hover: var(--purple-700);
  --success:    var(--lime-800);
  --success-bg: var(--lime-50);
  --danger:     var(--orange-700);
  --danger-bg:  var(--orange-50);
  --link:       var(--purple-600);

  --font-sans: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font-sans);
  font-weight: 400;
  line-height: 1.5;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { font-weight: 700; line-height: 1.2; }

a { color: var(--link); }

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1.25rem;
  border: 2px solid transparent;
  border-radius: 10px;
  font: inherit;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .15s, border-color .15s, color .15s;
}
.btn:focus-visible { outline: 3px solid var(--purple-400); outline-offset: 2px; }
.btn--primary { background: var(--primary); color: #fff; }
.btn--primary:hover { background: var(--primary-hover); }
.btn--secondary { background: var(--surface); color: var(--primary); border-color: var(--primary); }
.btn--secondary:hover { background: var(--purple-50); }
.btn--lime { background: var(--lime-500); color: var(--text); }
.btn--lime:hover { background: var(--lime-600); }
.btn--orange { background: var(--orange-700); color: #fff; }
.btn--orange:hover { background: var(--orange-800); }
.btn--ghost { background: transparent; color: var(--text); }
.btn--ghost:hover { background: var(--purple-50); }
.btn:disabled { opacity: .5; cursor: not-allowed; }

/* Badges */
.badge {
  display: inline-block;
  padding: .25rem .625rem;
  border-radius: 999px;
  font-size: .8125rem;
  font-weight: 600;
}
.badge--purple { background: var(--purple-50); color: var(--purple-600); }
.badge--lime { background: var(--lime-50); color: var(--lime-800); }
.badge--orange { background: var(--orange-50); color: var(--orange-700); }
.badge--lime-solid { background: var(--lime-500); color: var(--text); }
.badge--orange-solid { background: var(--orange-700); color: #fff; }

/* Alerts */
.alert {
  padding: 1rem 1.25rem;
  border-radius: 10px;
  border-left: 4px solid;
}
.alert--info { background: var(--purple-50); border-color: var(--purple-600); }
.alert--success { background: var(--success-bg); border-color: var(--lime-500); }
.alert--danger { background: var(--danger-bg); border-color: var(--orange-500); }
.alert strong { display: block; margin-bottom: .125rem; }

/* Cards */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 1.25rem;
}

/* Form fields */
.field { display: grid; gap: .375rem; }
.field label { font-weight: 600; font-size: .9375rem; }
.input {
  width: 100%;
  padding: .75rem 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
}
.input::placeholder { color: var(--text-muted); }
.input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--purple-50); }