/* QPDS Web UI Guidelines §3 — Aptos, sized in rem against a 16px root.
   Dashboards run one step denser than marketing. Tabular figures are
   mandatory on every monetary/metric value so columns align — enforced via
   the .qp-num utility class below, not left to each page to remember. */

@font-face {
  font-family: "Aptos";
  src: local("Aptos");
  font-display: swap;
}

html {
  font-size: 16px;
  font-family: "Aptos", "Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif;
}

body {
  font-size: 0.875rem;
  line-height: 1.5;
}

.qp-page-title {
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0;
}

.qp-kpi-value {
  font-size: 2rem;
  font-weight: 300;
}

.qp-panel-header {
  font-size: 1rem;
  font-weight: 600;
  margin: 0;
}

.qp-body {
  font-size: 0.875rem;
  font-weight: 400;
}

.qp-eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.qp-caption {
  font-size: 0.75rem;
  font-weight: 400;
  opacity: 0.75;
}

/* Every monetary/metric value in the app should carry this class —
   guideline §3: "tabular figures mandatory for every monetary and metric
   value so columns align." */
.qp-num {
  font-variant-numeric: tabular-nums;
}