/* legal.css
   Legal line under the clock (rating box + copyright).
   Loaded by index.html (order matters). */

/* ============================================================
   LEGAL LINE (rating notice + copyright) — settings in COUNTDOWN_CONFIG.legal
   ============================================================ */
.lc-legal {
  position: absolute; left: 50%; bottom: var(--legal-bottom, 3.2%); transform: translateX(-50%); z-index: 3;
  display: flex; flex-direction: column; align-items: center; gap: clamp(4px, 0.6vw, 8px);
  pointer-events: none; user-select: none; white-space: nowrap;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; color: rgba(255, 255, 255, 0.82);
  opacity: 0; transition: opacity 1.6s ease 0.8s;
}
.lc-legal.is-visible { opacity: 1; }
.lc-rating {
  border: 1.5px solid rgba(255, 255, 255, 0.7);
  padding: 0.18em 0.55em 0.1em;
  font-size: clamp(11px, 1.35vw, 19px); line-height: 1.1; letter-spacing: 0.01em; font-weight: 400;
}
.lc-copyright { font-size: clamp(9px, 0.95vw, 13px); letter-spacing: 0.04em; font-weight: 700; opacity: 0.85; }
/* phones: buttons share the bottom row, so the legal line sits above them and the clock goes higher */
@media (max-width: 700px) {
  .lc-legal { bottom: 70px !important; }
  .lc-countdown { bottom: var(--clock-bottom-mobile, 20%) !important; }
}
