.works-scene[data-project="graphic"] { width:min(1380px,90%); }
.works-scene[data-project="graphic"]>.works-heading { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1fr); gap:4px 9%; max-width:none; padding:0; margin:12px 0 20px; align-items:center; background:none; }
.works-scene[data-project="graphic"] .works-heading>.scene-eyebrow { grid-column:1; font-size:10px; margin:0; }
.works-scene[data-project="graphic"] .works-heading h1 { grid-column:1; grid-row:2; font:32px/1.4 "Songti SC",serif; margin:0; }
.works-scene[data-project="graphic"] .works-heading #worksSummary { grid-column:2; grid-row:1 / 3; max-width:440px; font-size:12px; line-height:1.9; }
.works-scene[data-project="graphic"] .chapter-stamp,.works-scene[data-project="graphic"] .chapter-recipe { display:none; }
.works-scene[data-project="graphic"] .reading-current { display:flex; align-items:center; justify-content:flex-end; white-space:nowrap; gap:7px; }
.works-scene[data-project="graphic"] .reading-current[hidden] { display:none; }
.works-scene[data-project="graphic"] .reading-current>span { overflow:hidden; text-overflow:ellipsis; }
.graphic-gallery .gallery-toolbar { align-items:stretch; gap:20px; border-block:1px solid #b5d8e7; padding:0; background:#f5fbfe; }
.graphic-gallery .gallery-filters { flex:1; gap:0 8px; counter-reset:graphic-tabs; padding:0; }
.graphic-gallery .gallery-filters button { display:inline-flex; align-items:center; gap:10px; padding:16px 12px; font-size:12px; }
.graphic-gallery .gallery-filters button::before { counter-increment:graphic-tabs; content:"0" counter(graphic-tabs); color:#89aebf; font:10px Georgia,serif; }
.graphic-gallery .gallery-filters button[aria-pressed="true"] { background:#f5e7f0; }
.graphic-gallery .gallery-filters button[aria-pressed="true"]::before { color:#a43e75; }
.graphic-gallery .gallery-count { align-self:center; padding-right:16px; font-size:10px; }
.graphic-stage-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:20px 0 0; padding:0 3%; }
.graphic-stage-heading[hidden],.poster-card-index[hidden] { display:none; }
.graphic-stage-heading>div>span { font-size:9px; color:#6d92a4; }
.graphic-stage-heading h2 { font:22px/1.6 "Songti SC",serif; color:#a43e75; margin-top:7px; }
.poster-series-label { font-size:11px; line-height:1.7; color:#648ca0; min-height:19px; margin:3px 0 0; }
.poster-redeal { display:inline-flex; align-items:center; gap:8px; border:0; border-bottom:1px solid #c7a0ba; color:#a43e75; background:none; font-size:11px; min-height:44px; padding:0 4px; flex-shrink:0; }
.poster-redeal>span { font:23px Georgia,serif; }
.graphic-gallery.is-poster-view { --poster-slot:300px; }
.graphic-gallery.is-poster-view .gallery-track { gap:24px; padding:18px calc(50% - var(--poster-slot) / 2) 20px; align-items:flex-start; scroll-padding-inline:calc(50% - var(--poster-slot) / 2); perspective:1600px; scrollbar-width:none; overflow-y:hidden; }
.graphic-gallery.is-poster-view .gallery-track::-webkit-scrollbar { display:none; }
.graphic-gallery.is-poster-view .poster-card { flex:0 0 var(--poster-slot); scroll-snap-align:center; position:relative; padding-top:0; }
.graphic-gallery.is-poster-view .poster-card .work-figure { transform:perspective(1400px) translateY(var(--card-dip,0px)) rotateY(var(--card-turn,0deg)) rotateZ(var(--card-roll,0deg)) scale(var(--card-scale,1)); transform-origin:50% 65%; will-change:transform; }
.graphic-gallery.is-poster-view .poster-card .work-figure>button { height:min(37svh,380px); display:flex; align-items:center; justify-content:center; transition:transform .28s ease; }
.graphic-gallery.is-poster-view .poster-card .work-figure img { width:auto; max-width:100%; height:auto; max-height:100%; border-radius:4px; object-fit:contain; box-shadow:0 var(--card-shadow,18px) 28px #42687c2b,0 0 0 1px #d2e3ec; }
.graphic-gallery.is-poster-view .poster-card .work-figure figcaption { opacity:.6; transition:opacity .3s; display:flex; justify-content:center; font-size:10px; margin-top:17px; }
.graphic-gallery.is-poster-view .poster-card.is-centred .work-figure figcaption { opacity:1; }
.graphic-gallery.is-poster-view .poster-card .figure-zoom { margin-left:2px; }
.graphic-gallery.is-poster-view .gallery-bottom { margin:0 3%; min-height:58px; border-block:1px solid #c4dfe9; gap:16px; }
.graphic-gallery.is-poster-view .gallery-bottom>span:first-child { color:#a43e75; font:16px/1.6 "Songti SC",serif; }
.poster-card-index { position:relative; display:flex; justify-content:flex-start; width:max-content; gap:12px; margin:16px auto 0; padding:8px 5px 16px; overflow:auto; scrollbar-width:thin; max-width:100%; }
.poster-card-index button { position:relative; flex:0 0 54px; width:54px; height:78px; padding:4px; border:1px solid transparent; border-radius:3px; background:none; opacity:.6; transform:translateY(4px); transition:transform .3s,opacity .3s,border-color .3s; }
.poster-card-index button img { width:100%; height:100%; object-fit:contain; display:block; }
.poster-card-index button>span { position:absolute; left:50%; bottom:-15px; translate:-50% 0; font:9px Georgia,serif; color:#648ca0; }
.poster-card-index button[aria-pressed="true"],.poster-card-index button:hover { opacity:1; transform:translateY(-4px); border-color:#cf8fb4; }
.poster-card-index button:focus-visible,.poster-redeal:focus-visible { outline:2px solid #a43e75; outline-offset:4px; }
.graphic-gallery .gallery-design-notes { gap:5%; margin:45px 3% 0; border-top:1px dashed #bbd8e5; padding-top:25px; }
.graphic-gallery .gallery-design-notes dd { font-size:12px; }
.graphic-gallery .gallery-design-notes dt { font-size:12px; }
.graphic-gallery.is-store-view:not(.is-ui-view) .gallery-design-notes { margin-bottom:55px; }
.graphic-gallery.is-store-view .gallery-track { max-width:1120px; margin:auto; gap:100px; padding:0 0 35px; }
.graphic-gallery.is-store-view:not(.is-ui-view) .gallery-hanger { display:grid; grid-template-columns:155px minmax(0,1fr); gap:45px; padding-top:30px; border-top:1px solid #bddae7; }
.graphic-folio-label { min-width:0; align-self:start; position:sticky; top:220px; }
.graphic-folio-label>span { font:64px/1.1 Georgia,serif; color:#c9dfea; }
.graphic-folio-label h2 { font:20px/1.8 "Songti SC",serif; color:#a43e75; margin-top:22px; }
.graphic-gallery.is-store-view:not(.is-ui-view) .gallery-hanger:nth-child(2n) { grid-template-columns:minmax(0,1fr) 155px; }
.graphic-gallery.is-store-view:not(.is-ui-view) .gallery-hanger:nth-child(2n) .graphic-folio-label { order:2; }
.graphic-gallery.is-store-view:not(.is-ui-view) .work-figure { width:100%; margin:0; border:0; padding:0; background:none; }
.graphic-gallery.is-store-view:not(.is-ui-view) .work-figure img { box-shadow:0 10px 24px #52788e17; }
.graphic-project-heading { text-align:center; padding:55px 0 32px; }
.graphic-project-heading>span { font-size:10px; color:#62899d; }
.graphic-project-heading h2 { font:34px/1.6 "Songti SC",serif; color:#a43e75; margin:15px 0; }
.graphic-project-heading p { font-size:13px; line-height:1.9; color:#53778d; }
.graphic-gallery.is-ui-view .gallery-track { max-width:850px; background:white; border-top:6px solid #ffdc32; box-shadow:0 15px 50px #466c801c; padding:0; }
.graphic-gallery.is-ui-view .gallery-hanger { width:100%; max-width:none; }
.graphic-gallery.is-ui-view .work-figure { padding:0; border:0; background:white; }
.graphic-gallery.is-ui-view .work-figure>button { padding:0; }
.graphic-gallery.is-ui-view .work-figure figcaption { padding:10px 20px 20px; }
.graphic-gallery.is-nushu-view .nushu-intro { position:relative; padding:35px 0 10px; }
.graphic-gallery.is-nushu-view .nushu-intro::before { content:"十二言"; display:block; font:12px/1.7 "Songti SC",serif; color:#86a9a8; margin-bottom:20px; }
.graphic-gallery.is-nushu-view .nushu-opening { max-width:1000px; gap:0; perspective:1800px; padding:15px 5% 45px; }
.graphic-gallery.is-nushu-view .nushu-opening .work-figure:first-child { transform:rotateY(10deg) rotateZ(-4deg) translateY(20px); }
.graphic-gallery.is-nushu-view .nushu-opening .work-figure:nth-child(2) { position:relative; z-index:1; margin-top:0; transform:scale(1.07); box-shadow:0 18px 35px #416e7d22; }
.graphic-gallery.is-nushu-view .nushu-opening .work-figure:last-child { transform:rotateY(-10deg) rotateZ(4deg) translateY(20px); }
.graphic-gallery.is-nushu-view .nushu-section { padding-top:30px; border-top:1px solid #c5dddf; }
.graphic-gallery.is-nushu-view .nushu-portrait-grid { gap:55px 28px; }
.graphic-gallery.is-nushu-view .nushu-portrait:nth-child(2n) { padding-top:28px; }
.graphic-gallery.is-packaging-view .packaging-intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.85fr); column-gap:8%; max-width:none; align-items:end; padding:20px 0 30px; border-bottom:1px solid #c8ded5; }
.graphic-gallery.is-packaging-view .packaging-intro>p:first-child { grid-column:1 / -1; }
.graphic-gallery.is-packaging-view .packaging-intro h2 { margin:0; font-size:36px; }
.graphic-gallery.is-packaging-view .packaging-intro>p:last-child { font-size:13px; }
.graphic-gallery.is-packaging-view .packaging-hero { perspective:1500px; }
.graphic-gallery.is-packaging-view .packaging-hero .work-figure { padding:20px; background:#f3f7f3; }
.graphic-gallery.is-packaging-view .packaging-section { border-color:#c8ded5; }
.graphic-gallery.is-packaging-view .packaging-illustration-grid { gap:40px; }
.graphic-gallery.is-packaging-view .packaging-illustration-grid>div { border-top:3px solid #abc8b7; padding-top:20px; }
.graphic-gallery.is-packaging-view .packaging-stage { display:flex; align-items:center; gap:12px; }
.graphic-gallery.is-packaging-view .packaging-stage::after { content:"↓"; margin-left:auto; font-size:24px; color:#8ea59b; }
.graphic-gallery.is-brand-view .brand-scroll { grid-template-columns:160px minmax(0,1fr); gap:50px; }
.graphic-gallery.is-brand-view .scroll-index { border-right:1px solid #bfdce8; padding-right:22px; }
.graphic-gallery.is-brand-view .scroll-progress { right:-1px; width:2px; }
.graphic-gallery.is-brand-view .brand-chapter>header { gap:30px; padding:25px 0; border-block:1px solid #c6dfeb; }
.graphic-gallery.is-brand-view .chapter-orbit { border:0; border-radius:0; font:48px/1 Georgia,serif; color:#b9d8e7; width:70px; height:auto; }
.graphic-gallery.is-brand-view .brand-chapter .work-figure { background:white; box-shadow:5px 7px 0 #e0eef4; transform:none; }
.graphic-gallery.is-brand-view .brand-chapter .work-figure img { border:0; }
.graphic-gallery.is-brand-view .brand-chapter figcaption { padding:10px 16px 18px; }
@media(max-width:1000px) {
 .graphic-gallery .gallery-toolbar { display:block; }
 .graphic-gallery .gallery-count { display:none; }
 .graphic-gallery .gallery-filters { justify-content:space-between; gap:0; }
 .graphic-gallery .gallery-filters button { gap:5px; padding-inline:8px; font-size:11px; }
 .graphic-gallery.is-poster-view { --poster-slot:270px; }
}
@media(max-width:650px) {
 .works-scene[data-project="graphic"]>.works-heading { display:block; margin:15px 0 22px; }
 .works-scene[data-project="graphic"] .works-heading h1 { font-size:30px; margin:6px 0 14px; }
 .works-scene[data-project="graphic"] .works-heading #worksSummary { font-size:11px; }
 .graphic-gallery .gallery-filters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
 .graphic-gallery .gallery-filters button { padding:9px 5px; justify-content:center; gap:4px; }
 .graphic-gallery .gallery-filters button::before { font-size:8px; }
 .graphic-stage-heading { margin:22px 0 0; align-items:flex-end; gap:12px; padding-inline:2%; }
 .graphic-stage-heading h2 { font-size:17px; max-width:185px; }
 .graphic-stage-heading>div>span { font-size:8px; }
 .poster-redeal { font-size:10px; gap:4px; }
 .graphic-gallery.is-poster-view { --poster-slot:245px; }
 .graphic-gallery.is-poster-view .gallery-track { padding-top:20px; gap:16px; }
 .graphic-gallery.is-poster-view .poster-card .work-figure>button { height:355px; }
 .graphic-gallery.is-poster-view .gallery-bottom>span:first-child { font-size:13px; max-width:47%; }
 .graphic-gallery.is-poster-view .gallery-bottom { gap:10px; }
 .poster-card-index { justify-content:flex-start; gap:8px; padding-inline:4px; }
 .poster-card-index button { flex-basis:44px; width:44px; height:64px; }
 .graphic-gallery .gallery-design-notes { grid-template-columns:1fr; gap:20px; margin-top:30px; }
 .graphic-gallery.is-store-view:not(.is-ui-view) .gallery-hanger,.graphic-gallery.is-store-view:not(.is-ui-view) .gallery-hanger:nth-child(2n) { display:block; }
 .graphic-folio-label { position:static; display:flex; align-items:center; gap:18px; margin-bottom:20px; }
 .graphic-folio-label>span { font-size:40px; }
 .graphic-folio-label h2 { margin:0; font-size:18px; }
 .graphic-gallery.is-store-view .gallery-track { gap:65px; }
 .graphic-gallery.is-ui-view .gallery-hanger { display:block; }
 .graphic-project-heading { padding-top:35px; }
 .graphic-project-heading h2 { font-size:27px; }
 .graphic-gallery.is-nushu-view .nushu-opening { padding-inline:2%; padding-bottom:24px; }
 .graphic-gallery.is-nushu-view .nushu-portrait-grid { gap:30px 16px; }
 .graphic-gallery.is-nushu-view .nushu-portrait:nth-child(2n) { padding-top:20px; }
 .graphic-gallery.is-packaging-view .packaging-intro { display:block; }
 .graphic-gallery.is-packaging-view .packaging-intro h2 { font-size:29px; margin:16px 0; }
 .graphic-gallery.is-packaging-view .packaging-hero .work-figure { padding:10px; }
 .graphic-gallery.is-brand-view .brand-scroll { display:block; }
 .graphic-gallery.is-brand-view .scroll-index { border:0; padding-right:0; }
 .graphic-gallery.is-brand-view .chapter-orbit { font-size:34px; width:48px; }
 .graphic-gallery.is-brand-view .brand-chapter>header { gap:15px; }
}
@media(max-height:650px) and (min-width:651px) {
 .graphic-gallery.is-poster-view .poster-card .work-figure>button { height:300px; }
}
@media(prefers-reduced-motion:reduce) {
 .graphic-gallery.is-poster-view .poster-card .work-figure { transform:translateY(var(--card-dip,0px)) rotateZ(var(--card-roll,0deg)) scale(var(--card-scale,1)); }
 .graphic-gallery.is-poster-view .poster-card .work-figure>button,.poster-card-index button { transition:none; }
}
