dialog.post-media-viewer{--viewer-chrome-opacity:1;position:fixed;inset:0;box-sizing:border-box;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:#0a0a0a;color:#fff;overflow:hidden;overscroll-behavior:contain;font:16px/1.5 'DM Sans',system-ui,sans-serif}
dialog.post-media-viewer::backdrop{background:transparent}
.media-viewer-toolbar{position:absolute;inset:0 0 auto;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:calc(12px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 28px max(16px,env(safe-area-inset-left));background:linear-gradient(#0009,transparent);pointer-events:none}
.media-viewer-toolbar>*{pointer-events:auto}
.media-viewer-count{padding:5px 11px;border-radius:20px;background:#0007;color:#fff;font-size:14px;font-weight:600;letter-spacing:.04em}
dialog.post-media-viewer button{display:grid;place-items:center;flex:none;min-width:44px;min-height:44px;padding:0;border:1px solid #ffffff30;border-radius:50%;background:#181818b3;color:#fff;font:500 16px/1 system-ui,sans-serif;touch-action:manipulation;cursor:pointer}
.post-media-viewer button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.post-media-viewer button:hover{background:#393939de}
.post-media-viewer button:active{background:#505050}
dialog.post-media-viewer button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.post-media-viewer button:disabled{opacity:.25;cursor:default}
.media-viewer-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;cursor:zoom-in}
.media-viewer-stage.is-zoomed{cursor:grab}
.media-viewer-stage.is-dragging{cursor:grabbing}
dialog.post-media-viewer .media-viewer-image{display:block;flex:none;max-width:none;max-height:none;margin:0;object-fit:contain;transform-origin:center;user-select:none;-webkit-user-drag:none;will-change:transform}
dialog.post-media-viewer .media-viewer-neighbor{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;pointer-events:none;will-change:transform}
.media-viewer-status{position:absolute;inset:0;display:grid;place-content:center;max-width:36rem;margin:auto;padding:24px;color:#ddd;text-align:center;pointer-events:none}
.media-viewer-navigation{position:absolute;inset:50% 12px auto;z-index:3;display:flex;justify-content:space-between;transform:translateY(-50%);pointer-events:none;opacity:var(--viewer-chrome-opacity)}
.media-viewer-navigation button{pointer-events:auto;box-shadow:0 2px 12px #0003}
.media-viewer-footer{position:absolute;inset:auto 0 0;z-index:3;display:grid;justify-items:center;gap:12px;padding:40px max(16px,env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:linear-gradient(transparent,#000b);opacity:var(--viewer-chrome-opacity);pointer-events:none}
.media-viewer-footer>*{pointer-events:auto}
.media-viewer-controls{display:flex;align-items:center;justify-content:center;gap:8px;padding:4px;border:1px solid #ffffff20;border-radius:30px;background:#1212129c}
dialog.post-media-viewer .media-viewer-controls button{min-width:44px;min-height:44px;border:0;background:transparent}
dialog.post-media-viewer .media-viewer-controls [data-photo-reset]{min-width:62px;border-radius:16px;font-size:13px;font-weight:600}
.media-viewer-thumbnails{display:flex;gap:7px;max-width:min(100%,430px);padding:4px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.media-viewer-thumbnails::-webkit-scrollbar{display:none}
dialog.post-media-viewer .media-viewer-thumbnails button{width:44px;height:54px;padding:0;border:2px solid transparent;border-radius:7px;overflow:hidden;opacity:.55}
dialog.post-media-viewer .media-viewer-thumbnails button[aria-current=true]{border-color:#fff;opacity:1}
.media-viewer-thumbnails img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.media-viewer-help{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.post-media-viewer.is-immersive .media-viewer-footer,.post-media-viewer.is-immersive .media-viewer-navigation,.post-media-viewer.is-immersive .media-viewer-count{opacity:0;pointer-events:none}
.post-media-viewer.is-immersive .media-viewer-toolbar{background:none}
@media(min-width:781px){.media-viewer-toolbar{padding-inline:24px}.media-viewer-navigation{inset-inline:24px}.media-viewer-footer{padding-bottom:20px}dialog.post-media-viewer .media-viewer-thumbnails button{width:48px;height:58px}}
@media(prefers-reduced-motion:no-preference){.post-media-viewer button{transition:background .12s ease,opacity .16s ease}.media-viewer-footer,.media-viewer-navigation,.media-viewer-count{transition:opacity .18s ease}}

/* Keep three-photo posts balanced instead of leaving an empty fourth tile. */
.post-image-grid:has(>.post-photo-open:nth-child(3):last-child):not(:has(.post-video)){height:360px;grid-template-rows:repeat(2,minmax(0,1fr))}
.post-image-grid:has(>.post-photo-open:nth-child(3):last-child):not(:has(.post-video))>.post-photo-open:first-child{grid-row:span 2}
.post-image-grid:has(>.post-photo-open:nth-child(3):last-child):not(:has(.post-video)) .post-image{height:100%;max-height:none;object-fit:cover}
.post-image-grid:has(>.post-photo-open:nth-child(5):last-child)>.post-photo-open:last-child{grid-column:1/-1}
@media(max-width:600px){.post-image-grid:has(>.post-photo-open:nth-child(3):last-child):not(:has(.post-video)){height:300px}}