/* Artwork floats above the page, with a quiet caption underneath. */
#viewer{position:fixed;inset:0;width:100%;height:100%;height:100svh;max-width:none;max-height:none;margin:0;padding:52px 56px 28px;border:0;background:transparent;box-shadow:none;color:#ecf2f6;overflow:auto}
#viewer[open]{display:flex;align-items:center;justify-content:center;animation:viewer-in .24s ease-out}
#viewer::backdrop{background:#102330df;backdrop-filter:blur(9px);animation:backdrop-in .25s ease-out}
#viewer.is-closing::backdrop{animation:backdrop-out .17s ease-out forwards}
.viewer-figure{margin:auto;max-width:100%;display:flex;align-items:center;flex-direction:column;gap:15px;pointer-events:none}
.viewer-stage{display:grid;place-items:center;min-width:100px;min-height:100px;position:relative;pointer-events:auto}
#viewer-image{display:block;width:auto;height:auto;max-width:calc(100vw - 112px);max-height:calc(100vh - 195px);max-height:calc(100svh - 195px);object-fit:contain;transform-origin:center;user-select:none}
.viewer-caption{width:100%;max-width:660px;text-align:center;line-height:1.7;pointer-events:auto;overflow-wrap:anywhere}
#viewer-title{display:block;font:400 12px/1.7 var(--sans);letter-spacing:.025em;color:#edf3f7}
#viewer-description{font:400 11px/1.8 var(--sans);white-space:pre-wrap;margin:6px 0 0;color:#c3d3de;max-height:15svh;overflow:auto}
#viewer-category{display:block;font:400 9px/1.6 var(--sans);letter-spacing:.08em;color:#9eb3c3;margin-top:5px}
#viewer-category:empty{display:none}
#viewer-loading{position:absolute;inset:0;display:grid;place-content:center;color:#c0d1dd;font:12px/1.7 var(--sans)}
#viewer-loading[hidden]{display:none}
#viewer-close,#viewer-prev,#viewer-next{position:fixed;display:grid;place-items:center;border:1px solid #dbe7f033;background:#dbe7f008;color:#edf3f7;width:40px;height:40px;border-radius:50%;font:300 21px/1 var(--sans);padding:0;cursor:pointer;transition:background .2s,border-color .2s;z-index:2}
#viewer-close{top:20px;right:22px;font-size:26px}#viewer-prev{left:15px;top:calc(50% - 20px)}#viewer-next{right:15px;top:calc(50% - 20px)}
#viewer-prev[hidden],#viewer-next[hidden]{display:none}
#viewer button:hover{background:#dbe7f025;border-color:#dbe7f080}#viewer button:focus-visible{outline:2px solid #c3e0f3;outline-offset:4px}
.category-grid .art-image img,.compact-home .thumb img{transition:transform .4s cubic-bezier(.2,.75,.25,1),filter .3s}
.category-grid .gallery-card:hover img{transform:scale(1.035)}
#page-content{view-transition-name:portfolio-page}
::view-transition-old(root),::view-transition-new(root){animation:none}
::view-transition-old(portfolio-page){animation:page-out .16s ease-in both}
::view-transition-new(portfolio-page){animation:page-in .32s cubic-bezier(.2,.7,.3,1) both}
::view-transition-group(portfolio-page){animation-duration:.32s}
@keyframes page-out{to{opacity:0;transform:translateY(-5px)}}
@keyframes page-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes viewer-in{from{opacity:0}to{opacity:1}}
@keyframes backdrop-in{from{background:#10233000;backdrop-filter:blur(0)}to{background:#102330df;backdrop-filter:blur(9px)}}
@keyframes backdrop-out{to{background:#10233000;backdrop-filter:blur(0)}}
@media(max-width:600px){#viewer{padding:64px 20px 30px}#viewer-image{max-width:calc(100vw - 40px);max-height:calc(100svh - 240px)}.viewer-figure{gap:13px}#viewer-prev,#viewer-next{top:auto;bottom:20px;width:36px;height:36px}#viewer-prev{left:calc(50% - 47px)}#viewer-next{right:calc(50% - 47px)}.viewer-caption{padding:0 4px 36px}#viewer-close{right:17px;top:16px;width:36px;height:36px}#viewer-description{max-height:14svh}}
@media(prefers-reduced-motion:reduce){#viewer[open],#viewer::backdrop,#viewer.is-closing::backdrop,::view-transition-old(portfolio-page),::view-transition-new(portfolio-page){animation:none}.category-grid .art-image img,.compact-home .thumb img{transition:none}}