.screenshot-page{max-width:1100px;padding-block:36px 55px}.screenshot-intro{max-width:800px;margin-bottom:26px}.screenshot-intro h1{font-size:clamp(42px,6vw,70px);line-height:1.04;letter-spacing:-.04em;margin:10px 0 20px}.screenshot-intro>p:last-child{font-size:19px;line-height:1.7;color:#444}.screenshot-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px 26px}.screenshot-card{margin:0;border-top:2px solid #111;padding-top:16px;min-width:0}.screenshot-card>a{display:block;min-height:44px;background:#eeede8;border:1px solid #bbb}.screenshot-card img{display:block;width:100%;height:280px;object-fit:contain;object-position:top;padding:8px}.screenshot-card figcaption{padding-top:12px}.screenshot-card .screenshot-meta{font-size:13px;line-height:1.5;color:#555;margin:0 0 8px}.screenshot-card h3{font-size:23px;line-height:1.35;margin:0 0 12px;overflow-wrap:anywhere}.screenshot-card figcaption>a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;margin-right:18px}.screenshot-coverage{font-size:15px;line-height:1.7;color:#555;max-width:80ch;margin-block:20px 28px}.screenshot-paging{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-block:30px;font-size:14px}.screenshot-paging button{background:#111;color:#fff;border:1px solid #111;padding:10px 14px;min-height:44px;font:600 15px/1.5 Arial,Helvetica,sans-serif;cursor:pointer}.screenshot-paging button:disabled{background:#eeede8;color:#666;border-color:#ccc}.linked-screenshots{border-block:1px solid #bbb;padding-block:20px;margin-block:24px;scroll-margin-top:24px}.linked-screenshots>h3{font-size:24px;line-height:1.3;margin:0 0 10px}.linked-screenshots>p{font-size:15px;line-height:1.7;color:#555;margin-bottom:15px;max-width:80ch}.linked-screenshots .screenshot-grid{grid-template-columns:1fr}.linked-screenshots .screenshot-card{display:grid;grid-template-columns:150px 1fr;gap:22px;border:0;padding:0;max-width:850px}.linked-screenshots .screenshot-card img{height:245px;padding:3px}.linked-screenshots .screenshot-card figcaption{padding-top:0}.linked-screenshots .screenshot-card h3{font-size:22px}.linked-screenshots .screenshot-match{font-size:16px;line-height:1.7;margin-bottom:12px}.screenshot-dialog{width:min(1040px,calc(100% - 36px));height:90vh;max-height:90vh;max-width:none;padding:0;border:2px solid #111;border-radius:0;background:#faf9f5;color:#111;overflow:auto}.screenshot-dialog::backdrop{background:rgb(0 0 0 / .8)}.screenshot-dialog-bar{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:18px;background:#111;color:#fff;padding:14px 20px}.screenshot-dialog-bar h2{font-size:20px;line-height:1.4;margin:0}.screenshot-dialog-bar button{min-height:44px;min-width:74px;background:#ff2e88;color:#111;border:0;padding:8px 14px;font:700 15px/1.5 Arial,Helvetica,sans-serif;cursor:pointer}.screenshot-dialog-notes{font-size:14px;line-height:1.7;padding:16px 20px;margin:0}.screenshot-dialog>img{display:block;width:100%;height:auto;background:#fff}.screenshot-dialog-links{display:flex;gap:12px 24px;flex-wrap:wrap;padding:16px 20px}.screenshot-dialog-links a{min-height:44px;display:inline-flex;align-items:center;font-size:15px}.screenshot-method{border-top:1px solid #bbb;padding-block:18px}.screenshot-method summary{cursor:pointer;font-weight:700;min-height:44px}.screenshot-method p{font-size:17px;line-height:1.8;max-width:80ch;margin-block:18px}
@media(max-width:650px){.screenshot-page{padding-top:28px}.screenshot-intro>p:last-child{font-size:18px}.screenshot-grid{grid-template-columns:1fr;gap:28px}.screenshot-card img{height:320px}.screenshot-paging{flex-wrap:wrap}.linked-screenshots .screenshot-card{grid-template-columns:100px 1fr;gap:14px}.linked-screenshots .screenshot-card img{height:185px}.linked-screenshots .screenshot-card h3{font-size:20px}.linked-screenshots .screenshot-match{font-size:15px}.screenshot-dialog{width:calc(100% - 16px);height:94vh;max-height:94vh}.screenshot-dialog-bar{padding:10px 12px;gap:10px}.screenshot-dialog-bar h2{font-size:17px}.screenshot-dialog-notes,.screenshot-dialog-links{padding:12px;font-size:13px}.screenshot-dialog-bar button{min-width:65px}}
[hidden]{display:none!important}

.screenshot-viewer-buttons{display:flex;gap:8px;flex:none}.screenshot-dialog-bar{left:0;flex-wrap:wrap}.screenshot-dialog-bar h2{flex:1;min-width:170px}.screenshot-dialog.screenshot-zoomed>img{width:auto;max-width:none}@media(max-width:650px){.screenshot-viewer-buttons{margin-left:auto}}
