:root{font-family:Segoe UI,Arial,sans-serif;color:#eef2eb;background:#141b18;color-scheme:dark}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button,select,a.primary{font:inherit;border:1px solid #526057;border-radius:8px;padding:10px 14px;background:#222e27;color:inherit;cursor:pointer}button:hover{background:#34483b}button:disabled{opacity:.45;cursor:default}button[aria-pressed=true]{background:#c8d9bb;color:#17251b}button:focus-visible,a:focus-visible,select:focus-visible,#viewport:focus-visible{outline:3px solid #c7d4a4;outline-offset:3px}[hidden]{display:none!important}header{display:flex;align-items:center;gap:24px;padding:16px 32px;border-bottom:1px solid #354139}header>a:first-child{white-space:nowrap;font-size:14px}.project-label{display:flex;align-items:center;gap:12px;font-size:13px;color:#b4c2b7;flex:1}select{width:min(420px,100%);text-overflow:ellipsis}a.primary{background:#c8d9bb;color:#17251b;font-weight:600}main{max-width:1920px;margin:auto;padding:22px 32px}.heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}.eyebrow{text-transform:uppercase;letter-spacing:.15em;color:#aabfa9;font-size:11px;margin:0 0 6px}h1{font-size:clamp(20px,2.1vw,30px);font-weight:500;margin:0}h2{font-size:16px;font-weight:500;margin:0}.tools{display:flex;align-items:center;gap:10px;font-size:13px}.tools>a{padding:10px}.stage{height:clamp(320px,62vh,950px);position:relative;background:#0c110e;border:1px solid #354139;border-radius:12px;overflow:hidden}#viewport{height:100%;width:100%;overflow:auto;display:flex;align-items:center;justify-content:center}#render{width:100%;height:100%;object-fit:contain}#viewport.zoomed{display:block}#viewport.zoomed #render{max-width:none;width:auto;height:auto;object-fit:initial}.step{position:absolute;top:50%;transform:translateY(-50%);border-radius:50%;font-size:30px;line-height:1;width:44px;height:44px;padding:0;background:#17211dda;box-shadow:0 3px 14px #0005}.prev{left:14px}.next{right:14px}#status{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);max-width:70%;text-align:center;color:#d7e2d7}#retry{position:absolute;left:50%;top:62%;transform:translateX(-50%)}.caption{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin:16px 0}#counter{color:#aabaaa;font-size:12px;white-space:nowrap}#thumbnails{display:flex;gap:12px;overflow-x:auto;padding:3px 3px 14px;scrollbar-color:#637560 #17211b}#thumbnails button{flex:0 0 150px;padding:0;overflow:hidden;text-align:left;background:transparent;border:2px solid transparent}#thumbnails button[aria-current=true]{border-color:#d4dfbd;background:#26362b}#thumbnails img{width:100%;height:84px;object-fit:cover;display:block}#thumbnails span{display:block;font-size:12px;line-height:1.35;padding:8px;color:#d6e0d6}footer{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 22px;color:#a9b6ac;font-size:12px;margin-top:5px}footer p{max-width:780px;margin:0}footer span{margin-left:auto}:fullscreen.stage{height:100vh;width:100vw;border:0;border-radius:0}@media(max-width:700px){header{padding:12px;gap:12px;flex-wrap:wrap}.project-label{order:3;flex-basis:100%;font-size:12px}select{flex:1;width:100%;max-width:none}header .primary{margin-left:auto;font-size:12px}main{padding:18px 12px}.heading{align-items:flex-start;flex-direction:column;gap:14px}.tools{width:100%;flex-wrap:wrap}.tools button,.tools a{padding:9px;font-size:12px}.stage{height:52vh;min-height:270px}.caption{gap:8px;align-items:flex-start}.caption h2{font-size:14px}#counter{white-space:normal;text-align:right}#thumbnails button{flex-basis:125px}#thumbnails img{height:72px}footer span{margin-left:0}}
