/* Wajang feature screenshot viewer — compact control and fitted display */
.feature-longform-grid{max-width:1320px;grid-template-columns:minmax(320px,.82fr) minmax(520px,1.18fr);gap:44px}
.feature-shot{padding:14px}
.wj-feature-image{margin:0;display:flex;flex-direction:column;align-items:center;gap:9px}
.wj-feature-image>img{display:block;width:100%;height:auto;max-height:590px;object-fit:contain;border-radius:10px;background:#050a10}
.wj-image-zoom{appearance:none;border:1px solid rgba(228,186,88,.48);background:#101c28;color:#ead078;border-radius:999px;padding:5px 10px 5px 6px;display:inline-flex;align-items:center;gap:7px;font:700 .66rem/1 var(--font-body,Arial,sans-serif);letter-spacing:.075em;text-transform:uppercase;cursor:pointer;box-shadow:0 5px 14px rgba(0,0,0,.18);transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}
.wj-image-zoom:hover,.wj-image-zoom:focus-visible{transform:translateY(-1px);border-color:#e6c45e;background:#182a3a;box-shadow:0 7px 18px rgba(0,0,0,.25),0 0 0 2px rgba(228,186,88,.12);outline:none}
.wj-image-zoom-icon{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#e6bf54,#a97718);color:#07121d;box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.wj-image-zoom-icon svg{width:16px;height:16px;display:block}
.wj-image-lightbox[hidden]{display:none!important}
.wj-image-lightbox{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:3vh 3vw}
.wj-image-lightbox-backdrop{position:absolute;inset:0;background:rgba(1,7,12,.88);backdrop-filter:blur(7px)}
.wj-image-lightbox-dialog{position:relative;width:min(90vw,1500px);height:min(90vh,1000px);display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:#07121d;border:1px solid rgba(228,186,88,.55);border-radius:15px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.7)}
.wj-image-lightbox-dialog header,.wj-image-lightbox-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 15px;background:#0b1722;border-color:rgba(228,186,88,.18)}
.wj-image-lightbox-dialog header{border-bottom:1px solid rgba(228,186,88,.18)}
.wj-image-lightbox-dialog footer{border-top:1px solid rgba(228,186,88,.18);color:#aeb8c3;font-size:.78rem}
.wj-image-lightbox-dialog h2{margin:1px 0 0;color:#fff;font-size:clamp(1rem,1.5vw,1.5rem)}
.wj-image-lightbox-dialog .eyebrow{font-size:.62rem}
.wj-image-lightbox-close{appearance:none;width:36px;height:36px;border-radius:50%;border:1px solid rgba(228,186,88,.45);background:#111e2a;color:#f2d16a;font-size:1.55rem;line-height:1;cursor:pointer;display:grid;place-items:center;transition:.18s ease}
.wj-image-lightbox-close:hover,.wj-image-lightbox-close:focus-visible{background:#d9b246;color:#08121b;outline:none;transform:rotate(3deg)}
.wj-image-lightbox-stage{min-height:0;overflow:auto;display:flex;align-items:center;justify-content:center;padding:14px;background:radial-gradient(circle at center,#152332 0,#050a10 72%)}
.wj-image-lightbox-stage img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;box-shadow:0 14px 45px rgba(0,0,0,.48)}
body.wj-lightbox-open{overflow:hidden}
@media(max-width:900px){
  .feature-longform-grid{grid-template-columns:1fr}
  .feature-shot{max-width:760px}
  .wj-image-lightbox{padding:2vh 2vw}
  .wj-image-lightbox-dialog{width:94vw;height:90vh;border-radius:12px}
  .wj-image-lightbox-dialog header,.wj-image-lightbox-dialog footer{padding:9px 11px}
  .wj-image-lightbox-dialog footer span{display:none}
  .wj-image-lightbox-stage{padding:8px}
  .wj-image-lightbox-stage img{max-width:100%;max-height:100%}
}
