.clc-noaa-tides-app-wrapper{
  padding: 1.5rem;
  background: #f3f4f6;
}
.clc-noaa-tides-app{
  background: #ffffff;
  border-radius: 16px;
  padding: 1.5rem;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.12);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 18px;
}

/* Chunky red scrollbar (WebKit) */
.clc-noaa-tides-app ::-webkit-scrollbar{
  width: 22px;
}
.clc-noaa-tides-app ::-webkit-scrollbar-track{
  background: #f3f4f6;
  border-radius: 10px;
}
.clc-noaa-tides-app ::-webkit-scrollbar-thumb{
  background-color: #dc2626;
  border-radius: 14px;
  border: 4px solid #f3f4f6;
}
.clc-noaa-tides-app ::-webkit-scrollbar-thumb:hover{
  background-color: #b91c1c;
}

/* Firefox */
.clc-noaa-tides-app{
  scrollbar-width: auto;
  scrollbar-color: #dc2626 #f3f4f6;
}

/* Pulsing arrow overlay (optional cue) */
.scroll-cue{
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  font-size: 28px;
  color: #dc2626;
  pointer-events: none;
  animation: scrollPulse 1.6s ease-in-out infinite;
  opacity: 0.9;
}
@keyframes scrollPulse{
  0%{ transform: translateY(-50%) translateX(0); opacity: 0.4; }
  50%{ transform: translateY(-50%) translateX(4px); opacity: 1; }
  100%{ transform: translateY(-50%) translateX(0); opacity: 0.4; }
}
.hide-scroll-cue{ display:none; }