/* Sumber aturan ukuran: ubah HANYA breakpoint CSS ini. */
#ulb-root { display:none; }
@media (max-width:999.98px) {
  /* Mode 1: Overlay (Menimpa layar penuh & Kunci Layar - Stay / Non-Scrollable) */
  #ulb-root[data-ready="true"][data-mode="overlay"], #ulb-root[data-ready="true"]:not([data-mode]) {
    display:flex; position:fixed; inset:0; z-index:2147483000; background:#fff; align-items:center; justify-content:center; overflow:hidden; cursor:pointer;
    box-sizing:border-box; padding:20px 16px calc(95px + env(safe-area-inset-bottom));
  }
  body:has(#ulb-root[data-ready="true"][data-mode="overlay"]), body:has(#ulb-root[data-ready="true"]:not([data-mode])) {
    overflow:hidden !important; position:fixed; width:100%; height:100%;
  }

 /* Mode 2: Scrollable (Paling atas 1 layar penuh HP, konten utama di bawahnya bisa di-scroll) */
 #ulb-root[data-ready="true"][data-mode="scrollable"] {
   display:flex; position:relative; width:100%; min-height:100dvh; background:#fff; align-items:center; justify-content:center; cursor:pointer; z-index:99;
   box-sizing:border-box; padding:env(safe-area-inset-top) env(safe-area-inset-right) calc(108px + env(safe-area-inset-bottom)) env(safe-area-inset-left);
 }
}
#ulb-root img { display:block; width:100%; height:100%; object-fit:contain; }
#ulb-root:focus-visible { outline:4px solid #1473e6; outline-offset:-4px; }

/* Tombol Thumb Reach */
.ulb-btn-wrap {
  position:absolute; bottom:calc(50px + env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%);
  width:min(calc(100% - 32px), 390px); z-index:10; pointer-events:auto;
}

/* Base Styling Tombol Kuning Keemasan (Teks Biru, Bersih & Statis Tanpa Efek Gerak) */
.ulb-btn {
  display:flex; align-items:center; justify-content:center; gap:10px; width:100%; height:auto; min-height:52px; padding:10px 18px;
  border:1.5px solid rgba(255, 255, 255, 0.8); border-radius:999px;
  background:linear-gradient(90deg, #FFE853 0%, #FFBE1A 45%, #E68B00 80%, #C46C00 100%);
  color:#1e40af; font-size:clamp(14px, 4vw, 17px); font-weight:900; letter-spacing:0.02em; text-transform:none;
  box-shadow:0 6px 18px rgba(217, 119, 6, 0.45), 0 2px 6px rgba(0,0,0,.12), inset 0 1px 2px rgba(255,255,255,0.85);
  cursor:pointer; font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  -webkit-tap-highlight-color:transparent; transition:transform .15s ease, box-shadow .15s ease;
  box-sizing:border-box;
}

.ulb-btn:active { transform:scale(.97); box-shadow:0 3px 10px rgba(196,108,0,.5); }

/* Fleksibilitas Teks Tombol: Tajam, Auto-wrap & Tanpa Titik-Titik (...) */
.ulb-btn span {
  display:block;
  color:#1e40af;
  font-size:inherit;
  font-weight:900;
  white-space:normal;
  word-break:break-word;
  overflow-wrap:anywhere;
  line-height:1.25;
  text-align:center;
}

/* Tanda Panah Kecil Elegan di Ujung Tombol */
.ulb-btn svg {
  display:inline-block;
  width:18px; height:18px;
  stroke:#1e40af; color:#1e40af; stroke-width:2.8;
  flex-shrink:0;
  transition:transform .2s ease;
}
.ulb-btn:hover svg { transform:translateX(3px); }

/* Petunjuk Scroll Down di Mode Scrollable */
.ulb-scroll-hint {
  display:flex; align-items:center; justify-content:center; gap:6px;
  margin-top:10px; color:#475569; font-size:12px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.04em;
  cursor:pointer; text-align:center; padding:4px 10px;
  animation:ulb-bounce 1.6s infinite ease-in-out;
}
.ulb-scroll-hint svg { width:15px; height:15px; }
@keyframes ulb-bounce {
  0%, 100% { transform:translateY(0); }
  50% { transform:translateY(4px); }
}