/* mini-quiz.css — sayfa içi test oluşturma kartı
   Ekranların kendi stilleri sitenin quiz.css dosyasından gelir (.quiz-view, .quiz-picker,
   .quiz-answers, .quiz-share, .quiz-modal ...). Burada yalnız kartın çerçevesi ve
   sayfaya oturması için gereken birkaç kural var. */

.mq {
  max-width: 44rem;
  margin: 0 auto;
}

.mq-card {
  /* sayfadaki sabit başlık adım etiketini kapatmasın */
  scroll-margin-top: 5.5rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: var(--space-8);
}

.mq-hint {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--muted);
  margin: var(--space-4) 0 0;
  max-width: 60ch;
}

/* özel sonuç linki sosyal düğmelerin hemen altına yapışmasın */
.mq-priv {
  margin-top: var(--space-6);
}

@media (max-width: 600px) {
  .mq-card {
    padding: var(--space-5);
    border-radius: var(--radius);
  }
}

/* 2. adımda "bu sayfada N soru var" uyarısı */
.quiz-picker-short {
  color: var(--muted);
  font-size: 0.875rem;
  margin-top: calc(var(--space-2) * -1);
}