.analytics-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-block-end: 16px;
}
.analytics-controls label { margin: 0; }
.analytics-controls select { width: auto; min-width: 120px; margin: 0; }
.analytics-stats, .analytics-grid {
  display: grid;
  gap: 12px;
  margin-block: 12px;
}
.analytics-stats { grid-template-columns: repeat(auto-fit, minmax(min(100%, 130px), 1fr)); }
.analytics-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.analytics-stat, .analytics-panel { min-width: 0; }
.analytics-stat { display: flex; flex-direction: column; gap: 8px; }
.analytics-stat strong { color: var(--ink); font-size: clamp(1.6rem, 2vw, 2.2rem); font-variant-numeric: tabular-nums; }
.analytics-next-step-stat strong { color: var(--blue); }
.analytics-panel h2 { margin-block-end: 8px; }
.analytics-table-scroll { max-height: 17rem; overflow: auto; }
.analytics-table-scroll table { width: 100%; min-width: 0; margin: 0; }
.analytics-table-scroll th, .analytics-table-scroll td { overflow-wrap: anywhere; padding: 8px; }
.analytics-table-scroll th:last-child, .analytics-table-scroll td:last-child { text-align: end; }
.analytics-chart-scroll { overflow-x: auto; }
.analytics-chart {
  display: grid;
  grid-template-columns: repeat(var(--buckets), minmax(9px, 1fr));
  gap: 2px;
  height: 115px;
  padding-top: 6px;
  border-bottom: 1px solid var(--line);
}
.analytics-bucket { display: flex; align-items: end; gap: 1px; }
.analytics-bar { flex: 1; height: var(--bar-height); background: var(--series-colour); border-radius: 2px 2px 0 0; }
.analytics-bar-page_views { --series-colour: #2580b9; }
.analytics-bar-searches { --series-colour: #05745f; }
.analytics-bar-clicks { --series-colour: #98721a; }
html[data-theme="dark"] .analytics-bar-page_views { --series-colour: #74bdef; }
html[data-theme="dark"] .analytics-bar-searches { --series-colour: #70c8ae; }
html[data-theme="dark"] .analytics-bar-clicks { --series-colour: #edc45e; }
.analytics-legend, .analytics-date-span { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
.analytics-key::before {
  content: '';
  display: inline-block;
  width: .65em;
  height: .65em;
  margin-inline-end: 5px;
  border-radius: 2px;
  background: var(--series-colour);
}
.analytics-date-span { justify-content: space-between; margin-top: 6px; color: var(--muted); }
.analytics-details { margin-top: 12px; }
.analytics-details summary { cursor: pointer; }
.analytics-details > .analytics-panel { margin-top: 6px; padding: 6px 0 0; border: 0; box-shadow: none; }
.analytics-details > .analytics-panel > h2 { position: absolute; clip-path: inset(50%); }