:root {
  --edu-navy: #071b4d;
  --edu-navy-deep: #041234;
  --edu-blue: #087cf0;
  --edu-blue-deep: #0758b8;
  --edu-cyan: #25b7f3;
  --edu-sky: #eaf6ff;
  --edu-canvas: #f5f9ff;
  --edu-ink: #10254b;
  --edu-muted: #5c6f8f;
  --edu-line: #d7e5f5;

  --lsi-primary: var(--edu-blue);
  --lsi-primary-dark: var(--edu-blue-deep);
  --lsi-navy: var(--edu-navy);
  --lsi-purple: var(--edu-blue-deep);
  --lsi-accent: var(--edu-cyan);
  --lsi-background: var(--edu-canvas);
  --lsi-text-primary: var(--edu-ink);
  --lsi-text: var(--edu-ink);
  --lsi-muted: var(--edu-muted);
  --lsi-border: var(--edu-line);

  --navy: var(--edu-navy);
  --navy-deep: var(--edu-navy-deep);
  --navy-strong: var(--edu-navy);
  --blue: var(--edu-blue);
  --violet: var(--edu-blue-deep);
  --blue-soft: var(--edu-sky);
  --canvas: var(--edu-canvas);
  --ink: var(--edu-ink);
  --muted: var(--edu-muted);
  --line: var(--edu-line);

  --primary: var(--edu-blue);
  --primary-dark: var(--edu-blue-deep);
  --accent: var(--edu-cyan);
  --accent-hover: #67cff8;
  --background: var(--edu-canvas);
  --text: var(--edu-ink);
  --border: var(--edu-line);
}

body {
  background:
    radial-gradient(circle at 8% 0%, rgba(37, 183, 243, .18), transparent 31rem),
    radial-gradient(circle at 94% 12%, rgba(8, 124, 240, .12), transparent 29rem),
    var(--edu-canvas) !important;
}

.button-primary,
.button.primary,
.primary-button,
.next-column,
#submitBtn,
#confirmSubmitBtn {
  border-color: transparent !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--edu-navy), var(--edu-blue)) !important;
  box-shadow: 0 12px 28px rgba(7, 27, 77, .2) !important;
}

.progress-track > span,
.progress-value {
  background: linear-gradient(90deg, var(--edu-blue), var(--edu-cyan)) !important;
}

:focus-visible {
  outline-color: var(--edu-cyan) !important;
}