/* GITO Pulse look and feel v2 – genererad från tokens.json */
:root {
  --morkbla: #002f6c;
  --ljusbla: #00b5e2;
  --energi: #00bfb3;
  --paus: #f2f2f2;
  --vit: #ffffff;
  --spanning: #fae100;
  --kraft: #ff9e1b;
  --puls: #d40f7d;
  --gra: #9aa5b1;
  --svart: #1a1a1a;
  --ton: #005e95;
  --surface: var(--vit);
  --surface-raised: var(--paus);
  --border: #dde2e8;
  --rutnat: #002f6c1f;
  --skala: #c7d0db;
  --border-strong: #7d8896;
  --ink: var(--morkbla);
  --ink-body: var(--svart);
  --ink-muted: #5b6675;
  --ink-on-dark: var(--vit);
  --ink-muted-on-dark: #b3c4d9;
  --nav: var(--morkbla);
  --nav-hover: #12407a;
  --action: var(--morkbla);
  --action-hover: #00245a;
  --on-action: var(--vit);
  --accent: var(--ljusbla);
  --focus: var(--morkbla);
  --focus-on-dark: var(--ljusbla);
  --link: var(--morkbla);
  --info-bg: #ccf0f9;
  --klar-bg: #ccf2f0;
  --varning-bg: #ffecd1;
  --fel-bg: #f6cfe5;
  --fel-text: var(--puls);
  --status-ny: var(--ljusbla);
  --status-het: var(--kraft);
  --status-kall: var(--gra);
  --status-mote: var(--morkbla);
  --status-vunnen: var(--energi);
  --status-forlorad: var(--puls);
  --chart-1: var(--morkbla);
  --chart-2: var(--ljusbla);
  --chart-3: var(--energi);
  --chart-4: var(--gra);
  --chart-5: var(--kraft);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-droppe: 8px;
  --radius-full: 999px;
  --shadow-card: 0 0 0 1px rgba(0,47,108,0.08), 0 1px 2px rgba(0,47,108,0.06);
  --shadow-overlay: 0 8px 24px rgba(0,47,108,0.14);
  --font-sans: Inter, Arial, sans-serif;
}
body { margin: 0; font-family: var(--font-sans); font-size: 15px; line-height: 22px; background: var(--surface); color: var(--ink); }
.display { font-family: var(--font-sans); font-size: 36px; line-height: 42px; font-weight: 600; letter-spacing: -0.02em; }
.h1 { font-family: var(--font-sans); font-size: 26px; line-height: 34px; font-weight: 600; letter-spacing: -0.01em; }
.h2 { font-family: var(--font-sans); font-size: 20px; line-height: 28px; font-weight: 700; }
.h3 { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 700; }
.body { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 400; }
.body-strong { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 600; }
.table { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; font-variant-numeric: tabular-nums; }
.small { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 400; }
.label { font-family: var(--font-sans); font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; }
.nyckeltal { font-family: var(--font-sans); font-size: 32px; line-height: 38px; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.data { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.02em; }
.droppe { border-radius: var(--radius-droppe) var(--radius-droppe) 0 var(--radius-droppe); }
.num { font-variant-numeric: tabular-nums; font-feature-settings: "zero"; }
.data { color: var(--ink-muted); }
.dots { background-color: var(--surface); background-image: radial-gradient(var(--rutnat) 1px, transparent 1.2px); background-size: 16px 16px; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
a { color: var(--link); }