/* Topbar */

     .topbar {
        display: flex; align-items: center; justify-content: space-between;
        gap: 16px; padding: 12px 20px;
        background: var(--black); color: var(--white);
        position: sticky; top: 0; z-index: 50;
      }
      .topbar-left { display: flex; align-items: center; gap: 12px; }
      .topbar-right { display: flex; align-items: center; gap: 12px; }
      .topbar .brand { display: inline-flex; align-items: center; gap: 10px; color: var(--stay-white); text-decoration: none; font-weight: 700; letter-spacing: .5px; }
      .topbar .brand img { width: 32px; height: 32px; }
      
      .topbar .search { display: flex; align-items: center; flex: 1; max-width: 720px; gap: 8px; margin: 0 12px; }
      .topbar .search-form { display: flex; width: 100%;}
      .topbar .search input { width: 100%; padding: 10px 48px 10px 12px; border-radius: 8px; border: 1px solid var(--grey-600); background: var(--grey-900); color: var(--white); }
    
      .topbar .search-btn:hover { color: var(--stay-white); }
    
      .topbar .search button {
        display: flex; padding: 8px 12px; border-radius: 8px; background: var(--yellow);
        border: none; font-weight: 700; cursor: pointer; color: var(--black);
      }
      .topbar .profile-btn {
        color: var(--black); background: var(--yellow);
        padding: 10px 14px; border-radius: 8px; text-decoration: none; font-weight: 700;
      }
      
      .menu-dropdown {
        background: transparent; color: var(--stay-white);
        border: 1px solid var(--grey-700); border-radius: 8px; padding: 6px 10px; cursor: pointer;
      }
      .dropdown {
        position: absolute;
        top: 52px;
        left: 16px;
        display: none;
        flex-direction: column;
        background: var(--grey-900);
        border: 1px solid var(--grey-700);
        border-radius: 14px;
        min-width: 180px;
        box-shadow: 0 12px 32px rgba(0,0,0,.18);
        padding: 8px 0;
        z-index: 100;
        transition: box-shadow 0.18s, border-color 0.18s;
      }
      .dropdown.open {
        display: flex;
      }
      .dropdown a {
        color: var(--white);
        text-decoration: none;
        padding: 12px 20px;
        border-radius: 8px;
        margin: 2px 8px;
        font-size: 1rem;
        transition: background 0.15s, color 0.15s;
        letter-spacing: 0.2px;
      }
      .dropdown a:hover {
        background: var(--yellow);
        color: var(--black);
        box-shadow: 0 2px 8px rgba(0,0,0,.08);
      }

      .user-chip { margin-right: .5rem; opacity: .85; }