/* الخلفية خلف النوتش وشريط الحالة؛ يغيّرها التطبيق حسب المظهر (setPageColor) */
html, body { margin: 0; height: 100%; background: #0E1526; overflow: hidden; overscroll-behavior: none; }
#app {
  position: fixed;
  top: env(safe-area-inset-top, 0px);
  right: env(safe-area-inset-right, 0px);
  bottom: env(safe-area-inset-bottom, 0px);
  left: env(safe-area-inset-left, 0px);
}
#splash { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; }
#splash .ring { width: 38px; height: 38px; border-radius: 50%; border: 3px solid #26314D; border-top-color: #F2A93B; animation: spin .9s linear infinite; }
#splash .name { color: #8B99AC; font: 600 15px -apple-system, "Segoe UI", sans-serif; letter-spacing: .3px; }
@keyframes spin { to { transform: rotate(360deg); } }
#update {
  position: fixed; z-index: 10; left: 12px; right: 12px;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 88px);
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 14px; border-radius: 14px; background: #F2A93B; color: #231603;
  font: 600 14px -apple-system, "Segoe UI", sans-serif; box-shadow: 0 6px 24px rgba(0,0,0,.35);
}
#update[hidden] { display: none; }
#update button { border: 0; border-radius: 10px; padding: 8px 12px; background: #231603; color: #F2A93B; font: inherit; }