:root {
  --cri-navy: #1a3a6b;
  --cri-navy-dark: #313655;
  --cri-light-blue: #7798c5;
  --color-text: #1a1a2e;
  --color-text-muted: #566274;
  --color-action: var(--cri-navy);
  --color-action-hover: var(--cri-navy-dark);
  --color-surface: #ffffff;
  --color-surface-subtle: #ffffff;
  --color-surface-secondary: #e8eef6;
  --color-field: #f1f4f8;
  --color-field-hover: #f8faff;
  --color-border: #c9d4e1;
  --color-focus: var(--cri-navy);
  --color-on-brand-muted: #dce6f3;
  --color-brand-tint: rgba(119, 152, 197, 0.14);
  --color-brand-tint-strong: rgba(119, 152, 197, 0.22);
  --color-danger: #9a2f35;
  --color-danger-strong: #78242a;
  --color-danger-border: #b9444d;
  --color-danger-surface: #fff5f5;
  --color-success: #28643d;
  --color-warning: #6a4a00;
  --color-warning-surface: #fff9e8;
  --font-body: Calibri, "Segoe UI", Arial, sans-serif;
  --font-heading: Cambria, Georgia, "Times New Roman", serif;
  --page-width: 52rem;
}

* { box-sizing: border-box; }

html { min-height: 100%; color: var(--color-text); background: var(--color-surface-subtle); font-family: var(--font-body); line-height: 1.55; -webkit-text-size-adjust: 100%; }
body { min-height: 100vh; margin: 0; display: flex; flex-direction: column; background: var(--color-surface-subtle); }
a { color: var(--color-action); text-underline-offset: 0.18em; }
::selection { color: white; background: var(--cri-navy); }
a:hover { color: var(--color-action-hover); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.page-width { width: min(calc(100% - 2rem), var(--page-width)); margin-inline: auto; }
img, svg, iframe { max-width: 100%; }
button, input, select, textarea { touch-action: manipulation; }

@media (max-width: 22rem) {
  .page-width { width: min(calc(100% - 1rem), var(--page-width)); }
}