:root{--paper:#f5f3ec;--ink:#272822;--muted:#72756b;--line:#d8d9cc;--brand-green:#8bdd2e;--green:#4b751c}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,PingFang SC,Microsoft YaHei,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid var(--green);outline-offset:5px}.detail-nav{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:22px max(24px,calc((100vw - 1200px)/2));border-bottom:1px solid var(--line);background:#f5f3ecf0;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.detail-logo{font-size:25px;font-weight:800;letter-spacing:-1px}.detail-logo span{color:var(--green);margin-left:5px}.back-link{font-size:13px}.detail-main{max-width:1200px;margin:auto;padding:0 24px}.project-intro{padding:78px 0 42px}.detail-eyebrow{font-size:11px;letter-spacing:2px;color:var(--green);font-weight:700}h1{font-size:clamp(32px,4.7vw,62px);line-height:1.25;letter-spacing:-1.8px;font-weight:500;margin:24px 0}.intro-copy{font-size:16px;line-height:1.9;color:var(--muted);max-width:640px}.project-meta{display:flex;flex-wrap:wrap;gap:12px 40px;margin:32px 0;font-size:12px;color:var(--green)}.chapter-nav{display:flex;align-items:center;flex-wrap:wrap;gap:12px;border-top:1px solid var(--line);padding-top:24px;font-size:12px}.chapter-nav a{border:1px solid var(--line);border-radius:40px;padding:10px 16px}.chapter-nav a:hover{background:var(--ink);color:var(--paper)}.chapter-nav>span{margin-left:auto;color:var(--muted)}.chapter{padding:30px 0 40px}.chapter-heading{display:flex;align-items:baseline;gap:14px;margin-bottom:20px}.chapter-heading>span{font-size:12px;color:var(--green);font-family:monospace}.chapter-heading h2{font-size:22px;letter-spacing:-.6px;font-weight:500;margin:0}.chapter-heading p{margin-left:auto;font-size:12px;color:var(--muted)}.gallery{display:grid;gap:24px}.image-button{display:block;position:relative;width:100%;padding:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;text-align:left}.image-button img{display:block;width:100%;height:auto}.image-zoom{position:absolute;right:16px;bottom:16px;border-radius:50px;background:#272822db;color:#fff;padding:9px 14px;font-size:11px;opacity:0;transition:opacity .2s}.image-button:hover .image-zoom,.image-button:focus-visible .image-zoom{opacity:1}.next-project{display:block;border-top:1px solid var(--line);padding:42px 0 60px}.next-project span{font-size:12px;color:var(--green)}.next-project h2{font-size:clamp(25px,3vw,40px);font-weight:500;line-height:1.4}.detail-footer{max-width:1200px;margin:auto;padding:22px 24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:11px}#image-viewer{width:calc(100% - 32px);max-width:1600px;max-height:calc(100svh - 32px);padding:0;border:1px solid #fff3;border-radius:14px;background:#13171e;color:#fff;overflow:hidden}#image-viewer::backdrop{background:#020617db;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.viewer-toolbar,.viewer-controls{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;font-size:12px}.viewer-toolbar>div{display:flex;gap:24px;align-items:center}.viewer-toolbar button,.viewer-controls button{background:transparent;color:inherit;border:1px solid #ffffff40;border-radius:30px;padding:9px 14px}.viewer-controls button:disabled{opacity:.35;cursor:default}.viewer-canvas{height:calc(100svh - 180px);overflow:auto;display:flex;align-items:center;justify-content:center}.viewer-canvas img{display:block;max-width:100%;max-height:100%;object-fit:contain}.viewer-controls>span{color:#9ca3af;font-size:11px}@media(max-width:600px){.detail-nav{padding:18px 22px}.detail-main{padding:0 20px}.project-intro{padding:42px 0 24px}h1{letter-spacing:-1px}.intro-copy{font-size:14px}.chapter-nav>span{margin-left:0;width:100%;margin-top:8px}.chapter-heading{gap:8px}.chapter-heading h2{font-size:19px}.gallery{gap:16px}.image-button{border-radius:6px}.image-zoom{display:none}.viewer-toolbar,.viewer-controls{padding:12px;font-size:11px}.viewer-toolbar>div{gap:12px}.viewer-controls>span{display:none}.viewer-canvas{height:auto;max-height:calc(100svh - 175px);min-height:180px}#image-viewer{width:calc(100% - 20px)}.detail-footer{padding:22px 20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.image-zoom{transition:none}}