* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  min-height: 100vh; /* Mindesthöhe Viewport, wächst mit Inhalt */
  background: radial-gradient(1200px 800px at 50% 30%, #0f172a 0%, #0b1220 40%, #070c17 100%);
  background-attachment: fixed; /* Hintergrund bleibt fixiert beim Scrollen */
  color: #000000;
  overflow: auto; /* Scrollen ermöglichen */
}

#app { position: relative; width: 100%; height: 100%; }

#ghost {
  position: fixed; /* changed from absolute to fixed */
  left: 0; top: 0;
  width: min(5vmin, 160px); /* skaliert mit dem Viewport, etwas kleiner */
  transform: translate(-50%, -50%);
  transform-origin: 50% 50%; /* wichtig für korrektes Spiegeln */
  will-change: transform;
  image-rendering: auto;
  filter: drop-shadow(0 10px 20px rgba(0,0,0,0.35));
  pointer-events: none; /* Klicks gehen durch das Bild */
  z-index: 999999; /* sehr hoher z-index um über allem zu erscheinen */
}

/* Optional: subtiler Glow-Effekt */
#ghost.glow {
  filter: drop-shadow(0 10px 25px rgba(147, 197, 253, 0.35)) drop-shadow(0 0 10px rgba(147, 197, 253, 0.25));
}

/* (ehem.) Cursor-Dot entfällt, da der System-Cursor sichtbar bleibt */