.portrait-gallery{width:100%;min-width:0;margin-bottom:18px}.portrait-stage{position:relative;overflow:hidden;border-radius:9px;background:#eaf0f8;touch-action:pan-y}.portrait-enlarge{display:block;width:100%;padding:0;background:transparent;cursor:zoom-in}.portrait-enlarge>img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;filter:none}.portrait-zoom-hint{position:absolute;bottom:12px;left:12px;border-radius:5px;padding:5px 8px;background:#14263cbd;color:white;font-size:11px;opacity:0;transition:opacity .15s}.portrait-arrow{position:absolute;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:38px;height:38px;min-height:38px;padding:0;border:1px solid #ffffffb0;border-radius:50%;background:#ffffffed;color:#253f60;box-shadow:0 2px 9px #14263c24;opacity:0;transition:opacity .15s;cursor:pointer}.portrait-arrow svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.portrait-previous{left:10px}.portrait-next{right:10px}.portrait-stage:hover .portrait-arrow,.portrait-stage:focus-within .portrait-arrow,.portrait-stage:hover .portrait-zoom-hint,.portrait-stage:focus-within .portrait-zoom-hint{opacity:1}.portrait-counter{position:absolute;bottom:12px;right:12px;padding:5px 9px;border-radius:5px;background:#14263cbd;color:#fff;font-size:11px;font-variant-numeric:tabular-nums;pointer-events:none}.portrait-thumbnails{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}.portrait-thumbnails button{padding:3px;border:2px solid transparent;border-radius:7px;background:transparent;min-width:0}.portrait-thumbnails button[aria-pressed=true]{border-color:#3266a9;background:#eaf2fd}.portrait-thumbnails img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:4px}.portrait-gallery button:focus-visible,#portrait-lightbox button:focus-visible{outline:3px solid #83b8f9;outline-offset:3px}
#portrait-lightbox{position:fixed;inset:0;box-sizing:border-box;width:min(900px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid #dbe6f2;border-radius:12px;background:#0f1e30;color:white;overflow:hidden;z-index:100}#portrait-lightbox::backdrop{background:#0c1825cf}.portrait-lightbox-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px}.portrait-lightbox-header h2{margin:0;font-size:16px;color:#fff}.portrait-close{display:grid;place-items:center;width:38px;height:38px;padding:0;border-radius:7px;color:white;background:#ffffff15;font-size:25px}.portrait-lightbox-stage{position:relative;touch-action:pan-y}.portrait-lightbox-image{display:block;width:100%;height:min(76dvh,850px);object-fit:contain}.portrait-lightbox-stage .portrait-arrow{opacity:1}.portrait-lightbox-stage .portrait-counter{bottom:14px}@media(hover:none),(pointer:coarse){.portrait-stage .portrait-arrow{opacity:1}.portrait-zoom-hint{opacity:1}}@media(max-width:580px){.portrait-gallery{max-width:400px;margin-inline:auto}.portrait-enlarge>img{max-height:none;width:100%}#portrait-lightbox{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.portrait-lightbox-image{height:75dvh}.portrait-arrow{width:40px;height:40px}.portrait-thumbnails{gap:7px}}@media(prefers-reduced-motion:reduce){.portrait-arrow,.portrait-zoom-hint{transition:none}}

@media(max-width:580px){.profile-layout>aside.gallery-profile-aside{display:block;grid-template-columns:none}.gallery-profile-aside .portrait-gallery{width:100%;max-width:400px}.gallery-profile-aside .portrait-stage .portrait-arrow{opacity:1}.gallery-profile-aside .portrait-zoom-hint{opacity:1}}

/* Compact controls on profile portraits; touch targets remain generous. */
.portrait-stage .portrait-arrow{width:32px;height:32px;min-width:32px;min-height:32px;border:0;background:transparent;box-shadow:none;color:#314b68}.portrait-stage .portrait-arrow::before{content:"";position:absolute;width:28px;height:28px;border-radius:50%;background:#ffffffe0;box-shadow:0 1px 4px #14263c18;transition:background .15s}.portrait-stage .portrait-arrow:hover::before{}.portrait-stage .portrait-arrow svg{position:relative;width:14px;height:14px;stroke-width:1.65}.portrait-stage .portrait-previous{left:6px}.portrait-stage .portrait-next{right:6px}@media(max-width:580px),(pointer:coarse){.portrait-stage .portrait-arrow{width:44px;height:44px;min-width:44px;min-height:44px}.portrait-stage .portrait-previous{left:0}.portrait-stage .portrait-next{right:0}}@media(prefers-reduced-motion:reduce){.portrait-stage .portrait-arrow::before{transition:none}}

.portrait-gallery[data-portrait-count="1"] .portrait-thumbnails,.portrait-gallery[data-portrait-count="1"] .portrait-counter{display:none}
