:root{--paper:#f5f3ec;--ink:#181816;--gray:#62635b;--rule:#c8c7bd;--gutter:clamp(18px,3.2vw,64px);color:var(--ink);background:var(--paper);font-family:Arial,"Hiragino Sans GB","PingFang SC","Noto Sans CJK JP","Noto Sans Devanagari","Malgun Gothic",sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100svh;display:flex;flex-direction:column}button,select{font:inherit;color:inherit;cursor:pointer}button{background:none;border:0}button:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid #b1471b;outline-offset:4px}button:hover{background:#e7e5db}header,footer{margin:0 var(--gutter);display:flex;align-items:center;gap:24px}header{height:76px;flex:none;border-bottom:2px solid var(--ink)}#brand{font-weight:950;font-size:clamp(18px,2.05vw,34px);letter-spacing:-.09em;padding:6px 0;line-height:1}#brand:hover{background:transparent}.slash{margin:0 .12em;color:#96988e}.venue,.stamp,#pageCount,#nextLabel{font-family:ui-monospace,"Arial",sans-serif;font-size:12px;letter-spacing:.075em;font-variant-numeric:tabular-nums}.venue{color:var(--gray)}nav{display:flex;gap:6px;margin-left:auto;align-items:center}nav button,.language{display:flex;align-items:center;gap:6px;font-size:13px;min-height:38px;padding:0 9px}nav button>span:first-child{font-size:20px}.language{border-right:1px solid var(--rule);margin-right:4px}.language>span{font-size:11px;color:var(--gray)}.language select{max-width:102px;background:transparent;border:0;font-size:14px}
#stage{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,3vw,60px);padding:clamp(18px,2.8vh,36px) var(--gutter);flex:1;min-height:0}
#visual{width:100%;min-width:0;min-height:0;position:relative;display:grid;place-items:center;overflow:hidden;background:#181917;color:var(--paper)}
#image{position:absolute;width:100%;height:100%;inset:0;object-fit:contain}
#source{align-self:start;font-size:12px;color:var(--gray);text-decoration:none;border-bottom:1px solid var(--rule);padding:2px 0}#source:hover{color:var(--ink)}
#tank{font:clamp(17px,3.2vw,62px)/1.3 ui-monospace,"Courier New",monospace;text-align:left;letter-spacing:0;margin:0;color:#111}#visual.symbol{background:#e7e7de}
body.action #visual{background:var(--ink)}body.action #typeArt{color:#f1f0e9}
footer{height:70px;border-top:1px solid var(--ink);flex:none;justify-content:space-between}.trail{display:flex;gap:15px;align-items:center;flex:1}#track{width:min(15vw,190px);height:2px;background:var(--rule);position:relative}#track i{display:block;height:100%;background:var(--ink);transition:width .18s}#present{font-size:13px;text-decoration:underline;text-underline-offset:5px;padding:8px}.arrows{display:flex;gap:6px}.arrows button,#close{width:50px;height:40px;border:1px solid var(--ink);font-size:24px;display:grid;place-items:center}.arrows #next{background:var(--ink);color:var(--paper)}button:disabled{opacity:.28;cursor:default}
dialog{background:var(--paper);color:var(--ink);border:1px solid var(--ink);width:min(900px,calc(100vw - 32px));max-height:85svh;padding:20px clamp(16px,3vw,40px)}dialog::backdrop{background:#111a}.dialogTop{display:flex;align-items:center;justify-content:space-between;gap:1em;border-bottom:2px solid var(--ink);padding:0 0 12px}h2{margin:0;font-size:24px}#close{width:36px;height:34px}ol{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}li{min-width:0}li button{display:flex;text-align:left;align-items:baseline;gap:10px;border-bottom:1px solid var(--rule);padding:12px 2px;width:100%;min-height:43px}li small{color:#62635b;font-size:11px}li button[aria-current=true]{font-weight:bold;border-bottom-color:var(--ink)}
[hidden]{display:none!important}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
#preview{margin:0 var(--gutter) 12px;padding:12px 16px;border-left:4px solid #191a16;background:#e5e6dd;display:flex;gap:16px;justify-content:space-between;align-items:center}#preview div{display:grid;gap:4px}#nextThumb{width:100px;height:64px;object-fit:contain;background:#ddd}#nextHead{font-size:18px}#nextCap{font-size:14px;line-height:1.35}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

#references{align-self:flex-start;border:1px solid var(--rule);padding:6px 10px;font-size:13px}
#referenceClose{font-size:24px}
#referenceList a{color:inherit;display:block;padding:10px 0;border-bottom:1px solid var(--rule);line-height:1.4;text-decoration:none}
#nextArt{max-width:35%;margin:0;padding:5px 10px;background:var(--ink);color:var(--paper);white-space:pre-wrap;font-family:inherit;font-size:16px;font-weight:bold;line-height:1.25;overflow-wrap:anywhere}
#nextArt.symbol{white-space:pre;font:10px/1.25 monospace}
#visual{touch-action:pan-y pinch-zoom}

/* The two exhibition labels share the same measure, type scale and ink. */
.copy{
 display:flex; flex-direction:column; justify-content:center; min-width:0;
 gap:clamp(12px,2.2vh,24px);
}
.stamp{display:flex; flex-wrap:wrap; gap:5px 14px; color:var(--gray); line-height:1.35}
.stamp span+span:not(:empty)::before{content:"/"; margin-right:12px; color:var(--gray)}
.words{display:grid; grid-auto-rows:1fr; min-width:0; row-gap:clamp(12px,2.4vh,28px)}
.passage{
 display:flex; flex-direction:column; justify-content:center; min-width:0;
 gap:clamp(5px,1vh,12px); position:relative;
}
.passage+.passage::before{
 content:""; position:absolute; top:calc(clamp(12px,2.4vh,28px) / -2);
 height:1px; width:100%; background:var(--rule);
}
.passage :is(h1,h2){
 margin:0; font-size:clamp(24px,min(3.15vw,5.1vh),68px); font-weight:780;
 line-height:1.14; letter-spacing:-.035em; text-wrap:balance; overflow-wrap:break-word;
}
.passage p{
 margin:0; font-size:clamp(16px,min(1.5vw,2.74vh),32px); font-weight:400;
 line-height:1.47; overflow-wrap:break-word; text-wrap:pretty;
}
.passage p:empty{display:none}
:lang(hi) :is(.passage h1,.passage h2,#typeArt),.passage[lang=hi] h1{line-height:1.24}
#typeArt{
 width:100%; padding:6%; display:grid; gap:.38em;
 font-size:clamp(32px,min(5.4vw,8.2vh),112px); font-weight:800;
 line-height:1.15; letter-spacing:-.04em; white-space:pre-line;
 text-wrap:balance; overflow-wrap:break-word;
}
#visual.forum #typeArt{text-align:center}
body.first #image{width:74%;height:74%;inset:13%;object-fit:contain}
#list button>span{display:grid;gap:.2em}
#preview{align-items:center}
#preview>div{flex:1;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 18px}
#nextLabel{grid-column:1/-1}
#nextHead,#nextCap{display:contents}
#nextHead>span{grid-row:2;font-size:16px;font-weight:700}
#nextCap>span{grid-row:3;font-size:14px;line-height:1.4}
#preview>div:has(#nextHead>span:only-child){grid-template-columns:1fr}
#nextArt span{display:block}
#nextThumb{flex:none}

@media(min-width:761px) and (min-height:470px){
 body{height:100svh}
 .copy{overflow:auto;justify-content:safe center}
 .copy>*{flex:none}
 .presenter header,.presenter footer{height:48px}
 .presenter #stage{padding-block:12px}
 .presenter .passage :is(h1,h2){font-size:clamp(20px,min(2.8vw,4.6vh),48px)}
 .presenter .passage p{font-size:clamp(15px,1.35vw,24px);line-height:1.4}
 .presenter .copy,.presenter .words{gap:13px}
 .presenter #typeArt{font-size:clamp(25px,min(4.5vw,6.5vh),80px)}
}
@media(max-width:1100px){.venue{display:none}}
@media(max-width:760px){
 :root{--gutter:clamp(14px,4.5vw,28px)}
 header,footer{gap:8px}
 header{height:54px}
 .venue{display:none}
 nav{gap:1px}
 nav button,.language{padding:0 5px}
 #menuName,#fsName{display:none}
 nav button{justify-content:center;min-width:38px;min-height:42px}
 #stage{display:flex;flex-direction:column;gap:18px;padding:14px var(--gutter) 24px}
 #visual{height:clamp(205px,35svh,440px);flex:none}
 .copy{gap:15px}
 .stamp{font-size:10px}
 .words{grid-auto-rows:auto;gap:22px}
 .passage{gap:7px}
 .passage+.passage::before{top:-11px}
 .passage :is(h1,h2){font-size:clamp(25px,6.5vw,37px)}
 .passage p{font-size:clamp(16px,3.9vw,19px);line-height:1.45}
 #source{font-size:12px}
 #typeArt{font-size:clamp(26px,min(7.7vw,6.3svh),46px);gap:.32em}
 #tank{font-size:clamp(16px,4.4vw,29px)}
 footer{height:auto;min-height:56px;padding:5px 0 max(5px,env(safe-area-inset-bottom));position:sticky;bottom:0;z-index:1;background:var(--paper);margin-top:auto}
 .arrows button{width:42px;height:42px}
 #present{font-size:12px;max-width:42%;text-wrap:balance;line-height:1.4}
 .trail{gap:5px}
 #track{display:none}
 ol{grid-template-columns:1fr}
 #preview{flex-wrap:wrap}
 #preview>div{flex-basis:100%}
 #preview #nextCap>span{font-size:13px}
}
@media(min-width:761px) and (max-height:469px){
 #visual{min-height:260px}
 header,footer{height:46px}
}