/* === override-v8.css: desktop-safe fixed sidebar + content margin === */

/* Desktop/tablet: pin sidebar to the left and push content */
@media (min-width: 981px){
  .sidebar, .side{position:fixed !important; left:0; top:56px; width:220px; height:calc(100vh - 56px) !important; overflow:auto !important; background:var(--panel, #121b2f); border-right:1px solid var(--border, rgba(255,255,255,.12));}
  main.container, main{margin-left:220px !important; padding-left:24px;}
  .layout, .app{display:block !important;} /* neutralize grids that misalign */
}

/* Mobile: natural flow (sidebar above content or hidden by your JS) */
@media (max-width: 980px){
  main.container, main{margin-left:0 !important; padding-left:16px;}
}

/* Tighten hero spacing a bit to avoid huge gaps */
.hero{padding-top:32px !important}

/* v8 marker */
#vtag{background:#3b82f6 !important; color:#fff !important}