:root{--bronze:#644a16;--inverse:#f5f2e8}
a,button{touch-action:manipulation;-webkit-tap-highlight-color:#644a1626}
:focus-visible{outline:2px solid var(--bronze);outline-offset:5px}
[id]{scroll-margin-top:85px}
.detail-page h2[id]{scroll-margin-top:140px}
.image-viewer [hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.detail-page{--paper:#fff;--ink:#211f1a;--muted:#575247;--violet:#644a16;--line:#ded9cd}
.detail-page .site-header{border-bottom:1px solid var(--line)}
.detail-page .wordmark{color:var(--bronze)}
.detail-page .site-header nav a,.detail-footer a{display:inline-flex;align-items:center;min-height:44px}
.detail-page .proj-pager{background:var(--bronze);color:var(--inverse)}
.detail-page .proj-pager :focus-visible{outline-color:var(--inverse)}
.detail-page .proj-body>h2{font:400 clamp(22px,2.4vw,36px)/1.5 var(--serif);margin:42px 0 22px}
.case-index{position:sticky;top:0;z-index:5;display:flex;align-items:center;flex-wrap:wrap;gap:4px 24px;padding:10px var(--gutter);background:#fffffff5;border-bottom:1px solid var(--line);font-size:12px}
.case-index>span{color:var(--muted);white-space:nowrap}.case-index a{min-height:38px;display:inline-flex;align-items:center;color:var(--ink)}
.case-index a[aria-current=location]{color:var(--bronze);text-decoration:underline;text-underline-offset:6px}
.detail-page main .image-zoom{display:block;position:relative;cursor:zoom-in;color:var(--inverse);background:none}
.image-zoom::after{content:'查看大图 ↗';position:absolute;right:12px;bottom:12px;padding:6px 10px;background:#211f1ad9;font:400 11px/20px var(--sans);opacity:0;transition:opacity .2s}
.image-zoom:is(:hover,:focus-visible)::after{opacity:1}
.image-zoom:focus-visible{outline-offset:4px}
.image-viewer{position:fixed;inset:0;width:min(1400px,96vw);height:94dvh;max-width:none;max-height:96dvh;margin:auto;padding:0;border:1px solid #ffffff30;background:#181915;color:#f5f2e8;overscroll-behavior:contain}
.image-viewer::backdrop{background:#10110ff2}
.viewer-layout{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.viewer-toolbar,.viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;flex-wrap:wrap}
.viewer-toolbar{border-bottom:1px solid #ffffff25}.viewer-footer{border-top:1px solid #ffffff25;font-size:13px}
.viewer-toolbar h2{font:400 16px/1.5 var(--sans);margin:0}.viewer-controls{display:flex;gap:12px}
.image-viewer button,.image-viewer a{border:1px solid #ffffff50;background:transparent;color:inherit;min-height:44px;padding:7px 14px;font:400 13px/1.5 var(--sans);cursor:pointer}
.image-viewer button:hover,.image-viewer a:hover{background:#ffffff16}
.image-viewer :focus-visible{outline-color:white}.viewer-image-area{min-height:0;position:relative;display:grid;place-items:center;overflow:auto;padding:12px}
.image-viewer .viewer-image{width:100%;height:100%;object-fit:contain;min-height:0;max-height:100%;margin:0}
.viewer-status{position:absolute;inset:auto 20px 20px;text-align:center;font-size:13px;background:#181915d9}
.viewer-caption{flex:1;margin:0!important;max-width:none!important;color:inherit!important;font-size:13px!important;line-height:1.6!important}
html:has(.image-viewer[open]){overflow:hidden}
.figma-home .project-link{min-height:44px;display:inline-flex;align-items:center}
.figma-home .motion-toggle{min-height:44px;min-width:76px}
.figma-home .site-header nav a{min-height:44px;display:inline-flex;align-items:center}
.contact-details .contact-actions{display:flex;gap:12px;align-items:center;margin-top:8px;flex-wrap:wrap}
.copy-contact{color:inherit;border:1px solid #ffffff66;background:transparent;padding:6px 12px;min-height:44px;font-size:12px;cursor:pointer}
.copy-contact:hover{background:#ffffff18}.contact-footer :focus-visible{outline-color:white}
.contact-feedback{font-size:12px;line-height:20px;min-height:20px;margin-top:6px;position:relative;z-index:1}
.contact-details{position:relative;z-index:1}.footer-word{pointer-events:none}
.figma-home .contact-footer{min-height:520px}
.home-related{display:flex;gap:20px;flex-wrap:wrap;margin-top:14px;color:var(--muted);font-size:12px}.home-related a{min-height:36px;display:inline-flex;align-items:center;text-decoration:underline;text-underline-offset:5px}
@media(hover:none){.image-zoom::after{opacity:1}}
@media(max-width:760px){.case-index{position:relative;gap:4px 18px;padding-top:16px;padding-bottom:16px}.case-index>span{width:100%}.image-viewer{width:100vw;height:100dvh;max-height:100dvh;border:0}.viewer-toolbar,.viewer-footer{padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left))}.viewer-footer{padding-bottom:max(16px,env(safe-area-inset-bottom))}.viewer-toolbar{padding-top:max(12px,env(safe-area-inset-top))}.viewer-controls{gap:8px}.image-viewer button,.image-viewer a{padding:7px 10px}.contact-footer{min-height:460px}.image-zoom::after{font-size:10px;padding:3px 7px}.figma-home .human-visual .project-link{max-width:60%}.detail-page .site-header{gap:12px}.detail-page .site-header nav{flex-wrap:wrap;gap:6px 18px}}
@media(prefers-reduced-motion:reduce){.image-zoom::after{transition:none}}
@media(max-width:760px){.figma-home .contact-footer{min-height:460px}}
