/* Modal shell (scoped) */
.yg3x-modal{position:fixed;inset:0;z-index:100020;display:block;opacity:0;transition:opacity .15s ease}
.yg3x-modal.__open{opacity:1}
.yg3x-overlay{position:absolute;inset:0;background:rgba(0,0,0,.65)}
.yg3x-dialog{
  position:relative;
  width:min(92vw, 980px);
  max-height:92vh;
  margin:6vh auto;
  background:#0b0b0b;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 12px 48px rgba(0,0,0,.35);
}
.yg3x-close{
  position:absolute;top:10px;right:10px;z-index:3;
  width:40px;height:40px;border:0;border-radius:9999px;
  background:#111827;color:#fff;font-size:22px;font-weight:800;line-height:1;cursor:pointer;
}
.yg3x-content{background:#000;min-height:min(82vh, calc(92vw * 9/16));}

/* Prevent theme bleed inside modal */
.yg3x-modal .button,
.yg3x-modal .btn,
.yg3x-modal button,
.yg3x-modal input[type="button"],
.yg3x-modal input[type="submit"]{
  all: unset; /* reset most things */
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px; border-radius:12px; cursor:pointer;
  background:#e5e7eb; color:#111827; font-weight:700; font-family:inherit; line-height:1.1;
  border: none;
}
.yg3x-modal .btn-primary{ background:#2563eb; color:#fff; }
.yg3x-modal .btn-secondary{ background:#f3f4f6; color:#111827; }

/* Also reset anchors that look like buttons */
.yg3x-modal a.button, .yg3x-modal a.btn{ text-decoration:none; }

/* Make any iframe/video fill */
.yg3x-content iframe,
.yg3x-content video{display:block;width:100%;height:min(82vh, calc(92vw * 9/16));border:0}

/* Small screens */
@media (max-width: 640px){
  .yg3x-dialog{ width:96vw; margin:4vh auto; border-radius:12px; }
  .yg3x-close{ width:38px;height:38px; font-size:20px; }
}
