body.dashboard-body { --spalte: 60rem; }

body.dashboard-body .dashboard-subnav {
  gap: 0.25rem;
  margin-bottom: var(--leading);
  max-width: 26rem;
  padding: 0.25rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 999px;
}
body.dashboard-body .dashboard-subnav a {
  padding: 0.45rem 0.9rem;
  font-size: 0.85rem;
  border: 0;
  background: transparent;
}
body.dashboard-body .dashboard-subnav a:hover { color: var(--ink); }
body.dashboard-body .dashboard-subnav a.active,
body.dashboard-body .dataset-filter button.active {
  color: var(--color-bg);
}
body.dashboard-body .dashboard-subnav a.active { background: var(--accent); }

body.dashboard-body .dashboard-toolbar { margin-bottom: var(--leading); }
body.dashboard-body .dataset-filter { gap: 0.5rem; }

body.dashboard-body .einstieg-link,
body.dashboard-body .heute-link,
body.dashboard-body .ausflug-link {
  padding: 0.55rem 1.1rem;
}

body.dashboard-body .karte-heute {
  border: 0;
  background: var(--accent-soft);
}

body.dashboard-body .karte-heute .heute-monat {
  background: var(--surface);
}
body.dashboard-body .karte-heute .heute-balken {
  background: color-mix(in srgb, var(--color-text) 14%, transparent);
}
body.dashboard-body .karte-heute .heute-frist {
  border-color: transparent;
  border-radius: 1.25rem;
}

body.dashboard-body .karte-einstieg {
  border-color: transparent;
}

body.dashboard-body .nk-abo { margin-top: var(--leading); padding-top: var(--half); }
body.dashboard-body .nk-subhead {
  font-family: var(--font-body);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--accent);
}

body.dashboard-body .tagesart-foto { border-radius: 1.25rem; }
body.dashboard-body .tagesart-name {
  font-family: var(--font-heading);
  font-weight: var(--font-heading-weight);
  font-size: 1.05rem;
}

body.dashboard-body .uhr-saeule,
body.dashboard-body .uhr-saeule-fill { border-radius: 999px 999px 0 0; }

body.dashboard-body .ausflug-titel {
  font-family: var(--font-heading);
  font-weight: var(--font-heading-weight);
  font-size: 1.05rem;
  line-height: 1.25;
}

body.dashboard-body .dashboard-weiter { gap: var(--half); margin-top: var(--leading); }
body.dashboard-body .dashboard-weiter a {
  padding: var(--half) 1.1rem;
  border-radius: 1.5rem;
}

body.dashboard-body .ausflug {
  border-radius: 1.5rem;
  padding: var(--half) 1.1rem calc(1.2 * var(--half));
}
body.dashboard-body .gap-item { border-radius: 1.25rem; }
body.dashboard-body .gap-photo { border-radius: 0.9rem; }
body.dashboard-body .gap-season { border-radius: 1.25rem; }

body.dashboard-body .region-kachel {
  border-radius: 1.25rem;
  border-color: transparent;
  padding: var(--half) 1rem;
}

body.dashboard-body .zeitraum-gruppe {
  border-left-color: var(--accent-soft);
  border-left-width: 3px;
  margin-bottom: var(--leading);
}

body.dashboard-body .zeitraum-titel {
  font-family: var(--font-body);
  letter-spacing: 0.06em;
  color: var(--accent);
}

@media (min-width: 860px) {
  body.dashboard-body .dashboard-columns {
    gap: var(--leading);
    margin-bottom: var(--leading);
  }
}

body.dashboard-body .stat-tiles { margin-bottom: var(--leading); }

body.dashboard-body .curve-fact-value,
body.dashboard-body .vielfalt-wert,
body.dashboard-body .region-wert {
  font-family: var(--font-heading);
  font-weight: var(--font-heading-weight);
  line-height: 1.15;
}
body.dashboard-body .jahresstart {
  border-color: transparent;
  border-radius: 1.25rem;
  padding: var(--half) 1rem;
}

body.dashboard-body .chart-bar { border-radius: 999px 999px 0 0; }
body.dashboard-body .chart-tooltip { border-radius: 0.75rem; }
body.dashboard-body .card-close { border-radius: 999px; }
body.dashboard-body .day-detail-item { border-radius: 1rem; }

body.dashboard-body .curve-fact {
  border-radius: 1.25rem;
  padding: var(--half) 1rem;
}

body.dashboard-body .curve-area {
  fill: color-mix(in srgb, var(--accent-soft) 55%, var(--surface));
}

body.dashboard-body .schutz-subhead {
  font-family: var(--font-body);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--accent);
}

body.dashboard-body .range-filter button.active { color: var(--color-bg); }
body.dashboard-body .export-btn { padding: 0.6rem 1.2rem; }

@media (max-width: 699.98px) {
  body.dashboard-body .dashboard-subnav { margin-bottom: var(--half); }
}