
/* Basis-Tiles: alle gleich groß */
.soko-floor,
.soko-wall,
.soko-dock,
.soko-indent,
.soko-box,
.soko-worker {
  display: block;
  width: 70px;
  height: 70px;
  float: left;
  overflow: hidden;
  text-indent: -999em;
}

/* Zeilencontainer */
.soko-line {
  overflow: hidden;
}

/* Spielfeld */
.soko-room {
  display: inline-block;
  padding: 1px;
  line-height: 1;
}

/* Grundfarben */
.soko-indent,
.soko-floor,
.soko-wall,
.soko-dock,
.soko-box,
.soko-worker {
  background-color: #c5c5c5;
}

/* === SPRITES (WICHTIG!) === */

/* Wand */
.soko-wall {
  background: #861410 url(sprites.png) 0 0 no-repeat;
}

/* Kiste */
.soko-box {
  background: #c5c5c5 url(sprites.png) 0 -70px no-repeat;
}

/* Kiste auf Ziel */
.soko-box.soko-dock {
  background: #c5c5c5 url(sprites.png) 0 -140px no-repeat;
}

/* Ziel */
.soko-dock {
  background: #c5c5c5 url(sprites.png) 0 -210px no-repeat;
}

/* Spieler */
.soko-worker {
  background: #c5c5c5 url(sprites.png) 0 -280px no-repeat;
}

/* Leeres Feld */
.soko-indent {
  background: transparent;
}

/* Level gelöst Effekt */
.soko-solved .soko-room * {
  opacity: 0.8;
}

/* Leveltitel */

.soko-room::after {
  content: attr(data-display);
}

.soko-room {
  transform: scale(0.8);
  transform-origin: center;
}

.soko-room::after {
  font-size: 32px;     /* Größe erhöhen */
  font-weight: bold;   /* optional: fetter */
}
