/* V17 · Quiet viewing rooms, connected by short spatial passages. */
#menu{width:min(620px,92vw);max-height:88dvh;padding:28px 38px;background:#080c0d;border:1px solid #aabbad30}
#menu nav{display:block;padding:30px 0 8px}#menu .menu-home{display:block;font:20px var(--serif);padding:10px 0 30px}
.menu-label{font:11px var(--serif);letter-spacing:.22em;color:#8d9c92;padding:0 0 17px;border-bottom:1px solid #9cb19e26}
#menu .collection-choice{display:block;padding:26px 0;border-bottom:1px solid #9cb19e26}
.collection-choice>span{font:normal 28px/1.5 var(--serif);letter-spacing:.12em}.collection-choice>small{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px;font:12px/1.6 var(--serif);letter-spacing:.06em;color:#9bad9e}.collection-choice em{font:normal 11px var(--serif);white-space:nowrap}.collection-choice.is-planned{opacity:.4}#menu .collection-choice[aria-current=true]>span{color:#e0e8dc}#menu .collection-choice:hover{color:#c9dccb}
.passage{height:38svh;min-height:240px;position:relative;isolation:isolate;overflow:clip;background:#000;--passage-progress:0;--passage-light:0}
.passage-chapter{height:78svh;min-height:480px}
.passage-space{position:absolute;inset:0;perspective:650px;perspective-origin:50% 50%;opacity:var(--passage-light);pointer-events:none}
.passage-space i{position:absolute;inset:-28% 20%;border-left:1px solid #c6d8c82e;border-right:1px solid #c6d8c82e;box-shadow:0 0 45px #9ab19d09;will-change:transform;backface-visibility:hidden}
.passage-chapter .passage-space i{inset:3% 18%;border:1px solid #c6d8c82e;background:linear-gradient(90deg,#b5d0bd06,transparent 6%,transparent 94%,#b5d0bd06)}
.passage-caption{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;color:#a9bcac;transform:translateY(calc((.5 - var(--passage-progress))*24px));opacity:calc(.35 + var(--passage-light)*.65)}
.passage-caption>span{font:10px "Museum Serif",serif;letter-spacing:.18em;color:#8b9f8e}.passage-caption>strong{font:normal 17px/1.5 var(--serif);letter-spacing:.3em}.passage-chapter .passage-caption>strong{font-size:38px;letter-spacing:.35em;color:#d0dccf}.passage-caption>small{display:flex;align-items:center;gap:20px;font:12px/1.6 var(--serif);letter-spacing:.1em}.passage-caption b{font-weight:normal}
.exhibit{--room-enter:0;--room-leave:0;--room-direction:1}
@media(prefers-reduced-motion:no-preference) and (min-height:501px){
 .exhibit-inner{transform:perspective(1300px) translate3d(calc((var(--room-enter)*-28px + var(--room-leave)*42px)*var(--room-direction)),calc(var(--room-enter)*24px),calc(var(--room-enter)*-90px + var(--room-leave)*90px));opacity:calc(1 - var(--room-enter)*.8 - var(--room-leave)*.92);filter:none;transition:none}
 .exhibit .artwork{transform:translateX(calc(var(--room-leave)*24px*var(--room-direction))) scale(var(--art-scale,1));filter:none}
 .exhibit .artwork>.art-open{clip-path:none}.exhibit .artwork .art{transform:none}
 .exhibit .object-info,.exhibit .object-info h2{transform:none;opacity:1}
}
@media(max-width:700px){#menu{padding:22px 24px}.collection-choice>span{font-size:24px}.collection-choice>small{font-size:11px;gap:8px}.passage{height:32svh;min-height:230px}.passage-chapter{height:65svh;min-height:410px}.passage-caption>small{font-size:11px;gap:12px}.passage-chapter .passage-caption>strong{font-size:32px}}
@media(prefers-reduced-motion:reduce),(max-height:500px){.passage{height:auto;min-height:150px}.passage-chapter{min-height:220px}.passage-space{display:none}.passage-caption{position:relative;min-height:inherit;opacity:1;transform:none}}
/* Keep the collection switcher available throughout the visit. */
header.museum-header{position:fixed;pointer-events:none;background:linear-gradient(#000b,transparent)}
header.museum-header>a,header.museum-header>.header-right{pointer-events:auto}
.exhibit{overflow:clip}
/* Give the objects a larger, consistent viewing area beneath the labels. */
@media(min-width:900px) and (min-height:501px){
 .exhibit .exhibit-inner{top:7svh;height:88svh;gap:22px}
 .exhibit .object-info{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);column-gap:32px;row-gap:7px;align-content:start}
 .exhibit .object-info h2{grid-column:1/-1;margin-bottom:4px}
 .exhibit .period{grid-column:1;grid-row:2;margin-top:0}
 .exhibit .dimensions{grid-column:1;grid-row:3;margin-top:0}
 .exhibit .english-label{grid-column:2;grid-row:2/4;margin-top:0;align-self:start;font-size:13px}
 .exhibit .english-label .title-en{font-size:15px}
 .exhibit .artwork{width:100%;height:100%;--art-scale:1;padding-bottom:44px}
 .exhibit.quiet .artwork{width:90%;height:100%}
 .exhibit .artwork>.view-trigger{bottom:0}
}
@media(max-width:899px){.exhibit .artwork{width:100%;height:100%;--art-scale:1}}
@media(max-width:700px) and (min-height:501px){
 .exhibit .exhibit-inner{top:80px;height:calc(100svh - 112px)}
}

/* V19 · Restrained Song-style labels shared by desktop and mobile. */
.exhibit .object-info h2{
 font-family:var(--serif);font-weight:400;--title-size:clamp(30px,2.8vw,42px);
 line-height:1.45;letter-spacing:.08em;color:#e6e2d8;
}
.exhibit .period{
 font-family:var(--serif);font-size:19px;line-height:1.7;letter-spacing:.06em;
 font-variant-numeric:lining-nums tabular-nums;color:#cbc7bd;
}
.exhibit .dimensions{
 font-family:var(--serif);font-size:16px;line-height:1.8;letter-spacing:.025em;
 font-variant-numeric:lining-nums tabular-nums;color:#b5b1a7;
}
.exhibit .english-label{letter-spacing:.01em;line-height:1.7}
.viewer-head h2{letter-spacing:.06em;line-height:1.5}
@media(min-width:900px) and (min-height:501px){
 .exhibit .object-info{row-gap:6px}
 .exhibit .object-info h2{margin-bottom:9px}
}
@media(max-width:899px){
 .exhibit .object-info h2{--title-size:30px;letter-spacing:.06em}
 .exhibit .period{font-size:18px}
 .exhibit .dimensions{font-size:15px}
}
@media(max-width:700px){
 .exhibit .object-info h2{--title-size:28px;line-height:1.5;letter-spacing:.05em}
 .exhibit .period{font-size:17px;line-height:1.7;letter-spacing:.045em;margin-top:14px}
 .exhibit .dimensions{font-size:14px;line-height:1.8;letter-spacing:.02em;margin-top:5px}
 .exhibit .english-label{margin-top:14px}
 .viewer-head h2{font-size:22px;letter-spacing:.04em}
}

/* V20 · One title line, a quiet label column, and an independent object field. */
.object-meta,.object-facts{display:contents}
@media(min-width:701px) and (min-height:501px){
 .exhibit{padding-left:8vw;padding-right:9vw}
 .exhibit .exhibit-inner{
  width:100%;max-width:1440px;margin:0 auto;min-height:0;
  top:max(80px,9svh);height:calc(100svh - max(80px,9svh) - 32px);
  grid-template-columns:minmax(220px,.72fr) minmax(0,1.8fr);
  grid-template-rows:auto minmax(0,1fr);column-gap:clamp(32px,4vw,80px);row-gap:clamp(32px,4svh,48px);
  container-type:inline-size;
 }
 .exhibit .object-info{display:contents}
 .exhibit .object-info h2{grid-column:1/-1;grid-row:1;margin:0;align-self:start}
 .exhibit .object-meta{display:block;grid-column:1;grid-row:2;padding-top:clamp(16px,3svh,32px);min-width:0}
 .exhibit .object-facts{display:block}
 .exhibit .period{margin:0;line-height:1.8}
 .exhibit .dimensions{margin-top:10px;line-height:1.9}
 .exhibit .english-label{margin-top:28px;max-width:25em;font-size:13px;line-height:1.8}
 .exhibit .english-label .title-en{font-size:15px;line-height:1.6;text-wrap:pretty;margin-bottom:10px}
 .exhibit .artwork{
  grid-column:2;grid-row:2;width:100%;height:100%;justify-self:stretch;align-self:stretch;
  padding:0 0 48px;--art-scale:1;
 }
 .exhibit .artwork>.view-trigger{bottom:0;right:0}
 .exhibit .artwork>.art-open{width:100%;height:100%;margin:0}
 .exhibit.quiet .artwork>.art-open{width:96%;margin-inline:auto}
 .exhibit.textile .artwork>.art-open{height:100%}
}
@media(min-width:701px) and (max-width:1000px) and (min-height:501px){
 .exhibit{padding-left:6vw;padding-right:8vw}
 .exhibit .exhibit-inner{grid-template-columns:minmax(175px,.7fr) minmax(0,1.5fr);column-gap:28px}
 .exhibit .object-meta{padding-top:12px}
 .exhibit .english-label{font-size:12px;margin-top:22px}
 .exhibit .english-label .title-en{font-size:14px}
 .exhibit .dimensions{font-size:14px}
}
/* Preserve the generous separation when a phone stacks the label above the object. */
@media(max-width:700px){
 .exhibit .exhibit-inner{row-gap:34px}
 .exhibit .object-info{display:block}
 .exhibit .object-meta,.exhibit .object-facts{display:block}
}

/* Broad vessels need the full width when a desktop window becomes narrow. */
@media(min-width:701px) and (max-width:1000px) and (min-height:501px){
 .exhibit:not(.tall):not(.textile) .exhibit-inner{
  grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);row-gap:28px;
 }
 .exhibit:not(.tall):not(.textile) .object-meta{
  grid-column:1;grid-row:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:28px;padding:0;
 }
 .exhibit:not(.tall):not(.textile) .english-label{margin:0}
 .exhibit:not(.tall):not(.textile) .artwork{grid-column:1;grid-row:3}
}