/* JX4 V5.1 responsive carousel: images are NEVER cropped. */
body.v2-liquid #slides.jx-responsive-banner {
  position:relative!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden!important;
  background:rgba(12,13,28,.42)!important;
  border-radius:15px;
}
body.v2-liquid #slides.jx-responsive-banner .jx-slide-frame {
  position:relative!important;
  display:none!important;
  width:100%!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  cursor:zoom-in;
}
body.v2-liquid #slides.jx-responsive-banner .jx-slide-frame.on {
  display:block!important;
  animation:jx-banner-in .32s ease-out both;
}
body.v2-liquid #slides.jx-responsive-banner .jx-slide-frame img {
  position:static!important;
  inset:auto!important;
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center center!important;
  aspect-ratio:auto!important;
  opacity:1!important;
  margin:0!important;
  padding:0!important;
  border-radius:14px;
}
body.v2-liquid #slides.jx-responsive-banner .slide-dots {
  position:absolute!important;
  bottom:clamp(7px,1.8vw,16px)!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  z-index:5!important;
  background:rgba(8,10,24,.64);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
  padding:8px 12px;
  border-radius:99px;
  box-shadow:0 2px 12px rgba(0,0,0,.32);
}
body.v2-liquid #slides.jx-responsive-banner .slide-dots button{min-height:8px;min-width:8px}
body.v2-liquid #slides.jx-responsive-banner .slide-dots button:focus-visible {outline:2px solid #fff;outline-offset:3px}
body.v2-liquid #slides.jx-responsive-banner .slide-fallback {min-height:210px}
@keyframes jx-banner-in {from{opacity:.35}to{opacity:1}}
@media(max-width:720px){
 body.v2-liquid #slides.jx-responsive-banner {width:100%!important;border-radius:13px!important}
 body.v2-liquid #slides.jx-responsive-banner .jx-slide-frame img {border-radius:12px!important}
 body.v2-liquid #slides.jx-responsive-banner .slide-dots {bottom:8px!important;padding:7px 10px!important}
}
@media(prefers-reduced-motion:reduce){body.v2-liquid #slides.jx-responsive-banner .jx-slide-frame.on{animation:none!important}}
/* Click-to-zoom viewer helps when a desktop landscape banner is viewed on mobile. */
.jx-banner-lightbox[hidden]{display:none!important}
.jx-banner-lightbox{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:65px 12px 16px;background:rgba(2,4,13,.96);backdrop-filter:blur(10px)}
.jx-banner-lightbox img{display:block;max-width:100%;max-height:calc(100vh - 86px);max-height:calc(100dvh - 86px);width:auto;height:auto;object-fit:contain}
.jx-banner-lightbox .jx-banner-close{position:absolute;right:14px;top:12px;border:1px solid rgba(255,255,255,.3);border-radius:11px;background:#27324b;color:#fff;padding:9px 14px;font-weight:750}
.jx-banner-zoom-open{overflow:hidden}
/* Admin editor */
.jx-banner-hint-panel .jx-banner-spec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.jx-banner-spec-grid>div{display:grid;gap:7px;padding:16px;border:1px solid rgba(185,197,255,.24);border-radius:14px;background:rgba(108,113,170,.09)}
.jx-banner-spec-grid strong{font-size:15px}.jx-banner-spec-grid b{font-size:clamp(20px,2vw,28px);color:var(--gold,#e8ba80);letter-spacing:.3px}.jx-banner-spec-grid span{font-size:12px;line-height:1.6;opacity:.82}
.jx-banner-pair-list{display:grid;gap:20px;margin:20px 0}.jx-banner-pair{border:1px solid rgba(170,186,235,.23);border-radius:16px;background:rgba(100,100,140,.07);padding:16px;min-width:0}
.jx-banner-pair-head{display:flex;gap:10px;justify-content:space-between;align-items:center;padding-bottom:12px;margin-bottom:14px;border-bottom:1px solid rgba(185,199,240,.12)}.jx-banner-pair-head span{opacity:.7;font-size:12px}
.jx-banner-pair-previews{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:16px;align-items:start}
.jx-banner-device{display:grid;gap:9px;min-width:0}.jx-banner-device-title{font-size:13px;font-weight:800}
.jx-banner-preview{display:grid;place-items:center;background:rgba(6,11,29,.33);border:1px solid rgba(175,195,235,.2);border-radius:13px;min-height:110px;overflow:hidden;padding:7px}
.jx-banner-preview-pc{aspect-ratio:1600/680}.jx-banner-preview-mobile{aspect-ratio:4/5;max-height:240px}
.jx-banner-preview img{max-height:100%;max-width:100%;width:auto;height:auto;object-fit:contain;display:block;border-radius:8px}
.jx-banner-no-mobile{text-align:center;opacity:.7;font-size:13px;line-height:1.8}.jx-banner-device>small{font-size:11px;opacity:.7}
.jx-banner-device label{display:grid;gap:6px;font-size:12px;font-weight:700}
.jx-banner-device input[type=file]{width:100%;min-width:0}
.jx-banner-pair-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(100px,175px) auto auto;gap:12px;align-items:end;margin-top:16px}
.jx-banner-pair-controls .field{min-width:0}.jx-banner-pair-controls .field input{width:100%}
.jx-banner-pair-controls .checkbox-line{align-self:center;white-space:nowrap}
@media(max-width:950px){.jx-banner-pair-controls{grid-template-columns:1fr 1fr}.jx-banner-pair-controls .checkbox-line{grid-column:auto}}
@media(max-width:650px){.jx-banner-hint-panel .jx-banner-spec-grid,.jx-banner-pair-previews,.jx-banner-pair-controls{grid-template-columns:minmax(0,1fr)}.jx-banner-pair-head{align-items:flex-start;flex-direction:column}.jx-banner-preview-mobile{max-width:240px}.jx-banner-pair{padding:12px}.jx-banner-pair-controls .btn.danger{justify-self:start}}
