
.mtg-card-grid{
  display:grid;
  grid-template-columns:repeat(var(--mtg-columns-desktop,3),minmax(0,1fr));
  gap:var(--mtg-gap,16px);
  max-width:var(--mtg-max-width,900px);
  margin-left:auto;
  margin-right:auto;
  text-align:center
}
.mtg-card{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.mtg-card a{display:block;width:100%;text-align:center}
.mtg-card img{display:block;width:100%;max-width:var(--mtg-image-max-width,250px);height:auto;margin:0 auto}
.mtg-card p{margin:4px 0;width:100%}

/* Center the final row without changing card width.
   When enabled, flexbox is used so incomplete final rows are naturally centered. */
.mtg-center-last-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:var(--mtg-gap,16px);
}

.mtg-center-last-row > .mtg-card{
  flex:0 0 calc(
    (100% - (var(--mtg-columns-desktop,3) - 1) * var(--mtg-gap,16px))
    / var(--mtg-columns-desktop,3)
  );
  max-width:calc(
    (100% - (var(--mtg-columns-desktop,3) - 1) * var(--mtg-gap,16px))
    / var(--mtg-columns-desktop,3)
  );
  box-sizing:border-box;
}

@media(max-width:600px){
  .mtg-card-grid{
    grid-template-columns:repeat(var(--mtg-columns-mobile,2),minmax(0,1fr));
  }

  .mtg-center-last-row{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:var(--mtg-gap,16px);
  }

  .mtg-center-last-row > .mtg-card{
    flex:0 0 calc(
      (100% - (var(--mtg-columns-mobile,2) - 1) * var(--mtg-gap,16px))
      / var(--mtg-columns-mobile,2)
    );
    max-width:calc(
      (100% - (var(--mtg-columns-mobile,2) - 1) * var(--mtg-gap,16px))
      / var(--mtg-columns-mobile,2)
    );
  }

  .mtg-card img{
    max-width:100%;
  }
}

.mtg-lightbox-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.9);
  display:none;justify-content:center;align-items:center;
  padding:60px 20px 20px;z-index:999999;cursor:pointer;box-sizing:border-box
}
.mtg-lightbox-overlay.is-open{display:flex}
.mtg-lightbox-stage{
  width:min(90vw,1200px);
  height:min(80vh,900px);
  display:flex;justify-content:center;align-items:center;box-sizing:border-box
}
.mtg-lightbox-stage img{
  width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;
  object-fit:contain;box-shadow:0 0 20px rgba(0,0,0,.5);cursor:default
}
.mtg-lightbox-btn{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(255,255,255,.1);color:#fff;border:0;font-size:40px;padding:20px;cursor:pointer;z-index:1000000
}
.mtg-lightbox-prev{left:10px}.mtg-lightbox-next{right:10px}
@media(max-width:600px){
  .mtg-lightbox-stage{width:92vw;height:76vh}
  .mtg-lightbox-btn{font-size:30px;padding:12px}
}

.mtg-lightbox-close{
  position:absolute;
  top:16px;
  right:16px;
  width:48px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:transparent;
  color:#fff;
  border:0;
  border-radius:0;
  font-size:34px;
  line-height:1;
  padding:0;
  cursor:pointer;
  z-index:1000001;
}
.mtg-lightbox-close:hover,
.mtg-lightbox-close:focus{
  background:transparent;
  opacity:.8;
}
@media(max-width:600px){
  .mtg-lightbox-close{
    top:10px;
    right:10px;
    width:42px;
    height:42px;
    font-size:30px;
  }
}

.mtg-fill-column-width > .mtg-card{
  margin:0;
  padding:0;
}
.mtg-fill-column-width > .mtg-card > a{
  display:block;
  width:100%;
  margin:0;
  padding:0;
}
.mtg-fill-column-width > .mtg-card img{
  display:block;
  width:100%;
  max-width:none;
  height:auto;
  margin:0;
}

.mtg-caption-small .mtg-card p{font-size:.85em}.mtg-caption-medium .mtg-card p{font-size:1em}.mtg-caption-large .mtg-card p{font-size:1.15em}
