/* Desktop: give the next-chapter bookmark a little more breathing room from exhibit models. */
@media (min-width: 901px) and (orientation: landscape){
  #shell:has(#stage .scene[data-id="9"]) .bottomnav .bookmark-nav--next{transform:translateX(14px)!important}
  #shell #stage .scene[data-id="13"]{grid-template-columns:minmax(190px,20%) minmax(0,1fr)!important;gap:2vw!important;padding-right:4.8vw!important}
  #shell #stage .scene[data-id="13"] .copy{max-width:350px!important}
  #shell #stage .scene[data-id="13"] .copy h1{font-size:clamp(38px,4vw,58px)!important;line-height:1.1!important}
  #shell #stage .scene[data-id="13"] .copy p{font-size:14px!important;line-height:1.65!important}
  #shell #stage .scene[data-id="13"] .copy .learning,#shell #stage .scene[data-id="13"] .copy .microfact{display:none!important}
  #shell #stage .scene[data-id="13"] .visual{height:min(82vh,820px)!important;min-height:480px!important}
  /* Compass: enlarge the exhibit lane, keep the model unobstructed, and make the four steps compact. */
  #shell #stage .scene[data-id="9"] .suspension-stage{width:100%!important;max-width:none!important;grid-template-columns:minmax(0,1.2fr) minmax(180px,.8fr)!important;gap:14px!important;padding:8px 8px 56px!important;min-height:0!important}
  #shell #stage .scene[data-id="9"] .suspension-hero{min-height:390px!important}
  #shell #stage .scene[data-id="9"] .suspension-side{gap:7px!important;padding:8px 0!important;max-height:calc(100% - 8px)!important;overflow:auto!important}
  #shell #stage .scene[data-id="9"] .suspension-side h3{font-size:20px!important;letter-spacing:.1em!important}
  #shell #stage .scene[data-id="9"] .suspension-side p,#shell #stage .scene[data-id="9"] .suspension-caption{display:none!important}
  #shell #stage .scene[data-id="9"] .principle-card{grid-template-columns:28px minmax(0,1fr)!important;gap:7px!important;padding:7px 8px!important;border-radius:10px!important}
  #shell #stage .scene[data-id="9"] .principle-num{width:26px!important;height:26px!important;font-size:14px!important}
  #shell #stage .scene[data-id="9"] .principle-copy b{font-size:12px!important;margin-bottom:2px!important}
  #shell #stage .scene[data-id="9"] .principle-copy span{font-size:10px!important;line-height:1.4!important}
  #shell #stage .scene[data-id="9"] .controlpanel{max-width:460px!important;padding:10px 13px!important}
  /* Across interactive exhibits, the model gets the wider lane; secondary fact cards are de-emphasized. */
  #shell #stage .scene[data-id="5"],#shell #stage .scene[data-id="6"],#shell #stage .scene[data-id="9"],
  #shell #stage .scene[data-id="10"],#shell #stage .scene[data-id="11"],#shell #stage .scene[data-id="12"],
  #shell #stage .scene[data-id="14"],#shell #stage .scene[data-id="15"],#shell #stage .scene[data-id="16"],#shell #stage .scene[data-id="17"]{
    grid-template-columns:minmax(200px,23%) minmax(0,1fr)!important;gap:2vw!important;
  }
  #shell #stage .scene[data-id="5"] .copy .microfact,#shell #stage .scene[data-id="6"] .copy .microfact,
  #shell #stage .scene[data-id="9"] .copy .microfact,#shell #stage .scene[data-id="10"] .copy .microfact,
  #shell #stage .scene[data-id="11"] .copy .microfact,#shell #stage .scene[data-id="12"] .copy .microfact,
  #shell #stage .scene[data-id="14"] .copy .microfact,#shell #stage .scene[data-id="15"] .copy .microfact,
  #shell #stage .scene[data-id="16"] .copy .microfact,#shell #stage .scene[data-id="17"] .copy .microfact{display:none!important}
}

/* Built-in responsive preview selector: desktop / phone portrait / phone landscape. */
#v45-preview-bar{position:fixed;z-index:99999;top:10px;right:10px;left:auto;transform:none;display:flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid #c9b88e;border-radius:999px;background:rgba(20,31,28,.94);box-shadow:0 6px 24px #0004;color:#f3e6c6;font:12px/1.2 system-ui,sans-serif;backdrop-filter:blur(10px)}
#v45-preview-bar strong{font-size:11px;font-weight:600;padding:0 7px;white-space:nowrap}
#v45-preview-bar button{border:1px solid #847958;border-radius:999px;background:transparent;color:#f3e6c6;padding:7px 10px;white-space:nowrap;font:inherit}
#v45-preview-bar button[aria-pressed="true"]{background:#d6c39a;color:#23342d;border-color:#d6c39a}
html[data-preview-mode^="phone"] body{background:#303a36!important;overflow:auto!important;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:54px 12px 18px!important;box-sizing:border-box}
html[data-preview-mode^="phone"] #shell{position:relative!important;inset:auto!important;flex:none!important;margin:0 auto!important;overflow:hidden!important;border:7px solid #141817!important;border-radius:28px!important;box-shadow:0 16px 48px #0007!important;height:var(--v45-device-h)!important;width:var(--v45-device-w)!important;min-height:0!important;max-height:none!important}
html[data-preview-mode^="phone"] #shell .bottomnav{bottom:max(7px,env(safe-area-inset-bottom,0px))!important}
html[data-preview-mode="phone-portrait"]{--v45-device-w:min(390px,calc(100vw - 32px));--v45-device-h:min(844px,calc(100dvh - 88px))}
html[data-preview-mode="phone-landscape"]{--v45-device-w:min(844px,calc(100vw - 32px));--v45-device-h:min(390px,calc(100dvh - 88px))}
html[data-preview-mode="phone-portrait"] #shell #stage .scene{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(220px,42vh) auto!important;align-content:start!important;gap:12px!important;padding:56px 18px 90px!important;overflow-y:auto!important;overflow-x:hidden!important}
html[data-preview-mode="phone-portrait"] #shell #stage .scene .copy{max-width:none!important;max-height:none!important;overflow:visible!important}
html[data-preview-mode="phone-portrait"] #shell #stage .scene .copy h1{font-size:clamp(30px,8vw,42px)!important;line-height:1.12!important;margin:6px 0 10px!important}
html[data-preview-mode="phone-portrait"] #shell #stage .scene .copy p{font-size:14px!important;line-height:1.7!important}
html[data-preview-mode="phone-portrait"] #shell #stage .scene .visual{width:100%!important;height:42vh!important;min-height:220px!important;max-height:360px!important;overflow:hidden!important}
html[data-preview-mode="phone-portrait"] #shell:has(#stage .scene) .bottomnav{position:absolute!important;left:12px!important;right:12px!important;bottom:7px!important}
html[data-preview-mode="phone-landscape"] #shell #stage .scene{grid-template-columns:minmax(0,35%) minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important;align-items:stretch!important;gap:12px!important;padding:48px 18px 58px!important;overflow:hidden!important}
html[data-preview-mode="phone-landscape"] #shell #stage .scene .copy{max-width:none!important;max-height:100%!important;overflow:auto!important;padding-right:4px!important}
html[data-preview-mode="phone-landscape"] #shell #stage .scene .copy h1{font-size:clamp(23px,5vh,34px)!important;line-height:1.1!important;margin:5px 0 7px!important}
html[data-preview-mode="phone-landscape"] #shell #stage .scene .copy p{font-size:11px!important;line-height:1.5!important}
html[data-preview-mode="phone-landscape"] #shell #stage .scene .visual{width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;overflow:hidden!important}
html[data-preview-mode^="phone"] #shell .floral-chapter-nav,html[data-preview-mode^="phone"] #shell .mx28-floral-nav{display:none!important}
html[data-preview-mode^="phone"] #shell #stage .scene .bookmark-nav--next{transform:none!important;min-width:0!important;padding:7px 10px!important;font-size:11px!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="13"]{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important;padding:45px 12px 54px!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="13"] .copy{display:none!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="13"] .visual{height:100%!important;min-height:0!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="9"]{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(0,1fr)!important;padding:45px 12px 54px!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="9"] .copy{display:none!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="9"] .visual{height:100%!important;min-height:0!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="9"] .suspension-stage{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important;width:100%!important;height:100%!important;min-height:0!important;padding:4px 4px 48px!important;gap:4px!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="9"] .suspension-side{display:none!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="9"] .suspension-hero{min-height:0!important;height:100%!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="9"] .suspension-model{height:92%!important;width:min(92%,430px)!important}
html[data-preview-mode^="phone"] #shell #stage .scene[data-id="14"] .copy .microfact{display:none!important}
@media(max-width:600px){#v45-preview-bar{top:5px;right:5px;gap:3px;padding:5px}#v45-preview-bar strong{display:none}#v45-preview-bar button{padding:7px 9px}}