/* Resized nodes retain their proportions; every field remains reachable. */
.pro-page .canvas-element.node-sized:not(.collapsed) {
  display:flex;
  flex-direction:column;
}
.pro-page .canvas-element.node-sized > .canvas-element-header {flex-shrink:0}
.pro-page .canvas-element.node-sized > .canvas-element-body {
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--node-accent,#cdb5ff) 40%,transparent) transparent;
  border-radius:0 0 13px 13px;
}
.pro-page .canvas-element > .resize-handle {
  width:22px;
  height:22px;
  right:0;
  bottom:0;
  z-index:5;
  opacity:.8;
  touch-action:none;
  cursor:nwse-resize!important;
}
.pro-page .canvas-element > .resize-handle::after {
  content:'';
  position:absolute;
  width:9px;
  height:9px;
  right:5px;
  bottom:5px;
  border-right:2px solid var(--node-accent,#cdb5ff);
  border-bottom:2px solid var(--node-accent,#cdb5ff);
  border-radius:0 0 3px 0;
}
.pro-page .canvas-element.collapsed > .resize-handle {display:none}
.pro-page .canvas-element > .resize-handle:hover {opacity:1}

/* Desktop Library uses the available viewport, with two independent panes.
   A long brief never pushes its download and source assets below the page. */
@media (min-width:1051px) and (min-height:600px) {
  .library-page {
    display:flex;
    flex-direction:column;
    height:calc(100dvh - var(--app-topbar-height,72px));
    min-height:0;
    padding-bottom:20px;
    overflow:hidden;
  }
  .library-page > .studio-heading,
  .library-page > .library-kind-filters {flex-shrink:0}
  .library-page #libraryBody {
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
  }
  .library-page .library-tools {flex-shrink:0}
  .library-page .library-layout {
    flex:1 1 auto;
    min-height:0;
    grid-template-rows:minmax(0,1fr);
    align-items:stretch;
  }
  .library-page .library-layout > div,
  .library-page .library-layout > .output-inspector {
    min-height:0;
    max-height:100%;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior-y:contain;
    scrollbar-width:thin;
    scrollbar-color:#66725766 transparent;
    scrollbar-gutter:stable;
  }
  .library-page .library-layout > div {padding-right:7px;padding-bottom:3px}
  .library-page .library-layout > .output-inspector {position:sticky;top:0;align-self:stretch}
}
/* A stacked inspector remains part of ordinary page scrolling on tablets,
   phones and short landscape windows: no nested scrolling trap. */
@media (max-width:1050px), (max-height:599px) {
  .library-page .library-layout > .output-inspector {
    position:relative;
    top:auto;
    max-height:none;
    overflow:visible;
    overscroll-behavior:auto;
  }
}
@media (min-width:1051px) and (min-height:600px) and (max-height:800px) {
 .library-page{padding-top:18px}
 .library-page>.studio-heading{min-height:0;padding:0;margin-bottom:15px}
 .library-page>.studio-heading h1{font-size:36px;line-height:1.02;margin:8px 0}
 .library-page>.studio-heading p{font-size:13px;line-height:1.4;margin:0}
 .library-page>.studio-heading .eyebrow{font-size:9px}
 .library-page>.library-kind-filters{margin-bottom:13px}
 .library-page .library-tools{margin-bottom:13px}
}