/* getpayrollquote — generated from tokens.json */
:root, [data-theme="light"] {
  --paper: #ffffff;
  --paper-tint: #f2f5f9;
  --line: #d7dee8;
  --ink: #10203f;
  --ink-muted: #4a5872;
  --ink-soft: #1b2f5c;
  --highlight: #ffe26a;
  --on-highlight: #10203f;
  --on-ink: #ffffff;
  --band: #10203f;
  --band-text: #ffffff;
  --band-muted: #c9d3e0;
  --band-button: #ffffff;
  --on-band-button: #10203f;
  --band-check: #afc0d8;
  --button-primary: var(--ink);
  --button-primary-hover: var(--ink-soft);
  --on-button-primary: var(--on-ink);
  --verified: #0f7a52;
  --estimate: #b4532a;
  --focus: #10203f;
  --shadow-sticky: 0 -4px 16px rgba(16,32,63,0.08);
}
[data-theme="dark"] {
  --paper: #0c1730;
  --paper-tint: #16233f;
  --line: #2a3a5a;
  --ink: #f3f5f9;
  --ink-muted: #aeb8ca;
  --ink-soft: #d9e0ec;
  --highlight: #ffe26a;
  --on-highlight: #10203f;
  --on-ink: #0c1730;
  --band: #16233f;
  --band-text: #f3f5f9;
  --band-muted: #aeb8ca;
  --band-button: #f3f5f9;
  --on-band-button: #0c1730;
  --band-check: #aeb8ca;
  --button-primary: var(--ink);
  --button-primary-hover: var(--ink-soft);
  --on-button-primary: var(--on-ink);
  --verified: #5ccb9a;
  --estimate: #f0a072;
  --focus: #ffe26a;
  --shadow-sticky: 0 -4px 16px rgba(0,0,0,0.45);
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --font-sans: "Instrument Sans", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}
.display { font-family: var(--font-sans); font-size: 56px; line-height: 60px; font-weight: 700; letter-spacing: -0.02em; }
.h1 { font-family: var(--font-sans); font-size: 40px; line-height: 44px; font-weight: 700; letter-spacing: -0.015em; }
.h2 { font-family: var(--font-sans); font-size: 28px; line-height: 34px; font-weight: 700; letter-spacing: -0.01em; }
.h3 { font-family: var(--font-sans); font-size: 20px; line-height: 26px; font-weight: 600; letter-spacing: -0.005em; }
.wordmark { font-family: var(--font-sans); font-size: 36px; line-height: 40px; font-weight: 700; letter-spacing: -0.03em; }
.lede { font-family: var(--font-sans); font-size: 20px; line-height: 30px; font-weight: 400; }
.answer { font-family: var(--font-sans); font-size: 19px; line-height: 29px; font-weight: 500; }
.body { font-family: var(--font-sans); font-size: 17px; line-height: 26px; font-weight: 400; }
.small { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 500; }
.caption { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 500; }
.price { font-family: var(--font-sans); font-size: 24px; line-height: 28px; font-weight: 700; letter-spacing: -0.01em; }
.price-unit { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 600; }
.table { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 400; }
.button { font-family: var(--font-sans); font-size: 16px; line-height: 20px; font-weight: 700; }
.button-big { font-family: var(--font-sans); font-size: 18px; line-height: 22px; font-weight: 700; }
.label { font-family: var(--font-sans); font-size: 16px; line-height: 22px; font-weight: 600; }