@charset "UTF-8";
.screenshots-section{background:#100d12;border-block:1px solid var(--line)}
.screenshots-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.screenshot-card{margin:0;min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.screenshot-link{display:block;position:relative;padding:14px 14px 0;background:#0d0d0f}
.screenshot-link:focus-visible{outline-offset:-4px}
.screenshot-image{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;width:100%;overflow:hidden;background:#111}
.screenshot-image img{width:100%;height:100%;object-fit:contain}
.screenshot-zoom{display:flex;align-items:center;justify-content:space-between;min-height:44px;gap:14px;color:var(--pink);font-size:.875rem}
.screenshot-link:hover .screenshot-zoom{text-decoration:underline;text-underline-offset:4px}
.screenshot-card figcaption{padding:24px;border-top:1px solid var(--line)}
.screenshot-card figcaption h3{font-size:1.45rem;margin:12px 0;line-height:1.2}
.screenshot-card figcaption>p:last-child{font-size:1rem;line-height:1.65}
.screenshots-note{margin-top:24px;max-width:850px;font-size:.875rem}
.screen-crop.screenshot-hero{aspect-ratio:auto}
.screen-crop.screenshot-hero img{position:static;width:100%;max-width:100%;height:auto}
.screenshot-hero a{display:block;cursor:zoom-in}
.screenshot-hero a:focus-visible{outline-offset:-4px}
.screenshot-dialog{width:min(1160px,calc(100% - 40px));max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);padding:24px;border:1px solid #815168;border-radius:12px;color:var(--text);background:#141015;overflow:auto;overscroll-behavior:contain}
.screenshot-dialog::backdrop{background:rgba(0,0,0,.86)}
.screenshot-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}
.screenshot-dialog-header h2{font-size:1.45rem;line-height:1.2}
.screenshot-close{flex-shrink:0;display:inline-flex;align-items:center;gap:12px;min-height:44px;border:1px solid #815168;border-radius:6px;padding:8px 14px;color:var(--text);background:#21151e;font-size:1rem}
.screenshot-close span{font-size:1.5rem;line-height:1}
.screenshot-dialog-image{display:flex;align-items:center;justify-content:center;background:#0b0b0c}
.screenshot-dialog-image img{display:block;width:auto;height:auto;max-width:100%;max-height:65vh;max-height:65dvh;object-fit:contain}
.screenshot-dialog>p{margin-top:18px;font-size:1rem;max-width:960px}
.screenshot-original{display:inline-block;padding-block:12px;color:var(--pink);font-size:.9rem;text-decoration:underline;text-underline-offset:4px}
.screenshot-open{overflow:hidden}
@media(min-width:801px) and (max-width:1050px){nav{gap:14px}nav a{font-size:.82rem}.nav-wrap{gap:16px}.nav-cta{padding:10px 12px}.nav-cta span{margin-left:8px}}
@media(max-width:700px){.screenshots-grid{grid-template-columns:1fr;gap:20px}.screenshot-card figcaption{padding:20px}.screenshot-link{padding:10px 10px 0}.screenshot-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);padding:16px}.screenshot-dialog-header{gap:12px;align-items:flex-start}.screenshot-dialog-header h2{font-size:1.15rem}.screenshot-close{font-size:.875rem;padding-inline:10px}.screenshot-dialog-image img{max-height:58dvh}}
@media print{.screenshot-dialog,.screenshot-zoom{display:none}.screenshot-card{break-inside:avoid}.screenshots-grid{display:block}}