/* WRS GEMPA readability tune: high-contrast text on desktop, in the catalog, and in the APK WebView. */
@media (min-width: 901px) {
  #cardRealtime .panel-header-title,
  .right-panel .rp-mag-info b,
  .right-panel .rp-stats b,
  .right-panel .rp-desc,
  .right-panel .rp-instr,
  .left-bottom .disc b,
  .left-bottom .leg-h {
    opacity: 1 !important;
    text-shadow: none !important;
  }

  #cardRealtime .panel-sub,
  #cardRealtime #rtFilter,
  #cardRealtime #rtAgo,
  #cardRealtime #rtCoord,
  #cardRealtime #rtDist,
  #cardRealtime #rtSrc,
  .right-panel .rp-mode,
  .right-panel .rp-stats small,
  .right-panel .rp-quick-status,
  .right-panel .rp-foot,
  .left-bottom .disc,
  .left-bottom .leg-row,
  .left-bottom .leg-lab {
    opacity: 1 !important;
    text-shadow: none !important;
    line-height: 1.5 !important;
  }

  html[data-wrs-theme="light"] .glass-panel {
    color: #15263a !important;
    background: rgba(250, 252, 255, .985) !important;
    border-color: rgba(61, 87, 119, .32) !important;
  }
  html[data-wrs-theme="light"] #cardRealtime .panel-header-title,
  html[data-wrs-theme="light"] .right-panel .rp-mag-info b,
  html[data-wrs-theme="light"] .right-panel .rp-stats b,
  html[data-wrs-theme="light"] .right-panel .rp-desc,
  html[data-wrs-theme="light"] .right-panel .rp-instr b,
  html[data-wrs-theme="light"] .left-bottom .disc b,
  html[data-wrs-theme="light"] .left-bottom .leg-h,
  html[data-wrs-theme="light"] #cardRealtime #rtDate,
  html[data-wrs-theme="light"] #cardRealtime #rtPlace {
    color: #14253a !important;
  }
  html[data-wrs-theme="light"] #cardRealtime .panel-sub,
  html[data-wrs-theme="light"] #cardRealtime #rtFilter,
  html[data-wrs-theme="light"] #cardRealtime #rtAgo,
  html[data-wrs-theme="light"] #cardRealtime #rtCoord,
  html[data-wrs-theme="light"] #cardRealtime #rtDist,
  html[data-wrs-theme="light"] #cardRealtime #rtSrc,
  html[data-wrs-theme="light"] .right-panel .rp-mode,
  html[data-wrs-theme="light"] .right-panel .rp-stats small,
  html[data-wrs-theme="light"] .right-panel .rp-quick-status,
  html[data-wrs-theme="light"] .right-panel .rp-foot,
  html[data-wrs-theme="light"] .right-panel .rp-desc,
  html[data-wrs-theme="light"] .right-panel .rp-instr span,
  html[data-wrs-theme="light"] .left-bottom .disc,
  html[data-wrs-theme="light"] .left-bottom .leg-row,
  html[data-wrs-theme="light"] .left-bottom .leg-lab {
    color: #334a63 !important;
  }

  html[data-wrs-theme="dark"] #cardRealtime .panel-header-title,
  html[data-wrs-theme="dark"] .right-panel .rp-mag-info b,
  html[data-wrs-theme="dark"] .right-panel .rp-stats b,
  html[data-wrs-theme="dark"] .right-panel .rp-desc,
  html[data-wrs-theme="dark"] .right-panel .rp-instr b,
  html[data-wrs-theme="dark"] .left-bottom .disc b,
  html[data-wrs-theme="dark"] .left-bottom .leg-h,
  html[data-wrs-theme="dark"] #cardRealtime #rtDate,
  html[data-wrs-theme="dark"] #cardRealtime #rtPlace {
    color: #f7fbff !important;
  }
  html[data-wrs-theme="dark"] #cardRealtime .panel-sub,
  html[data-wrs-theme="dark"] #cardRealtime #rtFilter,
  html[data-wrs-theme="dark"] #cardRealtime #rtAgo,
  html[data-wrs-theme="dark"] #cardRealtime #rtCoord,
  html[data-wrs-theme="dark"] #cardRealtime #rtDist,
  html[data-wrs-theme="dark"] #cardRealtime #rtSrc,
  html[data-wrs-theme="dark"] .right-panel .rp-mode,
  html[data-wrs-theme="dark"] .right-panel .rp-stats small,
  html[data-wrs-theme="dark"] .right-panel .rp-quick-status,
  html[data-wrs-theme="dark"] .right-panel .rp-foot,
  html[data-wrs-theme="dark"] .right-panel .rp-desc,
  html[data-wrs-theme="dark"] .right-panel .rp-instr span,
  html[data-wrs-theme="dark"] .left-bottom .disc,
  html[data-wrs-theme="dark"] .left-bottom .leg-row,
  html[data-wrs-theme="dark"] .left-bottom .leg-lab {
    color: #d6e5f4 !important;
  }

  #cardRealtime #rtDate { font-size: 13px !important; font-weight: 800 !important; }
  #cardRealtime #rtPlace { font-size: 13px !important; font-weight: 800 !important; }
  #cardRealtime #rtDist { font-size: 12px !important; font-weight: 800 !important; }
  #cardRealtime #rtSrc { font-size: 11px !important; font-weight: 700 !important; }
  #cardRealtime .world-clock-grid > .world-clock-time small { font-size: 10px !important; opacity: 1 !important; }
  #cardRealtime .world-clock-grid > .world-clock-time strong { font-size: 20px !important; }
  #cardRealtime .world-clock-grid > .world-clock-time time { font-size: 11px !important; font-weight: 750 !important; opacity: 1 !important; }
  #cardRealtime .world-clock-param small { font-size: 10px !important; opacity: 1 !important; }
  #cardRealtime .world-clock-param span { font-size: 11px !important; opacity: 1 !important; }
  html[data-wrs-theme="light"] #cardRealtime .world-clock-grid > .world-clock-time small { color: #33516b !important; }
  html[data-wrs-theme="light"] #cardRealtime .world-clock-grid > .world-clock-time strong { color: #075878 !important; }
  html[data-wrs-theme="light"] #cardRealtime .world-clock-grid > .world-clock-time time { color: #233c53 !important; }
  html[data-wrs-theme="light"] #cardRealtime .world-clock-param small { color: #33516b !important; }
  html[data-wrs-theme="light"] #cardRealtime .world-clock-param span { color: #2c465e !important; }
  html[data-wrs-theme="dark"] #cardRealtime .world-clock-grid > .world-clock-time small,
  html[data-wrs-theme="dark"] #cardRealtime .world-clock-param small { color: #c5d9eb !important; }
  html[data-wrs-theme="dark"] #cardRealtime .world-clock-grid > .world-clock-time time,
  html[data-wrs-theme="dark"] #cardRealtime .world-clock-param span { color: #e5f0fa !important; }

  .wrs-desktop-catalog-panel { font-size: 13px !important; }
  .wrs-desktop-catalog-brand h2 { font-size: 27px !important; }
  .wrs-desktop-catalog-brand p,
  .wrs-desktop-catalog-status small,
  .wrs-desktop-catalog-footer { font-size: 12px !important; }
  .wrs-desktop-catalog-place { font-size: 15px !important; }
  .wrs-desktop-catalog-time,
  .wrs-desktop-catalog-source,
  .wrs-desktop-catalog-distance { font-size: 12px !important; }
  .wrs-desktop-catalog-revision b { font-size: 11px !important; }
  .wrs-desktop-catalog-revision span,
  .wrs-desktop-catalog-revision-time { font-size: 12px !important; }
  .wrs-desktop-catalog-open { font-size: 12px !important; }
}

.wrs-mobile-header-clock .wrs-header-clock-date {
  display: block !important;
  min-width: 0 !important;
  margin-top: 1px !important;
  color: #b8cadc !important;
  font-size: 7.5px !important;
  font-weight: 750 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-wrs-theme="light"] .wrs-mobile-header-clock .wrs-header-clock-date {
  color: #435d74 !important;
}
html[data-wrs-theme="dark"] .wrs-mobile-header-clock .wrs-header-clock-date {
  color: #b8cadc !important;
}

.wrs-catalog-event-detail > b,
.wrs-catalog-event-detail > span {
  opacity: 1 !important;
  line-height: 1.45 !important;
}
.wrs-catalog-event-detail > b { font-size: 13px !important; }
.wrs-catalog-source,
.wrs-catalog-distance,
.wrs-catalog-revision,
.wrs-catalog-revision > span,
.wrs-catalog-revision-time {
  opacity: 1 !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  overflow-wrap: anywhere !important;
}
.wrs-catalog-revision {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  margin-top: 4px !important;
  padding: 9px 10px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(135, 157, 181, .45) !important;
  background: rgba(90, 111, 132, .12) !important;
}
.wrs-catalog-revision.is-major {
  border-color: rgba(255, 90, 110, .65) !important;
  background: rgba(180, 35, 55, .13) !important;
}
.wrs-catalog-revision.is-updated {
  border-color: rgba(220, 163, 20, .65) !important;
  background: rgba(206, 153, 14, .12) !important;
}
.wrs-catalog-revision.is-major b { color: #d21f3d !important; }
.wrs-catalog-revision.is-updated b { color: #925c00 !important; }
html[data-wrs-theme="dark"] .wrs-catalog-revision,
html[data-wrs-theme="dark"] .wrs-catalog-revision > span { color: #e1edf8 !important; }
html[data-wrs-theme="dark"] .wrs-catalog-revision.is-major b { color: #ffabb6 !important; }
html[data-wrs-theme="dark"] .wrs-catalog-revision.is-updated b { color: #ffe29a !important; }
html[data-wrs-theme="light"] .wrs-catalog-source,
html[data-wrs-theme="light"] .wrs-catalog-distance { color: #30465b !important; }
html[data-wrs-theme="dark"] .wrs-catalog-source,
html[data-wrs-theme="dark"] .wrs-catalog-distance { color: #d9e7f5 !important; }
html[data-wrs-theme="light"] .wrs-catalog-event-detail > b,
html[data-wrs-theme="light"] .wrs-catalog-event-detail > span { color: #15283d !important; }
html[data-wrs-theme="dark"] .wrs-catalog-event-detail > b,
html[data-wrs-theme="dark"] .wrs-catalog-event-detail > span { color: #f4f8ff !important; }

@media (max-width: 1200px) {
  .wrs-mobile-header-clock .wrs-header-clock-date { font-size: 7px !important; }
  .wrs-catalog-event-detail > b { font-size: 13px !important; }
  .wrs-catalog-revision,
  .wrs-catalog-source,
  .wrs-catalog-distance { font-size: 10.5px !important; }
}


/* Final desktop accessibility pass: opaque, high-contrast monitoring text. */
@media (min-width: 1201px) {
  #cardRealtime, #rightPanel, .glass-panel, .right-panel,
  .wrs-desktop-catalog-panel {
    color: #f5f9ff !important;
    opacity: 1 !important;
  }
  #cardRealtime.glass-panel, #rightPanel.glass-panel, .right-panel.glass-panel,
  .left-top.glass-panel, .left-bottom.glass-panel {
    background: rgba(4, 14, 27, .97) !important;
    border-color: rgba(139, 184, 224, .48) !important;
    box-shadow: 0 14px 38px rgba(0,0,0,.48), inset 0 1px rgba(255,255,255,.07) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.15) !important;
    backdrop-filter: blur(16px) saturate(1.15) !important;
  }
  #cardRealtime :is(.panel-header-title, #rtDate, #rtPlace, #rtParamMagnitude),
  #rightPanel :is(.rp-mag-info b, .rp-stats b, .rp-instr b),
  .left-bottom :is(.disc b, .leg-h) {
    color: #ffffff !important;
    opacity: 1 !important;
    text-shadow: none !important;
  }
  #cardRealtime :is(.panel-sub, #rtFilter, #rtAgo, #rtCoord, #rtDist, #rtSrc,
    #rtParamDepth, #rtParamRevision, .world-clock-grid small,
    .world-clock-grid time, .world-clock-param span),
  #rightPanel :is(.rp-mode, .rp-mag-info small, .rp-stats small, .rp-desc,
    .rp-instr span, .rp-foot, .rp-quick-status),
  .left-bottom :is(.disc, .leg-row, .leg-lab) {
    color: #dce8f5 !important;
    opacity: 1 !important;
    text-shadow: none !important;
  }
  #cardRealtime #rtPlace { font-size: 13px !important; font-weight: 800 !important; line-height: 1.5 !important; }
  #cardRealtime #rtSrc { font-size: 11px !important; font-weight: 750 !important; }
  #cardRealtime #rtCoord, #cardRealtime #rtDist { font-size: 12px !important; font-weight: 750 !important; }
  #cardRealtime .world-clock-grid > .world-clock-time strong {
    color: #9deeff !important;
    font-size: 20px !important;
    font-weight: 950 !important;
    font-variant-numeric: tabular-nums !important;
    text-shadow: none !important;
  }
  #cardRealtime .world-clock-grid > .world-clock-time small,
  #cardRealtime .world-clock-param small { color: #c7dced !important; opacity: 1 !important; }
  #cardRealtime .world-clock-grid > .world-clock-time time,
  #cardRealtime .world-clock-param span { color: #eef6ff !important; opacity: 1 !important; }
  #cardRealtime .world-clock-param strong { color: #ffffff !important; }
  #rightPanel input, #rightPanel select, #rightPanel textarea,
  .wrs-desktop-catalog-panel input, .wrs-desktop-catalog-panel select {
    color: #f5f9ff !important;
    caret-color: #7ce9ff !important;
    background-color: #0d2236 !important;
    border-color: rgba(143, 183, 218, .52) !important;
  }
  #rightPanel input::placeholder, #rightPanel textarea::placeholder,
  .wrs-desktop-catalog-panel input::placeholder {
    color: #b4c8dc !important;
    opacity: 1 !important;
  }
  .wrs-desktop-catalog-event {
    color: #f4f8ff !important;
    background: #0d2033 !important;
    border-color: rgba(135, 176, 214, .42) !important;
  }
  .wrs-desktop-catalog-place { color: #ffffff !important; opacity: 1 !important; }
  .wrs-desktop-catalog-time,
  .wrs-desktop-catalog-source,
  .wrs-desktop-catalog-distance,
  .wrs-desktop-catalog-footer { color: #d9e7f5 !important; opacity: 1 !important; }
  .wrs-desktop-catalog-revision {
    color: #edf5ff !important;
    background: rgba(34, 61, 82, .62) !important;
    border-color: rgba(132, 166, 197, .52) !important;
    opacity: 1 !important;
  }
  .wrs-desktop-catalog-revision b { color: #a7efff !important; opacity: 1 !important; }
  .wrs-desktop-catalog-revision span,
  .wrs-desktop-catalog-revision-time { color: #eaf3fd !important; opacity: 1 !important; }
  .wrs-desktop-catalog-open {
    color: #e8fbff !important;
    background: #12384d !important;
    border-color: #48b8d7 !important;
  }
  .wrs-catalog-event-detail > *,
  .wrs-catalog-source, .wrs-catalog-distance,
  .wrs-catalog-revision, .wrs-catalog-revision > *,
  .wrs-catalog-event-footer { opacity: 1 !important; }
  .wrs-catalog-event-detail > b { color: #ffffff !important; }
  .wrs-catalog-event-detail > span,
  .wrs-catalog-source,
  .wrs-catalog-distance { color: #dce8f5 !important; }
  .wrs-catalog-revision { background: rgba(26, 47, 65, .86) !important; }
  .wrs-catalog-revision.is-major b { color: #ffb4c0 !important; }
  .wrs-catalog-revision.is-updated b { color: #ffe29a !important; }
  .wrs-catalog-open { min-height: 36px !important; font-weight: 850 !important; }
}


/* WRS GEMPA — realtime card fixes (2026-10-30). Keep this file last in the stylesheet order. */
@media (max-width: 1200px) {
  /* Give WIB/UTC date labels enough horizontal room in the top header. */
  #mobilePageMap .wrs-mobile-live-header {
    grid-template-columns: minmax(48px, 1fr) auto 132px auto !important;
    column-gap: 4px !important;
  }
  #mobilePageMap .wrs-mobile-header-clocks {
    display: flex !important;
    flex: 0 0 132px !important;
    width: 132px !important;
    min-width: 132px !important;
    max-width: 132px !important;
    min-height: 36px !important;
    height: 36px !important;
    max-height: 36px !important;
    padding: 3px 5px !important;
    gap: 4px !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }
  #mobilePageMap .wrs-mobile-header-clock {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    overflow: visible !important;
  }
  #mobilePageMap .wrs-mobile-header-clock .wrs-header-clock-date {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    font-size: 6.6px !important;
    line-height: 1.15 !important;
    letter-spacing: -.02em !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  /* The realtime distance already comes from the consented device location; show it. */
  #mobilePageMap #cardRealtime .rt-dist {
    display: block !important;
    min-height: 12px !important;
    margin: 0 10px 4px !important;
    padding: 0 !important;
    color: #9cb2c8 !important;
    font-size: 9px !important;
    font-weight: 650 !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  #mobilePageMap #cardRealtime .rt-dist.has-loc {
    color: #82def6 !important;
    font-weight: 800 !important;
  }

  /* Parameter updates float directly below the realtime card, not in Detail Kejadian. */
  #mobilePageMap #rtUpdate.rt-update {
    display: block;
    margin: 0 !important;
    pointer-events: auto !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 22px rgba(0,0,0,.3) !important;
  }
}
@media (max-width: 380px) {
  #mobilePageMap .wrs-mobile-live-header {
    grid-template-columns: minmax(42px, 1fr) auto 116px auto !important;
    column-gap: 3px !important;
  }
  #mobilePageMap .wrs-mobile-header-clocks {
    flex-basis: 116px !important;
    width: 116px !important;
    min-width: 116px !important;
    max-width: 116px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    gap: 3px !important;
  }
  #mobilePageMap .wrs-mobile-header-clock .wrs-header-clock-date {
    font-size: 6.1px !important;
    letter-spacing: -.035em !important;
  }
}

/* Shared banner sizing also applies to desktop/mobile when its content is active. */
#rtUpdate.rt-update {
  max-width: calc(100vw - 16px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}