/* The surrounding frame has one geometry and palette for every section. */
html{scrollbar-gutter:stable}
body[data-nav-layout]{--portal-header:58px}
body[data-nav-layout] .topbar{height:var(--portal-header);min-height:var(--portal-header);position:sticky;top:0;padding:0 max(1.1rem,calc((100vw - 1460px)/2));background:#1b1719;border-bottom:1px solid #b5986244;backdrop-filter:none}
body[data-nav-layout] .sidebar{background:#1b1719;border-color:#b5986230;backdrop-filter:none}
body[data-nav-layout] .sidebar .nav-divider{height:1px;margin:.6rem .35rem;background:#b5986244;flex:none}
@media(min-width:761px){
  body[data-nav-layout] .sidebar{top:var(--portal-header);height:auto;padding:.7rem 7px}
  body[data-nav-layout] .sidebar .nav-label{background:none}
}
@media(min-width:761px) and (max-height:620px){
  body[data-nav-layout] .sidebar{padding-block:.35rem}
}
@media(max-width:760px){
  body[data-nav-layout]{--portal-header:64px}
  body[data-nav-layout] .topbar{padding:.65rem .8rem}
  body[data-nav-layout] .sidebar{position:sticky;inset:auto;top:var(--portal-header);width:100%;height:52px;padding:4px 7px}
  body[data-nav-layout] .sidebar .nav-divider{display:none}
  body[data-nav-layout] .sidebar [data-tab=builder]:before{content:"";position:absolute;left:-2px;top:8px;bottom:8px;width:1px;background:#b5986244}
  body[data-view=builder] .builder-tabs{top:calc(var(--portal-header) + 52px)}
}