:root[data-theme="light"] {
  --pico-font-size: 100%;
  --pico-primary: #27614b;
  --pico-primary-hover: #1c4a39;
  --pico-background-color: #f7f8f4;
  --pico-card-background-color: #fff;
}
.htmx-indicator {
  display: none;
}
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
  display: block;
}
body {
  max-width: 1100px;
  margin: auto;
}
header.container {
  padding-top: 1rem;
}
.brand {
  font-size: 1.4rem;
  font-weight: 750;
  text-decoration: none;
}
.mode {
  margin-top: 1rem;
  padding: 0.7rem 1rem;
  border: 1px solid #a6b9ab;
  border-radius: 0.4rem;
  background: #eaf0e9;
  font-size: 0.85rem;
  color: #284b39;
}
.workspace-section {
  border-top: 1px solid var(--pico-muted-border-color);
  padding-top: 1rem;
  margin-top: 1rem;
}
.workspace-section > summary {
  font-weight: 600;
}
.period-filter {
  margin-top: 1rem;
}
h1 {
  margin: 1.5rem 0;
}
h2 {
  font-size: 1.25rem;
}
.toolbar {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}
details form,
footer form {
  margin-top: 1rem;
}
.toolbar form {
  margin: 0;
}
.toolbar button {
  margin: 0;
}
.strategy-form {
  display: flex;
  gap: 0.5rem;
  margin: 0;
}
.strategy-form select,
.strategy-form button {
  margin: 0;
  padding: 0.4rem 0.6rem;
  font-size: 0.8rem;
}
.filters {
  display: flex;
  gap: 0.8rem;
  flex-wrap: wrap;
  align-items: end;
  margin-top: 1.5rem;
}
.filters label {
  flex: 1;
  min-width: 130px;
}
.filters button {
  width: auto;
}
.table-scroll {
  overflow-x: auto;
}
table {
  font-size: 0.9rem;
}
td,
th {
  white-space: nowrap;
}
small,
.muted {
  color: var(--pico-muted-color);
}
p small {
  display: block;
}
article {
  margin-top: 1.2rem;
}
.workspace-section article {
  box-shadow: none;
  border: 1px solid var(--pico-muted-border-color);
}
svg {
  width: 100%;
  max-height: 300px;
}
svg text {
  font-size: 12px;
  fill: var(--pico-color);
}
figcaption {
  font-size: 0.8rem;
  color: var(--pico-muted-color);
}
pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  padding: 1rem;
  background: var(--pico-code-background-color);
}
.notice {
  padding: 1rem;
  border-left: 4px solid var(--pico-primary);
  background: #eaf0e9;
}
footer {
  padding-bottom: 2rem;
}
.skip {
  position: absolute;
  left: -9999px;
}
.skip:focus {
  left: 1rem;
  background: white;
  padding: 1rem;
  z-index: 2;
}
@media (max-width: 600px) {
  .grid {
    grid-template-columns: 1fr;
  }
  .filters {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .filters button {
    grid-column: 1 / -1;
    width: 100%;
  }
  h1 {
    font-size: 1.7rem;
  }
  .toolbar a {
    font-size: 0.9rem;
  }
}
