:root {
  color-scheme: dark;
  --ipsum-canvas: #171b1e;
  --ipsum-surface: #22282d;
  --ipsum-raised: #2b333a;
  --ipsum-line: #3c464e;
  --ipsum-ink: #f3f5f6;
  --ipsum-muted: #b5bfc7;
  --ipsum-green: #82d7ad;
  --ipsum-green-soft: #273d34;
  --color-slate-950: var(--ipsum-canvas);
  --color-slate-900: var(--ipsum-surface);
  --color-slate-800: var(--ipsum-raised);
  --color-slate-700: #37424a;
  --color-slate-300: #d2d9de;
  --color-slate-200: #e6eaee;
  --color-slate-100: var(--ipsum-ink);
  --color-green-400: var(--ipsum-green);
  --color-blue-400: var(--ipsum-green);
  --color-sky-400: var(--ipsum-green);
}

body {
  background: var(--ipsum-canvas);
  color: var(--ipsum-ink);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

.ipsum-header {
  background: var(--ipsum-surface);
  border-color: var(--ipsum-line);
}

.ipsum-header button {
  color: var(--ipsum-ink);
}

.ipsum-sidebar nav a[aria-current="page"] {
  color: var(--ipsum-green);
  background: var(--ipsum-green-soft);
  font-weight: 650;
}

.dark :is(.dark\:text-slate-500, .dark\:text-slate-600),
.dark .ipsum-main :is(.text-slate-500, .text-slate-600):not([class*="dark:text-"]) {
  color: var(--ipsum-muted);
}

.ipsum-main :is(input, select, textarea)::placeholder {
  color: var(--ipsum-muted);
}

.ipsum-main :is(.recharts-cartesian-axis-tick-value, .recharts-polar-angle-axis-tick-value) {
  fill: var(--ipsum-muted);
}

.ipsum-main .recharts-cartesian-grid line {
  stroke: var(--ipsum-line);
}

.ipsum-main .recharts-area-curve[stroke="#217357"] {
  stroke: var(--ipsum-green);
}

.ipsum-main stop[stop-color="#217357"] {
  stop-color: var(--ipsum-green);
}

.ipsum-main .recharts-default-tooltip {
  background: var(--ipsum-surface) !important;
  border: 1px solid var(--ipsum-line) !important;
  border-radius: 10px;
  color: var(--ipsum-ink);
}

.ipsum-main .recharts-tooltip-item {
  color: var(--ipsum-ink) !important;
}

.dark :is(.ws-root, .ws-dialog) {
  --ws-bg: var(--ipsum-surface);
  --ws-ink: var(--ipsum-ink);
  --ws-muted: var(--ipsum-muted);
  --ws-line: var(--ipsum-line);
  --ws-soft: var(--ipsum-raised);
  --ws-green: var(--ipsum-green);
}

.dark .ws-dialog {
  background: var(--ws-bg);
  color: var(--ws-ink);
  border-color: var(--ws-line);
}

.dark .ws-dialog .ws-selected-members button {
  background: var(--ipsum-green-soft);
}

.forecast {
  color: var(--ipsum-ink);
  background: var(--ipsum-canvas);
}

.forecast :is(.f-panel, .f-stat, button, select, input:not([type="checkbox"])) {
  background-color: var(--ipsum-surface);
  color: var(--ipsum-ink);
  border-color: var(--ipsum-line);
}

.forecast :is(p, th, small, .f-field > span, .f-stat > span, .f-tabs button) {
  color: var(--ipsum-muted);
}

.forecast :is(.f-subpanel, .f-badge) {
  background: var(--ipsum-raised);
}

.forecast :is(.f-note, .f-tabs button.active) {
  color: var(--ipsum-green);
  background: var(--ipsum-green-soft);
  border-color: var(--ipsum-line);
}

.forecast button.primary {
  color: #101b16;
  background: var(--ipsum-green);
  border-color: var(--ipsum-green);
}

.forecast :is(.f-link, summary) {
  color: var(--ipsum-green);
}