.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.8rem; }
.stat-card {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  min-height: 88px;
  padding: 0.95rem;
  border-radius: 8px;
  border: 1px solid #dbe4ed;
  background: #fff;
}
.stat-card .stat-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  border-radius: 8px;
}
.stat-card .stat-copy {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.stat-card .stat-copy span {
  color: #64748b;
  font-weight: 700;
  font-size: 0.9rem;
}
.stat-card strong {
  color: #07152d;
  font-size: 1.55rem;
  line-height: 1;
}
.tone-sky { background: #eff8ff; border-color: #b9e6fe; }
.tone-mint { background: #ecfdf5; border-color: #99f6e4; }
.tone-amber { background: #fffbeb; border-color: #fcd34d; }
.tone-green { background: #f0fdf4; border-color: #86efac; }
.tone-violet { background: #f5f3ff; border-color: #ddd6fe; }
.tone-cyan { background: #ecfeff; border-color: #a5f3fc; }
.tone-rose { background: #fff1f2; border-color: #fecdd3; }
.tone-slate { background: #f8fafc; border-color: #e2e8f0; }
.tone-sky .stat-icon { background: #dff2ff; color: #0369a1; }
.tone-mint .stat-icon { background: #ccfbf1; color: #0f766e; }
.tone-amber .stat-icon { background: #fef3c7; color: #b45309; }
.tone-green .stat-icon { background: #dcfce7; color: #15803d; }
.tone-violet .stat-icon { background: #ede9fe; color: #6d28d9; }
.tone-cyan .stat-icon { background: #cffafe; color: #0e7490; }
.tone-rose .stat-icon { background: #ffe4e6; color: #be123c; }
.tone-slate .stat-icon { background: #eef2f7; color: #475569; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr); gap: 1rem; }
.bar-row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(100px, 1.2fr) 64px;
  gap: 0.75rem;
  align-items: center;
  margin: 0.85rem 0;
}
.bar-row span { font-weight: 800; color: var(--muted); }
.bar-row div { height: 11px; background: rgba(17, 33, 43, 0.08); border-radius: 10px; overflow: hidden; }
.bar-row i { display: block; height: 100%; background: linear-gradient(90deg, #36459c, #8fc73e); border-radius: inherit; }
.bar-row b { text-align: right; }
.report { padding-bottom: 2rem; }

@media (max-width: 1060px) {
  .stat-grid, .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 920px) {
  .stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 680px) {
  .stat-grid, .dashboard-grid { grid-template-columns: 1fr; }
  .stat-card {
    min-height: 80px;
    padding: 0.85rem;
  }
  .stat-card strong {
    font-size: 1.35rem;
  }
  .bar-row { grid-template-columns: 1fr; }
  .bar-row b { text-align: left; }
}

@media (max-width: 560px) {
  .dashboard-grid {
    gap: 0.85rem;
  }
  .bar-row {
    gap: 0.45rem;
    margin: 0.7rem 0;
  }
  .bar-row div {
    height: 9px;
  }
}

@media print {
  body { background: white; }
  .side-nav, .primary-btn, .secondary-btn { display: none !important; }
  .app-shell { display: block; padding: 0; }
  .glass-card, .question-card, .stat-card { box-shadow: none; border: 1px solid #ddd; background: white; }
}