.theme-timefunn {
  --tf-paper: #f7f9fb;
  --tf-paper-2: #eef2f6;
  --tf-ink: #10233b;
  --tf-body: #33465c;
  --tf-dim: #5d6f83;
  --tf-blue: #14558f;
  --tf-blue-2: #0f4373;
  --tf-funn: #fff3cd;
  --tf-rule: #dbe2ea;
  --tf-rule-2: #c3cdd8;
  --bg-app: var(--tf-paper);
  --surface: #ffffff;
  --surface-2: var(--tf-paper);
  --surface-3: var(--tf-paper-2);
  --text: var(--tf-ink);
  --text-2: var(--tf-body);
  --text-3: var(--tf-body);
  --text-mid: var(--tf-dim);
  --text-muted: var(--tf-dim);
  --text-faint: var(--tf-dim);
  --text-faint2: var(--tf-dim);
  --icon-faint: var(--tf-dim);
  --brand: var(--tf-blue);
  --brand-hover: var(--tf-blue-2);
  --brand-ink: var(--tf-blue-2);
  --brand-tint: #e7eef6;
  --brand-tint-2: #dde8f2;
  --brand-tint-3: var(--tf-paper-2);
  --brand-border: var(--tf-rule-2);
  --brand-ring: rgba(20, 85, 143, .35);
  --brand-avatar-bg: #dde8f2;
  --on-brand: #ffffff;
  --hairline: var(--tf-rule);
  --border-1: var(--tf-rule);
  --border-2: var(--tf-rule);
  --border-3: var(--tf-rule-2);
  --border-4: var(--tf-dim);
  --rule-heavy: var(--tf-ink);
  --ok: #0f7a4f;
  --ok-tint: #e8f3ed;
  --info: var(--tf-blue);
  --info-tint: #e7eef6;
  --warn: #8a5200;
  --warn-tint: #f7efdd;
  --danger: #b3261e;
  --danger-tint: #f9e8e6;
  --destruct: #b3261e;
  --font-ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-prose: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

.tf-month-grid td.tf-weekend {
  background: var(--surface-3);
}
.tf-month-grid td.tf-attested {
  background: var(--tf-funn);
}
.tf-month-grid input[type=number] {
  width: 4.5rem;
  text-align: right;
}

.tf-rate-note {
  color: var(--text-mid);
  font-size: 0.875rem;
}