:root{color-scheme:dark;--bg:#101414;--surface:#181e1c;--line:#303934;--text:#edf0e8;--muted:#a4aea4;--accent:#b4e989}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:6rem}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"PingFang SC","Microsoft Yahei",sans-serif;font-size:1rem;line-height:1.75}a{color:inherit;text-decoration:none}button{font:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:6px}header,main,footer{max-width:1320px;margin:auto}header{padding:28px 48px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:1.4rem;font-weight:750;letter-spacing:.025em}.brand-icon{font-size:1.6rem;color:var(--accent)}.brand-sub{font-size:.8rem;color:var(--muted);font-weight:400;margin-left:12px;letter-spacing:.05em}nav{display:flex;gap:30px;font-size:.9rem;color:var(--muted)}nav a:hover,nav a[aria-current=page]{color:var(--accent)}main{padding:0 48px}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:72px;padding:72px 0 76px;align-items:center}.eyebrow{font-size:.8rem;color:var(--accent);letter-spacing:.14em;margin:0 0 24px;font-weight:600}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(3rem,5.8vw,5.3rem);letter-spacing:-.035em;line-height:1.22;font-weight:650;margin-bottom:28px}h1 span{color:var(--accent)}.lede{font-size:1.1rem;line-height:1.9;color:var(--muted);max-width:520px}.hero-links{display:flex;align-items:center;gap:28px;margin-top:32px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 24px;border:1px solid var(--line);border-radius:3px;font-size:.95rem;font-weight:600}.primary{color:#132014;background:var(--accent);border-color:var(--accent)}.primary:hover{background:#c9f4a6}.text-link{font-size:.95rem;border-bottom:1px solid #819872;padding-bottom:4px}.text-link:hover{color:var(--accent)}.hero-note{font-size:.8rem;color:var(--muted);margin-top:45px;margin-bottom:0;letter-spacing:.07em}.hero-art{position:relative;display:block;max-width:490px}.hero-art img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:3px;filter:brightness(.92)}.art-caption{position:absolute;bottom:0;padding:26px;width:100%;background:linear-gradient(transparent,rgba(9,13,10,.95));display:flex;flex-direction:column}.art-caption strong{font-family:Georgia,serif;font-size:1.9rem;font-weight:400}.art-caption span{font-size:.8rem;color:#ccd3c6}.section{padding:56px 0;border-top:1px solid var(--line)}.section-top{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}.section-top .eyebrow{margin-bottom:12px}h2{font-size:clamp(1.6rem,2.4vw,2.2rem);font-weight:550;line-height:1.45;letter-spacing:-.02em;margin-bottom:20px}.section-top h2{margin:0}.section-note,.muted{color:var(--muted);font-size:.9rem}.filters{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px}.filters button{background:transparent;color:var(--muted);padding:8px 20px;border:1px solid var(--line);border-radius:2px;font-size:.9rem;cursor:pointer;min-height:44px}.filters button[aria-pressed=true]{background:var(--accent);color:#132014;border-color:var(--accent)}.work-card{display:grid;grid-template-columns:100px 1fr auto;align-items:center;gap:26px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.work-card img{width:100px;height:100px;object-fit:cover;border-radius:2px}.work-card h3{font-family:Georgia,serif;font-size:1.7rem;font-weight:400;margin:0 0 4px}.work-card p{font-size:.95rem;color:var(--muted);margin:0}.tags{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.tags span{border:1px solid var(--line);color:var(--muted);padding:3px 10px;font-size:.8rem}.work-card .number{font-size:.8rem;color:var(--accent)}.paths{display:grid;grid-template-columns:1fr 1fr;gap:64px}.path p{max-width:460px;color:var(--muted)}.path .eyebrow{margin-bottom:20px}.path:last-child{padding-left:48px;border-left:1px solid var(--line)}.path:hover h2{color:var(--accent)}.about{display:grid;grid-template-columns:1fr 2fr;gap:48px}.about p{max-width:650px;color:var(--muted)}footer{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:34px 48px;border-top:1px solid var(--line);color:var(--muted);font-size:.8rem}footer .brand{font-size:1.05rem;color:var(--text)}footer .brand-sub{font-size:.75rem}.page-intro{padding:80px 0 64px}.page-intro .lede{max-width:670px}.case-layout,.detail-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:64px;align-items:start}.case-layout p,.detail-grid p{color:var(--muted)}.chord-panel{padding:34px;background:var(--surface);border:1px solid var(--line)}.chords{font-family:Georgia,serif;font-size:clamp(1.5rem,3vw,2.5rem);line-height:2.1;color:var(--accent);word-spacing:.2em}.chords span{color:var(--text)}small{font-size:.8rem;color:var(--muted)}.form-timeline{display:grid;grid-template-columns:repeat(5,1fr);margin:34px 0;gap:1px;background:var(--line);border:1px solid var(--line)}.form-timeline div{padding:25px 18px;background:var(--surface)}.form-timeline strong{display:block;font-family:Georgia,serif;color:var(--accent);font-size:1.8rem;font-weight:400}.form-timeline span{font-size:.8rem;color:var(--muted)}.form-timeline p{font-size:.9rem;margin:12px 0 0}.chart{margin:30px 0 0;padding:12px;background:#e9ede4}.chart img{display:block;width:100%;height:auto}.chart figcaption{font-size:.8rem;color:#343c36;margin:10px 8px}.steps{margin-top:40px}.steps article{display:grid;grid-template-columns:85px 1fr;gap:26px;border-top:1px solid var(--line);padding:30px 0}.steps article>span{font-family:Georgia,serif;color:var(--accent);font-size:2rem}.steps h3{font-size:1.25rem;font-weight:500;margin-bottom:12px}.steps p{max-width:740px;color:var(--muted);margin-bottom:12px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:510px;font-size:.95rem}td,th{text-align:left;padding:18px;border-bottom:1px solid var(--line)}th{background:var(--surface);font-weight:500}td{color:var(--muted)}.detail-hero{padding:72px 0;display:grid;grid-template-columns:360px 1fr;gap:68px;align-items:center}.detail-hero>img{width:100%;height:auto}.detail-hero h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(2.8rem,5vw,4.7rem);margin-bottom:24px}.back{display:inline-block;color:var(--muted);font-size:.85rem;margin-bottom:24px}.detail-hero .eyebrow{margin-bottom:18px}.facts{margin-top:30px}.facts div{padding:14px 0;display:grid;grid-template-columns:150px 1fr;gap:16px;border-top:1px solid var(--line)}dt{font-size:.9rem;color:var(--muted)}dd{margin:0;font-size:.95rem}details{border:1px solid var(--line);margin:24px 0;padding:20px 24px}summary{cursor:pointer;font-size:1rem}details p{margin:20px 0 0;color:var(--muted)}.downloads>a:not(.text-link){display:flex;justify-content:space-between;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}.downloads>a:hover{color:var(--accent)}.downloads>a span{color:var(--muted);font-size:.85rem}.empty{padding:36px;border:1px solid var(--line);color:var(--muted)}.player{margin-top:24px;padding:20px;background:var(--surface)}.player audio{width:100%}.player p{font-size:.9rem}.skip{position:fixed;left:20px;top:-100px;background:var(--accent);color:#101414;z-index:100;padding:12px}.skip:focus{top:20px}
@media(max-width:900px){header,footer{padding:22px 28px}main{padding:0 28px}.brand-sub{display:none}nav{gap:20px}.hero{gap:35px;padding:55px 0}.hero-art{max-width:400px}.hero-links{gap:20px;flex-wrap:wrap}.detail-hero{grid-template-columns:280px 1fr;gap:35px}.case-layout,.detail-grid{gap:35px}.form-timeline div{padding:18px 12px}.paths{gap:30px}.path:last-child{padding-left:28px}}
@media(max-width:650px){header{padding:20px;display:block}.brand{font-size:1.25rem}nav{margin-top:16px;justify-content:space-between;gap:10px;font-size:.85rem}main{padding:0 20px}.hero{display:flex;flex-direction:column;gap:38px;padding:40px 0}.hero-copy{width:100%}h1{font-size:3rem;line-height:1.3}.hero-art{width:100%;max-width:none}.hero-art img{aspect-ratio:1.15;object-position:center}.hero-note{margin-top:28px}.hero-links{margin-top:24px}.section{padding:36px 0}.section-top{align-items:flex-start;flex-direction:column;gap:12px}.section-note{font-size:.85rem}.filters{gap:8px}.filters button{padding:8px 12px;font-size:.85rem}.work-card{grid-template-columns:72px 1fr;gap:18px}.work-card img{width:72px;height:72px}.work-card h3{font-size:1.35rem}.work-card>.text-link{grid-column:2;justify-self:start}.work-card .number{display:none}.paths,.about,.case-layout,.detail-grid{display:block}.path{display:block}.path:last-child{border-left:0;border-top:1px solid var(--line);padding:30px 0 0;margin-top:30px}.about h2{margin-top:25px}.page-intro{padding:48px 0 36px}.chord-panel{margin-top:30px;padding:24px}.form-timeline{grid-template-columns:1fr}.form-timeline div{display:grid;grid-template-columns:65px 100px 1fr;align-items:center;gap:12px;padding:16px}.form-timeline strong{font-size:1.5rem}.form-timeline p{margin:0}.detail-hero{display:flex;flex-direction:column;align-items:stretch;padding:36px 0;gap:30px}.detail-hero>img{max-width:260px}.detail-hero h1{font-size:3rem}.facts div{grid-template-columns:115px 1fr}.steps article{grid-template-columns:44px 1fr;gap:16px}.downloads>a:not(.text-link){font-size:.9rem}.chart{padding:6px}footer{padding:28px 20px;flex-wrap:wrap;gap:14px}footer>span:last-child{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}