.stromgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
  margin-bottom: 20px;
  padding: 10px;
}

.strombox {
  background: #222;
  color: #fff;
  padding: 20px;
  border-radius: 20px;
  box-shadow: 0 0 15px rgba(0,0,0,0.4);
  font-family: sans-serif;
}

.label {
  font-weight: bold;
  font-size: 1.2em;
  margin-bottom: 10px;
}

.balken {
  background: #444;
  height: 20px;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 10px;
}

.balken-inner {
  height: 100%;
  transition: width 0.5s;
}

.wert {
  font-size: 1.4em;
  text-align: center;
}

.rot    { background: #c0392b; }
.orange { background: #e67e22; }
.gruen  { background: #27ae60; }

.zeit {
  font-size: 0.9em;
  text-align: center;
  color: #888;
  margin-top: 10px;
}