@font-face{font-family:Manrope;src:url('assets/fonts/manrope-title.ttf') format('truetype');font-weight:600;font-display:swap}
:root{color-scheme:light;font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;color:#273329;background:#f2efe6;--line:#29352a26;--muted:#7c7c6b}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:0}body{margin:0}a{color:inherit;text-decoration:none}button,video,a{-webkit-tap-highlight-color:transparent}a:focus-visible,video:focus-visible{outline:2px solid #847754;outline-offset:6px}h1,h2,p,figure{margin:0}img{max-width:100%}::selection{background:#c9b48d;color:#263128}
.detail-skip{position:fixed;top:-60px;left:20px;z-index:100;padding:12px;background:#273329;color:#f2efe6}.detail-skip:focus{top:15px}
.detail-header{position:fixed;inset:0 0 auto;z-index:20;padding:25px 6%;min-height:78px;display:flex;justify-content:space-between;align-items:center;gap:20px;background:#f2efe6df;backdrop-filter:blur(18px);border-bottom:1px solid #29352a0d}
.detail-brand{font-family:Manrope,Arial,sans-serif;font-size:13px;letter-spacing:.23em;font-weight:600}.detail-header nav{display:flex;gap:26px;font-size:11px}.detail-header nav a{padding:8px 0}.detail-header nav a:hover{color:#9b7048}
.project-masthead,.page-section,.detail-footer{width:88%;max-width:1320px;margin-left:auto;margin-right:auto}.project-masthead{padding-top:120px}.project-breadcrumb{display:flex;gap:14px;font-size:9px;letter-spacing:.08em;color:var(--muted)}
.project-title-line{display:flex;align-items:baseline;justify-content:space-between;gap:28px;padding:29px 0 32px}.project-title-line h1{font-family:"Songti SC",SimSun,serif;font-size:clamp(34px,4.4vw,65px);font-weight:400;line-height:1.25;letter-spacing:.045em}.project-title-line>p{font-size:9px;letter-spacing:.17em;text-align:right;color:var(--muted)}
.project-screen{background:#10140f;line-height:0;padding:0}.project-screen video{display:block;width:100%;height:auto;aspect-ratio:16/9;max-height:72svh;object-fit:contain;background:#10140f}.project-screen-caption,.project-cover figcaption{display:flex;justify-content:space-between;gap:15px;margin-top:14px;font-size:8px;letter-spacing:.12em;color:var(--muted);line-height:1.7}.project-cover>img{display:block;width:100%;max-height:72svh;object-fit:contain;background:#151a13}
.page-section{border-top:1px solid var(--line);margin-top:76px;padding-top:32px}.project-kicker{font-size:8px;letter-spacing:.2em;color:var(--muted);margin-bottom:18px}.page-section h2{font-family:"Songti SC",SimSun,serif;font-size:clamp(29px,3.2vw,45px);font-weight:400;letter-spacing:.06em;line-height:1.4}
.project-overview{display:grid;grid-template-columns:1fr 1.5fr;gap:10%}.project-summary>p{font-family:"Songti SC",SimSun,serif;font-size:clamp(20px,2vw,28px);line-height:1.9;letter-spacing:.035em;max-width:650px}.project-summary dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;margin:35px 0 0;border-top:1px solid var(--line);padding-top:20px}.project-summary dt{font-size:9px;color:var(--muted);margin-bottom:9px}.project-summary dd{margin:0;font-size:11px;line-height:1.8}
.project-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:25px;margin-bottom:30px}.project-section-heading>p{font-size:10px;color:var(--muted)}.project-section-heading>p span{margin-left:32px;font-size:8px}.asset-feature>a{position:relative;display:block;background:#181c15;overflow:hidden}.asset-feature img{display:block;width:100%;height:auto;aspect-ratio:1672/941;object-fit:contain;transition:filter .3s}.asset-feature a:hover img{filter:brightness(1.05)}.asset-open{position:absolute;right:18px;bottom:18px;background:#171d16c7;color:#eee9da;backdrop-filter:blur(8px);padding:13px 18px;font-size:10px;letter-spacing:.04em}.asset-feature figcaption{display:flex;justify-content:space-between;gap:18px;margin-top:15px;font-size:9px;letter-spacing:.1em;color:var(--muted)}
.detail-footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;margin-top:25px;padding:27px 0 32px;font-size:9px;letter-spacing:.08em;color:var(--muted)}
@media(max-width:700px){.detail-header{padding:18px 7%;min-height:70px;gap:14px}.detail-brand{font-size:10px;letter-spacing:.16em}.detail-header nav{font-size:9px;gap:16px}.project-masthead,.page-section,.detail-footer{width:86%}.project-masthead{padding-top:100px}.project-breadcrumb{font-size:8px}.project-title-line{display:block;padding:24px 0}.project-title-line h1{font-size:34px;letter-spacing:.02em}.project-title-line>p{font-size:7px;margin-top:15px;text-align:left}.project-screen video,.project-cover>img{max-height:65svh}.project-screen-caption{font-size:6px;letter-spacing:.05em}.page-section{margin-top:49px;padding-top:25px}.project-overview{grid-template-columns:1fr;gap:25px}.project-summary>p{font-size:20px}.project-summary dl{gap:15px;margin-top:25px}.project-summary dd{font-size:10px}.project-kicker{font-size:7px;margin-bottom:12px}.project-section-heading{gap:10px;align-items:flex-end}.project-section-heading>p{font-size:8px}.project-section-heading>p span{margin-left:13px}.asset-open{right:10px;bottom:10px;padding:9px 12px;font-size:8px}.asset-feature figcaption{font-size:7px;letter-spacing:.04em}.asset-feature figcaption span:last-child{max-width:45%;text-align:right}.detail-footer{flex-wrap:wrap;font-size:8px;gap:18px}.detail-footer>span{display:none}}
.project-sections{position:fixed;top:77px;left:0;z-index:19;display:flex;gap:35px;align-items:center;width:100%;background:#f2efe6e8;backdrop-filter:blur(15px);border-bottom:1px solid var(--line);padding:13px max(6%, calc((100% - 1320px)/2));font-size:10px;letter-spacing:.06em}
.project-sections a{position:relative;padding:4px 0;color:var(--muted)}.project-sections a.is-active{color:#403427}.project-sections a.is-active::after{content:"";position:absolute;bottom:-14px;left:0;right:0;height:2px;background:#a17f4c}
.project-masthead{padding-top:157px}.project-overview,.project-assets,.project-process,.project-cover{scroll-margin-top:145px}
.project-process{padding-bottom:65px}.process-layout{display:grid;grid-template-columns:1fr 2fr;gap:7%;margin-top:25px}.process-outline p{display:flex;gap:25px;align-items:baseline;padding:20px 0;border-top:1px solid var(--line);font-size:13px}.process-outline p>span{font-size:9px;color:var(--muted)}.process-placeholder{min-height:230px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed var(--line);gap:15px;background:#f2efe650;color:var(--muted);padding:25px;text-align:center}.process-placeholder-mark{font-size:29px;font-weight:400;opacity:.55}.process-placeholder p{font-size:14px;letter-spacing:.13em}.process-placeholder>span:last-child{font-size:10px;line-height:1.8}
@media(max-width:700px){.project-sections{top:69px;width:100%;gap:24px;font-size:9px;padding:12px 7%}.project-masthead{padding-top:140px}.project-overview,.project-assets,.project-process,.project-cover{scroll-margin-top:130px}.process-layout{grid-template-columns:1fr;gap:20px}.process-outline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.process-outline p{flex-direction:column;gap:8px;font-size:10px;padding:14px 0}.process-placeholder{min-height:190px}.project-process{padding-bottom:30px}}
/* This artwork belongs only to the Dunhuang project. */
.project-dunhuang{position:relative;isolation:isolate;background:#fbf4e5;color:#403427;--line:#80623833;--muted:#8b775a}
.project-dunhuang::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url('assets/dunhuang-paper-clouds.png') center center/cover no-repeat}
.project-dunhuang .detail-header{background:#fbf4e5c9;border-color:#8062381a}
.project-dunhuang .project-sections{background:#fbf4e5cc}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.asset-feature img{transition:none}}

.asset-stage{margin:0}.asset-stage>img{display:block;width:100%;height:auto;aspect-ratio:1672/941;object-fit:contain;background:#efe4cd}.asset-stage figcaption{display:flex;justify-content:space-between;gap:20px;padding:16px 0 20px;font-size:11px;letter-spacing:.07em;color:var(--muted)}.asset-thumbnails{display:flex;gap:18px;overflow-x:auto;padding:3px 3px 12px}.asset-thumb{flex:0 0 160px;appearance:none;cursor:pointer;color:inherit;text-align:left;font:inherit;background:transparent;border:0;padding:0;opacity:.62;transition:opacity .2s}.asset-thumb img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border:1px solid transparent;padding:3px}.asset-thumb>span{display:flex;gap:12px;padding:10px 4px;font-size:9px;color:var(--muted)}.asset-thumb b{font-weight:400;color:inherit}.asset-thumb.is-selected,.asset-thumb:hover{opacity:1}.asset-thumb.is-selected img{border-color:#a17f4c}.asset-thumb.is-selected b{color:#403427}.asset-thumb:focus-visible{outline:2px solid #a17f4c;outline-offset:2px}
@media(max-width:700px){.asset-thumbnails{gap:12px}.asset-thumb{flex-basis:128px}.asset-stage figcaption{font-size:9px;padding:13px 0 15px}}
/* Light frosted sheets separate project content from the decorative paper. */
.project-dunhuang .project-masthead,.project-dunhuang .page-section{position:relative;isolation:isolate}
.project-dunhuang .project-masthead::before,.project-dunhuang .page-section::before{content:"";position:absolute;inset:0 -24px -24px;z-index:-1;pointer-events:none;background:linear-gradient(135deg,#fffdf57d,#fff9e957);backdrop-filter:blur(10px) saturate(.85);-webkit-backdrop-filter:blur(10px) saturate(.85);border:1px solid #ffffff80;border-radius:12px;box-shadow:0 10px 35px #88632e0a}
.project-dunhuang .project-masthead::before{top:137px}
.project-dunhuang .page-section{border-top-color:transparent}
.project-dunhuang .project-process{margin-bottom:50px}
@media(max-width:700px){.project-dunhuang .project-masthead::before,.project-dunhuang .page-section::before{left:-14px;right:-14px;bottom:-16px;border-radius:9px}.project-dunhuang .project-masthead::before{top:123px}}
.asset-category-tabs{display:flex;gap:30px;border-bottom:1px solid var(--line);margin-bottom:28px;overflow-x:auto}.asset-category-tabs button{appearance:none;flex-shrink:0;cursor:pointer;background:transparent;border:0;border-bottom:2px solid transparent;padding:14px 0 17px;color:var(--muted);font:inherit;font-size:13px;letter-spacing:.04em}.asset-category-tabs button span{margin-left:9px;font-size:9px;opacity:.65}.asset-category-tabs button[aria-selected=true]{color:#403427;border-bottom-color:#a17f4c}.asset-category-tabs button:focus-visible{outline:2px solid #a17f4c;outline-offset:-2px}.asset-empty{min-height:230px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;color:var(--muted);background:#fffaf142;border:1px dashed var(--line)}.asset-empty p{font-size:14px;letter-spacing:.1em}.asset-empty span,.asset-loading{font-size:11px}.asset-category-panel:focus-visible{outline:2px solid #a17f4c;outline-offset:5px}
@media(max-width:700px){.asset-category-tabs{gap:18px;margin-bottom:20px}.asset-category-tabs button{font-size:11px;padding:12px 0 14px}.asset-category-tabs button span{margin-left:5px;font-size:8px}.asset-empty{min-height:180px}}
@media(max-width:700px){.asset-category-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}.asset-category-tabs button{font-size:11px;text-align:center;letter-spacing:0}.asset-category-tabs button span{display:block;margin:5px 0 0}}
.asset-thumbnails{scrollbar-width:none;-ms-overflow-style:none;cursor:grab;user-select:none;-webkit-user-select:none;overscroll-behavior-x:contain}.asset-thumbnails::-webkit-scrollbar{display:none}.asset-thumbnails .asset-thumb{cursor:inherit}.asset-thumbnails.is-dragging{cursor:grabbing}.asset-thumbnails img{-webkit-user-drag:none;user-select:none}

.asset-stage>video{display:block;width:100%;height:auto;aspect-ratio:1672/941;object-fit:contain;background:#161616}.asset-thumb>.asset-video-thumbnail{display:grid;place-items:center;width:100%;aspect-ratio:16/9;background:#efe4cd;border:1px solid transparent;font-size:14px;letter-spacing:.04em}.asset-thumb.is-selected>.asset-video-thumbnail{border-color:#a17f4c}
