:root{--gallery-line:#ffffff16;--gallery-surface:linear-gradient(145deg,#191a25f2,#14151df5);--gallery-glow:#a17cff}
*{box-sizing:border-box}
html{min-width:320px;scroll-behavior:smooth}
body{min-height:100vh;margin:0;color:#f4f0ff;font-family:Inter,'Segoe UI',Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible{outline:3px solid #d3ff4e;outline-offset:3px}
.page-shell{padding-bottom:28px}
.gallery-panel{overflow:hidden;padding:22px;border:1px solid var(--gallery-line);border-radius:17px;background:var(--gallery-surface);box-shadow:0 20px 58px #0005,0 1px 0 #ffffff08 inset;backdrop-filter:blur(16px)}
.gallery-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px;padding:0 2px 16px;border-bottom:1px solid #ffffff12}
.section-kicker{color:#d3ff4e;font-size:8px;font-weight:850;letter-spacing:1.25px}
.gallery-heading h2{margin:6px 0 0;color:#f1edfa;font-size:19px;font-weight:750;letter-spacing:-.4px}
.photo-count{display:flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid #a17cff32;border-radius:99px;background:#a17cff12;color:#c9b8ec;font-size:8px;font-weight:800;letter-spacing:.7px;white-space:nowrap}
.photo-count i{width:6px;height:6px;border-radius:50%;background:#d3ff4e;box-shadow:0 0 0 4px #d3ff4e17}
.photo-count b{color:#f5f0ff;font-size:10px}
.gallery-grid{columns:4 190px;column-gap:13px}
.gallery-item{position:relative;display:block;width:100%;margin:0 0 13px;padding:0;overflow:hidden;break-inside:avoid;border:1px solid #ffffff16;border-radius:11px;background:#11121a;cursor:zoom-in;text-align:left;box-shadow:0 8px 22px #0003;isolation:isolate}
.gallery-item img{display:block;width:100%;height:auto;min-height:100px;object-fit:cover;transition:transform .45s cubic-bezier(.2,.7,.2,1),filter .35s}
.gallery-item:after{position:absolute;inset:35% 0 0;z-index:0;background:linear-gradient(180deg,transparent,#080910a8);content:'';opacity:.65;transition:opacity .25s}
.gallery-item:hover img{transform:scale(1.045);filter:saturate(1.08)}
.gallery-item:hover:after{opacity:1}
.image-index,.image-open{position:absolute;z-index:1;bottom:10px;display:grid;place-items:center;height:26px;border:1px solid #ffffff30;border-radius:7px;background:#101119b8;color:#fff;font-size:8px;backdrop-filter:blur(8px);opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s}
.image-index{left:10px;min-width:29px;padding:0 6px;font-weight:750;letter-spacing:.6px}
.image-open{right:10px;width:26px;font-size:14px}
.gallery-item:hover .image-index,.gallery-item:hover .image-open,.gallery-item:focus-visible .image-index,.gallery-item:focus-visible .image-open{opacity:1;transform:translateY(0)}
.gallery-end{display:flex;align-items:center;justify-content:center;gap:10px;margin:7px 0 0;color:#777386}
.gallery-end span{width:36px;height:1px;background:linear-gradient(90deg,transparent,#ffffff2b)}.gallery-end span:last-child{transform:rotate(180deg)}
.gallery-end p{margin:0;font-size:7px;font-weight:800;letter-spacing:1.35px}
.page-footer{margin-top:18px}
.lightbox{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:24px;visibility:hidden;opacity:0;transition:opacity .22s,visibility .22s}
.lightbox.show{visibility:visible;opacity:1}
.lightbox-backdrop{position:absolute;inset:0;background:#080910d9;backdrop-filter:blur(12px)}
.lightbox-dialog{position:relative;z-index:1;width:min(920px,100%);max-height:calc(100vh - 48px);padding:16px;border:1px solid #ffffff20;border-radius:17px;background:linear-gradient(145deg,#191a25f7,#11121af7);box-shadow:0 28px 90px #000b;transform:translateY(10px) scale(.985);transition:transform .22s}
.lightbox.show .lightbox-dialog{transform:translateY(0) scale(1)}
.lightbox-header,.lightbox-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}
.lightbox-header{padding:0 0 13px;border-bottom:1px solid #ffffff12}
.lightbox-title{display:flex;align-items:center;gap:10px}.lightbox-mark{display:grid;width:34px;height:34px;place-items:center;border:1px solid #d3ff4e28;border-radius:10px;background:#d3ff4e12;color:#d3ff4e;font-size:15px}
.lightbox-title div{display:grid;gap:3px}.lightbox-title strong{color:#eee9f6;font-size:9px;letter-spacing:1px}.lightbox-title span:last-child{color:#a49cb2;font-size:9px;font-variant-numeric:tabular-nums}
.lightbox-close,.lightbox-nav{display:grid;place-items:center;border:1px solid #ffffff1d;background:#ffffff09;color:#e9e3f2;cursor:pointer;transition:all .18s}
.lightbox-close{width:34px;height:34px;border-radius:9px}.lightbox-close:hover,.lightbox-nav:hover{border-color:#a17cff80;background:#a17cff20;color:#fff}
.lightbox-close svg,.lightbox-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lightbox-stage{position:relative;display:grid;place-items:center;min-height:220px;height:min(68vh,650px);margin:14px 0;overflow:auto;border:1px solid #ffffff15;border-radius:11px;background:radial-gradient(ellipse at 50% 45%,#a17cff15,transparent 60%),#0d0e15}
.lightbox-image{display:block;width:auto;height:auto;max-width:calc(100% - 84px);max-height:min(68vh,650px);object-fit:scale-down;object-position:center}
.lightbox-nav{position:absolute;top:50%;z-index:2;width:40px;height:40px;border-radius:12px;background:#11121acc;transform:translateY(-50%);backdrop-filter:blur(8px)}
.lightbox-nav.previous{left:12px}.lightbox-nav.next{right:12px}
.lightbox-footer{padding:1px 2px 0;color:#8d879a;font-size:8px;font-weight:750;letter-spacing:.65px}.lightbox-footer i{color:#ff55b8;font-style:normal}
@media(max-width:760px){.gallery-grid{columns:3 160px}}
@media(max-width:520px){.topbar,.page-shell{width:calc(100% - 30px)}.topbar{height:61px}.page-shell{padding-top:30px}.gallery-panel{padding:15px;border-radius:14px}.gallery-heading{margin-bottom:14px;padding-bottom:12px}.gallery-heading h2{font-size:17px}.gallery-grid{columns:2 130px;column-gap:9px}.gallery-item{margin-bottom:9px;border-radius:9px}.lightbox{padding:12px}.lightbox-dialog{max-height:calc(100vh - 24px);padding:11px;border-radius:13px}.lightbox-stage{height:min(68vh,560px);min-height:180px;margin:11px 0}.lightbox-image{max-width:calc(100% - 66px);max-height:min(62vh,560px)}.lightbox-nav{width:35px;height:35px;border-radius:10px}.lightbox-nav.previous{left:8px}.lightbox-nav.next{right:8px}.lightbox-footer{font-size:7px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition:none!important}}
