body[data-page="gallery"] .page .wrap{position:relative}
.singles-entry{position:absolute;right:0;top:8px;width:216px;height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.8);border-radius:28px;background:rgba(255,255,255,.45);box-shadow:0 14px 36px rgba(45,70,108,.08),inset 0 1px rgba(255,255,255,.9);cursor:pointer;color:#22344d;transition:transform .3s ease,box-shadow .3s ease}
.singles-entry:hover{transform:translateY(-4px);box-shadow:0 22px 42px rgba(45,70,108,.14)}
.singles-entry img{width:92px;height:92px;object-fit:contain;mix-blend-mode:multiply}
.singles-entry>span:nth-of-type(1){display:flex;align-items:baseline;gap:8px}.singles-entry strong{font-size:20px;font-weight:650}.singles-entry small{font-size:11px;color:#677b94}.singles-entry-arrow{position:absolute;right:16px;top:12px;font-size:19px;color:#6984a8}
.singles-overlay{position:fixed;inset:0;z-index:1200;display:none;align-items:center;justify-content:center;padding:24px;box-sizing:border-box}.singles-overlay.open{display:flex}.singles-backdrop{position:absolute;inset:0;background:rgba(28,44,68,.35);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.singles-panel{position:relative;width:min(1080px,100%);height:min(760px,calc(100dvh - 48px));overflow:hidden;background:#f7f9fc;border:1px solid #fff;border-radius:30px;box-shadow:0 30px 90px rgba(28,48,77,.25);display:flex;flex-direction:column;transform-origin:0 0}.singles-header{display:flex;justify-content:space-between;align-items:flex-start;padding:35px 42px 18px;border-bottom:1px solid #e7edf4}.singles-kicker{margin:0 0 8px;color:#5683ca;font-size:10px;letter-spacing:.28em}.singles-header h2{margin:0;font-family:serif;font-size:42px;font-weight:500;line-height:1.1;color:#1d2c42}.singles-lead{margin:8px 0 0;color:#8090a5;font-size:13px}.singles-close{width:40px;height:40px;border:0;border-radius:50%;background:#e9eef5;color:#425671;font-size:26px;cursor:pointer}.singles-close:hover{background:#dbe5f0}
.singles-list-view,.singles-detail-view{flex:1;min-height:0;overflow:auto;padding:22px 42px 40px}.singles-filters{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:22px}.singles-filter{border:1px solid #e0e8f2;background:white;border-radius:100px;padding:8px 18px;color:#60738d;cursor:pointer;font:inherit;font-size:13px}.singles-filter.active{background:#273e5e;border-color:#273e5e;color:white}.singles-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px}.singles-card{display:block;border:0;background:white;border-radius:18px;padding:9px;text-align:left;box-shadow:0 5px 16px rgba(34,55,81,.06);cursor:pointer}.singles-card img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px}.singles-card strong{display:block;margin:11px 4px 2px;color:#2b3c53;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.singles-card small{display:block;margin:0 4px 5px;color:#8b9aab;font-size:11px}.singles-empty{grid-column:1/-1;min-height:300px;display:grid;place-content:center;text-align:center;color:#788ba4;border:1px dashed #cad6e5;border-radius:22px;background:#fff}.singles-empty-icon{font-size:36px;color:#a8b9cf}.singles-empty strong{margin-top:12px;font-size:18px;color:#435875}.singles-empty p{font-size:13px;margin:8px 0 0}
.singles-detail-view[hidden],.singles-list-view[hidden]{display:none}.singles-back{border:0;background:none;color:#516d94;cursor:pointer;padding:0 0 16px;font:inherit;font-size:13px}.singles-detail-stage{height:min(470px,55vh);display:flex;align-items:center;justify-content:center;gap:14px}.singles-detail-image{max-width:calc(100% - 120px);max-height:100%;object-fit:contain;border-radius:10px;box-shadow:0 12px 30px rgba(34,55,81,.09)}.singles-prev,.singles-next{width:38px;height:38px;border-radius:50%;border:1px solid #dbe5ef;background:white;color:#405a7b;font-size:25px;cursor:pointer}.singles-prev:disabled,.singles-next:disabled{opacity:.3;cursor:default}.singles-detail-meta{display:flex;justify-content:space-between;align-items:end;margin:20px 52px 0}.singles-detail-meta h3{margin:0;color:#243955;font-size:19px}.singles-detail-meta p{margin:7px 0 0;color:#73859c;font-size:13px}.singles-counter{color:#8091a7;font-size:12px}
.singles-overlay.zoom-transition-active .singles-panel{will-change:transform}.singles-overlay.zoom-transition-active .singles-backdrop{will-change:opacity}.singles-overlay.zoom-transition-active:not(.zoom-settled) .singles-panel>*{opacity:var(--zoom-content-opacity,0)}
@media(max-width:1050px){.singles-entry{position:relative;top:auto;right:auto;width:100%;height:105px;flex-direction:row;gap:10px;justify-content:flex-start;padding:10px 24px;margin:22px 0 30px}.singles-entry img{width:82px;height:82px}.singles-entry-arrow{top:36px;right:25px}.singles-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.singles-overlay{padding:0}.singles-panel{width:100%;height:100dvh;border-radius:0}.singles-header{padding:24px 22px 16px}.singles-header h2{font-size:34px}.singles-list-view,.singles-detail-view{padding:18px 20px 28px}.singles-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.singles-detail-stage{height:55vh;gap:6px}.singles-detail-image{max-width:calc(100% - 74px)}.singles-prev,.singles-next{width:32px;height:32px;flex:none}.singles-detail-meta{margin:18px 5px 0}}
@media(prefers-reduced-motion:reduce){.singles-entry{transition:none}}

/* 画屿入口：透明立体图标浮出卡片，延续首页的悬浮与放大反馈。 */
@media(min-width:1051px){
  .singles-entry{top:94px;right:-12px}
}
.singles-entry{
  box-sizing:border-box;
  overflow:visible;
  isolation:isolate;
  justify-content:flex-end;
  padding:0 12px 17px;
  background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(240,245,255,.66) 65%,rgba(249,240,255,.65));
  border-color:rgba(255,255,255,.96);
  box-shadow:0 17px 42px rgba(81,95,151,.13),inset 0 1px 0 #fff;
}
.singles-entry::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
  background:radial-gradient(circle at 46% 35%,rgba(183,210,255,.4),transparent 54%),radial-gradient(circle at 79% 82%,rgba(234,183,255,.24),transparent 48%);
  opacity:.7;transition:opacity .35s ease;
}
.singles-entry:hover::before{opacity:1}
.singles-entry>span.singles-entry-art{
  display:block;position:absolute;z-index:2;left:50%;top:-82px;width:212px;height:212px;
  transform:translateX(-50%);pointer-events:none;animation:singlesArtFloat 6s ease-in-out infinite;
}
.singles-entry-art img{
  display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:normal;
  filter:drop-shadow(0 15px 18px rgba(112,91,189,.27));
  transition:transform .42s cubic-bezier(.16,1,.3,1),filter .42s cubic-bezier(.16,1,.3,1);
}
.singles-entry:hover .singles-entry-art img{
  transform:translateY(-8px) scale(1.08) rotate(-3deg);
  filter:drop-shadow(0 25px 30px rgba(110,88,181,.34));
}
.singles-entry-glow{
  position:absolute;inset:34% 9% 2%;border-radius:50%;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse,rgba(162,185,255,.28),rgba(210,172,255,.1) 45%,transparent 72%);
  filter:blur(12px);animation:singlesGlow 5s ease-in-out infinite alternate;
}
.singles-entry>span.singles-entry-copy{
  display:flex;position:relative;z-index:3;align-items:baseline;justify-content:center;gap:7px;
  width:100%;white-space:nowrap;text-shadow:0 1px 9px rgba(255,255,255,.96);
}
.singles-entry-copy strong{font-size:20px}
.singles-entry-copy small{font-size:10px}
.singles-entry-arrow{z-index:3}
.singles-speck{
  position:absolute;z-index:3;width:5px;height:5px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,#fff 0 15%,#9dc8ff 42%,rgba(154,178,255,0) 75%);
  box-shadow:0 0 12px rgba(142,166,255,.75);
  animation:singlesSpeckDrift 4.8s ease-in-out infinite;
}
.singles-speck:nth-of-type(2){left:13%;top:43%;--dx:-7px;--dy:-15px;animation-delay:-.6s}
.singles-speck:nth-of-type(3){left:81%;top:22%;width:4px;height:4px;--dx:8px;--dy:-10px;animation-delay:-2.1s;background:radial-gradient(circle,#fff 0 12%,#e2a7ff 43%,transparent 77%)}
.singles-speck:nth-of-type(4){left:91%;top:56%;width:6px;height:6px;--dx:6px;--dy:-18px;animation-delay:-3.4s}
.singles-speck:nth-of-type(5){left:26%;top:14%;width:3px;height:3px;--dx:-4px;--dy:-9px;animation-delay:-1.5s;background:radial-gradient(circle,#fff 0 12%,#f4abd5 43%,transparent 77%)}
.singles-speck:nth-of-type(6){left:73%;top:76%;width:4px;height:4px;--dx:8px;--dy:-12px;animation-delay:-4s}
.singles-speck:nth-of-type(7){left:6%;top:75%;width:3px;height:3px;--dx:-3px;--dy:-13px;animation-delay:-2.8s}
@keyframes singlesArtFloat{0%,100%{transform:translateX(-50%) translateY(0) rotate(-1deg)}50%{transform:translateX(-50%) translateY(-9px) rotate(1deg)}}
@keyframes singlesGlow{from{opacity:.5;transform:scale(.93)}to{opacity:.95;transform:scale(1.08)}}
@keyframes singlesSpeckDrift{0%,100%{opacity:.12;transform:translate3d(0,6px,0) scale(.6)}45%{opacity:.9;transform:translate3d(var(--dx),var(--dy),0) scale(1.25)}70%{opacity:.48}}
@media(max-width:1050px){
  .singles-entry{padding:0 20px;height:125px;justify-content:flex-start}
  .singles-entry>span.singles-entry-art{left:-9px;top:-22px;width:155px;height:155px;transform:none;animation-name:singlesArtFloatSmall}
  .singles-entry>span.singles-entry-copy{width:auto;margin-left:127px;flex-direction:column;align-items:flex-start;gap:1px}
  .singles-entry-arrow{top:15px;right:18px}
  @keyframes singlesArtFloatSmall{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-7px) rotate(1deg)}}
}
@media(prefers-reduced-motion:reduce){
  .singles-entry-art,.singles-entry-glow,.singles-speck{animation:none!important}
  .singles-entry:hover .singles-entry-art img{transform:none}
}
body[data-page="gallery"] .filter-row{scrollbar-width:none;-ms-overflow-style:none}
body[data-page="gallery"] .filter-row::-webkit-scrollbar{display:none}

/* Portrait artwork cards: keep the complete 2:3 composition and its in-image typography. */
.singles-grid{align-items:start;gap:20px}
.singles-card{
  min-width:0;padding:9px 9px 14px;border:1px solid rgba(255,255,255,.94);
  border-radius:21px;background:linear-gradient(150deg,rgba(255,255,255,.9),rgba(235,242,252,.76));
  box-shadow:0 10px 28px rgba(43,67,105,.1),inset 0 1px 0 #fff;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,border-color .3s ease;
}
.singles-card:hover,.singles-card:focus-visible{
  transform:translateY(-5px);border-color:rgba(171,203,246,.92);
  box-shadow:0 18px 38px rgba(43,67,105,.17),inset 0 1px 0 #fff;
}
.singles-card:focus-visible{outline:2px solid #668fce;outline-offset:3px}
.singles-card img{width:100%;height:auto;aspect-ratio:2/3;object-fit:contain;border-radius:14px;background:#edf2f8}
.singles-card strong{margin:12px 6px 0;font-size:15px;line-height:1.4;letter-spacing:.01em}
.singles-card small{margin:5px 6px 0;font-size:11px;line-height:1.5;color:#7488a3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.singles-detail-view,.singles-detail-stage{cursor:zoom-out}
.singles-detail-image{cursor:default}
.singles-detail-view button{cursor:pointer}
.singles-detail-stage{position:relative;overflow:hidden}
.singles-detail-image{position:relative;z-index:1;transform-origin:center;touch-action:none;user-select:none;-webkit-user-drag:none}
.singles-detail-stage.zoomed .singles-detail-image{cursor:grab}
.singles-detail-stage.is-panning .singles-detail-image{cursor:grabbing}
.singles-prev,.singles-next{position:relative;z-index:2;flex:none}
.singles-zoom-controls{position:absolute;right:14px;bottom:12px;z-index:3;display:flex;align-items:center;gap:2px;padding:3px;border:1px solid rgba(190,207,229,.85);border-radius:13px;background:rgba(248,251,255,.91);box-shadow:0 7px 20px rgba(29,54,86,.11);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);cursor:default}
.singles-zoom-button{display:grid;place-items:center;width:35px;height:35px;padding:0;border:0;border-radius:9px;background:transparent;color:#304c70;transition:background .2s ease,color .2s ease}
.singles-zoom-button:hover:not(:disabled),.singles-zoom-button:focus-visible{background:#e2ebf7;color:#1e3555}
.singles-zoom-button:focus-visible{outline:2px solid #6c92cd;outline-offset:1px}
.singles-zoom-button:disabled{color:#9daec2;cursor:default;opacity:.55}
.singles-zoom-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.singles-zoom-level{min-width:43px;text-align:center;color:#526b89;font-size:11px;font-variant-numeric:tabular-nums;letter-spacing:.02em}
@media(max-width:640px){.singles-grid{gap:13px}.singles-card{padding:6px 6px 11px;border-radius:17px}.singles-card img{border-radius:12px}.singles-card strong{font-size:13px;margin:9px 5px 0}.singles-card small{margin:4px 5px 0;font-size:10px}}
@media(max-width:640px){.singles-zoom-controls{right:7px;bottom:7px}.singles-zoom-button{width:32px;height:32px}.singles-zoom-level{min-width:38px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.singles-card{transition:none}.singles-card:hover,.singles-card:focus-visible{transform:none}}

/* Mixed artwork ratios: preserve all in-image typography while allowing wide pieces room to breathe. */
.singles-card.is-wide{grid-column:span 2}
.singles-card.is-last-centered{grid-column:2 / span 2}
.singles-card img{height:clamp(190px,22vw,280px);aspect-ratio:auto;object-fit:contain;background:linear-gradient(145deg,#f2f6fc,#eaf0fa)}
@media(max-width:1050px){.singles-card.is-last-centered{grid-column:span 2}}
@media(max-width:640px){.singles-card img{height:clamp(155px,43vw,240px)}.singles-card.is-wide img{height:clamp(185px,57vw,270px)}}