/* Phone-only composition. Desktop stylesheet and artwork remain unchanged. */
@media (max-width:760px){
 :root{--mobile-header:100px;--phone-height:100vh;--phone-safe:env(safe-area-inset-bottom,0px)}
 @supports(height:100svh){:root{--phone-height:100svh}}
 html{height:100%;background:#f4f6f9;overscroll-behavior:none}
 body{height:var(--phone-height);min-height:0;overflow:hidden;overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
 .sidebar{height:var(--mobile-header);padding:16px 20px 12px;display:block;background:#fbfbfc}
 .identity{height:59px;padding:2px 0 0 73px}
 .identity .wordmark{margin:3px 0 7px}
 .museum-wordmark{width:142px}
 .relief-emblem{left:-2px;top:-6px;width:71px;height:71px;margin:0}
 .space-description{font:400 11px/1.3 Outfit,sans-serif;letter-spacing:0;margin:0;color:#65707e}
 .space-description br{display:none}
 .collection-label{display:none}
 .sidebar-foot{left:auto;right:22px;bottom:12px;justify-content:flex-end;font-size:8px;gap:12px;line-height:12px}
 .sidebar-foot .company-signature{font-size:8px;gap:6px}
 .company-icon{width:11px;height:11px}
 /* Pointer focus must not inherit the desktop keyboard rectangle on iOS. */
 button,a{-webkit-tap-highlight-color:transparent}
 html[data-mobile-input="pointer"] button:focus,html[data-mobile-input="pointer"] a:focus{outline:none}
 html[data-mobile-input="keyboard"] button:focus-visible,html[data-mobile-input="keyboard"] a:focus-visible{outline:1px solid #7c8da3;outline-offset:3px}
 .relief-emblem canvas,.relief-icon canvas{display:none!important}
 .relief-emblem .relief-fallback,.relief-emblem.is-rendered .relief-fallback{opacity:1;filter:grayscale(1) contrast(.72) brightness(1.16);mix-blend-mode:multiply}
 .relief-icon .relief-fallback,.relief-icon.is-rendered .relief-fallback{opacity:1;filter:none;mix-blend-mode:multiply}
 .relief-emblem:active,.view:active .relief-icon{filter:brightness(.94);transform:translateY(1px)}
 main{height:calc(var(--phone-height) - var(--mobile-header));min-height:0;margin:0;background-color:#f4f6f9;background-image:linear-gradient(90deg,#4e596910 1px,transparent 1px),linear-gradient(#4e596910 1px,transparent 1px),radial-gradient(ellipse at 48% 30%,#fafbfd 5%,#f1f4f8 80%);background-size:34px 100%,100% 34px,100% 100%}
 .topline{top:18px;left:20px;right:20px;font-size:9px}
 .topline{justify-content:flex-end}
 #view-label,.topline::before,.topline::after{display:none}
 .stage[data-mode="stack"]{inset:106px 0 calc(86px + var(--phone-safe));min-height:0}
 .cards,.hits{perspective:none;transform-style:flat}
 .card,.hit{transform-style:flat}
 .stage[data-mode="stack"] .card.is-active{isolation:isolate}
 .stage[data-mode="stack"] .card.is-active .card-face{opacity:1;filter:none;background:#fff}
 .stage[data-mode="stack"] .card.is-active .folder-shell{fill:#fff}
 .stage[data-mode="stack"] .card.is-active .folder-window{background:#fff}
 .stage[data-mode="stack"] .card.is-active .folder-window::after{opacity:0;mix-blend-mode:normal}
 .stage[data-mode="stack"] .card:not(.is-active) .card-face,
 .stage[data-mode="stack"].has-focus .card:not(.is-active) .card-face{opacity:.56;filter:grayscale(.76) contrast(.9) brightness(.98)}
 .caption{position:absolute;left:22px!important;right:22px!important;top:24px;bottom:auto!important;width:auto;min-height:0;max-height:82px;padding:0 0 0 11px;text-align:left;border:0;border-left:1px solid #bdc6d2;pointer-events:none!important}
 .caption::after{display:none}
 .caption-index{font-size:10px;line-height:1.2;color:#929dac}
 .caption h2{font-size:clamp(20px,5.3vw,23px);line-height:1.2;margin:5px 0 4px;letter-spacing:-.04em;overflow-wrap:anywhere}
 .caption>span:last-of-type{font-size:9px;line-height:1.2}
 .views{left:18px;bottom:calc(12px + var(--phone-safe));height:60px;align-items:center;gap:8px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;isolation:isolate}
 .view{width:48px;height:57px;padding:0 0 3px;gap:1px;border-radius:0;font-size:10px;line-height:1.1;background:transparent;box-shadow:none}
 .view .relief-icon{display:block;width:43px;height:41px}
 .view.active{border-bottom-color:#8190a3}
 .bottomline,.stage[data-mode="stack"]~.bottomline{left:auto;right:18px!important;bottom:calc(20px + var(--phone-safe))!important;width:auto;gap:5px;padding:0}
 .position{gap:6px;font-size:10px}.progress{width:25px}.step-buttons{gap:0}.step-buttons button{width:29px;height:34px}.step-buttons button svg{width:14px;height:14px}
 .stage[data-mode="grid"]{inset:0;scroll-padding:55px 0 88px;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
 .stage[data-mode="grid"]~.bottomline{left:140px;right:18px!important;bottom:calc(13px + var(--phone-safe))!important;height:51px;padding:6px 10px;background:linear-gradient(125deg,#ffffffaa,#e4edf770 50%,#ffffff99);border:1px solid #ffffffeb;border-radius:13px;box-shadow:inset 0 1px 1px #fff,inset 0 -1px 1px #7088a647,0 5px 18px #263c581c;-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5)}
 .stage[data-mode="grid"] .card-face{transition:transform 400ms cubic-bezier(.22,.61,.36,1)}
 body.viewer-is-open>.sidebar,body.viewer-is-open>main{visibility:hidden;pointer-events:none}
 body.viewer-is-open .views,body.viewer-is-open .bottomline,body.viewer-is-open #caption{visibility:hidden!important;pointer-events:none!important}
 #viewer{position:fixed;inset:0;width:100%;height:100dvh;max-height:100dvh;max-width:100%;margin:0;padding:calc(64px + env(safe-area-inset-top,0px)) clamp(28px,8vw,48px) calc(32px + var(--phone-safe));overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;background:#eef2f7;color:#2a3038;isolation:isolate;z-index:10000}
 #viewer::before{display:none}
 #viewer::backdrop{background:#eef2f7}
 #viewer::after{content:"";position:fixed;z-index:4;pointer-events:none;inset:0 0 auto;height:calc(61px + env(safe-area-inset-top,0px));background:linear-gradient(#eef2f7 65%,#eef2f700)}
 #viewer .viewer-body{display:block;width:100%;height:auto;min-height:0;margin:0;--viewer-art-height:none}
 #viewer .viewer-artwork{display:block;width:100%;max-width:390px;height:auto;max-height:none;margin:0 auto;padding:0}
 #viewer #viewer-frame{width:100%;max-height:none;margin:0;aspect-ratio:var(--artwork-ratio,.748);border-radius:5px;isolation:isolate}
 #viewer .viewer-artwork #viewer-image{display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;background:#fff}
 #viewer .viewer-body>.viewer-copy{display:grid;grid-template-columns:max-content 1fr;column-gap:14px;row-gap:0;position:static;top:auto;width:100%;max-width:390px;max-height:none;overflow:visible;flex:none;align-self:auto;padding:0;margin:22px auto 10px;translate:0 0}
 #viewer-index{grid-column:1;float:none;margin:0 0 13px;font:200 17px/1.15 Outfit,sans-serif;letter-spacing:-.04em;color:#a1aab8}
 #viewer-series{grid-column:2;align-self:start;margin:0;padding:2px 0 0;font:400 9px/1.4 Outfit,sans-serif;letter-spacing:.035em;color:#8d98a8}
 #viewer-title,#viewer-subtitle,#viewer-description,#viewer-source{grid-column:1/-1;min-width:0;max-width:100%;overflow-wrap:anywhere}
 #viewer .viewer-body h2{clear:none;font-size:27px;line-height:1.2;margin:0 0 12px;letter-spacing:-.045em}
 #viewer-subtitle{font-size:13px;line-height:1.55;margin:0 0 12px}
 #viewer-description{font-size:11px;line-height:1.75;margin:0;white-space:pre-line}
 #viewer-source{justify-self:start;margin:18px 0 0;font-size:10px}
 #viewer>button{position:fixed;top:calc(10px + env(safe-area-inset-top,0px));bottom:auto;z-index:5;width:40px;height:40px;border:0;background:transparent;display:grid;place-items:center;color:#617083;opacity:1;translate:0 0;transition:opacity .2s;font-size:22px}
 #viewer>.viewer-prev{left:12px;right:auto}
 #viewer>.viewer-next{left:54px;right:auto}
 #viewer>.close{right:12px;left:auto;font-size:21px}
 #viewer .motion-toggle{right:9px;bottom:9px;width:34px;height:34px;opacity:.8}
}
@media(max-width:360px){.identity{padding-left:67px}.relief-emblem{width:65px;height:65px}.museum-wordmark{width:132px}.sidebar{padding-left:16px}.caption h2{font-size:20px}.views{left:12px}.stage[data-mode="grid"]~.bottomline{left:132px;right:12px!important}.stage[data-mode="stack"]~.bottomline{right:12px!important}}
@media(max-width:760px) and (max-height:620px){:root{--mobile-header:90px}.sidebar{padding-top:10px}.relief-emblem{width:59px;height:59px}.identity{padding-left:65px}.museum-wordmark{width:132px}.stage[data-mode="stack"]{top:94px;bottom:80px}.caption{top:19px;bottom:auto!important}.caption h2{font-size:20px}.sidebar-foot{bottom:6px}}

/* Portrait phone refinement: keep desktop and the existing landscape layout. */
@media (max-width:760px) and (orientation:portrait){
 :root{--mobile-header:136px}
 .sidebar{padding:20px 22px 16px}
 .identity{height:66px;padding-left:96px}
 .relief-emblem{top:-4px;width:90px;height:90px}
 .museum-wordmark{width:168px}
 .space-description{font-size:13px}
 .sidebar-foot{display:contents;animation:none!important}
 .sidebar-foot>span:last-child{position:absolute;right:22px;top:94px;line-height:12px}
 .sidebar-foot .company-signature{position:fixed;left:50%;bottom:calc(10px + var(--phone-safe));translate:-50% 0;width:max-content;z-index:6}
 .caption{top:26px;right:156px!important;max-height:98px}
 .caption-index{font-size:11px}
 .caption h2{font-size:clamp(24px,6vw,27px);line-height:1.18;margin:6px 0 5px}
 .caption>span:last-of-type{font-size:10px}
 .stage[data-mode="stack"]{top:140px;bottom:calc(98px + var(--phone-safe))}
 .views{top:calc(var(--mobile-header) + 24px);right:20px;left:auto;bottom:auto;height:60px;gap:8px;align-items:start}
 .view{width:56px;height:60px;padding:0 0 5px;gap:0}
 .view,.view.active,.view:hover{border:0}
 .view>span:not(.relief-icon){display:none}
 .view .relief-icon{width:56px;height:53.5px}
 .topline{display:none}
 .stage[data-mode="grid"]{top:128px;bottom:calc(28px + var(--phone-safe));scroll-padding-top:24px}
 .bottomline,.stage[data-mode="stack"]~.bottomline,.stage[data-mode="grid"]~.bottomline{
   left:50%!important;right:auto!important;bottom:calc(36px + var(--phone-safe))!important;
   width:max-content;translate:-50% 0;gap:12px;justify-content:center
 }
 .position{font-size:12px;gap:9px;margin-left:0}
 .progress{width:38px}
 .step-buttons{gap:4px}
 .step-buttons button{width:34px;height:40px}
 .step-buttons button svg{width:17px;height:17px}
 .stage[data-mode="grid"]~.bottomline{width:min(270px,calc(100% - 44px));height:58px;padding:8px 18px;bottom:calc(36px + var(--phone-safe))!important}
 #viewer .motion-toggle{display:none!important}
 #viewer-frame{touch-action:pan-y}
 #viewer-frame:focus{outline:none}
 html[data-mobile-input="keyboard"] #viewer-frame:focus-visible{outline:1px solid #7c8da3;outline-offset:3px}
 .relief-emblem,.view{touch-action:none}
 .relief-emblem:active,.view:active .relief-icon{filter:none;transform:none}
 .relief-emblem canvas,.relief-icon canvas{display:block!important;filter:none;mix-blend-mode:normal}
 .relief-emblem .relief-fallback{filter:grayscale(1) contrast(.85) brightness(1.04);mix-blend-mode:normal}
 .relief-emblem.is-rendered .relief-fallback,.relief-icon.is-rendered .relief-fallback{opacity:0}
}
@media(max-width:360px) and (orientation:portrait){
 .sidebar{padding-left:18px;padding-right:18px}.museum-wordmark{width:154px}.space-description{font-size:12px}
 .caption{left:20px!important;right:148px!important}.caption h2{font-size:23px}
 .views{right:16px;gap:8px}.topline{right:16px}
}
@media(max-width:760px) and (max-height:620px) and (orientation:portrait){
 :root{--mobile-header:120px}.sidebar{padding-top:15px}
 .sidebar-foot>span:last-child{top:82px}
 .identity{padding-left:86px}.relief-emblem{top:-1px;width:80px;height:80px}
 .stage[data-mode="stack"]{top:132px;bottom:90px}
}
