/* ONLYDROP Art 2D / v197
   Uncropped, large-format portfolio art in an asymmetrical flowing gallery.
   Restore document flow because legacy theme-immersive.css lays ALL work
   categories out as fixed, non-scrolling 12-column grids. */
html body #views #work[data-cat="art2d"].view-panel{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scroll-snap-type:none !important;
  overscroll-behavior-y:contain;
  scrollbar-width:thin;
  scrollbar-color:#6b65ab transparent;
}
html body #views #work[data-cat="art2d"] > .work-section {
  display:block !important;
  position:relative !important;
  box-sizing:border-box !important;
  width:100% !important;
  max-width:none !important;
  height:auto !important;
  min-height:100% !important;
  overflow:visible !important;
  grid-template-columns:none !important;
  grid-template-rows:none !important;
  grid-template-areas:none !important;
  padding:clamp(86px,10vh,116px) clamp(22px,3.5vw,75px) clamp(85px,9vw,140px) var(--padL) !important;
}
html body #views #work[data-cat="art2d"] .work-topline {
  position:relative !important;
  inset:auto !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  box-sizing:border-box !important;
  width:100% !important;
  min-height:38px !important;
  padding:0 0 15px !important;
  margin:0 0 clamp(20px,3vh,35px) !important;
  border-bottom:1px solid rgba(255,255,255,.19) !important;
  z-index:7 !important;
}
html body #views #work[data-cat="art2d"] .work-topline > * {
  position:relative !important;
  margin:0 !important;
}
html body #views #work[data-cat="art2d"] .section-heading {
  display:block !important;
  box-sizing:border-box !important;
  position:relative !important;
  grid-area:auto !important;
  width:100% !important;
  height:auto !important;
  min-width:0 !important;
  margin:0 0 clamp(38px,4vw,62px) !important;
  padding:0 0 0 clamp(14px,1.5vw,24px) !important;
  border-left:3px solid #d1ff00 !important;
}
html body #views #work[data-cat="art2d"] .section-heading > div{
  display:block !important;
  position:static !important;
  width:100% !important;
  height:auto !important;
  min-width:0 !important;
  grid-area:auto !important;
  align-self:auto !important;
  padding:0 !important;
  margin:0 !important;
  transform:none !important;
  translate:none !important;
  rotate:none !important;
}
html body #views #work[data-cat="art2d"] #workHeading {
  display:block !important;
  position:relative !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 !important;
  padding:3px 0 8px !important;
  transform:none !important;
  translate:none !important;
  rotate:none !important;
  scale:1 !important;
  font-size:clamp(49px,5.7vw,86px) !important;
  line-height:1.12 !important;
  overflow:visible !important;
  text-shadow:none !important;
}
html body #views #work[data-cat="art2d"] #projectGrid {
  display:none !important;
}
html body #views #work #odArt2dGallery[hidden] {
  display:none !important;
}
html body #views #work[data-cat="art2d"] #odArt2dGallery {
  display:block !important;
  position:relative !important;
  box-sizing:border-box !important;
  grid-area:auto !important;
  grid-column:auto !important;
  grid-row:auto !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 0 clamp(55px,6vw,100px) !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-group{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-group + .od-art2d-group{
  margin-top:clamp(55px,7vw,110px) !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-group-heading {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  width:100% !important;
  box-sizing:border-box !important;
  margin:0 0 clamp(12px,1.3vw,22px) !important;
  padding:0 0 14px !important;
  border:0 !important;
  border-bottom:1px solid rgba(255,255,255,.27) !important;
  font-family:"IBM Plex Mono",monospace !important;
  font-weight:600 !important;
  font-size:clamp(13px,1.12vw,17px) !important;
  line-height:1.3 !important;
  letter-spacing:.095em !important;
  text-transform:uppercase !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-group-heading::before {
  content:"+" !important;
  display:inline-block !important;
  color:#d1ff00 !important;
  -webkit-text-fill-color:#d1ff00 !important;
  font-size:23px !important;
  line-height:1 !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-group-heading > span:first-child {margin-right:auto !important;}
html body #views #work[data-cat="art2d"] .od-art2d-count {
  margin-left:auto !important;
  font-family:"IBM Plex Mono",monospace !important;
  font-size:11px !important;
  font-weight:400 !important;
  color:#bfc0ca !important;
  -webkit-text-fill-color:#bfc0ca !important;
}
/* v197 — One gallery, nearly attached cards like the homepage.
   Very short grid tracks preserve uneven vertical proportions. */
html body #views #work[data-cat="art2d"] .od-art2d-mosaic{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  grid-auto-flow:row dense !important;
  grid-auto-rows:2px !important;
  column-gap:3px !important;
  row-gap:3px !important;
  align-items:start !important;
  align-content:start !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-filters{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:3px !important;
  align-items:stretch !important;
  margin:0 0 clamp(14px,2vw,23px) !important;
  padding:0 !important;
  border:0 !important;
  width:100% !important;
  box-sizing:border-box !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-filter{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:clamp(14px,1.6vw,26px) !important;
  padding:11px clamp(12px,1.3vw,18px) !important;
  border:1px solid rgba(255,255,255,.24) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:#121218 !important;
  color:#f7f7f7 !important;
  -webkit-text-fill-color:#f7f7f7 !important;
  text-transform:uppercase !important;
  font:600 11px/1.3 "IBM Plex Mono",monospace !important;
  letter-spacing:.045em !important;
  cursor:pointer !important;
  transition:background .14s,border-color .14s !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-filter-count{
  color:#a4a5ac !important;
  -webkit-text-fill-color:#a4a5ac !important;
  font-weight:400 !important;
  font-size:10px !important;
  font-variant-numeric:tabular-nums !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-filter:is(:hover,:focus-visible) {
  border-color:#d1ff00 !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-filter.is-active{
  background:#d1ff00 !important;
  color:#09090c !important;
  -webkit-text-fill-color:#09090c !important;
  border-color:#d1ff00 !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-filter.is-active .od-art2d-filter-count{
  color:#09090c !important;
  -webkit-text-fill-color:#09090c !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-piece[hidden]{
  display:none !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-piece {
  appearance:none !important;
  display:block !important;
  box-sizing:border-box !important;
  position:relative !important;
  break-inside:avoid !important;
  -webkit-column-break-inside:avoid !important;
  page-break-inside:avoid !important;
  width:100% !important;
  min-width:0 !important;
  height:var(--od-art-height,auto) !important;
  max-width:none !important;
  padding:0 !important;
  margin:0 !important; /* grid gap provides spacing; avoids overlapping row spans */
  background:#111116 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:hidden !important;
  cursor:zoom-in !important;
  vertical-align:top !important;
  transition:none !important;
  /* Each card has its own restrained asymmetric cut; the media's
     intrinsic aspect ratio is preserved at all times. */
  clip-path:polygon(0 0,100% 0,100% calc(100% - 15px),calc(100% - 15px) 100%,0 100%) !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-piece[data-shape="1"] {
  clip-path:polygon(14px 0,100% 0,100% 100%,0 100%,0 14px) !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-piece[data-shape="2"] {
  clip-path:polygon(0 0,100% 0,100% 100%,14px 100%,0 calc(100% - 14px)) !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-piece[data-shape="3"] {
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%) !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-piece img,
html body #views #work[data-cat="art2d"] .od-art2d-piece video{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:none !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  transform:none !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-piece:hover,
html body #views #work[data-cat="art2d"] .od-art2d-piece:focus-visible {
  filter:brightness(1.07);
}
html body #views #work[data-cat="art2d"] .od-art2d-piece:focus-visible {
  outline:3px solid #d1ff00 !important;
  outline-offset:-3px;
}
html body #views #work[data-cat="art2d"] .od-art2d-piece::after {
  content:"↗" !important;
  display:grid !important;
  place-items:center !important;
  position:absolute !important;
  z-index:3 !important;
  right:0 !important;
  bottom:0 !important;
  width:39px !important;
  height:39px !important;
  color:#d1ff00 !important;
  background:#09090cdd !important;
  font:400 20px/1 "IBM Plex Mono",monospace !important;
  pointer-events:none !important;
  opacity:.8 !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-piece[data-media="video"]::before {
  content:"▶" !important;
  position:absolute !important;
  top:50% !important;
  left:50% !important;
  translate:-50% -50% !important;
  z-index:3 !important;
  display:grid !important;
  place-items:center !important;
  width:52px !important;
  height:52px !important;
  border:1px solid #d1ff00 !important;
  color:#d1ff00 !important;
  background:#09090c99 !important;
}
html body .od-art2d-viewer {
  width:min(94vw,1480px) !important;
  max-width:94vw !important;
  height:min(92vh,980px) !important;
  max-height:92vh !important;
  margin:auto !important;
  padding:clamp(12px,2vw,26px) !important;
  border:1px solid #6b65ab !important;
  border-radius:0 !important;
  color:#fff !important;
  background:#09090c !important;
  box-shadow:0 18px 90px #000b !important;
  overflow:auto !important;
}
html body .od-art2d-viewer::backdrop {background:#000e !important;}
html body .od-art2d-viewer-content {
  display:flex !important;
  min-height:45vh !important;
  align-items:center !important;
  justify-content:center !important;
}
html body .od-art2d-viewer-content img,html body .od-art2d-viewer-content video {
  display:block !important;
  max-width:100% !important;
  max-height:calc(92vh - 100px) !important;
  object-fit:contain !important;
}
html body .od-art2d-viewer-close {
  display:block !important;
  margin:0 0 12px auto !important;
  padding:9px 15px !important;
  background:#17171e !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.25) !important;
  border-radius:0 !important;
  font-family:"IBM Plex Mono",monospace !important;
  cursor:pointer !important;
}
html body .od-art2d-viewer-close:hover {border-color:#d1ff00 !important;color:#d1ff00 !important;}
@media (min-width:761px) and (max-width:1099px) {
  html body #views #work[data-cat="art2d"] .od-art2d-mosaic {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media(max-width:760px) {
  html body #views #work[data-cat="art2d"] > .work-section{
    padding:calc(204px + env(safe-area-inset-top,0px)) 4vw 80px !important;
  }
  html body #views #work[data-cat="art2d"] .section-heading{
    margin-bottom:38px !important;
  }
  html body #views #work[data-cat="art2d"] #workHeading{
    font-size:clamp(42px,10vw,69px) !important;
  }
  html body #views #work[data-cat="art2d"] .od-art2d-mosaic{
    grid-template-columns:minmax(0,1fr) !important;
  }
  html body #views #work[data-cat="art2d"] .od-art2d-filters{
    margin-bottom:14px !important;
  }
  html body #views #work[data-cat="art2d"] .od-art2d-filter{
    flex:1 1 calc(50% - 3px) !important;
    min-width:0 !important;
    padding:9px 10px !important;
    font-size:10px !important;
  }
}
@media(max-width:760px) and (max-height:520px){
  html body #views #work[data-cat="art2d"] > .work-section{
    padding-top:calc(154px + env(safe-area-inset-top,0px)) !important;
  }
}
@media(prefers-reduced-motion:reduce){
  html body #views #work[data-cat="art2d"] .od-art2d-piece{
    transition:none !important;
  }
}

/* v199 — Keep artwork and video previews entirely free of overlay symbols. */
html body #views #work[data-cat="art2d"] .od-art2d-piece::after,
html body #views #work[data-cat="art2d"] .od-art2d-piece[data-media="video"]::before {
  content:none !important;
  display:none !important;
}

/* v200 — Flat controls: no outlined boxes on the FX toggle,
   discipline switcher, or artwork filter bar. */
html body #motionToggle.global-motion-toggle,
html body #views #work > .category-switcher,
html body #views #work > .category-switcher > .filter,
html body #views #work[data-cat="art2d"] .od-art2d-filter {
  border:0 !important;
  outline:none;
  box-shadow:none !important;
}
html body #views #work > .category-switcher > .filter {
  border-left:0 !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-filter:is(:hover,:focus-visible),
html body #views #work > .category-switcher > .filter:is(:hover,:focus-visible) {
  border:0 !important;
}
html body #motionToggle.global-motion-toggle:focus-visible,
html body #views #work > .category-switcher > .filter:focus-visible,
html body #views #work[data-cat="art2d"] .od-art2d-filter:focus-visible {
  outline:2px solid #d1ff00 !important;
  outline-offset:3px !important;
}

/* v214 — One independent, viewport-sized backdrop shared by the image
   and its stationary bottom fade. The gallery is a separate foreground layer.
   The backdrop is a sibling of #work, never inside its scrolling/clipping box. */
html body #views > .od-art2d-backdrop {
  display:none !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#fff !important;
  pointer-events:none !important;
  isolation:isolate !important;
}
/* Background visibility is driven by the active Art 2D route, even if
   the JavaScript has not yet executed. */
html body #views.od-art2d-visible > .od-art2d-backdrop,
html body #views:has(> #work.active[data-cat="art2d"]) > .od-art2d-backdrop {
  display:block !important;
}
html body #views > .od-art2d-backdrop > .od-art2d-backdrop-image {
  display:block !important;
  position:absolute !important;
  inset:0 auto auto 0 !important;
  width:100% !important;
  max-width:none !important;
  height:auto !important;
  min-height:0 !important;
  object-fit:contain !important;
  object-position:top center !important;
  margin:0 !important;
  padding:0 !important;
  z-index:0 !important;
  transform:translate3d(0,var(--od-art-bg-translate,0px),0) !important;
  transform-origin:top center !important;
  pointer-events:none !important;
}
html body #views > .od-art2d-backdrop > .od-art2d-bottom-fade {
  display:block !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:100% !important;
  height:clamp(160px,35%,420px) !important;
  z-index:1 !important;
  margin:0 !important;
  padding:0 !important;
  pointer-events:none !important;
  background:linear-gradient(to bottom,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.12) 25%,
    rgba(255,255,255,.58) 67%,
    #fff 100%) !important;
}
html body #views #work[data-cat="art2d"].view-panel {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  z-index:2 !important;
  isolation:auto !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior-y:contain !important;
  scroll-snap-type:none !important;
}
html body #views #work[data-cat="art2d"] > .work-section {
  display:block !important;
  position:relative !important;
  z-index:auto !important;
  isolation:auto !important;
  box-sizing:border-box !important;
  width:100% !important;
  height:auto !important;
  min-height:100% !important;
  overflow:visible !important;
  background:transparent !important;
  background-image:none !important;
  padding-bottom:24px !important;
}
html body #views #work[data-cat="art2d"] #odArt2dGallery {
  padding-bottom:0 !important;
}
@media(prefers-reduced-motion:reduce){
  html body #views > .od-art2d-backdrop > .od-art2d-backdrop-image{
    --od-art-bg-translate:0px !important;
    transform:none !important;
  }
}

/* v215 — The palette paints every .view-panel solid black. The Art 2D
   panel must be clear, or it hides the sibling background and fade entirely.
   All other disciplines retain the original opaque panel canvas. */
html body #views #work.view-panel[data-cat="art2d"],
html body #views #work.view-panel.active[data-cat="art2d"] {
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
}

/* v216 — Art 2D: tighter centered gallery and persistent minimal navigation.
   All sticky controls belong to #work's existing scroll container; neither
   the artwork mosaic nor background contributes additional scroll height. */
html body #views #work[data-cat="art2d"] #odArt2dGallery {
  width:calc(100% - 2 * clamp(14px,1.6vw,32px)) !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
/* Back to index remains visible as its work section scrolls. */
html body #views #work[data-cat="art2d"] .work-topline {
  position:sticky !important;
  top:clamp(54px,4vw,76px) !important;
  inset-inline:auto !important;
  width:100% !important;
  min-height:36px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  margin:0 0 clamp(20px,3vh,35px) !important;
  padding:3px 0 !important;
  border:0 !important;
  background:transparent !important;
  z-index:90 !important;
}
html body #views #work[data-cat="art2d"] .work-topline > #workCounter {
  display:none !important;
}
/* The gallery filters stick below Back to index, independently of the art. */
html body #views #work[data-cat="art2d"] .od-art2d-filters {
  position:sticky !important;
  top:clamp(100px,6.2vw,125px) !important;
  z-index:85 !important;
  width:100% !important;
  margin-bottom:clamp(12px,1.4vw,18px) !important;
  padding:0 !important;
  background:rgba(9,9,12,.96) !important;
  isolation:isolate !important;
}
/* The discipline rail was already fixed. Simplify it and reduce its footprint. */
@media(min-width:761px) {
  html body #views #work[data-cat="art2d"] > .category-switcher {
    position:fixed !important;
    inset:50% auto auto clamp(12px,1.2vw,22px) !important;
    transform:translateY(-50%) !important;
    width:clamp(112px,8.2vw,128px) !important;
    min-width:0 !important;
    max-width:none !important;
    gap:3px !important;
    padding:5px !important;
    background:rgba(9,9,12,.96) !important;
    border:0 !important;
    box-shadow:none !important;
    z-index:100 !important;
  }
  html body #views #work[data-cat="art2d"] > .category-switcher::before {
    display:none !important;
    content:none !important;
  }
  html body #views #work[data-cat="art2d"] > .category-switcher > .filter {
    min-height:34px !important;
    height:auto !important;
    width:100% !important;
    padding:7px 8px !important;
    margin:0 !important;
    font-size:9px !important;
    line-height:1.2 !important;
    font-weight:600 !important;
    border:0 !important;
    border-left:0 !important;
    box-shadow:none !important;
  }
}
@media(max-width:760px) {
  html body #views #work[data-cat="art2d"] #odArt2dGallery {
    width:calc(100% - 2 * clamp(5px,1vw,12px)) !important;
  }
  html body #views #work[data-cat="art2d"] .work-topline {
    top:calc(67px + env(safe-area-inset-top,0px)) !important;
  }
  html body #views #work[data-cat="art2d"] .od-art2d-filters {
    top:calc(177px + env(safe-area-inset-top,0px)) !important;
  }
}
@media(max-width:760px) and (max-height:520px) {
  html body #views #work[data-cat="art2d"] .work-topline {
    top:calc(24px + env(safe-area-inset-top,0px)) !important;
  }
  html body #views #work[data-cat="art2d"] .od-art2d-filters {
    top:calc(136px + env(safe-area-inset-top,0px)) !important;
  }
}

/* v219 — Compact 14px artwork mask; navigation remains above it.
   Keep the other sections' layouts unchanged. */
html body #views #work[data-cat="art2d"] .od-art2d-mosaic.od-art2d-masked{
  -webkit-mask-image:linear-gradient(to bottom,
    transparent 0,
    transparent var(--od-art-mask-start,0px),
    #000 var(--od-art-mask-end,14px)) !important;
  mask-image:linear-gradient(to bottom,
    transparent 0,
    transparent var(--od-art-mask-start,0px),
    #000 var(--od-art-mask-end,14px)) !important;
}
/* Compress the reserved strip at the top without scrolling the controls. */
html body #views #work[data-cat="art2d"] .work-topline{
  top:clamp(10px,1.7vw,22px) !important;
  margin-bottom:clamp(14px,2vw,24px) !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-filters{
  top:clamp(54px,4vw,72px) !important;
  margin-bottom:clamp(10px,1vw,14px) !important;
}
/* The rail becomes a child of .work-section only for Art 2D.
   This restores native scrolling: no fixed positioning, counter-scroll JS,
   or moving transforms are needed. */
@media(min-width:761px){
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher{
    position:absolute !important;
    inset:clamp(135px,21vh,245px) auto auto clamp(13px,1.35vw,24px) !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    width:clamp(125px,12vw,156px) !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    padding:10px 8px !important;
    margin:0 !important;
    gap:6px !important;
    transform:none !important;
    translate:none !important;
    background:rgba(9,9,12,.94) !important;
    border:0 !important;
    box-shadow:none !important;
    z-index:80 !important;
    pointer-events:auto !important;
  }
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher::before{
    display:none !important;
    content:none !important;
  }
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher > .filter{
    display:block !important;
    width:100% !important;
    min-height:40px !important;
    margin:0 !important;
    padding:9px 10px !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:#17171e !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    font:600 10px/1.3 "IBM Plex Mono",monospace !important;
    text-align:left !important;
    cursor:pointer !important;
  }
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher > .filter:is(.active,[aria-pressed="true"]){
    background:#d1ff00 !important;
    color:#09090c !important;
    -webkit-text-fill-color:#09090c !important;
  }
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher > .filter:focus-visible{
    outline:2px solid #d1ff00 !important;
    outline-offset:2px !important;
  }
}
@media(max-width:760px){
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher{
    position:absolute !important;
    inset:calc(121px + env(safe-area-inset-top,0px)) 4vw auto 4vw !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    transform:none !important;
    translate:none !important;
    width:92vw !important;
    max-width:92vw !important;
    min-width:0 !important;
    height:auto !important;
    gap:5px !important;
    padding:6px !important;
    margin:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    border:0 !important;
    background:rgba(9,9,12,.96) !important;
    z-index:80 !important;
    pointer-events:auto !important;
  }
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher::before{
    display:none !important;
    content:none !important;
  }
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher > .filter{
    display:block !important;
    flex:0 0 auto !important;
    min-height:44px !important;
    min-width:91px !important;
    max-width:146px !important;
    padding:8px 10px !important;
    margin:0 !important;
    font:600 9px/1.25 "IBM Plex Mono",monospace !important;
    text-align:center !important;
    background:#17171e !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    border:0 !important;
    box-shadow:none !important;
  }
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher > .filter:is(.active,[aria-pressed="true"]){
    background:#d1ff00 !important;
    color:#09090c !important;
    -webkit-text-fill-color:#09090c !important;
  }
  html body #views #work[data-cat="art2d"] .work-topline{
    top:calc(18px + env(safe-area-inset-top,0px)) !important;
  }
  html body #views #work[data-cat="art2d"] .od-art2d-filters{
    top:calc(70px + env(safe-area-inset-top,0px)) !important;
  }
}
@media(max-width:760px) and (max-height:520px){
  html body #views #work[data-cat="art2d"] > .work-section > .category-switcher{
    top:calc(83px + env(safe-area-inset-top,0px)) !important;
  }
}

/* v220 — Art 2D discipline navigation stays visible during scroll.
   It remains a direct child of #work (the scroll viewport), not a child of
   the scrolling .work-section. The previous reparenting moved it out of view. */
@media(min-width:761px){
  html body #views #work[data-cat="art2d"] > .category-switcher{
    position:fixed !important;
    inset:50% auto auto clamp(13px,1.35vw,24px) !important;
    transform:translateY(-50%) !important;
    translate:none !important;
    width:clamp(125px,12vw,156px) !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:stretch !important;
    gap:6px !important;
    padding:10px 8px !important;
    margin:0 !important;
    border:0 !important;
    box-shadow:none !important;
    background:rgba(9,9,12,.94) !important;
    z-index:100 !important;
    pointer-events:auto !important;
  }
  html body #views #work[data-cat="art2d"] > .category-switcher > .filter{
    width:100% !important;
    min-height:40px !important;
    margin:0 !important;
    padding:9px 10px !important;
    font-size:10px !important;
    line-height:1.3 !important;
    border:0 !important;
    box-shadow:none !important;
  }
}
html body #views #work[data-cat="art2d"] > .category-switcher::before{
  content:none !important;
  display:none !important;
}
@media(max-width:760px){
  html body #views #work[data-cat="art2d"] > .category-switcher{
    position:fixed !important;
    inset:calc(121px + env(safe-area-inset-top,0px)) 4vw auto 4vw !important;
    transform:none !important;
    translate:none !important;
    width:92vw !important;
    max-width:92vw !important;
    min-width:0 !important;
    z-index:100 !important;
  }
}
@media(max-width:760px) and (max-height:520px){
  html body #views #work[data-cat="art2d"] > .category-switcher{
    top:calc(83px + env(safe-area-inset-top,0px)) !important;
  }
}

/* v221 — Overlay the discipline menu beside #work inside #views, rather
   than inside the scrolling #work viewport. It follows the viewport like
   the sticky upper controls, with no scroll-dependent transforms. */
@media(min-width:761px){
  html body #views > .category-switcher.od-art2d-floating-rail{
    position:absolute !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    inset:50% auto auto clamp(13px,1.35vw,24px) !important;
    transform:translateY(-50%) !important;
    translate:none !important;
    width:clamp(125px,12vw,156px) !important;
    max-width:none !important;
    min-width:0 !important;
    gap:6px !important;
    padding:10px 8px !important;
    margin:0 !important;
    border:0 !important;
    box-shadow:none !important;
    background:rgba(9,9,12,.94) !important;
    z-index:90 !important;
    pointer-events:auto !important;
  }
  html body #views > .category-switcher.od-art2d-floating-rail > .filter{
    display:block !important;
    appearance:none !important;
    width:100% !important;
    min-height:40px !important;
    padding:9px 10px !important;
    margin:0 !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    transform:none !important;
    background:#17171e !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    text-align:left !important;
    font:600 10px/1.3 "IBM Plex Mono",monospace !important;
    cursor:pointer !important;
  }
}
html body #views > .category-switcher.od-art2d-floating-rail::before{
  content:none !important;
  display:none !important;
}
html body #views > .category-switcher.od-art2d-floating-rail > .filter:is(.active,[aria-pressed="true"]){
  background:#d1ff00 !important;
  color:#09090c !important;
  -webkit-text-fill-color:#09090c !important;
}
html body #views > .category-switcher.od-art2d-floating-rail > .filter:hover:not(.active):not([aria-pressed="true"]){
  background:#dfedff !important;
  color:#09090c !important;
  -webkit-text-fill-color:#09090c !important;
}
html body #views > .category-switcher.od-art2d-floating-rail > .filter:focus-visible{
  outline:2px solid #d1ff00 !important;
  outline-offset:2px !important;
}
@media(max-width:760px){
  html body #views > .category-switcher.od-art2d-floating-rail{
    position:absolute !important;
    display:flex !important;
    flex-direction:row !important;
    justify-content:flex-start !important;
    align-items:stretch !important;
    flex-wrap:nowrap !important;
    inset:calc(121px + env(safe-area-inset-top,0px)) 4vw auto 4vw !important;
    transform:none !important;
    translate:none !important;
    width:92vw !important;
    max-width:92vw !important;
    min-width:0 !important;
    margin:0 !important;
    padding:6px !important;
    gap:5px !important;
    background:rgba(9,9,12,.96) !important;
    border:0 !important;
    box-shadow:none !important;
    z-index:90 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    pointer-events:auto !important;
  }
  html body #views > .category-switcher.od-art2d-floating-rail > .filter{
    flex:0 0 auto !important;
    width:auto !important;
    min-height:44px !important;
    min-width:91px !important;
    max-width:146px !important;
    margin:0 !important;
    padding:8px 10px !important;
    font:600 9px/1.25 "IBM Plex Mono",monospace !important;
    text-align:center !important;
    background:#17171e !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    border:0 !important;
    box-shadow:none !important;
  }
}
@media(max-width:760px) and (max-height:520px){
  html body #views > .category-switcher.od-art2d-floating-rail{
    top:calc(83px + env(safe-area-inset-top,0px)) !important;
  }
}

/* v223 — Resilient sticky heading; independent of the dynamic #workHeading.
   No DOM reparenting, work-panel attribute changes or layout observers required. */
html body #views #work[data-cat="art2d"] .work-section > .section-heading{
  display:none !important;
}
html body #views #work .od-art2d-sticky-title{
  display:none !important;
}
html body #views #work[data-cat="art2d"] .work-topline{
  display:grid !important;
  grid-template-columns:minmax(125px,1fr) minmax(0,2fr) !important;
  align-items:center !important;
  column-gap:clamp(12px,2vw,32px) !important;
  width:100% !important;
  min-height:0 !important;
  height:76px !important;
  margin-bottom:clamp(14px,2vw,24px) !important;
  padding:0 !important;
  top:clamp(10px,1.7vw,22px) !important;
  z-index:95 !important;
  transition:height .36s cubic-bezier(.22,.8,.2,1) !important;
}
html body #views #work[data-cat="art2d"] .work-topline.od-art2d-condensed{
  height:48px !important;
}
html body #views #work[data-cat="art2d"] .work-topline > .back-index{
  grid-column:1 !important;
  justify-self:start !important;
  align-self:center !important;
}
html body #views #work[data-cat="art2d"] .work-topline > .od-art2d-sticky-title{
  display:flex !important;
  grid-column:2 !important;
  align-items:center !important;
  justify-content:flex-start !important;
  position:relative !important;
  min-width:0 !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
  border:0 !important;
  background:none !important;
  color:#fff !important;
  transform:none !important;
  rotate:none !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-sticky-title > span{
  display:block;
  width:max-content;
  max-width:100%;
  white-space:nowrap;
  font-family:var(--hf),sans-serif;
  font-size:clamp(36px,4.5vw,68px);
  font-weight:400;
  letter-spacing:-.035em;
  line-height:1;
  transform-origin:left center;
  transform:scale(1);
  transition:transform .36s cubic-bezier(.22,.8,.2,1);
}
html body #views #work[data-cat="art2d"] .work-topline.od-art2d-condensed .od-art2d-sticky-title > span{
  transform:scale(.56);
}
html body[lang="es"] #views #work[data-cat="art2d"] .od-art-title-en,
html[lang="es"] body #views #work[data-cat="art2d"] .od-art-title-en,
html:not([lang="es"]) body #views #work[data-cat="art2d"] .od-art-title-es{
  display:none !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-filters{
  top:clamp(72px,5.2vw,88px) !important;
}
@media(max-width:760px){
  html body #views #work[data-cat="art2d"] .work-topline{
    grid-template-columns:minmax(90px,1fr) minmax(0,2fr) !important;
    height:67px !important;
    top:calc(18px + env(safe-area-inset-top,0px)) !important;
    column-gap:8px !important;
  }
  html body #views #work[data-cat="art2d"] .work-topline.od-art2d-condensed{
    height:43px !important;
  }
  html body #views #work[data-cat="art2d"] .od-art2d-sticky-title > span{
    font-size:clamp(30px,7.6vw,48px);
  }
  html body #views #work[data-cat="art2d"] .work-topline.od-art2d-condensed .od-art2d-sticky-title > span{
    transform:scale(.64);
  }
  html body #views #work[data-cat="art2d"] .od-art2d-filters{
    top:calc(186px + env(safe-area-inset-top,0px)) !important;
  }
}
@media(max-width:760px) and (max-height:520px){
  html body #views #work[data-cat="art2d"] .od-art2d-filters{
    top:calc(149px + env(safe-area-inset-top,0px)) !important;
  }
}
@media(prefers-reduced-motion:reduce){
  html body #views #work[data-cat="art2d"] .work-topline,
  html body #views #work[data-cat="art2d"] .od-art2d-sticky-title > span{
    transition:none !important;
  }
}

/* v224 — Match the original Art 2D lettering and accent while keeping the
   safe, static grid-aligned header from v223. No new JavaScript or DOM moves. */
html body #views #work[data-cat="art2d"] .od-art2d-sticky-title > span{
  font-family:'UnifrakturCook','Grenze Gotisch',serif !important;
  font-weight:700 !important;
  color:#d1ff00 !important;
  -webkit-text-fill-color:#d1ff00 !important;
  text-shadow:none !important;
  rotate:none !important;
  letter-spacing:-.025em !important;
}

/* v225 — Left-aligned mixed-case title beside Back to Index.
   The heading remains an independent grid cell (no DOM reparenting). */
html body #views #work[data-cat="art2d"] .work-topline{
  grid-template-columns:max-content minmax(0,1fr) !important;
  justify-content:start !important;
  column-gap:clamp(12px,1.4vw,24px) !important;
}
html body #views #work[data-cat="art2d"] .work-topline > .back-index{
  grid-column:1 !important;
  grid-row:1 !important;
  justify-self:start !important;
}
html body #views #work[data-cat="art2d"] .work-topline > .od-art2d-sticky-title{
  grid-column:2 !important;
  grid-row:1 !important;
  justify-self:start !important;
  text-align:left !important;
}
html body #views #work[data-cat="art2d"] .od-art2d-sticky-title > span{
  text-transform:none !important;
  font-variant:normal !important;
  text-align:left !important;
}
@media(max-width:760px){
  html body #views #work[data-cat="art2d"] .work-topline{
    grid-template-columns:max-content minmax(0,1fr) !important;
    column-gap:clamp(7px,1.6vw,14px) !important;
  }
  html body #views #work[data-cat="art2d"] .od-art2d-sticky-title > span{
    font-size:clamp(25px,6.8vw,44px) !important;
  }
}

/* v228 — Art 2D card: draw the same blackletter glyphs as the section
   at their native aspect ratio. Remove the earlier artificial scaleY and
   one-axis fitting; sizing comes from font-size, not glyph transforms. */
html body #views #home .category-menu > a.cat-art2d > h2.category-title > .type-lettering{
  --od-title-fit-x:1 !important;
  font-family:'UnifrakturCook','Grenze Gotisch',serif !important;
  font-weight:700 !important;
  font-size:clamp(34px,3.5vw,58px) !important;
  line-height:1 !important;
  font-stretch:normal !important;
  font-style:normal !important;
  letter-spacing:-.025em !important;
  width:max-content !important;
  max-width:none !important;
  height:auto !important;
  white-space:nowrap !important;
  transform:none !important;
  translate:none !important;
  scale:1 !important;
  rotate:none !important;
  transform-origin:left center !important;
}
@media(max-width:760px){
  html body #views #home .category-menu > a.cat-art2d > h2.category-title > .type-lettering{
    font-size:clamp(27px,6.8vw,42px) !important;
  }
}

/* v229 — Narrow the art wall substantially to expose the full-width backdrop.
   Center within the available work column, without cropping the artwork. */
@media(min-width:1100px){
  html body #views #work[data-cat="art2d"] #odArt2dGallery{
    width:90% !important;
    max-width:none !important;
    margin-inline:auto !important;
  }
}
@media(min-width:761px) and (max-width:1099px){
  html body #views #work[data-cat="art2d"] #odArt2dGallery{
    width:90% !important;
    max-width:none !important;
    margin-inline:auto !important;
  }
}
@media(max-width:760px){
  html body #views #work[data-cat="art2d"] #odArt2dGallery{
    width:calc(100% - 2 * clamp(20px,5vw,36px)) !important;
    max-width:none !important;
    margin-inline:auto !important;
  }
}

/* v230 — Slightly denser gallery. Preserve the existing mosaic, full
   image proportions, responsive column counts and fixed navigation. */
html body #views #work[data-cat="art2d"] .od-art2d-mosaic {
  column-gap:2px !important;
  row-gap:2px !important;
}

/* v231 — Optional captions only in the expanded viewer.
   The compact four-column gallery remains entirely unchanged. */
html body .od-art2d-viewer-caption {
  display:block !important;
  box-sizing:border-box !important;
  width:100% !important;
  max-width:760px !important;
  margin:14px auto 3px !important;
  padding:12px 1px 0 !important;
  border:0 !important;
  border-top:1px solid rgba(255,255,255,.23) !important;
  background:none !important;
  color:#f2f4f2 !important;
  font:500 clamp(12px,1.2vw,14px)/1.7 "Manrope",sans-serif !important;
  text-align:left !important;
  white-space:pre-line !important;
  overflow-wrap:anywhere !important;
}
html body .od-art2d-viewer-caption[hidden] {
  display:none !important;
}
html body .od-art2d-viewer:has(.od-art2d-viewer-caption:not([hidden])) .od-art2d-viewer-content {
  min-height:0 !important;
}
html body .od-art2d-viewer:has(.od-art2d-viewer-caption:not([hidden])) .od-art2d-viewer-content img,
html body .od-art2d-viewer:has(.od-art2d-viewer-caption:not([hidden])) .od-art2d-viewer-content video {
  max-height:calc(92vh - 245px) !important;
}

/* v232 — Frameless, viewport-fitted artwork viewer.
   The only overlay is the backdrop; neither media nor caption sits inside
   a bordered card. The close control stays in a separate top-right gutter. */
html body dialog.od-art2d-viewer:not([open]) {
  display:none !important;
}
html body dialog.od-art2d-viewer[open] {
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  position:fixed !important;
  inset:0 !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  box-sizing:border-box !important;
  width:100vw !important;
  max-width:none !important;
  height:100vh !important;
  height:100dvh !important;
  max-height:none !important;
  margin:0 !important;
  padding:clamp(64px,10vh,100px) clamp(25px,5vw,100px) clamp(22px,4vh,48px) !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:hidden !important;
  color:#fff !important;
  /* Mostly transparent: retain the underlying Art 2D artwork and navigation. */
  background:rgba(7,12,17,.06) !important;
  isolation:isolate !important;
  overscroll-behavior:contain !important;
}
html body dialog.od-art2d-viewer::backdrop {
  /* A light veil and modest blur leave the existing page clearly recognizable. */
  background:rgba(5,9,15,.24) !important;
  -webkit-backdrop-filter:blur(7px) saturate(.9) !important;
  backdrop-filter:blur(7px) saturate(.9) !important;
  animation:od-art2d-backdrop-open .3s ease-out both !important;
}
/* No bright bloom layer: the existing page is the backdrop. */
html body dialog.od-art2d-viewer[open]::before {
  content:none !important;
  display:none !important;
}
html body dialog.od-art2d-viewer[open] .od-art2d-viewer-content {
  display:flex !important;
  flex:1 1 0 !important;
  position:relative !important;
  z-index:1 !important;
  align-items:center !important;
  justify-content:center !important;
  box-sizing:border-box !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  /* The stage must not clip an enlarged image to its pre-zoom bounds.
     The viewport-sized dialog still limits zoom at screen edges. */
  overflow:visible !important;
  animation:od-art2d-image-arrive .32s ease-out both !important;
}
html body dialog.od-art2d-viewer[open] .od-art2d-viewer-content > .od-art2d-expanded-media {
  display:block !important;
  flex:0 1 auto !important;
  box-sizing:border-box !important;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:100% !important;
  margin:auto !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  clip-path:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  transform:scale(1) !important;
  transform-origin:center center;
  transition:transform .46s cubic-bezier(.18,.84,.2,1) !important;
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-user-drag:none !important;
}
html body dialog.od-art2d-viewer[open] .od-art2d-viewer-content > img.od-art2d-expanded-media {
  cursor:zoom-in !important;
  touch-action:manipulation !important;
}
html body dialog.od-art2d-viewer[open].is-zoomed .od-art2d-viewer-content > img.od-art2d-expanded-media {
  transform:scale(var(--od-art-zoom-scale,2.15)) !important;
  cursor:zoom-out !important;
}
html body dialog.od-art2d-viewer[open] .od-art2d-viewer-content > video.od-art2d-expanded-media {
  max-width:100% !important;
  max-height:100% !important;
}
html body dialog.od-art2d-viewer[open] .od-art2d-viewer-caption:not([hidden]) {
  display:block !important;
  flex:0 1 auto !important;
  box-sizing:border-box !important;
  position:relative !important;
  z-index:1 !important;
  /* Follow the visible artwork's width, capped for comfortable reading. */
  width:min(100%,var(--od-art-caption-width,680px)) !important;
  max-width:680px !important;
  max-height:min(25dvh,180px) !important;
  min-height:0 !important;
  margin:clamp(12px,1.8vh,20px) auto 0 !important;
  padding:clamp(12px,1.3vw,18px) clamp(14px,1.9vw,24px) !important;
  border:0 !important;
  border-radius:0 !important;
  color:#f5f6f3 !important;
  background:rgba(6,10,16,.88) !important;
  box-shadow:none !important;
  text-align:left !important;
  font:500 clamp(12px,1.1vw,14px)/1.65 "Manrope",sans-serif !important;
  white-space:pre-line !important;
  overflow-wrap:anywhere !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  scrollbar-width:thin !important;
  scrollbar-color:#d1ff00 transparent !important;
  animation:od-art2d-caption-arrive .3s .04s ease-out both !important;
}
html body dialog.od-art2d-viewer[open] > .od-art2d-viewer-close {
  display:grid !important;
  place-items:center !important;
  position:fixed !important;
  top:clamp(13px,3vh,30px) !important;
  right:clamp(17px,3.2vw,54px) !important;
  left:auto !important;
  bottom:auto !important;
  z-index:3 !important;
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#fff !important;
  font:300 28px/1 "Manrope",sans-serif !important;
  text-align:center !important;
  cursor:pointer !important;
  transform:none !important;
  transition:none !important;
}
html body dialog.od-art2d-viewer[open] > .od-art2d-viewer-close:is(:hover,:focus-visible) {
  color:#d1ff00 !important;
  background:transparent !important;
  border:0 !important;
  transform:none !important;
  transition:none !important;
}
html body dialog.od-art2d-viewer[open] > .od-art2d-viewer-close:focus-visible {
  outline:2px solid #d1ff00 !important;
  outline-offset:4px !important;
}
@keyframes od-art2d-backdrop-open {
  from{opacity:0;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);}
  to{opacity:1;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);}
}
@keyframes od-art2d-image-arrive {
  from{opacity:0;transform:translateY(7px) scale(.985);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes od-art2d-caption-arrive {
  from{opacity:0;transform:translateY(4px);}
  to{opacity:1;transform:translateY(0);}
}
@media(max-width:760px){
  html body dialog.od-art2d-viewer[open] {
    padding:calc(65px + env(safe-area-inset-top,0px))
      max(18px,4vw)
      calc(24px + env(safe-area-inset-bottom,0px)) !important;
  }
  html body dialog.od-art2d-viewer[open] > .od-art2d-viewer-close {
    top:calc(12px + env(safe-area-inset-top,0px)) !important;
    right:16px !important;
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
  }
  html body dialog.od-art2d-viewer[open] .od-art2d-viewer-caption:not([hidden]) {
    max-height:min(24dvh,155px) !important;
  }
}
@media(max-height:480px){
  html body dialog.od-art2d-viewer[open] {
    padding-top:48px !important;
    padding-bottom:12px !important;
  }
  html body dialog.od-art2d-viewer[open] > .od-art2d-viewer-close {
    top:7px !important;
    right:14px !important;
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    font-size:27px !important;
  }
  html body dialog.od-art2d-viewer[open] .od-art2d-viewer-caption:not([hidden]) {
    max-height:22dvh !important;
  }
}
@media(prefers-reduced-motion:reduce){
  html body dialog.od-art2d-viewer::backdrop,
  html body dialog.od-art2d-viewer[open]::before,
  html body dialog.od-art2d-viewer[open] .od-art2d-viewer-content,
  html body dialog.od-art2d-viewer[open] .od-art2d-viewer-caption {
    animation:none !important;
  }
  html body dialog.od-art2d-viewer[open] .od-art2d-viewer-content > .od-art2d-expanded-media {
    transition:none !important;
  }
}
html.motion-paused body dialog.od-art2d-viewer::backdrop,
html.motion-paused body dialog.od-art2d-viewer[open]::before,
html.motion-paused body dialog.od-art2d-viewer[open] .od-art2d-viewer-content,
html.motion-paused body dialog.od-art2d-viewer[open] .od-art2d-viewer-caption {
  animation:none !important;
}
html.motion-paused body dialog.od-art2d-viewer[open] .od-art2d-viewer-content > .od-art2d-expanded-media {
  transition:none !important;
}

/* v234 — Keep zoom on the entire viewport rather than inside the fit-size
   media stage. Subtle, reversible close motion; preserve the minimal X. */
html body dialog.od-art2d-viewer[open].is-zoomed .od-art2d-viewer-content {
  z-index:2 !important;
  overflow:visible !important;
}
html body dialog.od-art2d-viewer[open].is-zoomed > .od-art2d-viewer-close {
  z-index:4 !important;
}
html body dialog.od-art2d-viewer[open].is-closing {
  pointer-events:none !important;
  animation:od-art2d-dialog-exit .22s ease-in both !important;
}
html body dialog.od-art2d-viewer[open].is-closing::backdrop {
  animation:od-art2d-backdrop-exit .22s ease-in both !important;
}
html body dialog.od-art2d-viewer[open].is-closing .od-art2d-viewer-content,
html body dialog.od-art2d-viewer[open].is-closing .od-art2d-viewer-caption {
  animation:none !important;
}
@keyframes od-art2d-dialog-exit {
  from{opacity:1;}
  to{opacity:0;}
}
@keyframes od-art2d-backdrop-exit {
  from{opacity:1;}
  to{opacity:0;}
}
@media(prefers-reduced-motion:reduce){
  html body dialog.od-art2d-viewer[open].is-closing,
  html body dialog.od-art2d-viewer[open].is-closing::backdrop {
    animation:none !important;
  }
}
html.motion-paused body dialog.od-art2d-viewer[open].is-closing,
html.motion-paused body dialog.od-art2d-viewer[open].is-closing::backdrop {
  animation:none !important;
}