:root {
  --color-primary: #002045;
  --color-primary-container: #1a365d;
  --color-on-primary: #ffffff;
  --color-on-primary-container: #86a0cd;
  --color-secondary: #875200;
  --color-secondary-fixed: #ffddba;
  --color-on-secondary-fixed: #2b1700;
  --color-on-secondary-fixed-variant: #673d00;
  --color-tertiary-container: #003d3c;
  --color-on-tertiary-container: #4cadab;
  --color-background: #f7fafc;
  --color-surface: #f7fafc;
  --color-surface-container-lowest: #ffffff;
  --color-surface-container-low: #f1f4f6;
  --color-surface-container: #ebeef0;
  --color-surface-container-high: #e5e9eb;
  --color-surface-container-highest: #e0e3e5;
  --color-on-background: #181c1e;
  --color-on-surface: #181c1e;
  --color-on-surface-variant: #43474e;
  --color-outline-variant: #c4c6cf;
  --color-primary-fixed: #d6e3ff;
  --color-on-primary-fixed-variant: #2d476f;
  --color-error: #ba1a1a;

  --bg: var(--color-background);
  --text: var(--color-on-background);
  --heading: var(--color-primary);
  --muted: var(--color-on-surface-variant);
  --card: var(--color-surface-container-lowest);
  --accent: var(--color-primary);
  --accent-dark: var(--color-primary-container);
  --accent-hover: var(--color-primary-container);
  --danger: var(--color-error);
  --radius: 1rem;
  --shadow: 0 12px 30px rgba(0, 32, 69, 0.08);
  --font-sans: "Lexend", system-ui, -apple-system, sans-serif;
}

.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

.material-symbols-outlined--filled {
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}