@media (max-width: 1024px) {
  .content { padding: 20px 18px 50px; }
}

@media (max-width: 860px) {
  .sidebar-toggle-btn { display: inline-flex; }

  .sidebar {
    position: fixed;
    top: var(--topbar-height);
    left: 0;
    bottom: 0;
    width: 260px;
    z-index: 40;
    transform: translateX(-100%);
    box-shadow: var(--shadow-lg);
  }
  .sidebar.open { transform: translateX(0); }

  .sidebar-backdrop.open {
    display: block;
    animation: fade-in 0.2s var(--ease);
  }

  .search-wrap { max-width: 220px; }
  #upload-btn span { display: none; }
}

@media (max-width: 640px) {
  .topbar { gap: 10px; padding: 0 12px; }
  .search-wrap { max-width: 160px; }
  .file-grid { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
  .connect-card { padding: 26px 20px; }
  .repo-actions-row { flex-direction: column; }
  .content { padding: 16px 14px 50px; }
}

@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}