/* Ostfriesland Games — Startbildschirm (Web-Fassung)
   Nur das Nötigste: Container + pixelgenaues Canvas. */

.ostart {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;          /* per CSS überschreibbar, z. B. für Header-Banner */
  min-height: 120px;
  overflow: hidden;
  background: #87cfeb;            /* Kamera-Hintergrund aus Unity, bis das Canvas steht */
  line-height: 0;
}

/* Höhe fest vorgegeben (z. B. height: 420px)? Dann Seitenverhältnis abschalten. */
.ostart[style*="height"] { aspect-ratio: auto; }

.ostart-canvas {
  display: block;
  width: 100%;
  height: 100%;
  /* Bewusst KEIN image-rendering: pixelated.
     Das Canvas rendert bereits in Bildschirmauflösung und skaliert die
     Pixel-Sprites intern hart hoch. Auf Retina (devicePixelRatio 2) würde
     "pixelated" das fertige Bild beim Herunterskalieren erneut zerhacken —
     und damit genau das saubere Logo wieder ruinieren. */
}

/* Assets fehlen o. Ä.: nur der Himmel bleibt stehen, keine kaputte Seite. */
.ostart--error { background: #87cfeb; }