.project-gallery{margin:22px 0 25px;min-width:0}.gallery-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:10px;color:var(--muted);margin-bottom:10px}.gallery-heading>span:first-child{font-weight:600}.gallery-heading b{font-size:9px;font-weight:500;border:1px solid var(--border);border-radius:4px;padding:1px 5px;margin-left:5px}.photo-strip{display:flex;align-items:flex-start;gap:10px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:none;scroll-behavior:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;scrollbar-width:none;border-radius:7px;cursor:grab;user-select:none;contain:inline-size}.photo-strip::-webkit-scrollbar{display:none}.photo-strip.is-dragging{cursor:grabbing}.gallery-photo{flex:0 0 86%;min-width:0;margin:0}.gallery-image{height:auto;position:relative;background:var(--surface);border-radius:6px;overflow:hidden}.gallery-image img{width:100%;height:auto;object-fit:contain;display:block;pointer-events:none}.image-kind{position:absolute;left:10px;bottom:10px;font-size:8px;letter-spacing:.6px;background:var(--overlay);color:var(--ink);padding:4px 7px;border-radius:3px;box-shadow:0 1px 4px #242a3414}.gallery-photo figcaption{padding:8px 1px 0;line-height:1.4;overflow-wrap:anywhere}.image-caption{display:block;font-size:10px;color:var(--muted)}.gallery-photo figcaption a{display:block;width:fit-content;font-size:9px;color:var(--muted);margin-top:4px;text-decoration:none}.gallery-photo figcaption a:hover{text-decoration:underline;text-underline-offset:3px}.gallery-bottom{display:flex;align-items:center;gap:16px;margin-top:11px}.gallery-position{height:2px;flex:1;background:var(--surface);border-radius:3px;overflow:hidden}.gallery-position>span{display:block;height:100%;background:var(--accent);border-radius:3px}.gallery-controls{display:flex;gap:5px}.gallery-controls button{width:29px;height:27px;display:grid;place-items:center;border:1px solid var(--border);border-radius:4px;font-size:15px;background:var(--paper);color:var(--muted);touch-action:manipulation}.gallery-controls button:hover:enabled{background:var(--accent-soft)}.gallery-controls button:disabled{opacity:.3;cursor:default}.gallery-single .gallery-controls{display:none}.gallery-single .gallery-photo{flex-basis:100%}.gallery-compact{margin:12px 0}.gallery-compact .gallery-heading{font-size:9px;margin-bottom:8px;padding-right:14px}.gallery-compact .photo-strip{gap:8px;border-radius:5px}.gallery-compact .gallery-photo{flex-basis:88%}.gallery-compact .gallery-photo figcaption{padding-top:6px}.gallery-compact .image-caption{font-size:9px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.gallery-compact .gallery-photo figcaption a{font-size:8px;margin-top:2px}.gallery-compact .gallery-bottom{margin-top:8px}.gallery-compact .gallery-controls button{height:24px;width:26px}.gallery-unavailable{padding:20px;background:var(--surface);font-size:11px;color:var(--muted);border-radius:6px;margin-bottom:17px}.image-unavailable{display:grid;place-items:center}.image-failure{padding:24px;color:var(--muted);font-size:10px;text-align:center}.gallery-image img[hidden]{display:none}
@media(max-width:620px){.project-gallery{margin-top:20px}.gallery-photo{flex-basis:88%}.gallery-compact{margin-top:0}.gallery-photo figcaption a{font-size:9px}.gallery-heading{font-size:10px}}

.upload-section{border:1px solid var(--border);border-radius:7px;margin:16px 0;background:var(--surface)}.upload-section>summary{cursor:pointer;padding:14px 16px;font-size:12px;font-weight:600}.upload-section>summary span{display:block;font-size:10px;font-weight:400;color:var(--muted);margin:4px 0 0 14px}.upload-body{padding:0 16px 16px}.upload-body p{font-size:11px}.upload-picker{display:block;padding:12px;border:1px dashed var(--border-strong);border-radius:5px;background:var(--paper);font-size:12px}.upload-picker input{display:block;margin-top:9px;max-width:100%;font-size:11px}.upload-form>small{font-size:10px;color:var(--muted);display:block;margin:8px 0;line-height:1.6}.upload-fields{display:grid;gap:12px;margin:15px 0}.upload-fields label,.upload-preview label{font-size:11px;display:block}.upload-fields label span{color:var(--muted)}.upload-fields input,.upload-preview input,.upload-preview select{display:block;width:100%;padding:10px;border:1px solid var(--border);background:var(--paper);border-radius:4px;color:var(--ink);margin-top:5px;font-size:12px}.upload-preview{display:grid;grid-template-columns:100px 1fr;gap:10px;margin:14px 0;padding:12px 0;border-block:1px solid var(--border)}.upload-preview img{width:100px;height:100px;object-fit:cover;background:var(--surface);grid-row:span 2}.upload-preview select{padding:7px}.upload-status{color:var(--accent)!important;line-height:1.7;overflow-wrap:anywhere}.upload-submit:disabled{opacity:.55;cursor:wait}.upload-managed{display:flex;gap:12px;align-items:center;border-top:1px solid var(--border);padding:12px 0;font-size:11px}.upload-managed img{width:60px;height:50px;object-fit:cover;border-radius:3px}.upload-managed>span{flex:1;overflow-wrap:anywhere}.upload-managed small{display:block;font-size:9px;color:var(--muted);margin-top:4px}.upload-managed button{font-size:11px;text-decoration:underline;color:var(--accent);padding:8px}.image-credit,.image-uploaded{display:block;font-size:9px;color:var(--muted);margin-top:5px}.image-uploaded{font-style:italic}.upload-section input:focus-visible,.upload-section select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media(max-width:620px){.upload-body{padding:0 12px 12px}.upload-preview{grid-template-columns:72px 1fr}.upload-preview img{width:72px;height:80px}.upload-fields input,.upload-preview input,.upload-preview select{font-size:16px}.upload-managed{gap:8px}}

/* Gallery frames follow the image’s natural proportions: no cropping or empty bands. */
.gallery-image { display:block; width:100%; padding:0; border:0; cursor:zoom-in; }
.gallery-image:focus-visible { outline:3px solid var(--accent); outline-offset:-3px; }
.photo-strip.is-dragging .gallery-image { cursor:grabbing; }
/* Keep navigation at the image edges, clear of the enlargement link. */
.gallery-stage { position:relative; min-width:0; }
.project-gallery .gallery-stage .gallery-controls { position:absolute; z-index:2; top:50%; left:0; width:100%; display:flex; justify-content:space-between; transform:translateY(-50%); padding-inline:12px; pointer-events:none; }
.project-gallery .gallery-stage .gallery-controls button { display:grid; place-items:center; flex:none; width:48px; height:48px; min-width:44px; min-height:44px; padding:0; border:1px solid #ffffff45; border-radius:50%; background:rgb(16 18 22 / 72%); color:#fff; font-size:26px; line-height:1; pointer-events:auto; box-shadow:0 2px 8px #0003; }
.project-gallery .gallery-stage .gallery-controls button:hover:enabled { background:rgb(16 18 22 / 92%); }
.project-gallery .gallery-stage .gallery-controls button:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.project-gallery .gallery-stage .gallery-controls button:disabled { opacity:.3; }
.project-gallery.gallery-single .gallery-stage .gallery-controls { display:none; }
@media(max-width:620px) { .project-gallery .gallery-stage .gallery-controls { padding-inline:8px; } .project-gallery .gallery-stage .gallery-controls button { width:44px; height:44px; } }
.image-meta { display:flex; flex-wrap:wrap; gap:4px 7px; margin-bottom:6px; font-size:9px; font-weight:600; color:var(--muted); }
.image-meta span + span::before { content:'·'; padding-right:7px; color:var(--muted); }
.gallery-compact .image-meta { font-size:8px; gap:3px 5px; }
.image-license { display:block; margin-top:5px; font-size:9px; color:var(--muted); }
.gallery-photo .image-license a { display:inline; }

/* The first click fills the page; the image itself links to the bare original. */
#image-preview { position:fixed; inset:0; width:100%; height:100vh; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0; border-radius:0; overflow:hidden; background:#101216; color:#fff; }
#image-preview::backdrop { background:#101216; }
.image-preview-canvas { position:absolute; inset:12px; display:grid; place-items:center; }
.image-preview-figure { position:relative; margin:0; max-width:100%; max-height:100%; }
.image-preview-original { display:block; width:100%; height:100%; cursor:zoom-in; }
.image-preview-original img { display:block; width:100%; height:100%; object-fit:contain; }
.image-preview-original img[hidden] { display:none; }
.image-preview-original:focus-visible { outline:3px solid #8eb6ff; outline-offset:3px; }
.image-preview-caption { position:absolute; inset:auto 0 0; max-height:35%; overflow:auto; overscroll-behavior:contain; padding:14px 18px; background:rgb(10 14 20 / 68%); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); color:#fff; font-size:15px; line-height:1.5; overflow-wrap:anywhere; text-shadow:0 1px 2px #0006; }
@media(max-width:620px) { .image-preview-caption { padding:10px 12px; font-size:13px; } }
.image-preview-close { position:absolute; top:max(12px,env(safe-area-inset-top)); right:max(12px,env(safe-area-inset-right)); display:grid; place-items:center; width:44px; height:44px; border:1px solid #ffffff50; border-radius:50%; background:#101216d9; color:#fff; font-size:28px; line-height:1; }
.image-preview-close:hover { background:#303640; }
.image-preview-error { padding:24px; text-align:center; }
