function TopHeader({ title, newCount, onMenuToggle }) {
  return (
    <header className="top-header">
      <div style={{ display: 'flex', alignItems: 'center', gap: 'var(--space-3)' }}>
        <button
          className="menu-toggle"
          onClick={onMenuToggle}
          aria-label="Toggle navigation"
        >
          <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
            <path d="M2 4h12M2 8h12M2 12h12" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round"/>
          </svg>
        </button>
        <span className="top-header__title">{title}</span>
      </div>
      <div className="top-header__actions">
        {newCount > 0 && (
          <span className="badge" title={`${newCount} new request${newCount > 1 ? 's' : ''}`}>
            {newCount}
          </span>
        )}
      </div>
    </header>
  );
}