body {
  margin: 0;
  overflow: hidden;
  background: #eee6d8;
  font-family: Georgia, serif;
}

/* Szene */
#scene {
  width: 100vw;
  height: 100vh;
  perspective: 1200px;
}

#camera {
  width: 100%;
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
}

/* Raumgröße */
:root {
  --room-width: 1800px;
  --room-depth: 1800px;
  --room-height: 700px;
}
/* Wände allgemein */
.wall {
  position: absolute;
  background: #f6f1e7;
  backface-visibility: hidden;
}

/* Rückwand */
.back {
  width: var(--room-width);
  height: var(--room-height);
  transform: translateZ(calc(var(--room-depth) / -2));
}

/* Vorderwand */
.front {
  width: var(--room-width);
  height: var(--room-height);
  transform: rotateY(180deg) translateZ(calc(var(--room-depth) / -2));
}

/* Linke Wand */
.left {
  width: var(--room-depth);
  height: var(--room-height);
  transform: rotateY(90deg) translateZ(calc(var(--room-width) / -2));
}

/* Rechte Wand */
.right {
  width: var(--room-depth);
  height: var(--room-height);
  transform: rotateY(-90deg) translateZ(calc(var(--room-width) / -2));
}

/* Boden */
.floor {
  width: var(--w);
  height: var(--d);
  background: #777;
  transform:
    translateY(calc(var(--h) / 2))
    rotateX(90deg);
}

/* Decke */
.ceiling {
  width: var(--w);
  height: var(--d);
  background: #faf8f3;
  transform:
    translateY(calc(var(--h) / -2))
    rotateX(-90deg);
}

/* Bild-Reihe */
.row {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;

  gap: 80px;        /* 👈 Abstand zwischen Bildern */
  width: 1600px;
  margin: 0 auto;
}

/* Einzelnes Bild */
.painting {
  text-align: center;
  transform: translateY(40px); /* Bilder leicht nach unten */
}

/* Rahmen */
.frame {
  padding: 12px;
  background: #c2a25f;
  box-shadow: 0 10px 24px rgba(0,0,0,0.25);

  display: inline-block;   /* passt sich dem Bild an */
}

.frame img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* Titel */
.painting span {
  display: block;
  margin-top: 10px;
  font-size: 13px;
  color: #4a3b2a;
}

/* UI */
.ui {
  position: fixed;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 13px;
  color: #6b5a44;
}