.dashboard {
  padding: 2rem;
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 2rem;
}

.live-data, .controls {
  background: var(--gray-light);
  padding: 1.5rem;
  border-radius: 0.8rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.data-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
}

.card {
  background: var(--white);
  padding: 1rem;
  border-radius: 0.6rem;
  text-align: center;
  font-weight: 500;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.control-btn {
  background: var(--green-primary);
  color: var(--white);
  padding: 0.8rem 1.2rem;
  border: none;
  border-radius: 0.5rem;
  margin: 0.5rem;
  cursor: pointer;
  transition: 0.3s;
}

.control-btn:hover {
  background: var(--blue-primary);
}