.analytics-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  margin-bottom: 12px;
  padding: 18px;
  background: #ffffff;
  border: 1px solid var(--color-border);
}

.analytics-hero h2 {
  margin: 8px 0 4px;
  font-size: 1.55rem;
}

.analytics-hero p,
.analytics-strip,
.analytics-kpi p,
.analytics-ranking span,
.analytics-root p,
.analytics-findings span {
  color: var(--color-text-secondary);
}

.analytics-strip,
.analytics-actions,
.analytics-tabs,
.analytics-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.analytics-strip {
  margin-top: 10px;
  font-size: 0.86rem;
}

.analytics-actions {
  justify-content: flex-end;
}

.analytics-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr)) auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 12px;
  padding: 12px;
}

.analytics-chips {
  grid-column: 1 / -1;
}

.analytics-tabs {
  margin-bottom: 12px;
  overflow-x: auto;
  flex-wrap: nowrap;
}

.analytics-tab {
  min-height: 38px;
  padding: 0 12px;
  white-space: nowrap;
  color: var(--color-text-primary);
  background: #f7f7f7;
  border: 1px solid var(--color-border);
}

.analytics-tab.active {
  color: #ffffff;
  background: var(--color-primary);
  border-color: var(--color-primary);
}

.analytics-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.analytics-kpi {
  display: grid;
  gap: 7px;
  padding: 14px;
  border-left: 4px solid var(--color-border-strong);
}

.analytics-kpi.better { border-left-color: var(--color-success); }
.analytics-kpi.worse { border-left-color: var(--color-danger); }
.analytics-kpi.stable { border-left-color: var(--color-info); }

.analytics-kpi strong {
  font-size: 1.45rem;
  color: var(--color-text-primary);
}

.analytics-kpi small {
  color: var(--color-text-secondary);
  font-weight: 700;
}

.analytics-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 12px;
  margin-bottom: 12px;
}

.analytics-layout > div,
.analytics-layout > aside {
  display: grid;
  gap: 12px;
  align-content: start;
}

.analytics-bars,
.analytics-ranking,
.analytics-root,
.analytics-findings .card-body,
.analytics-saved,
.heat-map {
  display: grid;
  gap: 9px;
}

.analytics-bar {
  display: grid;
  grid-template-columns: 72px 1fr 42px;
  gap: 10px;
  align-items: center;
}

.analytics-bar div {
  height: 12px;
  background: #f0f0f0;
  border: 1px solid var(--color-border);
}

.analytics-bar i {
  display: block;
  height: 100%;
  background: var(--color-primary);
}

.analytics-bar .bar-20 { width: 20%; }
.analytics-bar .bar-40 { width: 40%; }
.analytics-bar .bar-60 { width: 60%; }
.analytics-bar .bar-80 { width: 80%; }
.analytics-bar .bar-100 { width: 100%; }

.risk-matrix {
  display: grid;
  grid-template-columns: repeat(4, minmax(80px, 1fr));
  gap: 6px;
}

.risk-cell,
.heat-cell,
.analytics-ranking article,
.analytics-root article,
.analytics-findings article,
.analytics-saved article {
  display: grid;
  gap: 5px;
  padding: 10px;
  background: #f7f7f7;
  border: 1px solid var(--color-border);
}

.risk-cell strong,
.heat-cell strong {
  font-size: 1.2rem;
}

.level-0 { background: #f7f7f7; }
.level-1 { background: var(--color-info-soft); }
.level-2 { background: var(--color-warning-soft); }
.level-3,
.level-4 { background: var(--color-danger-soft); }

.analytics-table-wrap {
  overflow-x: auto;
}

.analytics-table {
  width: 100%;
  border-collapse: collapse;
}

.analytics-table th,
.analytics-table td {
  padding: 9px;
  border-bottom: 1px solid var(--color-border);
  text-align: left;
  white-space: nowrap;
}

.analytics-table th {
  background: #f7f7f7;
}

.heat-map {
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
}

@media (max-width: 1100px) {
  .analytics-filters,
  .analytics-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .analytics-layout,
  .analytics-hero {
    grid-template-columns: 1fr;
  }

  .analytics-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .analytics-filters,
  .analytics-kpi-grid,
  .risk-matrix {
    grid-template-columns: 1fr;
  }
}