/* Filter Glossary */

.glossary-backdrop {
  z-index: var(--z-modal);
}

.glossary-modal-content {
  position: relative;
  background: #050505;
  border: 1px solid rgba(255, 255, 255, var(--opacity-faint));
  border-radius: 0;
  max-width: 560px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
}

.glossary-inner {
  padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-lg);
}

.glossary-title {
  font-size: var(--font-size-xs);
  font-weight: var(--font-semibold);
  color: rgba(255, 255, 255, var(--opacity-quiet));
  letter-spacing: var(--letter-spacing-label);
  text-transform: uppercase;
  margin-bottom: var(--spacing-xl);
}

.glossary-subtitle {
  display: none;
}

.glossary-sections {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.glossary-section {
  border-bottom: none;
  padding: 0 0 var(--spacing-xl);
}

.glossary-section:first-child {
  padding-top: 0;
}

.glossary-section:last-child {
  padding-bottom: 0;
}

.glossary-category {
  font-size: var(--font-size-xs);
  font-weight: var(--font-semibold);
  color: rgba(255, 255, 255, var(--opacity-tertiary));
  letter-spacing: var(--letter-spacing-label);
  text-transform: uppercase;
  margin-bottom: var(--spacing-xs);
}

.glossary-category-desc {
  font-size: var(--font-size-compact);
  color: rgba(255, 255, 255, var(--opacity-quiet));
  text-transform: none;
  margin-bottom: var(--spacing-sm);
  line-height: var(--line-height-relaxed);
}

.glossary-terms {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.glossary-term-row {
  display: flex;
  gap: var(--spacing-sm);
  font-size: var(--font-size-compact);
  line-height: var(--line-height-base);
  padding: 6px 0;
}

.glossary-term-row dt {
  color: rgba(255, 255, 255, var(--opacity-secondary));
  font-weight: var(--font-regular);
  white-space: nowrap;
}

.glossary-term-row dt::after {
  content: ' \2014';
  color: rgba(255, 255, 255, var(--opacity-muted));
}

.glossary-term-row dd {
  /* definitions are info text — 0.55 floor, not decorative 0.35 */
  color: rgba(255, 255, 255, var(--opacity-tertiary));
  margin: 0;
}

/* Mobile glossary */

/* ========================================
   SMALL PHONE FIXES (max-width: 480px)
   Covers: movie modal, recommend modal,
   search, view controls, FAB, header extras
   ======================================== */

/* ========================================
   EXTRA SMALL PHONE FIXES (max-width: 380px)
   Covers: iPhone SE, very small devices
   ======================================== */

/* ── Reduced Motion ── */