/* Original screenshots remain complete; no artificial system chrome or cropped interfaces. */
.jj-case-list-grid{align-items:start;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr))}
.jj-case-list-card{max-width:440px;width:100%}
.jj-case-preview{--screen-width:210px;--screen-height:456px;padding:28px 16px 18px;background:#f5f7f6;min-width:0}
.jj-case-screenshots{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;gap:0;margin:0;padding:0;scrollbar-width:thin;scrollbar-color:#aebbb4 transparent;touch-action:pan-x pan-y pinch-zoom}
.jj-case-screenshots figure{flex:0 0 100%;min-width:0;margin:0;scroll-snap-align:start;scroll-snap-stop:always}
.jj-case-screenshots a{display:block;width:min(var(--screen-width,290px),100%);height:var(--screen-height,630px);margin:0 auto;background:#fff;border:5px solid #293b34;border-radius:22px;overflow:hidden;box-sizing:border-box;box-shadow:0 8px 20px rgb(25 49 35 / 9%)}
.jj-case-screenshots img{display:block;width:100%;height:100%;object-fit:contain;background:#fff;border-radius:0}
.jj-case-screenshots figcaption{font-size:14px;line-height:1.6;color:#4b5952;text-align:center;max-width:38ch;margin:14px auto 0;padding:0 8px;min-height:3.2em}
.jj-case-preview-controls{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:14px}
.jj-case-preview-controls button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #a7b6ad;background:#fff;color:#204d37;border-radius:50%;cursor:pointer;padding:0}
.jj-case-preview-controls button:hover:not(:disabled){background:#e8f3ed;border-color:#32875b}
.jj-case-preview-controls button:disabled{opacity:.35;cursor:default}
.jj-case-preview-count{font-size:14px;font-variant-numeric:tabular-nums;color:#4b5952;min-width:42px;text-align:center}
.jj-case-preview button:focus-visible,.jj-case-screenshots:focus-visible,.jj-case-screenshots a:focus-visible{outline:3px solid #288452;outline-offset:4px}
.jj-case-preview--detail{--screen-width:290px;--screen-height:630px;margin:24px 0;background:#f5f7f6;border-radius:8px}
.jj-case-body>.jj-case-screenshots{--screen-width:290px;--screen-height:630px;padding:24px 0;background:#f5f7f6}
@media(max-width:600px){.jj-case-preview{padding:22px 12px 16px}.jj-case-preview--detail,.jj-case-body>.jj-case-screenshots{--screen-width:260px;--screen-height:565px}.jj-case-list-grid{grid-template-columns:1fr}.jj-case-list-card{max-width:none}}
@media(prefers-reduced-motion:reduce){.jj-case-list-card{transition:none}.jj-case-list-card:hover{transform:none}}

/* Explicit desktop website galleries retain their full landscape screenshots. */
.jj-case-screenshots[data-preview-kind="web"] a{width:100%;height:auto;aspect-ratio:2.16;border:1px solid #a7b6ad;border-radius:6px;box-shadow:none}
.jj-case-screenshots[data-preview-kind="web"] img{width:100%;height:100%;aspect-ratio:2.16;object-fit:contain}
