@font-face{font-family:Barlow;src:url("vendor/BarlowCondensed-SemiBold.ttf") format("truetype");font-weight:600;font-display:swap}
@font-face{font-family:Plex;src:url("vendor/IBMPlexMono-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
:root{--ui-white:#eeede8;--ui-muted:#b6b7ae;--ui-line:#ffffff26;--ui-accent:#cbbfa6;--ui-bg:#121313;--ui-ease:cubic-bezier(.22,1,.36,1)}
body.immersive{max-width:none;overflow-x:clip;color:var(--ui-white);background:var(--ui-bg);font-family:"Helvetica Neue","PingFang SC",sans-serif}
html{scroll-padding-top:0;scroll-behavior:auto}button,a{touch-action:manipulation}
.hud{top:34px;left:40px;right:40px;align-items:center}
.identity{font-family:Barlow,sans-serif;font-size:35px;letter-spacing:-1px;font-weight:600}
.identity span{font-size:9px;letter-spacing:1.6px;line-height:1.5;margin-top:8px;color:#d6d5ce}
.hud button{height:44px;font-size:12px;border:1px solid var(--ui-line);padding:0 18px;background:#12131355;backdrop-filter:blur(8px);transition:background .25s,border-color .25s}
.hud button:hover{background:#ffffff16;border-color:#ffffff70}
.chapters{left:40px;top:38%;gap:0}
.chapters a{min-height:44px;font-size:11px;letter-spacing:1.5px;opacity:1;color:#c0c1b7;gap:10px;transition:color .2s}
.chapters a span{font-family:Plex,monospace;font-size:10px;padding:10px 10px 10px 9px;border-color:#ffffff24}
.chapters a.active{color:#fff}.chapters a.active span{color:#d8ccb3;border-color:#d8ccb3}
.chapters a:hover{color:#fff}.chapters a:hover span{border-color:#fff}
.chapter{height:165svh}.chapter:last-child{height:100svh}
.scene-copy{position:fixed;top:29%;left:16%;margin:0;width:44%;max-width:710px;padding:0;opacity:0;visibility:hidden;transform:translate3d(0,22px,0);transition:opacity .45s,transform .7s var(--ui-ease),visibility .45s}
.chapter.active .scene-copy{opacity:1;visibility:visible;transform:translate3d(0,0,0)}
.eyebrow{font:10px/1.6 Plex,monospace;letter-spacing:2px;color:#c8c8bd;margin-bottom:24px}
.chapter h1,.chapter h2{font-family:Barlow,"Arial Narrow",sans-serif;font-weight:600;font-size:clamp(58px,7.1vw,114px);line-height:.95;letter-spacing:-.018em;text-wrap:nowrap;text-shadow:0 3px 36px #090a0926}
.chapter h1 i,.chapter h2 i{-webkit-text-stroke:.8px #eeede8;color:transparent}
.chinese{font-size:16px;font-weight:400;letter-spacing:2px;line-height:1.9;margin-top:30px}
.scene-description{font-size:13px;letter-spacing:.6px;line-height:2.1;max-width:410px;color:#c1c2b8;margin-top:18px}
.scene-note{right:40px;top:auto;bottom:18vh;font:9px/1.9 Plex,monospace;color:#b9bab0;letter-spacing:1.3px}
.scene-footer{left:40px;right:40px;bottom:27px;font:10px/1.6 Plex,monospace;letter-spacing:.8px;color:#c8c9be;min-height:44px}
.scroll-cue{display:flex;align-items:center;gap:20px;font-size:9px}
.scene-footer button{min-height:44px;min-width:76px;border:1px solid var(--ui-line);font-size:10px;letter-spacing:1px;padding:0 12px}
.scene-footer button:hover{background:#ffffff10}
.scene-button,.all-work{height:48px;padding:0 22px;border-color:#ffffff55;font-size:12px;letter-spacing:1px;margin-top:28px;transition:background .2s,color .2s}
.featured{display:flex;flex-direction:column;align-items:stretch;width:310px;gap:0;margin-top:25px}
.featured button{font-size:12px;min-height:46px;text-align:left;border-bottom:1px solid var(--ui-line);letter-spacing:.4px;transition:padding .3s,color .3s}
.featured button:hover{padding-left:8px;color:#e2d5bb}
.pending{font-size:12px;color:#b3b4a9;border-color:#ffffff26;margin-top:24px;letter-spacing:1px}
.vignette{background:linear-gradient(90deg,#090b0a66 0%,#090b0a22 38%,transparent 66%),linear-gradient(0deg,#090b0ab3,transparent 18%,transparent 85%,#090b0a22)}
.archive{--paper:#141615;--ink:#eeede8;--muted:#a9aca1;--line:#ffffff26;background:var(--paper);color:var(--ink);padding:32px 7% 80px;overscroll-behavior:contain;scrollbar-color:#565b50 #141615}
.archive-head{position:sticky;top:-32px;z-index:3;background:#141615f2;padding:14px 0;backdrop-filter:blur(20px);margin-bottom:45px;border-bottom:1px solid var(--line);align-items:center;font:10px Plex,monospace}
.archive-head button{min-height:44px;border:1px solid var(--line);padding:0 16px}
.archive h2{font-size:clamp(36px,5vw,64px);letter-spacing:-1px;font-weight:400;margin-bottom:30px}
.archive h2 small{color:var(--muted);font:11px Plex,monospace;margin-left:15px}
.archive .filter-bar{padding:18px 0 26px}.archive .filters{gap:6px}.archive .filters button{min-height:44px;font-size:12px;padding:0 17px;color:#bec1b5}.archive .filters button[aria-pressed=true]{background:#ddd8ca;color:#1c201b}
.archive .project-grid{gap:42px 26px}.archive .project-card{color:var(--ink)}.archive .project-card:first-child{grid-column:auto}.archive .project-image,.archive .project-card:first-child .project-image{aspect-ratio:1.45;background:#232721}
.archive .project-image img{object-fit:contain}.archive .project-caption h3{font-size:19px}.archive .project-caption p{font:9px/1.6 Plex,monospace;letter-spacing:.7px}.archive .project-meta{font-size:11px}
.archive .view-project{background:#e5e0d4;color:#1c201b;opacity:1;transform:none;padding:10px 12px;font-size:11px}
body.immersive #project-dialog{--paper:#141615;--ink:#eeede8;--muted:#b5b8ac;--line:#ffffff26;background:var(--paper);color:var(--ink);outline:1px solid var(--line);scrollbar-color:#565b50 #141615;overscroll-behavior:contain}
body.immersive .dialog-toolbar{padding:14px 4%;background:#141615f2;backdrop-filter:blur(16px);font:10px Plex,monospace}
body.immersive .dialog-toolbar button{min-height:44px;font-size:12px;background:#e5e0d4;color:#1c201b}
body.immersive .dialog-head{padding:42px 6% 36px}body.immersive .dialog-head h2{font-size:clamp(28px,3.5vw,48px);letter-spacing:-1px}
body.immersive .detail-images{gap:24px}.dialog-next{min-height:48px}
body.immersive :focus-visible{outline:2px solid #ddd0af;outline-offset:5px}
.archive .project-card:focus-visible{outline-offset:8px}
.scene-copy .icon{width:16px;height:16px;display:inline-block;vertical-align:middle;margin-left:14px}
@media(min-width:1600px){.scene-copy{left:15%;width:42%}.chapters{left:48px}.hud{left:48px;right:48px}}
@media(max-width:1000px) and (min-width:701px){.scene-copy{left:15%;width:46%;top:30%}.chapter h1,.chapter h2{font-size:7.6vw}.chinese{font-size:14px;letter-spacing:1px}.hud,.scene-footer{left:28px;right:28px}.chapters{left:28px}.scene-note{right:28px}}
@media(max-width:700px){.hud{top:22px;left:22px;right:22px}.identity{font-size:29px}.identity span{font-size:7px;letter-spacing:1px}.hud button{font-size:11px;padding:0 12px}.scene-copy{top:22%;left:19%;width:76%;max-width:none}.chapter h1,.chapter h2{font-size:clamp(45px,10.4vw,72px);line-height:.97;letter-spacing:-.02em}.eyebrow{font-size:8px;margin-bottom:17px;letter-spacing:1.2px}.chinese{font-size:13px;letter-spacing:1px;line-height:1.8;margin-top:22px}.scene-description{font-size:12px;max-width:270px;line-height:1.9}.chapters{left:18px;top:38%}.chapters a{min-width:44px;min-height:44px;font-size:0;gap:0}.chapters a span{font-size:10px;padding-left:8px}.scene-footer{bottom:16px;left:22px;right:22px;gap:12px;font-size:8px}.scroll-cue{font-size:0}.scroll-cue:after{content:'SCROLL';font:8px Plex,monospace}.scene-footer button{font-size:9px;min-width:65px}.scene-note{right:22px;bottom:17vh;font-size:8px}.featured{width:260px;margin-top:18px}.featured button{font-size:11px;min-height:44px}.all-work,.scene-button{margin-top:20px;font-size:11px}.archive{padding:18px 6% 60px}.archive-head{top:-18px;margin-bottom:35px;font-size:8px}.archive h2 small{display:block;margin:14px 0}.archive .project-grid{grid-template-columns:1fr;gap:34px}.archive .filter-bar{flex-direction:column;align-items:flex-start;gap:12px}.archive .filters button{padding:0 13px}.archive .result-count{padding:0}.archive .project-caption h3{font-size:18px}body.immersive .dialog-toolbar{font-size:8px}body.immersive .detail-images{gap:14px}body.immersive .dialog-head p{font-size:13px}}
@media(max-height:640px) and (min-width:701px){.scene-copy{top:23%}.chapter h1,.chapter h2{font-size:64px}.chinese{margin-top:18px}.eyebrow{margin-bottom:16px}.featured{margin-top:12px}.featured button{min-height:36px}.all-work{margin-top:16px}.scene-description{margin-top:14px}.hud{top:18px}.scene-footer{bottom:12px}}
@media(prefers-reduced-motion:reduce){.scene-copy{transition:none;transform:none}.chapter{height:115svh}.chapter:last-child{height:100svh}}
