:root {
  color-scheme: light;
  --bg: #f6f5f0;
  --text: #233d36;
  --forest: #173f38;
  --muted: #596b60;
  --border: #dce3d8;
  --accent: #d4ef86;
  --paper: #fffefa;
  --subtle: #edf1e6;
  --raised: #ffffff;
  --control: #f0f3e9;
  --control-hover: #e3ebd9;
  --button: #173f38;
  --button-text: #ffffff;
  --button-hover: #28594d;
  --good: #3c6337;
  --good-bg: #e8f0dd;
  --good-border: #93ae78;
  --warn: #895016;
  --warn-bg: #fff0d9;
  --warn-border: #c69b62;
  --stopped: #5d6862;
  --stopped-bg: #e8ece7;
  --ring: #34644c;
  --ring-ready: #a6c97d;
  --ring-track: #e4eadc;
  --focus: #a45e16;
  --shadow: #293c2b08;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #101916;
  --text: #e4eee4;
  --forest: #c3dfac;
  --muted: #a9bbae;
  --border: #35473c;
  --accent: #c4e28e;
  --paper: #1b2821;
  --subtle: #17231c;
  --raised: #223229;
  --control: #293b2e;
  --control-hover: #354d3b;
  --button: #c4e28e;
  --button-text: #192818;
  --button-hover: #d5eca9;
  --good: #b9dda1;
  --good-bg: #2c4029;
  --good-border: #779667;
  --warn: #eac087;
  --warn-bg: #3e3020;
  --warn-border: #a87d47;
  --stopped: #becac1;
  --stopped-bg: #303c35;
  --ring: #aed68e;
  --ring-ready: #7eab67;
  --ring-track: #344337;
  --focus: #e7c17f;
  --shadow: #00000030;
}
.theme-control {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
}
.theme-control svg {
  flex-shrink: 0;
}
.theme-control select {
  font: inherit;
  font-size: 0.875rem;
  min-height: 42px;
  max-width: 120px;
  padding: 8px 24px 8px 10px;
  color: var(--text);
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: 9px;
  cursor: pointer;
}
.theme-control select:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}