* { margin: 0; padding: 0; box-sizing: border-box; }

html, body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #000;
  font-family: Arial, Helvetica, sans-serif;
  color: #fff;
  cursor: none; /* sembunyikan kursor di TV */
}

#stage {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
}

/* Isi slide */
.slide-img {
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain; /* ganti ke cover kalau mau penuh & terpotong */
}
.slide-video, .slide-web {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
/* Signage = display, bukan kiosk: iframe tidak bisa diklik biar tidak nyasar */
.slide-web { pointer-events: none; }
.slide-video { object-fit: contain; background: #000; }

/* Running text */
#ticker {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 8vh;
  min-height: 48px;
  background: rgba(0, 0, 0, 0.7);
  overflow: hidden;
  white-space: nowrap;
  display: flex;
  align-items: center;
  z-index: 10;
}
#ticker-text {
  display: inline-block;
  padding-left: 100%;
  font-size: 4.2vh;
  font-weight: bold;
  animation: ticker-scroll 20s linear infinite;
}
@keyframes ticker-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-100%); }
}

/* Layar kosong */
#empty {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
#empty h1 { font-size: 5vh; margin-bottom: 1vh; }
#empty p { font-size: 3vh; color: #aaa; }

/* Petunjuk fullscreen */
#fs-hint {
  position: absolute;
  top: 20px; left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  padding: 12px 22px;
  border-radius: 30px;
  font-size: 2.4vh;
  z-index: 20;
  animation: hintPulse 1.6s ease-in-out infinite;
}
@keyframes hintPulse { 0%,100% { opacity: 0.55; } 50% { opacity: 1; } }

.hidden { display: none !important; }

/* Layer crossfade antar slide (mulus, bukan kedip hitam) */
.slide-layer {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  opacity: 0;
  transition: opacity 0.6s ease;
}
.slide-layer.show { opacity: 1; }