:root{--page-gutter:5vw;--header-height:112px}body{scrollbar-gutter:stable}#site-header{position:relative;inset:auto;height:var(--header-height);padding:20px var(--page-gutter);margin:0;width:100%;display:flex;align-items:center;justify-content:space-between;gap:25px;z-index:5;box-sizing:border-box;border:0}body:has(#reset):not(:has(#lightbox)) #site-header{position:fixed;top:0;left:0;right:0}.xxi-logo{display:block;width:120px;flex:0 0 120px;height:55px;color:#f5f2f8}.xxi-logo svg{width:100%;height:100%;overflow:visible}.xxi-logo text{font:900 53px Arial;letter-spacing:-6px;fill:currentColor}.xxi-logo .xxi-electric{fill:none;stroke:#b8f65c;stroke-width:.85;stroke-dasharray:5 11;opacity:0;filter:drop-shadow(0 0 2px #b8f65c)}.electric-active .xxi-electric{animation:xxi-current .7s steps(4) both}#site-header nav{margin:0;display:flex;gap:32px;align-items:center;font:11px Space Grotesk,Arial,sans-serif;letter-spacing:2px}#site-header nav a{position:relative;color:#a99bb6;text-decoration:none;padding:12px 0;transition:color .2s}#site-header nav a:hover,#site-header nav a[aria-current]{color:#b8f65c}#site-header nav a:after{content:"";position:absolute;bottom:3px;left:0;width:100%;height:1px;background:#b8f65c;transform:scaleX(0);transform-origin:left;transition:transform .2s}#site-header nav a:hover:after{transform:scaleX(1)}body:has(#lightbox)>main,body:not(:has(canvas)):not(:has(.shade))>main{margin:48px var(--page-gutter) 65px}.heading p{font-size:11px;line-height:1.6}.heading h1{font-size:clamp(60px,7vw,120px);line-height:.95;margin:22px 0 55px}body:has(.shade) main .eyebrow{font-size:12px;letter-spacing:2px;margin-bottom:22px}body:has(.shade) main .discipline{font-size:clamp(12px,1vw,16px);line-height:1.8;margin-top:28px;max-width:440px}body:has(.shade) main .explore{font-size:13px;margin-top:24px}.preview-button{position:relative}.preview-button:after{content:"查看细节 ↗";position:absolute;right:15px;bottom:15px;background:#100d18dd;color:#b8f65c;padding:12px 16px;font-size:12px;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s}.preview-button:hover:after,.preview-button:focus-visible:after{opacity:1;transform:none}.preview-button:hover #preview{transform:scale(.985)}.category small{font-size:12px}figcaption{font-size:11px}.viewer-bottom #prev,.viewer-bottom #next{position:fixed;top:50%;transform:translateY(-50%);width:44px;height:64px;background:#100d18a8;border:1px solid #ffffff25;z-index:4;color:#f5f2f8;font-size:24px}.viewer-bottom #prev{left:14px}.viewer-bottom #next{right:14px}.viewer-bottom #prev:hover,.viewer-bottom #next:hover{background:#292032e6;border-color:#b8f65c;color:#b8f65c}.viewer-bottom button:disabled{opacity:.25;cursor:default}.viewer-bottom button[hidden]{display:none!important}#viewport{left:72px;right:72px}.gallery-heading{align-items:baseline}.gallery-heading h2{font-size:clamp(32px,4vw,65px);line-height:1}@keyframes xxi-current{0%{opacity:0;stroke-dashoffset:60}15%,45%,70%{opacity:1}30%,60%{opacity:.15}to{opacity:0;stroke-dashoffset:-70}}@media(max-width:750px){:root{--header-height:94px;--page-gutter:6vw}.xxi-logo{width:110px;flex-basis:110px}#site-header nav{gap:18px;font-size:10px}#viewport{left:48px;right:48px}.viewer-bottom #prev,.viewer-bottom #next{width:32px;height:52px}.viewer-bottom #prev{left:6px}.viewer-bottom #next{right:6px}body:has(.shade) main .eyebrow{font-size:10px}body:has(.shade) main .discipline{font-size:12px}}@media(prefers-reduced-motion:reduce){.electric-active .xxi-electric{animation:none!important;opacity:0}}
