* { margin: 0; box-sizing: border-box; font-family: system-ui, sans-serif; }
html, body { height: 100%; overflow: hidden; }
body {
  /* Helles, freundliches Sky-Blau */
  background: radial-gradient(circle at 50% 18%, #dCEBFb 0%, #a9cdee 50%, #7fa9da 100%);
}
#scene { display: block; width: 100vw; height: 100vh; }

/* Steuerungstafel mit suessen Pill-Buttons */
#controls {
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%);
  display: flex; gap: 6px; padding: 7px;
  background: rgba(20, 22, 28, 0.78);
  border-radius: 999px;
  box-shadow: 0 10px 34px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
#controls button {
  border: 0; cursor: pointer; color: #cdd3e3;
  background: transparent; font: 600 14px system-ui;
  padding: 9px 18px; border-radius: 999px;
  transition: background .15s, color .15s, transform .1s;
}
#controls button:hover { color: #fff; background: rgba(255, 255, 255, 0.10); }
#controls button:active { transform: scale(0.95); }
#controls button.active { color: #0b0e14; background: #4ade80; }
#controls .sep { width: 1px; align-self: stretch; margin: 4px 2px; background: rgba(255,255,255,0.15); }
#controls #sound-btn { font-size: 16px; padding: 9px 14px; }

/* Button oben rechts: Link zur Belegarbeit */
#thesis-btn {
  position: fixed; top: 22px; right: 22px; z-index: 10;
  display: inline-flex; align-items: center; gap: 7px;
  padding: 10px 18px; border-radius: 999px;
  background: rgba(20, 22, 28, 0.78); color: #fff;
  font: 600 14px system-ui; text-decoration: none;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  transition: background .15s, color .15s, transform .1s;
}
#thesis-btn:hover { background: rgba(74, 222, 128, 0.92); color: #0b0e14; }
#thesis-btn:active { transform: scale(0.96); }

#demo-clock {
  display: none;
  position: fixed; top: 22px; left: 50%; transform: translateX(-50%);
  padding: 8px 18px; border-radius: 999px;
  background: rgba(20, 22, 28, 0.78); color: #fff;
  font: 700 18px system-ui; letter-spacing: 0.5px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
