/* Shared activity filters: version, period, then player mode in DOM/tab order. */
.page-header { justify-content: space-between; gap: 8px 16px; }
.dashboard-filters { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; min-width: 0; }
.dashboard-filters .version-filter { min-width: 0; }
.dashboard-filters .version-filter select { width: clamp(190px, 24vw, 420px); min-width: 0; max-width: 100%; }
.dashboard-filters .activity-range, .dashboard-filters .activity-mode { flex: 0 0 auto; width: auto; }
.dashboard-filters button { min-height: 36px; }
.header-actions { margin-left: auto; }
.storage-usage {
  padding: 5px 9px;
  border: 1px solid #b6d4c6;
  border-radius: 6px;
  background: #eef6f1;
  color: #285e48;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.storage-usage[data-state="warning"] { background: #fff4df; border-color: #e3c389; color: #8a510b; }
.storage-usage[data-state="critical"] { background: #fff0f0; border-color: #e4a8aa; color: #a92c37; }

.activity-mode button[data-mode="all"] {
  --mode-color: #28644f;
  --mode-soft: #e8f4ee;
  --mode-border: #a7cebd;
}
.activity-mode button[data-mode="solo"] {
  --mode-color: #285f9c;
  --mode-soft: #edf4ff;
  --mode-border: #b0c9ed;
}
.activity-mode button[data-mode="multiplayer"] {
  --mode-color: #8a510b;
  --mode-soft: #fff4df;
  --mode-border: #e3c389;
}
.activity-mode button[data-mode] {
  color: var(--mode-color);
  background: var(--mode-soft);
  border-color: var(--mode-border);
}
.activity-mode button[data-mode][aria-pressed="true"] {
  color: #fff;
  background: var(--mode-color);
  border-color: var(--mode-color);
  box-shadow: inset 0 0 0 1px #ffffff40;
}
.activity-mode button[data-mode]:hover:not(:disabled) {
  border-color: var(--mode-color);
  box-shadow: inset 0 0 0 1px var(--mode-color);
}
.activity-mode button[data-mode]:focus-visible { outline-color: var(--mode-color); }

#all-floor-panel { border-top: 1px solid var(--line); padding-top: 4px; }
#all-floor-panel > summary { cursor: pointer; padding: 8px 0; font-size: 14px; font-weight: 650; }
#all-floor-panel[open] > summary { margin-bottom: 10px; }

@media (max-width: 700px) {
  .dashboard-filters { width: 100%; gap: 10px; }
  .dashboard-filters .version-filter { width: 100%; }
  .dashboard-filters .version-filter select { width: 100%; }
  .dashboard-filters .activity-range, .dashboard-filters .activity-mode { flex: 1 1 auto; }
  .dashboard-filters button { min-height: 44px; }
  .header-actions { margin-left: 0; }
}