/* dmetric — generated from tokens.json */
:root, [data-theme="light"] {
  --paper: #f1eee6;
  --panel: #fbfaf6;
  --sunken: #e8e4d9;
  --rule: #d3cdbf;
  --border: #7d8079;
  --ink: #1b1d1c;
  --ink-muted: #5a5f5b;
  --tag: #e6bf1a;
  --on-tag: #1b1d1c;
  --slab: #1b1d1c;
  --on-slab: #f1eee6;
  --on-slab-muted: #a3a69f;
  --status-up: #1d6f86;
  --status-warn: #9a6a00;
  --status-down: #b3261e;
  --focus: var(--ink);
}
[data-theme="dark"] {
  --paper: #121413;
  --panel: #1a1d1b;
  --sunken: #0d0f0e;
  --rule: #2f332f;
  --border: #6e726c;
  --ink: #ece8de;
  --ink-muted: #a3a69f;
  --slab: #0b0c0b;
  --on-slab: #ece8de;
  --on-slab-muted: #8f928b;
  --status-up: #5fb3cc;
  --status-warn: #d9a531;
  --status-down: #f0786c;
  --focus: #e6bf1a;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-pill: 999px;
  --control-h: 32px;
  --row-h: 40px;
  --sidebar-w: 224px;
  --font-sans: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
}
.display { font-family: var(--font-sans); font-size: 40px; line-height: 44px; font-weight: 700; letter-spacing: -0.01em; }
.title { font-family: var(--font-sans); font-size: 20px; line-height: 26px; font-weight: 600; }
.body { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.body-strong { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 600; }
.label { font-family: var(--font-sans); font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; }
.reading { font-family: var(--font-mono); font-size: 28px; line-height: 32px; font-weight: 500; }
.mono { font-family: var(--font-mono); font-size: 12px; line-height: 18px; font-weight: 400; }
@font-face { font-family: "Archivo"; src: url("../fonts/Archivo-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Archivo"; src: url("../fonts/Archivo-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Archivo"; src: url("../fonts/Archivo-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/IBMPlexMono-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../fonts/IBMPlexMono-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }