/* 相遇之境: authored material and foreground, complete in its static frame. */
body.community-gallery .community-page-art { position:relative; isolation:isolate; width:calc(100% - 40px); max-width:1280px; min-width:0; height:220px; margin:22px auto 24px; overflow:hidden; border:1px solid var(--gallery-line); border-radius:3px; background:var(--gallery-white); color:var(--gallery-ink); }
body.community-gallery .community-page-art__picture { position:absolute; inset:0; z-index:0; pointer-events:none; }
.art-material { position:absolute; inset:0; display:block; }
.art-material img { width:100%; height:100%; object-fit:cover; object-position:75% 56%; display:block; }
.art-vector { position:absolute; inset:0; }
.page-art-svg { width:100%; height:100%; display:block; }
body.community-gallery .community-page-art__picture::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,var(--gallery-white) 0%,var(--gallery-white) 34%,transparent 69%); }
body.community-gallery .community-page-art__caption { position:relative; z-index:1; width:45%; height:100%; padding:24px 30px 55px; display:flex; flex-direction:column; justify-content:center; }
body.community-gallery .community-page-art__chapter { font-size:12px; letter-spacing:.16em; line-height:1.7; margin:0 0 8px; color:var(--gallery-muted); }
body.community-gallery .community-page-art__title { font-family:'Noto Serif TC','PMingLiU',serif; font-size:clamp(24px,2.7vw,34px); line-height:1.5; margin:0 0 8px; color:var(--gallery-ink)!important; }
body.community-gallery .community-page-art__copy { font-size:14px; line-height:1.8; margin:0; color:var(--gallery-ink)!important; }
.art-controls { position:absolute; right:12px; bottom:10px; z-index:4; display:flex; gap:6px; }
body.community-gallery .community-page-art__toggle { position:static; display:flex; align-items:center; justify-content:center; gap:7px; min-height:44px; min-width:108px; padding:8px 11px; border:1px solid var(--gallery-line)!important; border-radius:4px; background:var(--gallery-white)!important; color:var(--gallery-ink)!important; font-size:13px; line-height:1.2; cursor:pointer; box-shadow:none; }
body.community-gallery .community-page-art__toggle span { font-size:13px!important; color:inherit!important; }
body.community-gallery .community-page-art__toggle:disabled { cursor:default; }
body.community-gallery .art-theme-toggle { min-width:62px; }
body.community-gallery .community-page-art__toggle:focus-visible { outline:3px solid var(--gallery-green); outline-offset:3px; }
body.community-gallery .community-art-host { position:relative!important; isolation:isolate; overflow:hidden; min-height:210px; background:var(--gallery-white)!important; background-image:none!important; padding-bottom:60px!important; }
body.community-gallery .community-art-host > :not(.community-page-art) { position:relative; z-index:1; }
body.community-gallery .community-art-host > .community-page-art { position:absolute; inset:0; z-index:0; width:100%; height:100%; max-width:none; border:0; border-radius:inherit; margin:0; }
body.community-gallery .community-art-host > .community-page-art .community-page-art__caption { display:none; }
body.community-gallery .community-art-host > .community-page-art .community-page-art__picture { width:100%; inset:0; opacity:1; }
body.community-gallery .community-art-host > .community-page-art .art-material { left:28%; }
body.community-gallery .community-art-host > .community-page-art .community-page-art__picture::after { background:linear-gradient(90deg,var(--gallery-white) 0%,var(--gallery-white) 42%,transparent 75%); }
body.community-gallery .community-art-host > :is(h1,h2,p,div):not(.community-page-art) { max-width:75%; }
body.community-gallery .community-art-host h1 { text-wrap:balance; }
body[data-art-layout="diptych"] .community-art-host { border-radius:3px 40px 3px 3px; }
body[data-art-layout="diptych"] .community-art-host .art-material { left:42%; border-left:1px solid var(--gallery-line); }
body[data-art-layout="diagram"] .community-art-host { border-top:3px double var(--gallery-line); }
body[data-art-layout="diagram"] .community-art-host .art-material img { object-position:75% 76%; }
body[data-art-layout="stage"] .community-art-host { border-radius:3px 3px 40px 3px; }
body[data-art-layout="stage"] .community-art-host .art-material img { object-position:77% 68%; }
body[data-art-layout="pavilion"] .community-art-host .art-material { left:38%; }
body[data-art-layout="pavilion"] .community-art-host .art-material img { object-position:70% 70%; }
body[data-art-layout="catalogue"] .community-art-host { border-left:5px solid var(--gallery-clay); }
body[data-art-layout="folio"] .community-art-host { border-bottom:3px double var(--gallery-line); }
body[data-art-layout="studio"] .community-art-host,body[data-art-layout="quiet"] .community-art-host { min-height:160px; }
body[data-art-layout="studio"] .community-art-host .art-material,body[data-art-layout="quiet"] .community-art-host .art-material { left:54%; }
body[data-art-layout="correspondence"] .community-art-host { min-height:165px; }
body[data-art-layout="correspondence"] .community-art-host .art-material img { object-position:70% 66%; }
body.community-admin-shell .community-page-art { width:100%; height:165px; margin-top:0; }
body.community-admin-shell .community-art-host { min-height:155px; }
body.community-admin-shell .community-art-host .art-material { left:56%!important; }
body.community-admin-login-page .community-page-art { width:100%; height:160px; margin-top:0; }
.page-art-svg :is(.art-sway,.art-float,.art-glimmer,.art-flow,.art-drift,.art-light,.art-line) { transform-box:fill-box; transform-origin:center; animation-play-state:var(--community-art-play,running); }
.page-art-svg .art-sway { animation:artwork-sway calc(32s * var(--art-pace,1)) ease-in-out infinite; animation-play-state:var(--community-art-play,running); }
.page-art-svg .art-float { animation:artwork-float calc(26s * var(--art-pace,1)) ease-in-out infinite; animation-play-state:var(--community-art-play,running); }
.page-art-svg .art-glimmer,.page-art-svg .art-light { animation:artwork-light calc(34s * var(--art-pace,1)) ease-in-out infinite; animation-play-state:var(--community-art-play,running); }
.page-art-svg .art-flow,.page-art-svg .art-drift { animation:artwork-flow calc(38s * var(--art-pace,1)) ease-in-out infinite; animation-play-state:var(--community-art-play,running); }
.page-art-svg .art-line { stroke-dasharray:900; stroke-dashoffset:0; animation:artwork-line .9s ease-out 1 both; animation-play-state:var(--community-art-play,running); }
.community-page-art[data-art-motion="still"] .page-art-svg g { animation:none!important; }
body:is(.art-document-hidden,.art-motion-paused,.art-is-working,.art-is-reading) .page-art-svg g,.community-page-art.is-offscreen .page-art-svg g { animation-play-state:paused!important; }
body:not(.art-ready) .page-art-svg g { animation:none!important; stroke-dashoffset:0; }
body:not(.art-ready) .art-controls { display:none; }
@keyframes artwork-sway { 0%,100% { transform:rotate(-.6deg); } 50% { transform:rotate(.6deg); } }
@keyframes artwork-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-4px); } }
@keyframes artwork-flow { 0%,100% { transform:translate(0,0); } 50% { transform:translate(4px,2px); } }
@keyframes artwork-light { 0%,100% { opacity:.4; } 50% { opacity:.65; } }
@keyframes artwork-line { from { stroke-dashoffset:900; } to { stroke-dashoffset:0; } }
@media (max-width:700px) {
 body.community-gallery .community-page-art { width:calc(100% - 28px); height:170px; margin:14px auto 18px; }
 body.community-gallery .community-page-art__caption { width:70%; padding:16px 16px 54px; }
 body.community-gallery .community-page-art__title { font-size:23px; margin-bottom:0; }
 body.community-gallery .community-page-art__copy { display:none; }
 body.community-gallery .community-art-host { min-height:185px; padding:18px 16px 60px!important; }
 body.community-gallery .community-art-host > :is(h1,h2,p,div):not(.community-page-art) { max-width:83%; }
 body.community-gallery .community-art-host > .community-page-art { width:100%; height:100%; margin:0; }
 body.community-gallery .community-art-host > .community-page-art .art-material { left:22%!important; }
 body.community-gallery .community-art-host > .community-page-art .community-page-art__picture::after { background:linear-gradient(90deg,var(--gallery-white) 0%,var(--gallery-white) 39%,transparent 89%); }
 body.community-gallery .community-art-host h1 { font-size:27px!important; line-height:1.45!important; }
 body.community-gallery .community-art-host p { font-size:14px!important; line-height:1.75; }
 body.community-gallery .community-art-host .community-page-art__toggle { min-width:98px; }
 body.community-gallery .community-art-host .art-theme-toggle { min-width:58px; }
 body.community-admin-shell .community-page-art { width:100%; height:165px; }
 body.community-admin-shell .community-art-host { min-height:145px; }
 body[data-art-layout="studio"] .community-art-host,body[data-art-layout="quiet"] .community-art-host { min-height:145px; }
 .art-controls { right:10px; bottom:8px; }
}
@media (prefers-reduced-motion:reduce) { .page-art-svg g { animation:none!important; } }
