/* Backdrop */
.lo-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.6);
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease;
  z-index: 9998;
}

/* Panel */
.lo-panel {
  position: fixed;
  top: 5vh;
  right: 50%;
  transform: translateX(50%);
  width: min(900px, 92vw);
  height: 90vh;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
  z-index: 9999;
}

/* Header / Close */
.lo-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid #eee;
}
.lo-title { font-size: 18px; font-weight: 600; margin: 0; }
.lo-close { border: 0; background: transparent; font-size: 20px; line-height: 1; cursor: pointer; }

/* Scrollbarer Inhalt */
.lo-body {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 20px clamp(16px, 2.5vw, 28px);
}

/* Sichtbar-Zustand */
.legal-overlay-open .lo-backdrop,
.legal-overlay-open .lo-panel { opacity: 1; visibility: visible; }
.legal-overlay-open { overflow: hidden; }

/* Mobile Vollhöhe */
@media (max-width: 768px) {
  .lo-panel { top: 0; height: 100vh; border-radius: 0; }
}

/* Print */
@media print { .lo-backdrop, .lo-panel { display: none !important; } }