/* ---------------------------------------------------------------------------
 *  مجله هم‌داستان | بازی «حوا در بهشت»
 *  مسیر: frontend/assets/css/eve.css
 *  فقط از متغیرهای تم سایت استفاده می‌کند: --text-color، --bg-color
 *  و رنگ اصلی تم که صفحه در --sg-accent می‌گذارد.
 * --------------------------------------------------------------------------- */
.sg-page { max-width: 1120px; margin: 0 auto; padding: 28px 16px 56px; color: var(--text-color); }
.sg-head { margin-bottom: 20px; }
.sg-title { margin: 0; font-size: clamp(1.9rem, 5vw, 3rem); line-height: 1.25; font-weight: 900; }
.sg-sub { margin: 8px 0 0; font-size: 1.05rem; opacity: .8; }
.sg-kicker { display: inline-block; margin-bottom: 8px; font-weight: 800; font-size: .9rem; border-bottom: 2px solid var(--sg-accent); }

.sg-btn {
  display: inline-block; padding: 10px 26px; border-radius: 999px;
  background: var(--sg-accent); color: #1c1400; font: inherit; font-weight: 900;
  text-decoration: none; border: 0; cursor: pointer;
}
.sg-btn:hover { filter: brightness(1.08); }
.sg-btn:focus-visible { outline: 3px solid var(--text-color); outline-offset: 3px; }

/* ---------- صفحه‌ی بازی ---------- */
.sg-stage { border-radius: 16px; overflow: hidden; background: #0f1d3d; }
.sg-frame { display: block; width: 100%; aspect-ratio: 16 / 9; max-height: 82vh; border: 0; }
.sg-actions { display: flex; justify-content: center; margin: 14px 0 6px; }
.sg-text { max-width: 720px; margin: 22px auto 0; line-height: 1.9; }
.sg-text h2 { margin: 26px 0 6px; font-size: 1.15rem; font-weight: 900; }
.sg-text p { margin: 0; }
.sg-lead { font-size: 1.08rem; }
.sg-note { padding: 16px; color: #fff; text-align: center; }

@media (max-width: 760px) {
  .sg-page { padding: 18px 12px 44px; }
  /* روی گوشی قاب بلند است تا بازی جا داشته باشد */
  .sg-frame { aspect-ratio: auto; height: min(78vh, 720px); max-height: none; }
}