/* VSH Network v37.9.4 — viewport-fixed desktop side rails + IG-style actions */

/* The desktop shell reserves physical rail columns. The rails themselves are viewport-fixed. */
@media (min-width:1280px){
  :root{
    --vsh-shell-max:1580px;
    --vsh-shell-pad:24px;
    --vsh-left-fixed-w:clamp(230px,17vw,270px);
    --vsh-right-fixed-w:clamp(290px,21vw,340px);
    --vsh-fixed-gap:28px;
    --vsh-fixed-rail-top:calc(var(--vsh-topbar-h,74px) + 14px);
    --vsh-fixed-rail-bottom:14px;
  }

  /* Keep the document as the only page scroller. */
  html,body{height:auto!important;min-height:100%!important;overflow-x:hidden!important;overflow-y:auto!important}
  body.vsh-fixed-app-shell{height:auto!important;overflow-y:auto!important}

  /* Three-column destinations: fixed rails + reserved grid columns. */
  body:not(.vsh-view-videos):not(.vsh-view-video):not(.vsh-view-research):not(.vsh-view-work):not(.vsh-view-jobs):not(.vsh-view-job) .vsh-shell,
  .vsh-profile-shell{
    width:min(var(--vsh-shell-max),100%)!important;
    max-width:var(--vsh-shell-max)!important;
    margin:0 auto!important;
    padding-left:var(--vsh-shell-pad)!important;
    padding-right:var(--vsh-shell-pad)!important;
    display:grid!important;
    grid-template-columns:var(--vsh-left-fixed-w) minmax(0,1fr) var(--vsh-right-fixed-w)!important;
    grid-template-areas:"left center right"!important;
    column-gap:var(--vsh-fixed-gap)!important;
    align-items:start!important;
    overflow:visible!important;
  }

  body:not(.vsh-view-videos):not(.vsh-view-video):not(.vsh-view-research):not(.vsh-view-work):not(.vsh-view-jobs):not(.vsh-view-job) .vsh-shell>.vsh-center,
  .vsh-profile-shell>.vsh-profile-main{
    grid-area:center!important;
    min-width:0!important;
    width:100%!important;
    max-width:none!important;
    position:relative!important;
    z-index:1!important;
  }

  /* TRUE FIXED left rail. It no longer depends on sticky/overflow ancestors. */
  .vsh-shell>.vsh-left,
  .vsh-profile-shell>.vsh-left,
  body.vsh-fixed-app-shell .vsh-shell>.vsh-left,
  body.vsh-fixed-app-shell .vsh-profile-shell>.vsh-left{
    display:block!important;
    position:fixed!important;
    top:var(--vsh-fixed-rail-top)!important;
    left:max(var(--vsh-shell-pad),calc((100vw - var(--vsh-shell-max))/2 + var(--vsh-shell-pad)))!important;
    width:var(--vsh-left-fixed-w)!important;
    height:calc(100dvh - var(--vsh-fixed-rail-top) - var(--vsh-fixed-rail-bottom))!important;
    max-height:calc(100dvh - var(--vsh-fixed-rail-top) - var(--vsh-fixed-rail-bottom))!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-width:thin!important;
    scrollbar-gutter:stable!important;
    z-index:90!important;
    margin:0!important;
    align-self:auto!important;
  }

  /* TRUE FIXED right rail. */
  .vsh-shell>.vsh-right,
  .vsh-profile-shell>.vsh-right,
  body.vsh-fixed-app-shell .vsh-shell>.vsh-right,
  body.vsh-fixed-app-shell .vsh-profile-shell>.vsh-right{
    display:block!important;
    position:fixed!important;
    top:var(--vsh-fixed-rail-top)!important;
    right:max(var(--vsh-shell-pad),calc((100vw - var(--vsh-shell-max))/2 + var(--vsh-shell-pad)))!important;
    left:auto!important;
    width:var(--vsh-right-fixed-w)!important;
    height:calc(100dvh - var(--vsh-fixed-rail-top) - var(--vsh-fixed-rail-bottom))!important;
    max-height:calc(100dvh - var(--vsh-fixed-rail-top) - var(--vsh-fixed-rail-bottom))!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-width:thin!important;
    scrollbar-gutter:stable!important;
    z-index:90!important;
    margin:0!important;
    align-self:auto!important;
  }

  .vsh-shell>.vsh-left::-webkit-scrollbar,.vsh-profile-shell>.vsh-left::-webkit-scrollbar,
  .vsh-shell>.vsh-right::-webkit-scrollbar,.vsh-profile-shell>.vsh-right::-webkit-scrollbar{width:5px}
  .vsh-shell>.vsh-left::-webkit-scrollbar-thumb,.vsh-profile-shell>.vsh-left::-webkit-scrollbar-thumb,
  .vsh-shell>.vsh-right::-webkit-scrollbar-thumb,.vsh-profile-shell>.vsh-right::-webkit-scrollbar-thumb{background:rgba(100,116,139,.18);border-radius:999px}

  /* Two-column destinations still reserve only the left rail. */
  body:is(.vsh-view-videos,.vsh-view-video,.vsh-view-research,.vsh-view-work,.vsh-view-jobs,.vsh-view-job) .vsh-shell{
    width:min(var(--vsh-shell-max),100%)!important;
    max-width:var(--vsh-shell-max)!important;
    margin:0 auto!important;
    padding-left:var(--vsh-shell-pad)!important;
    padding-right:var(--vsh-shell-pad)!important;
    display:grid!important;
    grid-template-columns:var(--vsh-left-fixed-w) minmax(0,1fr)!important;
    grid-template-areas:"left center"!important;
    column-gap:var(--vsh-fixed-gap)!important;
    align-items:start!important;
  }
  body:is(.vsh-view-videos,.vsh-view-video,.vsh-view-research,.vsh-view-work,.vsh-view-jobs,.vsh-view-job) .vsh-shell>.vsh-center{grid-area:center!important;min-width:0!important;width:100%!important;max-width:none!important}
  body:is(.vsh-view-videos,.vsh-view-video,.vsh-view-research,.vsh-view-work,.vsh-view-jobs,.vsh-view-job) .vsh-shell>.vsh-right{display:none!important}
}

/* Tablet/mobile are explicitly isolated from desktop fixed rails. */
@media (max-width:1279px){
  .vsh-shell>.vsh-left,.vsh-profile-shell>.vsh-left,
  .vsh-shell>.vsh-right,.vsh-profile-shell>.vsh-right{
    position:static!important;inset:auto!important;width:auto!important;height:auto!important;max-height:none!important;overflow:visible!important
  }
}

/* Instagram-inspired post actions: no pills, no boxes, just clean icons. */
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:18px!important;
  width:100%!important;
  min-height:48px!important;
  margin-top:12px!important;
  padding:12px 2px 2px!important;
  border-top:1px solid rgba(15,23,42,.08)!important;
  background:transparent!important;
  overflow:visible!important;
}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions .vsh-action-group{
  display:flex!important;align-items:center!important;gap:18px!important;min-width:0!important
}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions .vsh-action-spacer{flex:1 1 auto!important;min-width:10px!important}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions button{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:32px!important;
  max-width:none!important;
  height:38px!important;
  margin:0!important;
  padding:2px!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#111827!important;
  font-size:14px!important;
  transition:transform .16s ease,color .16s ease,opacity .16s ease!important;
}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions button:hover{background:transparent!important;color:#374151!important;transform:scale(1.06)!important}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions button:active{transform:scale(.90)!important}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions button .vsh-ico{
  width:28px!important;height:28px!important;margin:0!important;stroke-width:1.8!important
}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions .vsh-action-count{
  position:static!important;
  min-width:0!important;width:auto!important;height:auto!important;
  padding:0!important;margin:0!important;
  border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
  color:#111827!important;font-size:15px!important;font-weight:800!important;line-height:1!important
}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions .vsh-action-count.is-sr-only{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important
}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions [data-action="like"]{color:#111827!important}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions [data-action="like"] .vsh-ico path{fill:none!important;stroke:currentColor!important}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions [data-action="like"].active{color:#ed4956!important;background:transparent!important}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions [data-action="like"].active .vsh-ico path{fill:#ed4956!important;stroke:#ed4956!important}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions [data-action="repost"].active{color:#16a34a!important;background:transparent!important}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions [data-action="bookmark"].active{color:#111827!important;background:transparent!important}
.vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions [data-action="bookmark"].active .vsh-ico path{fill:currentColor!important}

@media(max-width:767px){
  .vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions{gap:15px!important;padding-left:0!important;padding-right:0!important}
  .vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions .vsh-action-group{gap:15px!important}
  .vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions button{min-width:30px!important;height:36px!important}
  .vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions button .vsh-ico{width:26px!important;height:26px!important}
  .vsh-post-actions.vsh-post-actions-v26.vsh-icon-actions .vsh-action-count{font-size:14px!important}
}
