.ui-gallery{max-width:1200px;margin:0 auto;padding:clamp(4.5rem,8vw,8rem) clamp(1.1rem,4vw,3.5rem) 5rem}
.ui-gallery__eyebrow,.ui-meta,.ui-project__category,.ui-project__index{font:.64rem/1.5 'IBM Plex Mono',monospace;letter-spacing:.12em;text-transform:uppercase}
.ui-gallery__eyebrow{color:#7faaff;margin:0 0 1.2rem}
.ui-gallery h1{color:#f2f5fa;font:500 clamp(2.6rem,7vw,6rem)/.98 'Space Grotesk',sans-serif;letter-spacing:-.075em;margin:0;max-width:12ch}
.ui-gallery__intro{max-width:67ch;color:#9eabc1;font:400 1rem/1.8 'DM Sans',sans-serif;margin:1.35rem 0 2rem}
.ui-gallery__filters{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.25rem;padding:0;list-style:none}
.ui-gallery__filters button{background:#0e1724;border:1px solid #27374d;color:#9eabc1;border-radius:999px;padding:.5rem .85rem;font:.65rem/1.3 'IBM Plex Mono',monospace;cursor:pointer}
.ui-gallery__filters button[aria-pressed="true"],.ui-gallery__filters button:hover{background:#142544;border-color:#577fca;color:#eaf1ff}
.ui-gallery__status{min-height:1.4rem;color:#8192aa;font:.65rem/1.5 'IBM Plex Mono',monospace;letter-spacing:.07em;margin:0 0 1rem}
.ui-gallery__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;align-items:start}
.ui-project{min-width:0;border:1px solid #26354a;background:#0d1521;padding:clamp(.8rem,1.7vw,1.2rem);display:flex;flex-direction:column}
.ui-project[hidden]{display:none}
.ui-project__head{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:.65rem}
.ui-project__category{color:#83aaff;border:1px solid #2e4770;padding:.32rem .45rem;font-size:.56rem;line-height:1.4}
.ui-project__index{color:#7286a4}
.ui-project h2{color:#f1f4f9;font:500 clamp(1.3rem,2.2vw,1.8rem)/1.1 'Space Grotesk',sans-serif;letter-spacing:-.04em;margin:0 0 .45rem}
.ui-project__type{color:#8292aa;font:.62rem/1.5 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.08em;margin:0 0 .7rem}
.ui-project__summary{color:#a4b0c3;font:.86rem/1.7 'DM Sans',sans-serif;margin:0 0 1rem;max-width:70ch}
.ui-project__media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin:0 0 1rem}
.ui-project__media-item{position:relative;margin:0;min-width:0;aspect-ratio:1.2;background:#080d15;border:1px solid #202d40;overflow:hidden}
.ui-project__media-item:first-child:last-child{grid-column:1/-1;aspect-ratio:1.5}
.ui-project__media-item button{display:flex;width:100%;height:100%;align-items:center;justify-content:center;background:transparent;border:0;padding:0;cursor:zoom-in}
.ui-project__media-item img{display:block;width:100%;height:100%;object-fit:contain}
.ui-project__media-item button:focus-visible{outline:2px solid #83aaff;outline-offset:-3px}
.ui-project__media-item figcaption{position:absolute;left:.45rem;bottom:.4rem;padding:.25rem .35rem;color:#eef3fb;background:#08111ddd;font:.55rem/1.3 'IBM Plex Mono',monospace;pointer-events:none}
.ui-image-fallback{display:none;place-items:center;width:100%;height:100%;padding:1rem;color:#8e9fb9;font:.72rem/1.5 'IBM Plex Mono',monospace;text-align:center}
.ui-image-fallback.is-visible{display:grid}
.ui-project__details{border-top:1px solid #26354a;margin-top:.3rem;padding-top:.65rem}
.ui-project__details summary{color:#c7d4e8;cursor:pointer;font:.66rem/1.5 'IBM Plex Mono',monospace;letter-spacing:.08em;text-transform:uppercase}
.ui-project__details summary:focus-visible{outline:2px solid #83aaff;outline-offset:3px}
.ui-project__details p{color:#93a2b8;font:.78rem/1.65 'DM Sans',sans-serif;margin:.75rem 0 0}
.ui-project__facts{display:grid;grid-template-columns:minmax(82px,.3fr) 1fr;gap:.45rem .75rem;margin:.85rem 0 0;padding-top:.8rem;border-top:1px solid #202d3e}
.ui-project__facts dt{color:#7f92b0;font:.58rem/1.6 'IBM Plex Mono',monospace;letter-spacing:.08em;text-transform:uppercase}
.ui-project__facts dd{margin:0;color:#b8c4d8;font:.77rem/1.55 'DM Sans',sans-serif}
.ui-project__link{color:#a9c7ff;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.ui-project__note{color:#7e8da2;font:.65rem/1.6 'DM Sans',sans-serif;margin:.8rem 0 0}
.ui-gallery__empty{border:1px dashed #364962;padding:1.5rem;color:#b7c4d7;font:.85rem/1.7 'DM Sans',sans-serif}
.ui-gallery__empty[hidden]{display:none}
.ui-gallery__footer{margin-top:3.5rem;border-top:1px solid #1c2a3c;padding-top:1.2rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:#8292aa;font:.64rem/1.55 'IBM Plex Mono',monospace;letter-spacing:.08em;text-transform:uppercase}
.ui-gallery__footer a{color:#a9c7ff;text-decoration:none}
.ui-gallery__footer a:hover{text-decoration:underline;text-underline-offset:3px}
.ui-lightbox{width:min(96vw,1250px);max-width:none;max-height:94dvh;padding:0;border:1px solid #425674;background:#080d15;color:#f4f6fb}
.ui-lightbox::backdrop{background:rgba(2,5,10,.88)}
.ui-lightbox__inner{position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto;max-height:94dvh;padding:.65rem}
.ui-lightbox__image-wrap{min-height:0;display:grid;place-items:center;overflow:auto}
.ui-lightbox img{display:block;max-width:100%;max-height:calc(94dvh - 5rem);object-fit:contain}
.ui-lightbox figcaption{color:#b7c4d8;padding:.7rem 3rem .25rem .25rem;font:.68rem/1.5 'IBM Plex Mono',monospace}
.ui-lightbox__close{position:absolute;top:.85rem;right:.85rem;z-index:1;width:42px;height:42px;border:1px solid #647894;border-radius:50%;background:#0e1724;color:#fff;font:1.35rem/1 sans-serif;cursor:pointer}
.ui-lightbox__close:focus-visible{outline:2px solid #95baff;outline-offset:3px}
@media(max-width:760px){.ui-gallery__grid{grid-template-columns:1fr}.ui-project__media-item{aspect-ratio:1.35}.ui-gallery__footer{flex-direction:column}}
@media(max-width:420px){.ui-gallery{padding-left:1rem;padding-right:1rem}.ui-project__facts{grid-template-columns:1fr;gap:.1rem}.ui-project__facts dd{margin-bottom:.45rem}.ui-project__media{gap:.35rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.ui-lightbox{max-height:94vh;max-height:94dvh}
.ui-lightbox[open]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;z-index:1000}
.ui-lightbox:not([open]){display:none}
.ui-lightbox__inner{max-height:94vh;max-height:94dvh}
.ui-lightbox img{max-height:calc(94vh - 5rem);max-height:calc(94dvh - 5rem)}