/* A neutral editorial frame, with the work carrying its own colour. */
:root{--paper:#f5f5f1;--ink:#242623;--muted:#6c7068;--line:#d8dbd2;--edition-accent:#245ae8}
.header{background:#f5f5f1f5;border-bottom-color:var(--line)}
.header nav a,.header nav button{font-size:13px;letter-spacing:0;color:var(--ink)}
.header nav>[data-contact]{border-bottom-color:#6b7167}
.hero{padding-top:29px;padding-bottom:32px}.hero-line{margin-top:30px}.hero .name-signature{width:min(1000px,80%)}
.hero-top,.hero-top>span:last-child,.hero-line>p{color:#656b61}.hero-intro{padding-top:25px}.hero-intro>p{font-size:16px;color:#3e443a}.hero-intro>a{font-size:13px;color:#383e33}
.work-nav{padding-top:23px;padding-bottom:25px}.work-controls{gap:30px}.filters button{color:#6b7165}.filters button[aria-pressed=true]{color:#242923}.view-switch button[aria-pressed=true]{color:#20291c;background:#e8eae2}
.projects{row-gap:76px;column-gap:34px}.caption{padding-top:18px}.caption h2,.showcase-project .caption h2{font-size:17px;font-weight:500}.caption>span:not(.caption-arrow),.showcase-project .caption>span:not(.caption-arrow){font-size:12px;color:#73796c}.caption h2::before{color:#858d7c}
.caption-arrow{transition:transform .2s,color .2s}.project:hover .caption-arrow{transform:translate(2px,-2px);color:var(--edition-accent)}.caption h2 button:hover{color:var(--edition-accent)}
.project .cover-action{border:0;color:#283326;background:#f7f8f1f2}
.projects .project[data-work=aura]>.cover.authored-cover[data-open],.projects .project[data-work=offset]>.cover.authored-cover[data-open]{height:var(--flat-height);aspect-ratio:var(--flat-aspect);min-height:0}
dialog#project-dialog{width:100vw;max-width:1600px;height:100dvh;max-height:100dvh;margin:0 auto;border:0;border-radius:0;background:var(--paper)}
#project-dialog>.dialog-toolbar{background:#f5f5f1f5;border-bottom-color:var(--line);padding:13px 5%}
.dialog-toolbar>span,.dialog-toolbar button,.dialog-toolbar .dialog-close{color:#535f49}.detail-head{padding:45px 6% 36px;display:grid;grid-template-columns:1.2fr 1fr;column-gap:55px}
.detail-head>.small-label{grid-column:1/-1;color:#747d69}.detail-head>h2{grid-column:1;font-size:clamp(34px,4vw,60px);font-weight:500;letter-spacing:-.025em;margin:23px 0 0;line-height:1.4}
.detail-head>p{grid-column:2;align-self:end;margin:0 0 4px;font-size:15px;line-height:1.85;color:#626d56}
.detail-head>.case-meta{grid-column:1/-1;grid-template-columns:1.2fr 1fr;column-gap:55px;margin-top:28px;padding-top:20px}.case-meta dt{color:#77836b}.case-meta dd{color:#58654b}
.case-context{padding-top:38px;padding-bottom:38px}.case-context h3{font-size:26px;font-weight:500;color:#35452a}.case-context p{color:#69775b;font-size:15px}.case-overline{color:#758466}
.art-sheet-toolbar{padding-top:15px;border-top:1px solid var(--line);margin-bottom:12px}.art-sheet-toolbar>span{font-size:12px;color:#68785a}.art-sheet-actions button{color:#4b603c}.art-sheet-actions button:hover{color:var(--edition-accent)}
.art-view-nav{display:flex;gap:25px;align-items:center;margin-bottom:18px}.art-view-nav button{padding:8px 0;border-bottom:1px solid transparent;font-size:13px;color:#718260}.art-view-nav button[aria-pressed=true]{color:#293d1e;border-bottom-color:#4d6940}.art-view-nav button:hover{color:var(--edition-accent)}
.art-sheet>.authored-cover.is-series-view{aspect-ratio:1.7;max-width:none;width:100%;margin-inline:0}
.about-content>h2{font-weight:500;color:#33442a}.about-content>h2>span{color:#77836b}.about-content>p{color:#66755b}.contact-block .contact-mail{color:#3d5630}.contact-public-phone,.footer>span{color:#70825e}
/* Wenshan: an original typographic identity and a sparse line drawing. */
.scent-art{background:#dce1e1;color:#344950}.scent-art .art-registration{font-size:1.45cqw;color:#617579}
.scent-brand{position:absolute;left:7%;top:21%;display:flex;flex-direction:column;gap:1.5cqw}.scent-brand>strong{font-size:7.5cqw;font-weight:500;letter-spacing:.05em;line-height:1.3}.scent-brand>span{font-size:1.5cqw;letter-spacing:.2em}
.scent-title{position:absolute;right:9%;top:20%;display:flex;flex-direction:column;gap:2cqw}.scent-title>strong{font-size:13cqw;font-weight:400;line-height:1.12;letter-spacing:.04em}.scent-title>span{font-size:1.4cqw;letter-spacing:.14em}
.scent-drawing{position:absolute;width:47%;height:25%;left:5%;bottom:32%;opacity:.7}.scent-spec{position:absolute;left:7%;bottom:15%;display:flex;flex-direction:column;gap:.9cqw;font-size:1.45cqw}.scent-spec>strong{font-size:2.4cqw;font-weight:500}
.scent-foot{position:absolute;left:7%;right:7%;bottom:6%;border-top:1px solid #8d9fa04a;padding-top:2.2cqw;display:flex;justify-content:space-between;font-size:1.2cqw;color:#566e72}
/* Shanxu: folded-paper geometry. No photo mockup or borrowed brand mark. */
.tea-art{background:#e5e6dc;color:#294c3d}.tea-art .art-registration{font-size:1.45cqw}.tea-brand{position:absolute;left:8%;top:19%;bottom:25%;display:flex;flex-direction:column;justify-content:space-between}.tea-brand>strong{font-size:14cqw;line-height:1.06;font-weight:500;letter-spacing:.02em}.tea-brand>span{font-size:1.5cqw;line-height:1.8;letter-spacing:.06em}
.tea-fold{position:absolute;right:10%;top:16%;bottom:26%;width:45%;background:#f6f5e9;clip-path:polygon(0 0,86% 0,100% 10%,100% 100%,0 100%);padding:3.5cqw;display:flex;flex-direction:column;align-items:center;text-align:center}.tea-fold>span{font-size:1.5cqw;align-self:flex-start}.tea-fold>svg{width:77%;height:62%;margin:2cqw 0;color:#426b4a}.tea-fold>strong{font-size:3.4cqw;font-weight:500;letter-spacing:.16em}.tea-fold>small{font-size:1.1cqw;letter-spacing:.08em;margin-top:1.5cqw}
.tea-categories{position:absolute;left:8%;right:8%;bottom:6.5%;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #90a38a;padding-top:2.4cqw}.tea-categories>span{display:grid;grid-template-columns:auto 1fr;gap:.8cqw 1.5cqw;align-items:baseline}.tea-categories i{grid-row:span 2;font:normal 1.3cqw monospace;padding-top:.2cqw}.tea-categories strong{font-size:2.4cqw;font-weight:400;letter-spacing:.1em}.tea-categories small{font-size:.95cqw;letter-spacing:.06em}
/* Flat series boards: labels share a grammar, not a fake production photograph. */
.system-art{background:#e8eae4;color:#35472c}.system-heading,.system-footer{position:absolute;left:6%;right:6%;display:flex;justify-content:space-between;align-items:baseline;gap:3cqw;font-size:1.45cqw;line-height:1.5}.system-heading{top:6%;border-bottom:1px solid currentColor;padding-bottom:2cqw}.system-footer{bottom:6%;font-size:1.3cqw}.system-footer>span:last-child{text-align:right}
.system-grid{position:absolute;inset:22% 6% 19%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.7cqw}.system-label{position:relative;display:flex;flex-direction:column;background:var(--label-bg);color:var(--label-ink);padding:2.5cqw 2cqw;border-top:.7cqw solid currentColor;overflow:hidden}
.system-label-head{display:flex;flex-direction:column;gap:.8cqw}.system-label-head>b{font-size:3.8cqw;line-height:1.3;font-weight:500;letter-spacing:.04em}.system-label-head>span{font-size:1cqw;letter-spacing:.1em}.system-number{font-size:1.15cqw;margin-top:auto;border-top:1px solid currentColor;padding-top:1.1cqw}
.system-product{font-size:3cqw;font-weight:500;line-height:1.5;letter-spacing:.01em;margin-top:.7cqw}.system-latin{font-size:.9cqw;letter-spacing:.04em;margin-top:.6cqw}.system-label-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:1cqw;margin-top:2cqw;font-size:1.02cqw}.system-label-bottom>span:last-child{font-size:.7cqw;letter-spacing:.03em}
.system-serein{background:#d9e0e3;color:#3a5572}.system-coffee{background:#e4e3d9;color:#354332}.system-coffee .system-label{border:0}.system-coffee .system-label-head>b{font-size:4.4cqw;font-weight:700}.system-scent{background:#d6dfdc;color:#3f5c54}.system-tea{background:#d8ddce;color:#36573e}
.system-scent .system-number{font:normal 6cqw/1.2 var(--font-ui);border:0;padding:0}.system-scent .system-product{font-size:3.8cqw;font-weight:400}.system-tea .system-label{border:1px solid #536d4955}.system-tea .system-label-head>b{letter-spacing:.12em}.system-tea .system-product{font-size:3.9cqw;font-weight:400}
/* Applications retain the same typography and colour decisions. */
.application-serein{background:#dce1df;color:#354f6c}.application-poster{position:absolute;left:6%;top:22%;bottom:18%;width:48%;background:#416181;color:#f3f1e8;padding:3cqw;display:flex;flex-direction:column;justify-content:space-between}.application-poster>span{font-size:1cqw;letter-spacing:.03em}.application-poster>strong{font-size:7cqw;font-weight:500}.application-poster>p{font-size:3.3cqw;line-height:1.55;margin:0 0 auto;padding-top:2cqw}.application-poster>span:last-child{font-size:1.2cqw}
.application-stationery{position:absolute;left:58%;right:6%;top:22%;bottom:18%;display:grid;grid-template-rows:.8fr 1.2fr;gap:2cqw}.serein-card{background:#f3f1e8;position:relative;display:flex;justify-content:space-between;padding:2.5cqw}.serein-card>b{font-size:3.4cqw;font-weight:500}.serein-card>span{font-size:.9cqw;line-height:1.8}.serein-card>i{position:absolute;bottom:2cqw;left:2.5cqw;right:2.5cqw;height:.25cqw;background:currentColor}
.serein-small-label{background:#becbd5;padding:2.5cqw;display:flex;justify-content:space-between;flex-direction:column}.serein-small-label>span{font-size:1.1cqw}.serein-small-label>strong{font-size:6cqw;font-weight:400;align-self:center;line-height:1.1}
.coffee-extension{background:#e6decf;color:#423b2e}.coffee-poster-main{position:absolute;left:6%;top:22%;bottom:18%;width:56%;background:#df6436;color:#222e24;padding:3cqw;display:flex;flex-direction:column;justify-content:space-between}.coffee-poster-main>span{font-size:1.2cqw;letter-spacing:.04em}.coffee-poster-main>strong{font-size:9cqw;font-weight:700;line-height:1.05}.coffee-poster-side{position:absolute;left:65%;right:6%;top:22%;bottom:18%;padding:2.8cqw;background:#f2e9d2;display:flex;flex-direction:column}.coffee-poster-side>b{font-size:4cqw;font-weight:700}.coffee-poster-side>span{font-size:1.2cqw;line-height:1.8}.coffee-poster-side>svg{width:85%;height:35%;margin:auto;color:#986f4b}.coffee-poster-side>small{font-size:.9cqw;margin-top:2cqw}
.running-system{background:#dcded1;color:#333e29}.running-posters{position:absolute;inset:22% 6% 18%;display:grid;grid-template-columns:repeat(3,1fr);gap:2.5cqw}.running-posters>div{position:relative;padding:2cqw;background:#273129;color:#e0e7d4;display:flex;flex-direction:column;overflow:hidden}.running-posters>div:nth-child(2){background:#e75b2a;color:#243126}.running-posters>div:nth-child(3){background:#edeacb;color:#243126}.running-posters span{font-size:1.1cqw}.running-posters strong{margin-top:auto;font-size:6.2cqw;line-height:1.12;letter-spacing:-.07em;font-weight:800}.running-posters>div:last-child strong{font-size:4.9cqw}.running-posters i{position:absolute;right:1.5cqw;bottom:1cqw;font:normal 7cqw/1 var(--font-ui);opacity:.7}
.running-banner{background:#e65c30;color:#243126}.running-banner>strong{position:absolute;left:7%;top:22%;font-size:13cqw;line-height:1.03;letter-spacing:-.055em;font-weight:800}.running-banner>strong>span{margin-left:17cqw}.running-banner>svg{position:absolute;right:8%;top:27%;width:30%;height:48%;color:#ebebce}
@media(min-width:1101px){.project[data-work=offset]{grid-column:span 7}.project[data-work=noct]{grid-column:span 5}}
@media(max-width:1100px){.hero .name-signature{width:80%}.projects{column-gap:25px;row-gap:57px}.detail-head{column-gap:32px}.detail-head>.case-meta{column-gap:32px}.caption h2,.showcase-project .caption h2{font-size:16px}}
@media(max-width:760px){
  .header nav a,.header nav button{font-size:12px}.header nav{gap:19px}.hero{padding-top:24px;padding-bottom:28px}.hero .name-signature{width:100%}.hero-line{margin-top:25px}.hero-intro{padding-top:22px;align-items:baseline}.hero-intro>p{font-size:14px}.hero-intro>a{font-size:12px}.hero-top,.hero-top>span:last-child{font-size:10px}
  .work-controls{gap:16px}.work-nav{padding-top:20px;padding-bottom:22px}.projects{row-gap:41px}.caption h2,.showcase-project .caption h2{font-size:15px}.caption>span:not(.caption-arrow),.showcase-project .caption>span:not(.caption-arrow){font-size:11px}.caption{padding-top:14px}
  #project-dialog>.dialog-toolbar{padding:10px 12px}.detail-head{display:block;padding:30px 23px 27px}.detail-head>h2{font-size:29px;margin:17px 0 16px;letter-spacing:0}.detail-head>p{font-size:14px;line-height:1.85}.detail-head>.case-meta{grid-template-columns:1fr;gap:16px;margin-top:23px;padding-top:18px}.case-meta dt{font-size:10px}.case-meta dd{font-size:13px}.case-context h3{font-size:23px}.case-context p{font-size:14px}
  .art-view-nav{gap:22px;margin-bottom:14px}.art-view-nav button{font-size:12px}.art-sheet-toolbar{gap:10px}.art-sheet-toolbar>span{font-size:11px}.art-sheet-actions{gap:12px}.art-sheet-actions button{font-size:11px}.art-sheet>.authored-cover.is-series-view{aspect-ratio:1.05}
  .scent-art .art-registration,.tea-art .art-registration{font-size:1.9cqw}.scent-brand{top:22%}.scent-brand>strong{font-size:9cqw}.scent-brand>span{font-size:1.8cqw}.scent-title{top:24%;right:8%}.scent-title>strong{font-size:15cqw}.scent-title>span{font-size:1.65cqw}.scent-drawing{height:25%;bottom:32%}.scent-spec{bottom:14%;font-size:1.8cqw;gap:1.4cqw}.scent-spec>strong{font-size:3cqw}.scent-foot{font-size:1.6cqw}.scent-foot>span:last-child{font-size:1.25cqw}
  .tea-brand>strong{font-size:18cqw}.tea-brand>span{font-size:1.9cqw}.tea-fold{right:8%;width:46%;top:19%;bottom:25%;padding:4cqw}.tea-fold>span{font-size:1.8cqw}.tea-fold>strong{font-size:4cqw}.tea-fold>small{font-size:1.4cqw}.tea-fold>svg{height:60%;margin:3cqw 0}.tea-categories strong{font-size:3cqw}.tea-categories i{font-size:1.65cqw}.tea-categories small{font-size:1.3cqw}
  .system-heading{font-size:1.9cqw}.system-footer{font-size:1.75cqw;align-items:flex-end}.system-footer>span:first-child{max-width:66%}.system-grid{inset:20% 6% 20%;gap:2cqw}.system-label{padding:3.4cqw 2cqw}.system-label-head>b{font-size:4.7cqw}.system-label-head>span{font-size:1.5cqw}.system-number{font-size:1.65cqw}.system-product{font-size:3.6cqw;margin-top:2cqw}.system-latin{font-size:1.35cqw;min-height:3.7cqw}.system-label-bottom{flex-direction:column;align-items:flex-start;font-size:1.65cqw;margin-top:3cqw;gap:1.2cqw}.system-label-bottom>span:last-child{font-size:1.1cqw}.system-coffee .system-label-head>b{font-size:4.8cqw}.system-scent .system-number{font-size:7.2cqw}.system-scent .system-product,.system-tea .system-product{font-size:4.8cqw}
  .application-poster,.application-stationery,.coffee-poster-main,.coffee-poster-side{top:20%;bottom:20%}.application-poster>span{font-size:1.4cqw}.application-poster>strong{font-size:8.4cqw}.application-poster>p{font-size:4.6cqw;line-height:1.5}.application-poster>span:last-child{font-size:1.6cqw}.serein-card>b{font-size:4.2cqw}.serein-card>span{font-size:1.4cqw}.serein-small-label>span{font-size:1.6cqw}.serein-small-label>strong{font-size:9cqw}.coffee-poster-main>span,.coffee-poster-side>span{font-size:1.6cqw}.coffee-poster-main>strong{font-size:12cqw}.coffee-poster-side>b{font-size:5.1cqw}.coffee-poster-side>small{font-size:1.45cqw}.running-posters{top:20%;bottom:20%}.running-posters span{font-size:1.6cqw}.running-posters strong{font-size:8cqw}.running-posters>div:last-child strong{font-size:6cqw}.running-posters i{bottom:30%;font-size:9cqw}.running-banner>strong{top:25%;font-size:18cqw}.running-banner>svg{width:31%;height:35%;top:42%;right:7%}
}
@media(max-width:370px){.header nav{gap:13px}.header nav a,.header nav button{font-size:11px}.hero-intro{gap:12px}.hero-intro>p{font-size:13px}.hero-intro>a{font-size:11px}.art-sheet-actions{gap:9px}.art-sheet-actions button{font-size:10px}.art-sheet-toolbar>span{font-size:10px}.art-view-nav{gap:19px}.art-view-nav button{font-size:11px}.detail-head>h2{font-size:27px}}
@media(prefers-reduced-motion:reduce){.caption-arrow{transition:none}.project:hover .caption-arrow{transform:none}}
