:root{--ink:#121212;--paper:#fafafa;--blue:#171717;--red:#333333;--line:rgba(18,18,18,.3)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Avenir Next","PingFang SC","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.55}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid var(--red);outline-offset:4px}.site-header{min-height:78px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:25px;padding:18px 4.5vw;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;background:rgba(250,250,250,.96);backdrop-filter:blur(14px)}.wordmark{font:700 25px/1 "Avenir Next","Arial",sans-serif;letter-spacing:-1.6px}.site-header nav{display:flex;gap:25px;font-size:13px}.site-header nav a:hover,.text-link:hover,footer a:hover{color:var(--red)}.language-switch{justify-self:end;display:flex;border:1px solid var(--ink)}.language-switch button{appearance:none;border:0;border-left:1px solid var(--ink);background:transparent;min-width:31px;height:28px;font:600 12px/1 inherit;cursor:pointer}.language-switch button:first-child{border-left:0}.language-switch .active{background:var(--ink);color:var(--paper)}.hero{min-height:calc(100vh - 78px);padding:9vh 4.5vw 4vw;display:flex;flex-direction:column;justify-content:space-between}.hero-copy{max-width:880px}.eyebrow,.section-label{font-size:11px;font-weight:650;letter-spacing:.09em;text-transform:uppercase}.eyebrow{margin:0 0 9px;color:var(--red)}h1,h2{font-family:"Songti SC","STSong",Baskerville,serif;font-weight:400;letter-spacing:-.055em}.hero h1{font-size:clamp(6.3rem,19vw,15.5rem);line-height:.78;margin:0}.hero h1 span{color:var(--red)}.manifesto{font-family:"Songti SC","STSong",serif;font-size:clamp(1.3rem,2.1vw,2.1rem);line-height:1.42;max-width:670px;margin:38px 0 0}.signal{display:flex;gap:6px;margin:6vh 0}.signal span{display:block;height:5px;flex:1;background:var(--blue)}.signal span:nth-child(2){background:var(--red)}.platforms{align-self:end;width:min(830px,100%);display:grid;grid-template-columns:repeat(6,1fr);border-left:1px solid var(--line);border-top:1px solid var(--line)}.platforms a{min-height:91px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:22px 1fr;align-content:center;gap:8px;padding:13px 11px;position:relative;font-size:12px}.platforms a:hover{background:var(--blue);color:#fff}.platforms img{width:20px;height:20px;object-fit:contain;filter:grayscale(1)}.platforms a:hover img{filter:brightness(0) invert(1)}.platforms b{position:absolute;right:9px;top:6px;font-size:11px;font-weight:400}.show-section{padding:64px 4.5vw 76px;background:#eeeeee}.section-label{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:28px}.section-label.light{border-color:rgba(255,255,255,.55)}.show-head{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:31px}.show-head h2,.content-grid h2{font-size:clamp(2.9rem,6vw,5.8rem);line-height:.88;margin:0}.show-head p{margin:17px 0 0;font-size:17px}.text-link{font-size:13px;text-decoration:underline;text-underline-offset:5px;white-space:nowrap}.carousel-shell{max-width:1120px;margin:0 auto}.show-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;scrollbar-width:none;overscroll-behavior-x:contain}.show-track::-webkit-scrollbar{display:none}.show-track figure{margin:0;min-width:100%;scroll-snap-align:start;scroll-snap-stop:always}.show-track img{width:100%;display:block;aspect-ratio:1.414/1;object-fit:cover;background:#d7d6d0}.show-track figcaption{font-size:11px;letter-spacing:.08em;margin-top:10px}.carousel-controls{display:flex;justify-content:space-between;align-items:center;margin-top:16px;font-size:12px}.carousel-controls div{display:flex;gap:7px}.carousel-controls button{width:40px;height:40px;border:1px solid var(--ink);background:transparent;font-size:20px;cursor:pointer}.carousel-controls button:hover:not(:disabled){background:var(--ink);color:#fff}.carousel-controls button:disabled{opacity:.35;cursor:not-allowed}.show-notes{display:grid;grid-template-columns:1fr 1fr;gap:50px;max-width:1020px;margin:57px auto 0;padding-top:18px;border-top:1px solid var(--line)}.show-notes p{font:20px/1.55 "Songti SC","STSong",serif;margin:0}.qiu-section{background:var(--blue);color:#fff;padding:64px 4.5vw 78px}.qiu-grid{display:grid;grid-template-columns:1fr 1.8fr;gap:8vw}.qiu-grid h2{font-size:clamp(4.2rem,9vw,8rem);line-height:.8;margin:0}.qiu-lead{font:clamp(1.55rem,2.8vw,2.8rem)/1.32 "Songti SC","STSong",serif;margin:0 0 26px}.qiu-grid p{max-width:700px;font-size:17px;margin:0}.formula{background:#fff;color:var(--ink);padding:25px 27px;margin:35px 0 17px}.formula-label{font-size:11px;letter-spacing:.1em}.formula>div{display:flex;align-items:baseline;gap:17px;margin:12px 0;font:clamp(2rem,4vw,4rem)/1 "Songti SC","STSong",serif}.formula i{font:400 25px/1 sans-serif;color:#666}.formula code{font-family:"Avenir Next",sans-serif;letter-spacing:-.07em}.formula code span{color:var(--red)}.formula p{display:flex;gap:22px;padding-top:12px;border-top:1px solid #ddd;font-size:13px}.small-note{font-size:14px!important;color:rgba(255,255,255,.84)}.content-grid{display:grid;grid-template-columns:1fr 1fr}.content-grid article{min-height:410px;padding:53px 4.5vw 60px;border-bottom:1px solid var(--line)}.content-grid article+article{border-left:1px solid var(--line)}.content-grid h2{font-size:clamp(2.7rem,4.6vw,5rem);margin:0 0 36px}.content-grid p{font:18px/1.65 "Songti SC","STSong",serif;max-width:510px;margin:0}.content-grid .text-link{display:inline-block;margin-top:26px}footer{display:flex;justify-content:space-between;gap:30px;padding:28px 4.5vw 35px;background:#fff;font-size:14px}footer p{color:#666;font-size:11px;margin:9px 0 0}footer>a{text-align:right;line-height:1.65}@media(max-width:760px){.site-header{grid-template-columns:1fr auto;padding:15px 5vw}.site-header nav{display:none}.hero{padding:10vh 5vw 5vw;min-height:calc(100svh - 63px)}.hero h1{font-size:27vw}.manifesto{font-size:1.32rem;margin-top:30px}.platforms{grid-template-columns:repeat(3,1fr);align-self:stretch}.platforms a{min-height:82px}.show-section,.qiu-section{padding:42px 5vw 54px}.show-head{display:block}.show-head h2{font-size:17vw}.show-head p{font-size:15px}.show-head .text-link{display:inline-block;margin-top:20px}.show-track figure{min-width:91%}.show-notes{grid-template-columns:1fr;gap:20px;margin-top:35px}.show-notes p{font-size:18px}.qiu-grid{grid-template-columns:1fr;gap:28px}.qiu-grid h2{font-size:23vw}.qiu-grid p{font-size:16px}.formula{padding:20px}.formula p{flex-direction:column;gap:3px}.content-grid{grid-template-columns:1fr}.content-grid article{min-height:auto;padding:43px 5vw 50px}.content-grid article+article{border-left:0;border-top:1px solid var(--line)}.content-grid h2{font-size:3.8rem}.content-grid p{font-size:17px}footer{padding:25px 5vw;flex-direction:column}footer>a{text-align:left}.section-label{margin-bottom:21px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Content revision: preserve the existing editorial composition. */
.welcome{font-family:"Avenir Next","Helvetica Neue",sans-serif;letter-spacing:-.035em;overflow-wrap:anywhere}
.welcome span{color:var(--red)}
.show-track figure{flex:0 0 100%;min-width:0}
.show-track img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;background:transparent}
.show-track figcaption{display:flex;justify-content:space-between;gap:20px}
.show-head>span{text-decoration:none}
.converter-open{margin-top:28px;padding:13px 19px;background:#fff;color:var(--blue);border:1px solid #fff;cursor:pointer;font:inherit}
.converter-open:hover{background:transparent;color:#fff}
body.dialog-open{overflow:hidden}
dialog{width:min(720px,calc(100% - 32px));max-height:90dvh;overflow:auto;overscroll-behavior:contain;background:var(--paper);color:var(--ink);padding:28px;border:1px solid var(--ink)}
dialog::backdrop{background:#0009;backdrop-filter:blur(4px)}
.dialog-head{display:flex;align-items:start;justify-content:space-between;gap:15px}
.dialog-head h2{margin:0;font-size:2.3rem;line-height:1.2;overflow-wrap:anywhere}
dialog button{font:inherit;font-size:14px;padding:9px 14px;border:1px solid var(--ink);background:transparent;cursor:pointer;color:var(--ink)}
dialog button:hover{background:var(--ink);color:var(--paper)}
.dialog-head button{flex-shrink:0}
dialog p{font-size:14px;line-height:1.6}
dialog>label{display:block;font-size:14px;margin:17px 0 7px}
dialog textarea,dialog select{font:inherit;color:var(--ink);background:#fff;border:1px solid #999;border-radius:0;padding:10px 12px;max-width:100%}
dialog>textarea,dialog>select{width:100%}
dialog textarea{resize:vertical;line-height:1.6;min-height:100px}
dialog textarea:focus-visible,dialog select:focus-visible,dialog summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
#converter-output{background:#eeeeee}
.input-hint{color:#555;margin-top:5px}
#converter-status{min-height:24px}
.converter-actions{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
#candidate-panel{margin-top:22px;border-top:1px solid var(--line);padding-top:15px}
#candidate-panel summary{cursor:pointer;font-size:14px}
#candidates{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:15px}
#candidates label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px;overflow-wrap:anywhere}
#candidates select{min-width:75px}
html[data-language=qiu] [data-i18n]{overflow-wrap:anywhere;letter-spacing:normal}
html[data-language=qiu] .site-header nav{flex-wrap:wrap;gap:10px 20px}
html[data-language=qiu] .show-head h2,html[data-language=qiu] .content-grid h2{font-family:"Avenir Next",sans-serif;font-size:clamp(2rem,4vw,4rem);line-height:1.25}
.formula>div{flex-wrap:wrap}
.link-arrow{display:inline-block;width:16px;height:16px;vertical-align:middle;color:inherit}
.text-link[href]::after,.converter-open::after,footer>a::after{content:"";display:inline-block;width:16px;height:16px;margin-left:9px;vertical-align:middle;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h11M9 4l4 4-4 4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h11M9 4l4 4-4 4' fill='none' stroke='black' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.language-switch button{color:var(--ink)}
@media(max-width:760px){.hero{min-height:0;justify-content:flex-start;padding:52px 5vw 28px}.hero .signal{flex:none;margin:36px 0 16px}.hero .platforms{flex:none}.platforms a{min-height:78px}}
.show-head>div{min-width:0;flex:1}
.show-head h2{font-size:clamp(2.4rem,5.2vw,5.8rem);line-height:1.15;letter-spacing:-.035em}
.album-section{padding:64px 4.5vw 76px;border-bottom:1px solid var(--line)}
.album-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:6vw;align-items:center;max-width:1250px;margin:auto}
.album-cover{display:block;aspect-ratio:1;background:#fff;border:1px solid var(--line)}
.album-cover img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}
.album-details{min-width:0}
.album-heading{display:flex;justify-content:space-between;align-items:baseline;gap:20px}
.album-heading h2{font:400 clamp(3rem,7vw,6rem)/1 Baskerville,serif;margin:0}
.album-heading p{font-size:16px;margin:0}
.track-list{list-style:none;margin:26px 0 24px;padding:0;border-top:1px solid var(--line)}
.track-list li{border-bottom:1px solid var(--line)}
.track-list a{display:grid;grid-template-columns:24px minmax(0,1fr) 18px;gap:14px;align-items:center;padding:18px 0;min-height:64px;font-size:clamp(1rem,1.45vw,1.35rem)}
.track-list a:hover{color:var(--blue)}
.track-title{overflow-wrap:anywhere;line-height:1.45}
.track-number,.track-arrow{font-size:14px}
.album-details>.text-link{white-space:normal;font-size:14px}
@media(max-width:760px){.show-head h2{font-size:clamp(2rem,8vw,3.8rem)}.album-section{padding:42px 5vw 54px}.album-grid{grid-template-columns:1fr;gap:30px}.album-cover{width:min(100%,440px);margin:auto}.track-list a{padding:16px 0;gap:10px}.album-heading h2{font-size:3.5rem}}
@media(max-width:760px){dialog{padding:20px}.dialog-head h2{font-size:1.8rem}#candidates{grid-template-columns:1fr}.show-track figure{flex:0 0 100%}}

/* Quiet movement; content remains visible without scripting. */
:root{--ink:#000;--paper:#fff;--blue:#000;--red:#000;--line:#000}
body,.site-header,.hero,.qiu-section,.show-section,.album-section,.content-grid,footer,dialog{background:#fff;color:#000}
.site-header{backdrop-filter:none}
.qiu-section .small-note,.site-credit,.input-hint,footer p,.formula i{color:#000}
.qiu-section .section-label.light{border-color:#000}
.formula{border:1px solid #000}
.formula p,dialog textarea,dialog select{border-color:#000}
#converter-output{background:#fff}
.signal span,.signal span:nth-child(2){background:#000}
.platforms img{filter:grayscale(1) brightness(0)}
.album-screenshot{position:relative;overflow:hidden;background:#fff}
.album-screenshot img{position:absolute;width:161.9%;height:auto;max-width:none;aspect-ratio:auto;left:-30.9%;top:-31.4%}
.release-note{font-size:14px;margin:18px 0 0}
.unlinked-track{display:grid;grid-template-columns:24px minmax(0,1fr);gap:14px;align-items:center;padding:18px 0;min-height:64px}
@media(prefers-reduced-motion:no-preference){
 .album-cover img{transition:transform .65s cubic-bezier(.2,.65,.3,1)}
 .album-cover:hover img{transform:scale(1.015)}
 .track-list a .track-title,.link-arrow{transition:transform .3s ease}
 .track-list a:hover .track-title{transform:translateX(4px)}
 a:hover .link-arrow{transform:translateX(3px)}
 .section-label.entered{animation:rule-enter .8s cubic-bezier(.2,.65,.3,1) both}
 .signal.entered span{transform-origin:left;animation:rule-enter .9s ease both}
 .signal.entered span:nth-child(2){animation-delay:.1s}
 .signal.entered span:nth-child(3){animation-delay:.2s}
 dialog[open]{animation:quiet-enter .3s ease both}
 @keyframes rule-enter{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
}
section[id]{scroll-margin-top:90px}
.qiu-section{background:#fff;color:var(--ink)}
.qiu-section .section-label.light{border-color:var(--line)}
.qiu-section .small-note{color:#000}
.qiu-section .converter-open{background:transparent;color:var(--ink);border-color:var(--ink)}
.qiu-section .converter-open:hover{background:var(--ink);color:#fff}
.site-credit{display:block;margin-top:14px;color:#000;font-size:11px;font-weight:300;letter-spacing:.06em}
@media(max-width:760px){.hero{min-height:calc(100svh - 78px)}.hero .signal{margin-top:auto;margin-bottom:16px;padding-top:36px}.hero .signal span{flex-shrink:0}}
.platforms a,.text-link,.converter-open,.carousel-controls button,.language-switch button,.track-list a{transition:color .18s ease,background-color .18s ease}
.entered{animation:quiet-enter .7s cubic-bezier(.2,.65,.3,1) both}
@keyframes quiet-enter{from{opacity:.65;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.entered{animation:none!important}}

/* 002-02 archive: preserve the complete photographic layouts. */
.show-track .show02-slide img{object-fit:contain;background:#fff}
.clean-cover{border:0;overflow:hidden}
.show-chapters{display:flex;gap:24px;flex-wrap:wrap;margin:0 0 22px;border-bottom:1px solid #000}
.show-chapters button{appearance:none;background:none;color:#000;border:0;border-bottom:2px solid transparent;padding:12px 0;font:inherit;font-size:12px;cursor:pointer;transition:border-color .25s,transform .25s}
.show-chapters button[aria-pressed=true]{border-bottom-color:#000}
.show-chapters button:hover{transform:translateY(-2px)}
.show02-notes{margin-top:44px;padding-top:24px;border-top:1px solid #000}
.show02-label{font-size:12px;letter-spacing:.12em;margin:0}
.show02-notes .show-notes{margin-top:18px}
@media(max-width:760px){.show-chapters{gap:16px}.show-chapters button{font-size:11px}.show02-notes{margin-top:30px}}
@media(prefers-reduced-motion:reduce){.show-chapters button{transition:none}.show-chapters button:hover{transform:none}}

/* A single reading rhythm across section boundaries. */
#language{border-bottom:1px solid #000}
#show{border-bottom:1px solid #000}
.album-cover{border:0;overflow:hidden;background:#fff}
.show-context{max-width:1120px;margin:36px auto 0;border-top:1px solid #000;padding-top:22px;display:grid;grid-template-columns:1fr 2fr;gap:48px}
.context-meta{display:flex;flex-direction:column;align-items:start;gap:24px;font-size:14px}
.context-copy{display:grid;gap:14px;max-width:700px}
.context-copy p{margin:0;font:18px/1.8 "Songti SC","STSong",serif}
.show-track figcaption{font-size:12px;min-height:20px}
.content-grid h2{line-height:1.14}
.text-link{white-space:normal;font-size:14px}
@media(max-width:760px){.show-context{grid-template-columns:1fr;gap:24px}.context-meta{flex-direction:row;justify-content:space-between;align-items:center}.context-copy p{font-size:17px}.show-context{margin-top:24px}}

/* Editorial scale and clearer, monochrome destinations. */
body{font-size:17px}
.site-header nav{font-size:14px}
.eyebrow,.section-label{font-size:12px}
.platforms a{font-size:13px}
.show-head p,.qiu-grid p{font-size:18px}
.text-link[href],.converter-open{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;max-width:100%;min-height:46px;padding:11px 15px;border:1px solid var(--ink);text-decoration:none;font-size:15px;line-height:1.4;white-space:normal}
.text-link[href]:hover,.converter-open:hover{background:var(--ink);color:#fff}
.text-link[href]::after,.converter-open::after{margin-left:0;flex:0 0 16px}
.track-list a:hover,.site-header nav a:hover{background:rgba(0,0,0,.055);color:var(--ink)}
.track-list a:focus-visible,.platforms a:focus-visible{outline-offset:-3px}
.archive-entry{max-width:1120px;margin:38px auto 0;padding:25px 28px;display:grid;grid-template-columns:minmax(130px,1fr) minmax(0,2fr) auto;gap:20px;align-items:center;border:1px solid var(--ink);transition:background-color .25s,color .25s}
.archive-entry-index{font-size:12px;letter-spacing:.1em}
.archive-entry strong{font:400 clamp(1.75rem,3.6vw,3rem)/1.15 "Songti SC","STSong",Baskerville,serif;letter-spacing:-.035em}
.archive-entry-arrow{font:400 32px/1 "Avenir Next",sans-serif;transition:transform .25s}
.archive-entry:hover{background:var(--ink);color:#fff}
.archive-entry:hover .archive-entry-arrow{transform:translateX(5px)}
@media(max-width:760px){.archive-entry{grid-template-columns:1fr auto;gap:13px;padding:20px;margin-top:28px}.archive-entry-index{grid-column:1/-1}.archive-entry strong{font-size:1.8rem}.show-head p,.qiu-grid p{font-size:17px}.text-link[href]{font-size:15px}}
@media(prefers-reduced-motion:reduce){.archive-entry,.archive-entry-arrow{transition:none}}
/* Keep the 002 entrance directional cue at the scale of other links. */
.archive-entry-arrow{font-size:18px;line-height:1;transform:none}
.archive-entry:hover .archive-entry-arrow{transform:translateX(2px)}

/* The language control has one visual weight on both site surfaces. */
.site-header .language-switch button{font-family:"Avenir Next","PingFang SC","Microsoft YaHei",sans-serif;font-size:12px;font-weight:400;line-height:1;letter-spacing:0;min-width:31px;width:31px;height:28px;padding:0}

.new-portals{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink)}.new-portal{min-height:290px;display:flex;flex-direction:column;align-items:flex-start;position:relative;padding:38px 4.5vw 45px;border-bottom:1px solid var(--ink);transition:background .3s,color .3s}.new-portal+ .new-portal{border-left:1px solid var(--ink)}.new-portal>span:first-child{font-size:12px;letter-spacing:.08em}.new-portal strong{font:400 clamp(2.5rem,4.5vw,5rem)/1.2 "Songti SC","STSong",serif;margin:auto 0 10px}.new-portal>span:nth-last-child(2){font-size:15px}.new-portal-mark{position:absolute;right:4.5vw;top:35px;font-size:25px;line-height:1;transition:transform .3s}.new-portal:hover,.new-portal:focus-visible{background:var(--ink);color:var(--paper)}.new-portal:hover .new-portal-mark{transform:translateX(5px)}@media(max-width:760px){.new-portals{grid-template-columns:1fr}.new-portal{min-height:240px;padding:28px 5vw 34px}.new-portal+.new-portal{border-left:0}.new-portal-mark{right:5vw;top:24px}}

/* Four homepage editorial panels share the same rhythm. */
.home-resources article{border-top:0}.home-resources .section-label{min-height:30px}.home-resources h2{max-width:none}.home-resources .text-link{margin-top:28px}@media(max-width:760px){.home-resources article+article{border-top:1px solid var(--line)}}
.content-grid article{display:flex;flex-direction:column}.content-grid article>p{margin-top:auto}.content-grid article>.text-link{align-self:flex-start}

.footer-contact{text-align:right}.footer-contact a{display:inline-block;line-height:1.65}.footer-contact .site-credit{color:#000;font-size:11px;font-weight:300;letter-spacing:.06em;margin-top:14px}.footer-contact .mail-arrow{margin-left:9px;font-size:17px;line-height:1}@media(max-width:760px){.footer-contact{text-align:left}}

/* Align homepage return and give the cover wordmark a restrained response. */
#top{scroll-margin-top:120px}.hero h1{white-space:nowrap}.hero h1 .hero-glyph{display:inline-block;color:inherit;will-change:transform;transition:transform .5s cubic-bezier(.22,.7,.2,1)}.hero h1 .hero-glyph:hover,.hero h1 .hero-glyph.is-touched{transform:translate3d(0,-.022em,0) rotate(-.45deg)}.hero h1 .hero-glyph:last-child:hover,.hero h1 .hero-glyph:last-child.is-touched{transform:translate3d(.008em,-.018em,0) rotate(.4deg)}footer p{font-size:14px}.footer-contact>a{font-size:clamp(16px,1.35vw,19px)}@media(prefers-reduced-motion:reduce){.hero h1 .hero-glyph{transition:none;transform:none!important}}
/* Clickable elements respond through movement, without switching to black panels. */
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .site-header nav a,.site-header .wordmark,.text-link,.platforms a,.platforms a img,.platforms a span,.platforms a b,.track-list a,.archive-entry,.archive-entry strong,.new-portal,.new-portal strong,.content-grid article .text-link,footer a,.converter-open,.carousel-controls button{transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .3s,background .3s,color .3s,filter .3s}
  .site-header nav a:hover,.site-header .wordmark:hover,.text-link:hover,.content-grid article .text-link:hover,footer a:hover,.converter-open:hover,.carousel-controls button:hover{transform:translateY(-3px)}
  .platforms a:hover img,.platforms a:hover span,.platforms a:hover b{transform:translateY(-4px) scale(1.035)}
  .track-list a:hover{transform:translateY(-3px)}
  .archive-entry:hover,.new-portal:hover{transform:translateY(-4px)}
  .archive-entry:hover strong,.new-portal:hover strong{transform:translateY(-2px)}
}
.platforms a:hover,.platforms a:focus-visible,.archive-entry:hover,.archive-entry:focus-visible,.new-portal:hover,.new-portal:focus-visible,.converter-open:hover,.converter-open:focus-visible{background:transparent;color:inherit}
.platforms a:hover img,.platforms a:focus-visible img{filter:grayscale(1)}
.archive-entry:hover .archive-entry-arrow,.new-portal:hover .new-portal-mark{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){.platforms a img,.platforms a span,.platforms a b,.archive-entry,.new-portal{transition:none!important;transform:none!important}}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.language-switch button{transition:transform .35s cubic-bezier(.2,.7,.2,1)}.language-switch button:hover{transform:translateY(-2px)}}
/* Fine motion. Hover changes position only; selected language remains flush inside its frame. */
.site-header nav a:hover,.site-header nav a:focus-visible,.track-list a:hover,.platforms a:hover,.platforms a:focus-visible,.show-chapters button:hover,.carousel-controls button:hover,.converter-open:hover,.archive-entry:hover,.new-portal:hover{background:transparent;color:inherit}
.site-header .language-switch button:hover,.site-header .language-switch button:focus-visible{transform:none!important}
.site-header .language-switch button.active:hover,.site-header .language-switch button.active:focus-visible{background:var(--ink);color:var(--paper)}
.site-header .language-switch button:not(.active):hover{background:transparent;color:var(--ink)}
.hero .eyebrow,.hero .welcome,.hero .signal span,.album-heading h2,.album-section .section-label span,.album-section .track-title,.album-section .unlinked-track{transition:transform .55s cubic-bezier(.2,.72,.19,1);will-change:transform}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
.hero .eyebrow:hover,.hero .welcome:hover,.hero .signal span:hover,.album-heading h2:hover,.album-section .section-label span:hover,.album-section .unlinked-track:hover{transform:translateY(-4px)}
.album-section .track-list a:hover .track-title{transform:translateY(-3px)}
}
.hero .eyebrow.is-touched,.hero .welcome.is-touched,.hero .signal span.is-touched{transform:translateY(-4px)}
.hero .eyebrow,.hero .welcome{display:table}.hero .signal span{position:relative}
.signal.entered span{animation-fill-mode:both}
.album-section .unlinked-track{display:grid}
.footer-contact-label{display:block;font-size:clamp(16px,1.35vw,19px);line-height:1.65}.footer-contact .footer-mail{display:inline-block;font-size:clamp(15px,1.15vw,17px);line-height:1.65;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.footer-contact .footer-mail:hover{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.hero .eyebrow,.hero .welcome,.hero .signal span,.album-heading h2,.album-section .section-label span,.album-section .track-title,.album-section .unlinked-track{transition:none!important;transform:none!important}}
.site-header nav a:hover,.text-link:hover,footer a:hover,.track-list a:hover{color:inherit}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.album-section .text-link:hover{transform:translateY(-3px)}}
/* Final link-state pass: movement, never an inverted fill. */
.text-link[href]:hover,.text-link[href]:focus-visible,.album-details>.text-link:hover,.qiu-section .converter-open:hover,.archive-entry:hover,.archive-entry:focus-visible,.new-portal:hover,.new-portal:focus-visible,.carousel-controls button:hover:not(:disabled),dialog button:hover{background:transparent;color:inherit}
.platforms a:hover,.platforms a:focus-visible,.track-list a:hover,.track-list a:focus-visible,.site-header nav a:hover{background:transparent;color:inherit}
/* The whole bar row is a generous target; only the thin inner strokes move. */
.hero .signal{align-items:stretch;gap:6px;min-height:44px;margin-top:calc(6vh - 18px);margin-bottom:calc(6vh - 18px)}
.hero .signal span,.hero .signal span:nth-child(2){height:44px;background:transparent;position:relative;cursor:pointer;transform:none!important}
.hero .signal span::after{content:"";position:absolute;left:0;right:0;top:50%;height:5px;background:#000;transform:translateY(calc(-50% - var(--lift,0px))) scaleY(var(--height,1));transform-origin:center;transition:transform .62s cubic-bezier(.16,.82,.19,1)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
.hero .signal[data-active="1"] span:nth-child(1)::after,.hero .signal[data-active="2"] span:nth-child(2)::after,.hero .signal[data-active="3"] span:nth-child(3)::after{--lift:8px;--height:1}
.hero .signal[data-active="1"] span:nth-child(2)::after,.hero .signal[data-active="2"] span:nth-child(1)::after,.hero .signal[data-active="2"] span:nth-child(3)::after,.hero .signal[data-active="3"] span:nth-child(2)::after{--lift:3px;--height:1}
}
/* Touch receives the same pattern. */
.hero .signal[data-active="1"] span:nth-child(1)::after,.hero .signal[data-active="2"] span:nth-child(2)::after,.hero .signal[data-active="3"] span:nth-child(3)::after{--lift:8px;--height:1}
.hero .signal[data-active="1"] span:nth-child(2)::after,.hero .signal[data-active="2"] span:nth-child(1)::after,.hero .signal[data-active="2"] span:nth-child(3)::after,.hero .signal[data-active="3"] span:nth-child(2)::after{--lift:3px;--height:1}
.hero .eyebrow.is-touched,.album-heading h2.is-touched{transform:translateY(-5px)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.hero .eyebrow:hover,.album-heading h2:hover{transform:translateY(-5px)}}
@media(prefers-reduced-motion:reduce){.hero .signal span::after{transition:none;--lift:0px!important;--height:1!important}}
/* Section titles respond without changing color or affecting surrounding layout. */
.hover-title{transition:transform .55s cubic-bezier(.2,.72,.19,1);will-change:transform}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.hover-title:hover{transform:translateY(-5px)}}
.hover-title.touch-lift{transform:translateY(-5px)}
@media(prefers-reduced-motion:reduce){.hover-title{transition:none;transform:none!important}}
/* Give the small index and Qiuyu example a shared, discreet touch response. */
.hero .eyebrow{position:relative;transform-origin:left center}
.hero .eyebrow::before{content:"";position:absolute;inset:-10px}
.formula>div strong,.formula>div code,.formula p span{display:inline-block;transition:transform .55s cubic-bezier(.2,.72,.19,1);will-change:transform}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
.hero .eyebrow:hover{transform:translateY(-7px) rotate(-.6deg)}
.formula>div strong:hover,.formula>div code:hover,.formula p span:hover{transform:translateY(-5px)}
}
.hero .eyebrow.is-touched{transform:translateY(-7px) rotate(-.6deg)}
.formula>div strong.is-touched,.formula>div code.is-touched,.formula p span.is-touched{transform:translateY(-5px)}
@media(prefers-reduced-motion:reduce){.hero .eyebrow,.formula>div strong,.formula>div code,.formula p span{transition:none!important;transform:none!important}}
/* The small cover index has its own clearly visible response. */
.hero .eyebrow{display:inline-flex;align-items:center;min-height:42px;margin-top:-10px}
.hero .eyebrow .eyebrow-mark{display:inline-block;transform-origin:center;transition:transform .58s cubic-bezier(.18,.78,.19,1)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.hero .eyebrow:hover{transform:none}.hero .eyebrow:hover .eyebrow-mark{transform:translateY(-8px) rotate(-2deg) scale(1.08)}}
.hero .eyebrow.is-touched{transform:none}.hero .eyebrow.is-touched .eyebrow-mark{transform:translateY(-8px) rotate(-2deg) scale(1.08)}
@media(prefers-reduced-motion:reduce){.hero .eyebrow .eyebrow-mark{transition:none;transform:none!important}}
/* Keep the tiny cover index above the large wordmark's hit area. */
.hero .eyebrow{z-index:3;isolation:isolate;cursor:pointer;min-width:58px}
.hero .eyebrow::before{inset:-12px -10px}
footer .site-credit{display:inline-block;font-size:11px;font-weight:300;letter-spacing:.06em;margin-top:14px;color:#000}
/* Match the two footer columns while keeping the address on its own line. */
footer{align-items:stretch}
footer>div:first-child{display:flex;flex-direction:column;align-items:flex-start}
.footer-contact{display:flex;flex-direction:column;align-items:flex-end;text-align:right}
.footer-contact .footer-mail{display:inline-block;font-size:clamp(15px,1.15vw,17px)}
.footer-contact .site-credit{display:block;margin-top:auto;text-align:right;font-size:11px;font-weight:300;letter-spacing:.06em;color:#000;line-height:1.4}
.show-track figcaption{justify-content:flex-end;text-align:right}
.show-track figcaption span{margin-left:auto}
.archive-entry{max-width:1120px;display:inline-flex;gap:15px;align-items:center;margin:34px 0 0;padding:11px 0;border:0;border-bottom:1px solid var(--ink)}
.archive-entry-index{font-size:11px}.archive-entry strong{font:400 16px/1.4 "Avenir Next","PingFang SC",sans-serif;letter-spacing:0}.archive-entry-arrow{font-size:18px}
@media(max-width:760px){.footer-contact{align-items:flex-start;text-align:left}.footer-contact .site-credit{margin-top:14px;text-align:left}.archive-entry{display:inline-flex;min-height:0;gap:10px;padding:10px 0;margin-top:26px}.archive-entry-index{display:none}.archive-entry strong{font-size:15px}}
/* 002 archive appears as a small, editorial route beneath the runway. */
.archive-entry{display:flex;flex-direction:column;align-items:flex-start;gap:26px;max-width:none;width:100%;margin:42px 0 0;padding:23px 0 0;border:0;border-top:1px solid var(--ink)}
.archive-entry-index{font:400 23px/1.2 "Avenir Next","PingFang SC",sans-serif;letter-spacing:0}
.archive-entry .text-link{display:inline-flex;align-items:center;gap:18px;font-size:20px;line-height:1.3;padding:0 0 4px;border-bottom:1px solid currentColor}
.archive-entry .archive-entry-arrow{font-size:22px;line-height:1}
.archive-entry:hover{transform:none;background:transparent;color:inherit}
.archive-entry .text-link:hover{transform:translateY(-3px)}
/* Start each destination at the sticky header edge, without the previous panel showing above it. */
#music,#show,#album-003,#language{scroll-margin-top:78px}
@media(max-width:760px){.archive-entry{display:flex;gap:18px;margin-top:30px;padding-top:20px}.archive-entry-index{display:block;font-size:20px}.archive-entry .text-link{font-size:17px}#music,#show,#album-003,#language{scroll-margin-top:116px}}
/* The archive route belongs directly below the 002 chapter number. */
.show-context .context-meta .archive-route{display:inline-flex;align-items:center;gap:16px;align-self:flex-start;font:400 18px/1.4 "Avenir Next","PingFang SC",sans-serif;border:0;padding:0}
.show-context .archive-route span:first-child{border-bottom:1px solid currentColor;padding-bottom:3px}
.show-context .archive-route span:last-child{font-size:21px;line-height:1}
@media(max-width:760px){.show-context .context-meta .archive-route{font-size:16px}}
/* Keep the contextual chapter compact and its copy aligned to the right column. */
.show-context{margin-top:23px;padding-top:18px;column-gap:48px}
.show-context .context-copy{grid-column:2;justify-self:end;width:100%}
.show-context .archive-route::after{margin-left:0}
.show-context .archive-route span:last-child{font-size:inherit;line-height:inherit}
footer .site-credit::after{content:none!important;display:none!important}
@media(max-width:760px){.show-context{margin-top:19px;gap:20px}.show-context .context-copy{grid-column:1}}
/* Keep the full site navigation available on narrow screens. */
@media(max-width:760px){
  body:not(.archive-page) .site-header{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;gap:0 12px;padding:14px 5vw 0;min-height:0}
  body:not(.archive-page) .site-header .wordmark{grid-column:1;grid-row:1}
  body:not(.archive-page) .site-header .language-switch{grid-column:2;grid-row:1}
  body:not(.archive-page) .site-header nav{display:flex;grid-column:1/-1;grid-row:2;gap:22px;width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;white-space:nowrap;flex-wrap:nowrap;padding:12px 0 13px;font-size:14px}
  body:not(.archive-page) .site-header nav::-webkit-scrollbar{display:none}
  body:not(.archive-page) .site-header nav a{flex:0 0 auto}
  .hero{min-height:calc(100svh - 110px);padding-top:7vh}
  #top{scroll-margin-top:110px}
  #music,#show,#album-003,#language,#converter{scroll-margin-top:110px}
}
/* Returning from a subpage opens the hero in its final state. */
html.returning-home .hero .entered,html.returning-home .hero .signal.entered span{animation:none!important}
/* Mobile keeps the mark and language switch; section routes remain in the page. */
@media(max-width:760px){
  .site-header,body:not(.archive-page) .site-header{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto;min-height:64px;padding:15px 5vw;gap:12px}
  .site-header .wordmark,body:not(.archive-page) .site-header .wordmark{grid-column:1;grid-row:1}
  .site-header .language-switch,body:not(.archive-page) .site-header .language-switch{grid-column:2;grid-row:1}
  .site-header nav,body:not(.archive-page) .site-header nav,.archive-page .site-header nav,.quiet-page .site-header nav{display:none!important}
  .hero{min-height:calc(100svh - 64px)}
  #top,#music,#show,#album-003,#language,#converter{scroll-margin-top:70px}
}

/* Resolve saved language before translated text becomes visible. */
html[data-language-pending] [data-i18n],html[data-language-pending] [data-copy],html[data-language-pending] [data-label],html[data-language-pending] #archive-content{visibility:hidden}
/* The retired opening animation must not replay when returning home. */
html.returning-home .hero .entered,html.returning-home .hero .signal.entered span{animation:none!important}